/* Real Bolgare — Gestione Tornei
 * Stili minimi e neutri: ereditano colori e tipografia dal tema (Fuse/UIkit).
 * Personalizzazioni fini meglio farle dal Customizer YOOtheme o in LESS di progetto.
 */

.rb-team {
	display: inline-flex;
	align-items: center;
	gap: .5em;
	font-weight: 600;
}

.rb-team__logo,
.rb-team img.rb-team__logo {
	width: 40px;
	height: 40px;
	object-fit: contain;
	flex: 0 0 auto;
}

.rb-team__logo--placeholder {
	display: inline-block;
	border-radius: 50%;
	background: rgba(0, 0, 0, .08);
}

.rb-team--home-club .rb-team__name {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ======================================================================
 * Prossimo match — blocco "hero" scuro
 * Fascia full-width della sezione contenitore (metterla in una sezione
 * a larghezza piena di YOOtheme Fuse per il full-bleed come da mockup).
 * ==================================================================== */
.rb-hero {
	position: relative;
	overflow: hidden;
	color: #fff;
	text-align: center;
	padding: clamp(2.5rem, 6vw, 4.5rem) 1rem;
	/* Base scura + texture CSS neutra. Sovrascrivibile con l'attributo sfondo="". */
	background-color: #0e0e10;
	background-image:
		var(--rb-hero-bg, none),
		radial-gradient(120% 130% at 50% 0%, rgba(255, 255, 255, .05), transparent 62%),
		repeating-linear-gradient(115deg, rgba(255, 255, 255, .018) 0 2px, transparent 2px 9px);
	background-size: cover, auto, auto;
	background-position: center;
}

/* Accento superiore: un'unica riga rossa, coerente col badge. */
.rb-hero::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 4px;
	background: #e2001a;
}

.rb-hero__inner {
	position: relative;
	max-width: 1100px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: clamp(1rem, 2.5vw, 1.6rem);
}

.rb-hero__badge {
	display: inline-block;
	background: #e2001a;
	color: #fff;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .12em;
	font-size: .72rem;
	line-height: 1;
	padding: .6em 1em;
	border-radius: 2px;
}

.rb-hero__fixture {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: clamp(.8rem, 3vw, 2.5rem);
	width: 100%;
}

.rb-hero__side {
	display: flex;
	align-items: center;
	gap: clamp(.6rem, 1.5vw, 1.2rem);
	flex: 1 1 0;
	min-width: 0;
}

.rb-hero__side--home {
	justify-content: flex-end;
}

.rb-hero__side--away {
	justify-content: flex-start;
}

.rb-hero__crest {
	width: clamp(48px, 8vw, 88px);
	height: auto;
	flex: 0 0 auto;
	object-fit: contain;
}

.rb-hero__crest--placeholder {
	width: clamp(48px, 8vw, 88px);
	aspect-ratio: 1;
	border-radius: 50%;
	background: rgba(255, 255, 255, .1);
}

.rb-hero__name {
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .01em;
	line-height: 1.05;
	font-size: clamp(1.3rem, 3.4vw, 2.6rem);
	color: #fff;
}

.rb-hero__side--home .rb-hero__name {
	text-align: right;
}

.rb-hero__score {
	flex: 0 0 auto;
	font-weight: 700;
	font-size: clamp(1.3rem, 3vw, 2.2rem);
	letter-spacing: .1em;
	white-space: nowrap;
	color: #fff;
}

.rb-hero__colon {
	margin: 0 .35em;
	opacity: .8;
}

.rb-hero__meta {
	text-transform: uppercase;
	letter-spacing: .1em;
	font-size: .8rem;
	color: #9a9a9d;
}

.rb-hero__sep {
	margin: 0 .5em;
}

.rb-hero__time {
	font-weight: 700;
	font-size: clamp(1.3rem, 3vw, 1.9rem);
	color: #fff;
}

