/**
 * AI Sázky – Tabulka tipů
 *
 * Layout je 1:1 přepis tabulky .table z app.aisazky.cz/historie do flexboxu.
 * Naměřeno na živé stránce při šířce tabulky 1230 px:
 *   hvězda 44 · datum 125 · čas 67 · liga 124 · domácí 198 · skóre 46
 *   hosté 215 · typ sázky 151 · kurz 112 · stav 147   (celkem 1229)
 *   řádek 48 px · td padding 4/8 · border-spacing 0 4px · logo 24 · club gap 16
 *   .table__tag: padding 5/24, radius 8, 16 px, base 500, --success 800
 *
 * Responsivita kopíruje media query appky: pod 768 px se řádek zalomí na tři
 * pruhy pomocí order + pseudoelementů, pod 1200 px klesne písmo na 14 px.
 * Přepíná se podle ŠÍŘKY WIDGETU (ResizeObserver), ne podle okna.
 */

.aisz-tips {
	/* Řádky – tr:nth-child(2n) { background: #11121F } */
	--aisz-row-bg: transparent;
	--aisz-row-bg-alt: #11121f;
	--aisz-row-bg-hover: transparent;
	--aisz-row-gap: 0.25em;
	--aisz-row-height: 3em;
	--aisz-cell-pad-y: 0.25em;
	--aisz-cell-pad-x: 0.5em;
	--aisz-row-radius: 0px;
	--aisz-divider: transparent;
	--aisz-dim: 1;

	/* Text – .table { color: #dcdcdc } */
	--aisz-team-color: #dcdcdc;
	--aisz-team-color-active: #ffffff;
	--aisz-league-color: #dcdcdc;
	--aisz-bet-color: #dcdcdc;
	--aisz-meta-color: #dcdcdc;
	--aisz-star: #ffd596;

	/* Důvěra – vlastní sloupec, v Historii není */
	--aisz-conf-high: #7adb78;
	--aisz-conf-medium: #dba350;
	--aisz-conf-mega: #ac6aff;

	/* Odznaky – .table__tag */
	--aisz-badge-bg: #585858;
	--aisz-badge-fg: #ffffff;
	--aisz-win-bg: #7adb78;
	--aisz-win-fg: #054404;
	--aisz-loss-bg: #585858;
	--aisz-loss-fg: #949494;
	--aisz-void-bg: #0063bf;
	--aisz-void-fg: #dcdcdc;
	--aisz-pending-bg: #ffd596;
	--aisz-pending-fg: #4a3200;
	--aisz-badge-radius: 0.5em;

	/* Loga – .table__club img { width: 1.3125em } + gap 1em */
	--aisz-logo-size: 1.5em;
	--aisz-logo-gap: 1em;

	/* Tlačítko – .container__bottom-button */
	--aisz-btn-color: #ffffff;
	--aisz-btn-bg: #000000;
	--aisz-btn-border: #32cda1;
	--aisz-btn-hover: #ac6aff;

	width: 100%;
	color: var(--aisz-team-color);
	font-family: var(--e-global-typography-text-font-family, "Exo 2"), sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
}

.aisz-tips *,
.aisz-tips *::before,
.aisz-tips *::after {
	box-sizing: border-box;
}

/* ---------------------------------------------------------------- Seznam */

.aisz-tips__list {
	display: flex;
	flex-direction: column;
	gap: var(--aisz-row-gap);
}

/* Bez JS zustane tabulkovy layout a radeji se scrolluje do stran. */
.aisz-tips:not(.is-ready) .aisz-tips__list {
	overflow-x: auto;
}

.aisz-tips:not(.is-ready) .aisz-tips__row {
	min-width: 1100px;
}

/* ---------------------------------------------------------------- Řádek */

.aisz-tips__row {
	position: relative;
	display: flex;
	align-items: center;
	min-height: var(--aisz-row-height);
	border-radius: var(--aisz-row-radius);
	background: var(--aisz-row-bg);
}

.aisz-tips__row:nth-child(even) {
	background: var(--aisz-row-bg-alt);
}

.aisz-tips__row.is-loss {
	opacity: var(--aisz-dim);
}

.aisz-tips__row:hover {
	background: var(--aisz-row-bg-hover);
}

.aisz-tips__row:nth-child(even):hover {
	background: var(--aisz-row-bg-alt);
}

/* .table__active-tr { color: #fff } – bez pruhu, bez tucneho */
.aisz-tips__row.is-highlight {
	opacity: 1;
	color: var(--aisz-team-color-active);
}

.aisz-tips__row.is-highlight .aisz-tips__team,
.aisz-tips__row.is-highlight .aisz-tips__score,
.aisz-tips__row.is-highlight .aisz-tips__league,
.aisz-tips__row.is-highlight .aisz-tips__bet,
.aisz-tips__row.is-highlight .aisz-tips__date,
.aisz-tips__row.is-highlight .aisz-tips__time {
	color: var(--aisz-team-color-active);
}

