/* fooba-esportes — Bloco Partidas — Frontend */

.esf-partidas-block {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	background: #fff;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 2px 14px rgba(0,0,0,.09);
}

/* ── Header ── */
.esf-block-header {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 11px 18px;
	background: #fff;
	border-left: 5px solid #f5c800;
	border-bottom: 1px solid #efefef;
}
.esf-block-header-logo   { width: 28px; height: 28px; object-fit: contain; }
.esf-block-header-name   { font-weight: 700; font-size: 14px; color: #111; }
.esf-block-header-season { font-size: 12px; color: #aaa; margin-left: auto; font-weight: 500; }

/* ── Strip ── */
.esf-matches-strip {
	display: flex;
	overflow-x: auto;
	scrollbar-width: thin;
	scrollbar-color: #e0e0e0 transparent;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
}
.esf-matches-strip::-webkit-scrollbar        { height: 3px; }
.esf-matches-strip::-webkit-scrollbar-thumb  { background: #ddd; border-radius: 2px; }

.esf-strip-msg {
	padding: 22px 24px;
	font-size: 13px;
	color: #aaa;
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 200px;
}
.esf-strip-error { color: #b00; }

/* ── Card — layout de uma linha ── */
.esf-match-card {
	flex: 0 0 auto;
	background: #fff;
	padding: 10px 14px;
	scroll-snap-align: start;
	border-right: 1px solid #f0f0f0;
	transition: background .12s;
	cursor: default;
	box-sizing: border-box;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 5px;
}
.esf-match-card:last-child { border-right: none; }
.esf-match-card:hover       { background: #fafafa; }
.esf-match-card.esf-match-live { background: #fffaf5; }

/* Status classes */
.esf-match-card.esf-status-ft   { opacity: .82; }
.esf-match-card.esf-status-pst  { opacity: .55; }
.esf-match-card.esf-status-canc { opacity: .45; }

/* ── Topo: data + badge ── */
.esf-match-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 6px;
}
.esf-match-date {
	font-size: 10px;
	color: #aaa;
	white-space: nowrap;
	line-height: 1;
}
.esf-match-badge-live {
	font-size: 9px;
	font-weight: 800;
	color: #fff;
	padding: 2px 6px;
	border-radius: 3px;
	text-transform: uppercase;
	letter-spacing: .4px;
	white-space: nowrap;
	animation: esf-live-pulse 1s ease-in-out infinite;
	line-height: 1.4;
}
@keyframes esf-live-pulse { 0%,100%{opacity:1} 50%{opacity:.6} }

span.esf-match-badge-status {
	font-size: 8.5px;
	text-transform: uppercase;
	font-weight: bold;
	white-space: nowrap;
	line-height: 1;
}
.esf-match-badge-arrow {
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
}

/* ── Linha principal: SIGLA [FLAG] GOL x GOL [FLAG] SIGLA ── */
.esf-match-row {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	white-space: nowrap;
}

/* Sigla do time (3 letras) */
.esf-match-abbr {
	font-size: 11px;
	font-weight: 700;
	color: #222;
	letter-spacing: .3px;
	width: 30px;
	overflow: hidden;
	text-overflow: clip;
}
.esf-match-abbr.home { text-align: right; }
.esf-match-abbr.away { text-align: left; }
.esf-match-abbr.esf-winner { color: #1a6b3a; }

/* Bandeira */
.esf-match-flag {
	width: 22px;
	height: 15px;
	object-fit: cover;
	border-radius: 2px;
	flex-shrink: 0;
	display: block;
}

/* Placar central */
.esf-match-score-row {
	display: flex;
	align-items: center;
	gap: 3px;
	min-width: 52px;
	justify-content: center;
}
.esf-match-score-num {
	font-size: 15px;
	font-weight: 800;
	color: #111;
	min-width: 12px;
	text-align: center;
	line-height: 1;
}
.esf-match-score-num.esf-live-score { color: #cc2200; }
.esf-match-score-x {
	font-size: 11px;
	font-weight: 700;
	color: #bbb;
	line-height: 1;
}
/* Quando não tem placar ainda */
.esf-match-score-vs {
	font-size: 11px;
	font-weight: 600;
	color: #ccc;
	min-width: 28px;
	text-align: center;
}

/* Rodada */
.esf-match-round {
	font-size: 9.5px;
	color: #bbb;
	text-align: center;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	line-height: 1;
}

/* ── Spinner ── */
.esf-spinner {
	width: 14px; height: 14px;
	border: 2px solid #eee;
	border-top-color: #bbb;
	border-radius: 50%;
	animation: esf-spin .65s linear infinite;
	flex-shrink: 0;
}
@keyframes esf-spin { to { transform: rotate(360deg); } }

.esf-partidas-block.alignwide  { max-width: 100%; }
.esf-partidas-block.alignfull  { max-width: 100%; border-radius: 0; }