/* Evidenzia in modo discreto la nostra squadra, se marcata come Real Bolgare. */
.rb-hero .rb-team--home-club .rb-hero__name {
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* Mobile: layout impilato per non comprimere due nomi lunghi affiancati. */
@media (max-width: 640px) {
	.rb-hero__fixture {
		flex-direction: column;
		gap: 1rem;
	}
	.rb-hero__side,
	.rb-hero__side--home,
	.rb-hero__side--away {
		justify-content: center;
		flex: 0 0 auto;
	}
	.rb-hero__side--home .rb-hero__name {
		text-align: center;
	}
}

/* Card incontro nello stile "prossimo incontro": stessa grafica dell'hero,
 * ma SEMPRE impilata (le card dello slider sono strette anche su desktop). */
.rb-hero--card {
	height: 100%;
	padding: clamp(1.4rem, 4vw, 2.2rem) 1.2rem;
	border-radius: 8px;
}
.rb-hero--card .rb-hero__inner { gap: 1rem; }
.rb-hero--card .rb-hero__fixture { flex-direction: column; gap: .8rem; }
.rb-hero--card .rb-hero__side,
.rb-hero--card .rb-hero__side--home,
.rb-hero--card .rb-hero__side--away { justify-content: center; flex: 0 0 auto; width: 100%; }
.rb-hero--card .rb-hero__side--home .rb-hero__name { text-align: center; }
.rb-hero--card .rb-hero__crest,
.rb-hero--card .rb-hero__crest--placeholder { width: clamp(40px, 12vw, 56px); }
.rb-hero--card .rb-hero__name { font-size: clamp(1.05rem, 2.4vw, 1.5rem); overflow-wrap: break-word; }
.rb-hero--card .rb-hero__score { font-size: clamp(1.4rem, 3vw, 2rem); }
.rb-hero--card .rb-hero__badge { font-size: .62rem; padding: .5em .9em; }

/* ======================================================================
 * Card incontro (slider "Incontri precedenti" + calendario)
 * Colori fissi coerenti col mockup; sovrascrivibili in Customizer LESS.
 * ==================================================================== */
.rb-mcard {
	position: relative;
	background: #fff;
	border: 1px solid #ececec;
	border-radius: 6px;
	padding: 1.5em 1.2em 1.3em;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1em;
	text-align: center;
}

/* Badge competizione (ribbon rosso con estremità a V) */
.rb-mcard__badge {
	display: inline-block;
	background: #e2001a;
	color: #fff;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .08em;
	font-size: .62rem;
	line-height: 1;
	padding: .5em 1.6em;
	clip-path: polygon(0 0, 100% 0, 93% 50%, 100% 100%, 0 100%, 7% 50%);
}

.rb-mcard__row {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: clamp(.5rem, 2vw, 1.1rem);
	width: 100%;
}

.rb-mcard__side {
	display: flex;
	align-items: center;
	gap: .6em;
	flex: 1 1 0;
	min-width: 0;
}

.rb-mcard__side--home {
	justify-content: flex-end;
}

.rb-mcard__side--away {
	justify-content: flex-start;
}

.rb-mcard__crest {
	width: 38px;
	max-width: 38px;
	height: auto;
	flex: 0 0 auto;
	object-fit: contain;
}

.rb-mcard__crest--placeholder {
	width: 38px;
	aspect-ratio: 1;
	border-radius: 50%;
	background: rgba(0, 0, 0, .08);
}

.rb-mcard__name {
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .02em;
	font-size: .9rem;
	line-height: 1.15;
	color: #222;
	min-width: 0;
	overflow-wrap: anywhere;
}

.rb-mcard__side--home .rb-mcard__name {
	text-align: right;
}

/* Punteggio: due riquadri neri + due punti */
.rb-mcard__score {
	display: flex;
	align-items: center;
	gap: .35em;
	flex: 0 0 auto;
}

.rb-mcard__num {
	background: #16181d;
	color: #fff;
	font-weight: 700;
	font-size: 1.35rem;
	line-height: 1;
	min-width: 1.5em;
	padding: .35em .3em;
	border-radius: 4px;
	text-align: center;
}

.rb-mcard__colon {
	font-weight: 700;
	color: #16181d;
}

.rb-mcard__vs {
	font-size: .85rem;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: #999;
}

.rb-mcard__meta {
	display: flex;
	flex-direction: column;
	gap: .15em;
}

.rb-mcard__date {
	color: #6f7a80;
	font-size: .82rem;
}

.rb-mcard__venue {
	color: #9a9a9a;
	font-size: .82rem;
}

/* ---- Slider "Incontri precedenti" ---- */
.rb-slider__viewport {
	position: relative;
	padding: 0 clamp(40px, 6vw, 60px);
}

.rb-slider__track {
	overflow: hidden;
}

.rb-slider__nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	border: 1px solid #e4e4e4;
	color: #333;
	font-size: 1.2rem;
	text-decoration: none;
	border-radius: 3px;
	transition: background .15s ease, color .15s ease;
}

.rb-slider__nav:hover {
	background: #16181d;
	color: #fff;
	border-color: #16181d;
}

.rb-slider__nav--prev {
	left: 0;
}

.rb-slider__nav--next {
	right: 0;
}

/* Calendario: elenco a griglia con le stesse card */
.rb-cal__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 1em;
}

/* Stati vuoti */
.rb-next--empty,
.rb-slider--empty,
.rb-cal--empty {
	opacity: .7;
	font-style: italic;
}