.aisz-tips--divided .aisz-tips__row + .aisz-tips__row::after {
	content: "";
	position: absolute;
	inset: calc(var(--aisz-row-gap) / -2 - 0.5px) 0 auto 0;
	height: 1px;
	background: var(--aisz-divider);
}

.aisz-tips.is-ready .aisz-tips__row.is-hidden {
	display: none;
}

/* ------------------------------------------------- Buňky a šířky sloupců */

.aisz-tips__cell {
	display: flex;
	align-items: center;
	min-width: 0;
	padding: var(--aisz-cell-pad-y) var(--aisz-cell-pad-x);
}

/* Poměry odpovídají naměřeným šířkám v Historii. */
.aisz-tips__cell--star {
	flex: 0 0 2.75em;
	justify-content: flex-start;
}

/* Zabírá přesně místo po datu a čase (125 + 67), takže zbytek sloupců
   zůstává na šířkách naměřených v Historii. */
.aisz-tips__cell--confidence {
	flex: 192 1 0;
	gap: 8px;
}

.aisz-tips__cell--date {
	flex: 125 1 0;
}

.aisz-tips__cell--time {
	flex: 67 1 0;
}

.aisz-tips__cell--league {
	flex: 124 1 0;
}

.aisz-tips__cell--home {
	flex: 198 1 0;
	gap: var(--aisz-logo-gap);
}

.aisz-tips__cell--score {
	flex: 0 0 2.875em;
}

.aisz-tips__cell--away {
	flex: 215 1 0;
	gap: var(--aisz-logo-gap);
}

.aisz-tips__cell--bet {
	flex: 151 1 0;
}

.aisz-tips__cell--odds {
	flex: 0 0 7em;
}

.aisz-tips__cell--status {
	flex: 0 0 9.1875em;
}

/* Skrývání sloupců z nastavení widgetu */
.aisz-tips--no-star .aisz-tips__cell--star,
.aisz-tips--no-confidence .aisz-tips__cell--confidence,
.aisz-tips--no-date .aisz-tips__cell--date,
.aisz-tips--no-time .aisz-tips__cell--time,
.aisz-tips--no-league .aisz-tips__cell--league,
.aisz-tips--no-score .aisz-tips__cell--score,
.aisz-tips--no-bet .aisz-tips__cell--bet,
.aisz-tips--no-odds .aisz-tips__cell--odds,
.aisz-tips--no-status .aisz-tips__cell--status {
	display: none !important;
}

/* ---------------------------------------------------------------- Obsah */

.aisz-tips__star {
	color: var(--aisz-star);
	font-size: inherit;
	line-height: 1;
}