/* ======================================================================
 * Embed classifica tuttocampo (iframe cross-origin: si veste solo la cornice)
 * ==================================================================== */
.rb-embed {
	margin: 0 auto;
	width: 100%;
}

.rb-embed__heading {
	margin: 0 0 .6em;
}

.rb-embed__frame {
	background: #fff;
	border: 1px solid #ececec;
	border-radius: 6px;
	overflow: hidden;
	line-height: 0;
}

.rb-embed__frame iframe {
	display: block;
	width: 100%;
	border: 0;
}

/* ======================================================================
 * Classifica personalizzata — stile "league table"
 * Header rosso, righe a zebra, barrette zona (promozione/playoff/retroc.).
 * Colonne: # | Squadra | PL | W | D | L | GD | PTS
 * ==================================================================== */
.rb-standings__scroll {
	overflow-x: auto;
	border-radius: 10px;
	border: 1px solid #ececec;
}

.rb-standings__table {
	width: 100%;
	border-collapse: collapse;
	font-size: .92rem;
	background: #fff;
}

.rb-standings__table th,
.rb-standings__table td {
	padding: .45em .6em;
	text-align: left;
	white-space: nowrap;
	vertical-align: middle;
}

/* Intestazione rossa */
.rb-standings__table thead th {
	background: #c1272d;
	color: #fff;
	font-size: .72rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .06em;
}

.rb-standings__table thead th.rb-standings__team {
	padding-left: 3.4em;
}

/* Righe a zebra */
.rb-standings__table tbody tr:nth-child(even) {
	background: #f6f6f6;
}

.rb-standings__pos {
	width: 2.5em;
	color: #8a8a8a;
	font-weight: 600;
}

.rb-standings__team {
	text-align: left;
	white-space: normal;
}

.rb-standings__logo {
	width: 30px;
	height: 30px;
	object-fit: contain;
	vertical-align: middle;
	margin-right: .7em;
}

.rb-standings__name {
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .01em;
	vertical-align: middle;
	color: #1a1a1a;
	font-size: .9em;
}

.rb-standings__num {
	color: #555;
}

.rb-standings__pts {
	font-weight: 800;
	color: #1a1a1a;
}

/* Barretta colorata a sinistra per le zone (bordo interno sulla prima cella) */
.rb-standings__row--promo   td:first-child { box-shadow: inset 4px 0 0 #3aa655; }
.rb-standings__row--playoff td:first-child { box-shadow: inset 4px 0 0 #f0a020; }
.rb-standings__row--releg   td:first-child { box-shadow: inset 4px 0 0 #d0342c; }

/* Riga della nostra squadra */
.rb-standings__row--ours { background: #fff2f2 !important; }
.rb-standings__row--ours .rb-standings__name { color: #c1272d; }

/* Legenda zone */
.rb-standings__legend {
	display: flex;
	flex-wrap: wrap;
	gap: 1em;
	margin-top: .7em;
	font-size: .78rem;
	color: #666;
}
.rb-standings__legend span { display: inline-flex; align-items: center; gap: .4em; }
.rb-standings__legend i { width: 10px; height: 10px; border-radius: 2px; display: inline-block; }
.rb-standings__legend .is-promo { background: #3aa655; }
.rb-standings__legend .is-playoff { background: #f0a020; }
.rb-standings__legend .is-releg { background: #d0342c; }

.rb-standings__note {
	margin-top: .6em;
	font-size: .8rem;
	color: #9a9a9a;
}

.rb-standings--loading .rb-standings__loading-row td {
	text-align: center;
	color: #9a9a9a;
	font-style: italic;
	padding: 1.2em;
}

/* ======================================================================
 * Slider rosa — fascia foto (coverflow) in alto + pannello dettagli sotto
 * [rb_rosa_slider]
 * ==================================================================== */
.rb-team[data-rb-team] {
	display: block;   /* evita la collisione con il chip .rb-team (inline-flex) delle partite */
	position: relative;
	width: 100%;
	max-width: 100%;
	min-width: 0;
}

/* --- Fascia foto scura (coverflow) --- */
.rb-team__stage {
	position: relative;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	overflow: hidden;
	padding: 2em 0 0;          /* aria sopra le teste; i piedi a filo del bordo basso */
	background: #14151d;        /* sovrascritto inline dall'attributo sfondo="" */
	cursor: grab;
	touch-action: pan-y;        /* scroll verticale ok, orizzontale lo gestiamo noi */
	user-select: none;
}
.rb-team--dragging,
.rb-team--dragging .rb-team__stage { cursor: grabbing; }
.rb-team--dragging .rb-team__track { transition: none; }
.rb-team--dragging .rb-team__link { pointer-events: none; }
.rb-team__img { -webkit-user-drag: none; user-select: none; }

.rb-team__track {
	position: relative;      /* le card sono posizionate in assoluto (coverflow ad anello) */
	width: 100%;
	will-change: transform;
	opacity: 0;
	transition: transform .3s ease, opacity .3s ease;
	animation: rb-team-reveal .01s linear 1.5s forwards; /* fallback se il JS non gira */
	--rb-team-spread: 0.85;  /* distanza tra le card: 1 = affiancate, <1 = piu sovrapposte */
}
.rb-team--ready .rb-team__track { opacity: 1; animation: none; }
@keyframes rb-team-reveal { to { opacity: 1; } }

.rb-team__card {
	position: absolute;
	left: 50%;
	bottom: 0;
	width: clamp(190px, 25vw, 460px);   /* piu grandi */
	transform-origin: center bottom;
	transition: transform .55s cubic-bezier(.22, .61, .36, 1), opacity .45s ease;
	cursor: pointer;
}
.rb-team__card.is-active { cursor: default; }
.rb-team__link { display: block; text-decoration: none; }
.rb-team__photo { position: relative; aspect-ratio: 3 / 4; overflow: hidden; }
.rb-team__img,
.rb-team__img.rb-team__img {
	width: 100%; height: 100%;
	object-fit: cover; object-position: top center;
	display: block;
}
.rb-team__img--placeholder {
	display: block; width: 100%; height: 100%;
	background: linear-gradient(160deg, #2a2d3a, #14151d);
}

/* --- Pannello dettagli (sotto, sul fondo chiaro della sezione) --- */
.rb-team__details {
	position: relative;
	padding: 4.4em 1em 2.8em;
	text-align: center;
	background-color:#f5f5f5;
}
.rb-team__panel {
	position: relative;
	display: inline-block;
	min-width: min(90%, 440px);
}
.rb-team__panel.is-in { animation: rb-team-fade .3s ease; }
@keyframes rb-team-fade {
	from { opacity: .25; transform: translateY(5px); }
	to   { opacity: 1;   transform: none; }
}

.rb-team__bignum {
	display: block;
	position: absolute;
	left: 50%; top: -.38em;
	transform: translateX(-50%);
	font-size: clamp(4.5rem, 10vw, 10rem);
	font-weight: 900; line-height: 1;
	color: #fff; opacity: 1;
	z-index: 0; pointer-events: none;
	white-space: nowrap;
	font-family: 'Sofia Sans Extra Condensed';
}
.rb-team__pname {
	position: relative; z-index: 1; display: block;
	font-weight: 800; text-transform: uppercase; letter-spacing: .02em; line-height: 1.05;
	font-size: clamp(1.4rem, 3vw, 2.1rem); color: #1a1a1a;
}
.rb-team__prole {
	position: relative; z-index: 1; display: block; margin-top: .45em;
	text-transform: uppercase; letter-spacing: .06em; font-size: .8rem; font-weight: 700;
}
.rb-team__prole-label { color: #8a8a8a; }
.rb-team__prole-val { color: #c1272d; }
.rb-team__pcta {
	position: relative; z-index: 1; display: inline-block; margin-top: 2.2em;
	background: #c1272d; color: #fff; text-decoration: none;
	font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em;
	padding: .9em 1.8em; border-radius: 2px;
	transition: background .15s ease;
}
.rb-team__pcta:hover { background: #a01f24; }

/* Frecce quadrate ai lati del pannello */
.rb-team__nav {
	position: absolute; top: 50%; transform: translateY(-50%);
	width: 52px; height: 52px;
	display: flex; align-items: center; justify-content: center;
	background: #fff; border: 1px solid #e4e4e4; color: #222;
	font-size: 1.3rem; line-height: 1; cursor: pointer; z-index: 5;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.rb-team__nav:hover { background: #c1272d; color: #fff; border-color: #c1272d; }
.rb-team__nav--prev { left: clamp(10px, 8vw, 150px); }
.rb-team__nav--next { right: clamp(10px, 8vw, 150px); }

@media (max-width: 640px) {
	.rb-team__nav--prev { left: 6px; }
	.rb-team__nav--next { right: 6px; }
	.rb-team__nav { width: 44px; height: 44px; }
	/* Mobile: 3 card ben proporzionate (centrale + due laterali visibili) */
	.rb-team__card { width: 56vw; }
}
@media (prefers-reduced-motion: reduce) {
	.rb-team__track, .rb-team__card, .rb-team__panel { transition: none; animation: none; }
}

}