.aisz-tips__confidence {
	font-size: inherit;
	font-weight: 700;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.aisz-tips__confidence--high {
	color: var(--aisz-conf-high);
}

.aisz-tips__confidence--medium {
	color: var(--aisz-conf-medium);
}

.aisz-tips__confidence--mega {
	color: var(--aisz-conf-mega);
}

/* Šipka drží barvu úrovně důvěry, ne barvu řádku. */
.aisz-tips__trend {
	flex: 0 0 auto;
	width: 1em;
	height: 1em;
}

.aisz-tips__trend--high {
	color: var(--aisz-conf-high);
}

.aisz-tips__trend--medium {
	color: var(--aisz-conf-medium);
}

.aisz-tips__trend--mega {
	color: var(--aisz-conf-mega);
}

.aisz-tips__date,
.aisz-tips__time {
	color: var(--aisz-meta-color);
	white-space: nowrap;
}

.aisz-tips__league {
	color: var(--aisz-league-color);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.aisz-tips__logo {
	flex: 0 0 auto;
	width: var(--aisz-logo-size);
	height: var(--aisz-logo-size);
	object-fit: contain;
}

.aisz-tips__logo--empty {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.1);
	color: rgba(255, 255, 255, 0.75);
	line-height: 1;
}

.aisz-tips__logo--empty > i {
	font-size: 0.66em;
	font-style: normal;
	font-weight: 500;
}

.aisz-tips__team {
	color: var(--aisz-team-color);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.aisz-tips__score {
	color: var(--aisz-team-color);
	white-space: nowrap;
}

.aisz-tips__bet {
	color: var(--aisz-bet-color);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* --------------------------------------------------- Odznaky (.table__tag) */

.aisz-tips__badge {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 0.3125em 1.5em;
	border: 0;
	border-radius: var(--aisz-badge-radius);
	background: var(--aisz-badge-bg);
	color: var(--aisz-badge-fg);
	font-size: inherit;
	font-weight: 500;
	line-height: 1;
	text-align: center;
	text-transform: uppercase;
	white-space: nowrap;
}

.aisz-tips__row.is-win .aisz-tips__badge {
	background: var(--aisz-win-bg);
	color: var(--aisz-win-fg);
	font-weight: 800;
}

.aisz-tips__row.is-loss .aisz-tips__badge {
	background: var(--aisz-loss-bg);
	color: var(--aisz-loss-fg);
}

.aisz-tips__row.is-void .aisz-tips__badge {
	background: var(--aisz-void-bg);
	color: var(--aisz-void-fg);
}

.aisz-tips__row.is-pending .aisz-tips__badge {
	background: var(--aisz-pending-bg);
	color: var(--aisz-pending-fg);
}

/* --------------------------------------------------- Zlomy velikosti písma
 * Appka kombinuje dvě věci: @media(max-width:991px){html{font-size:12px}}
 * a .table { 1rem / 0.875rem pod 1200 / 1rem pod 768 }. Výsledná velikost
 * je 16 / 14 / 10.5 / 12 px. Všechno ostatní je v em, takže jde s ní.
 */

.aisz-tips.is-compact {
	font-size: 14px;
}

.aisz-tips.is-tablet {
	font-size: 10.5px;
}

.aisz-tips.is-cards {
	font-size: 12px;
}

/* ---------------------------------- Mobil (< 768 px) – @media appky 1:1 */

.aisz-tips.is-cards .aisz-tips__row {
	flex-wrap: wrap;
	min-height: 0;
	padding: 0.5em 1em;
}

/* Zalomeni na tri pruhy: r1 | r2 | zbytek */
.aisz-tips.is-cards .aisz-tips__row::before {
	content: "";
	flex-basis: 100%;
	order: -3;
}

.aisz-tips.is-cards .aisz-tips__row::after {
	content: "";
	flex-basis: 100%;
	order: -1;
}

.aisz-tips.is-cards .aisz-tips__cell {
	flex: 0 0 auto;
	padding: var(--aisz-cell-pad-y) var(--aisz-cell-pad-x);
}

.aisz-tips.is-cards .aisz-tips__cell--r1 {
	order: -4;
}

.aisz-tips.is-cards .aisz-tips__cell--r2 {
	order: -2;
}

.aisz-tips.is-cards .aisz-tips__cell--star {
	padding-left: 0;
}

.aisz-tips.is-cards .aisz-tips__cell--star:empty {
	padding: 0;
}

.aisz-tips.is-cards .aisz-tips__cell--end {
	margin-left: auto;
}

.aisz-tips.is-cards .aisz-tips__cell--odds,
.aisz-tips.is-cards .aisz-tips__cell--status {
	flex: 0 0 auto;
}

/* .table__tag nema na mobilu zadny override – sirka podle obsahu. */
.aisz-tips.is-cards .aisz-tips__badge {
	width: auto;
	min-width: 0;
}

.aisz-tips.is-cards .aisz-tips__team,
.aisz-tips.is-cards .aisz-tips__league,
.aisz-tips.is-cards .aisz-tips__bet {
	overflow: visible;
	text-overflow: clip;
}

/* @media (max-width: 399px) */
.aisz-tips.is-cards.is-narrow .aisz-tips__row {
	padding-left: 0.5em;
	padding-right: 0.5em;
}

.aisz-tips.is-cards .aisz-tips__footer {
	padding-left: 20px;
	padding-right: 20px;
}

/* ---------------------------------------------------------------- Tlačítko */

.aisz-tips__footer {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: 28px;
}

/* 1:1 podle .container__bottom-button. Motiv webu styluje <button> globalne,
   proto vyssi specificita a !important. */
.aisz-tips .aisz-tips__more,
.aisz-tips button.aisz-tips__more {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	max-width: 29rem;
	min-height: 3.6875rem;
	margin: 0;
	padding: 0.5rem 2rem;
	border: 1px solid var(--aisz-btn-border) !important;
	border-radius: 0.625rem;
	background: var(--aisz-btn-bg) !important;
	background-image: none !important;
	box-shadow: none !important;
	color: var(--aisz-btn-color) !important;
	font: 900 1rem var(--e-global-typography-text-font-family, "Exo 2"), sans-serif;
	letter-spacing: 0.056em;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: border-color 0.2s ease, color 0.2s ease;
	-webkit-appearance: none;
	appearance: none;
}

.aisz-tips .aisz-tips__more:hover,
.aisz-tips button.aisz-tips__more:hover {
	background: var(--aisz-btn-bg) !important;
	border-color: var(--aisz-btn-hover) !important;
	color: var(--aisz-btn-hover) !important;
	box-shadow: none !important;
}

.aisz-tips .aisz-tips__more:focus-visible {
	outline: 2px solid var(--aisz-btn-hover);
	outline-offset: 3px;
}

.aisz-tips .aisz-tips__more[hidden] {
	display: none;
}

@media (max-width: 991px) {
	.aisz-tips .aisz-tips__more,
	.aisz-tips button.aisz-tips__more {
		min-height: 3rem;
	}
}

.aisz-tips__empty {
	padding: 20px;
	border: 1px dashed rgba(255, 255, 255, 0.25);
	color: #9ca3af;
	font-size: 14px;
	text-align: center;
}

.aisz-tips__sr {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* ---------------------------------------------------------------- Animace */

.aisz-tips__row.is-revealing {
	animation: aisz-tips-reveal 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
	animation-delay: calc(var(--aisz-i, 0) * 55ms);
}

@keyframes aisz-tips-reveal {
	from {
		opacity: 0;
		transform: translateY(8px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.aisz-tips__row.is-revealing {
		animation-duration: 0.01s;
		animation-delay: 0s;
	}
}