/* BFoot Live — styles des blocs. Les couleurs se surchargent depuis le thème via les variables --bsl-*. */
.bsl {
	--bsl-pitch: #3f7a2a;
	--bsl-pitch-deep: #24511a;
	--bsl-gold: #f0b21c;
	--bsl-live: #e1262c;
	--bsl-teal: #1f9b8f;
	--bsl-orange: #e9780c;
	--bsl-surface: #ffffff;
	--bsl-surface-2: #f1f3f5;
	--bsl-ink: #1f2933;
	--bsl-muted: #6b7280;
	--bsl-line: #e3e6ea;
	--bsl-display: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
	--bsl-radius: 10px;
	box-sizing: border-box;
	color: var(--bsl-ink);
	font-family: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
	font-size: 13px;
	line-height: 1.45;
	font-variant-numeric: tabular-nums;
}
@media (prefers-color-scheme: dark) {
	.bsl-auto-dark .bsl, .bsl.bsl-auto-dark {
		--bsl-pitch: #5fa245; --bsl-surface: #161e18; --bsl-surface-2: #1e2920;
		--bsl-ink: #e8eee6; --bsl-muted: #93a296; --bsl-line: #2a372d;
	}
}
.bsl *, .bsl *::before, .bsl *::after { box-sizing: border-box; }
.bsl button { font: inherit; color: inherit; cursor: pointer; }
.bsl button:focus-visible { outline: 2px solid var(--bsl-gold); outline-offset: 2px; }

.bsl-scores, .bsl-standings {
	background: var(--bsl-surface);
	border: 1px solid var(--bsl-line);
	border-radius: var(--bsl-radius);
	overflow: hidden;
}
.bsl-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--bsl-line); }
.bsl-title { font-family: var(--bsl-display); font-weight: 800; font-size: 17px; line-height: 1.15; text-transform: uppercase; letter-spacing: .2px; margin: 0; }
.bsl-demo { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .6px; background: var(--bsl-gold); color: #1a1405; border-radius: 4px; padding: 2px 7px; }
.bsl-loading, .bsl-empty { padding: 22px 14px; text-align: center; color: var(--bsl-muted); }
.bsl-foot { font-size: 11px; color: var(--bsl-muted); padding: 8px 14px; border-top: 1px solid var(--bsl-line); }

/* Jours */
.bsl-days-wrap { display: flex; align-items: stretch; border-bottom: 1px solid var(--bsl-line); }
.bsl-days { flex: 1; display: grid; grid-template-columns: repeat(5, 1fr); }
.bsl-days button { border: 0; background: transparent; padding: 6px 0; font-size: 11.5px; color: var(--bsl-muted); display: grid; line-height: 1.2; }
.bsl-days b { font-family: var(--bsl-display); font-weight: 800; font-size: 14px; color: var(--bsl-ink); }
.bsl-days button[aria-pressed="true"] { box-shadow: inset 0 -3px 0 var(--bsl-pitch); color: var(--bsl-ink); }
.bsl-days .bsl-today:not([aria-pressed="true"]) b { color: var(--bsl-pitch); }
.bsl-cal { position: relative; display: grid; place-items: center; width: 44px; flex: none; border-left: 1px solid var(--bsl-line); color: var(--bsl-muted); cursor: pointer; }
.bsl-cal:hover, .bsl-cal:focus-within { color: var(--bsl-ink); }
.bsl-cal svg { width: 18px; height: 18px; }
.bsl-cal input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; border: 0; padding: 0; }
.bsl-cal input::-webkit-calendar-picker-indicator { position: absolute; inset: 0; width: 100%; height: 100%; cursor: pointer; }
.bsl .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Filtres */
.bsl-filters { display: flex; gap: 5px; padding: 7px 12px; border-bottom: 1px solid var(--bsl-line); overflow-x: auto; scrollbar-width: none; }
.bsl-filters::-webkit-scrollbar { display: none; }
.bsl-filters button { flex: none; display: inline-flex; align-items: center; gap: 5px; border: 0; background: var(--bsl-surface-2); border-radius: 999px; padding: 4px 10px; font-size: 12px; font-weight: 600; white-space: nowrap; }
@container (max-width: 360px) { .bsl-filters { gap: 4px; padding: 7px 10px; } .bsl-filters button { padding: 4px 8px; font-size: 11.5px; gap: 4px; } }
.bsl-filters .bsl-f-fav svg { width: 14px; height: 14px; fill: currentColor; }
.bsl-filters .bsl-f-fav.bsl-has { color: var(--bsl-gold); }
.bsl-filters button i { font-style: normal; font-size: 11px; font-weight: 700; color: var(--bsl-muted); }
.bsl-filters button i:empty { display: none; }
.bsl-filters button[aria-pressed="true"] { background: var(--bsl-ink); color: var(--bsl-surface); }
.bsl-filters button[aria-pressed="true"] i { color: inherit; opacity: .75; }
.bsl-filters [data-f="live"].bsl-has { color: var(--bsl-live); }
.bsl-filters [data-f="live"].bsl-has i { color: var(--bsl-live); }
.bsl-filters [data-f="live"][aria-pressed="true"] { background: var(--bsl-live); color: #fff; }
.bsl-filters [data-f="live"][aria-pressed="true"] i { color: #fff; }

/* Championnats */
.bsl-league + .bsl-league { border-top: 1px solid var(--bsl-line); }
.bsl .bsl-comp { width: 100%; display: flex; align-items: center; gap: 9px; border: 0; background: var(--bsl-surface-2); padding: 7px 12px; text-align: left; min-height: 38px; }
.bsl-flag { width: 18px; height: 13px; flex: none; object-fit: cover; border-radius: 2px; box-shadow: 0 0 0 1px rgba(0, 0, 0, .08); }
.bsl-globe { height: 16px; width: 16px; box-shadow: none; color: var(--bsl-muted); }
.bsl-comp-n { flex: 1; display: grid; min-width: 0; line-height: 1.2; }
.bsl-comp-n span { font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--bsl-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bsl-comp-n em { font-style: normal; text-transform: none; letter-spacing: 0; font-weight: 500; }
.bsl-comp-n b { font-size: 13px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bsl-count { flex: none; min-width: 22px; height: 20px; padding: 0 6px; border-radius: 999px; display: inline-grid; place-items: center; font-size: 11px; font-weight: 700; background: var(--bsl-surface); color: var(--bsl-muted); }
.bsl-count-live { background: var(--bsl-live); color: #fff; }
.bsl-chev { width: 16px; height: 16px; flex: none; color: var(--bsl-muted); transition: transform .15s; }
.bsl-shut .bsl-chev { transform: rotate(180deg); }

/* Matchs */
.bsl-scores { container-type: inline-size; }
.bsl-match { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto 28px; align-items: center; column-gap: 8px; padding: 5px 4px 5px 12px; border-top: 1px solid var(--bsl-line); }
.bsl-match:hover { background: var(--bsl-surface-2); }
.bsl .bsl-star { border: 0; background: transparent; padding: 0; width: 28px; height: 32px; display: grid; place-items: center; color: var(--bsl-line); }
.bsl-star svg { width: 15px; height: 15px; fill: currentColor; }
.bsl .bsl-star[aria-pressed="true"] { color: var(--bsl-gold); }
.bsl-st { font-size: 12px; color: var(--bsl-muted); text-align: center; line-height: 1.2; }
.bsl-m-live .bsl-st, .bsl-m-live .bsl-sc { color: var(--bsl-live); font-weight: 700; }
.bsl-m-live .bsl-st::after { content: ""; display: block; width: 5px; height: 5px; margin: 3px auto 0; border-radius: 50%; background: currentColor; animation: bsl-pulse 1.4s infinite; }
.bsl-m-off .bsl-st { font-size: 10.5px; }
.bsl-m-off .bsl-teams { opacity: .6; }
.bsl-teams { display: grid; gap: 1px; min-width: 0; }
.bsl-teams > span { display: flex; align-items: center; gap: 7px; min-width: 0; line-height: 19px; }
.bsl-teams > span > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bsl-m-ft .bsl-teams > span:not(.bsl-win) { color: var(--bsl-muted); }
.bsl-win { font-weight: 700; }
.bsl-sc { display: grid; gap: 1px; text-align: right; font-family: var(--bsl-display); font-weight: 800; font-size: 14px; line-height: 19px; min-width: 18px; }
.bsl-m-pre .bsl-sc { color: var(--bsl-line); }
.bsl-pens { grid-column: 2 / -1; font-size: 11px; color: var(--bsl-muted); }
.bsl-crest { width: 18px; height: 18px; border-radius: 50%; flex: none; display: inline-grid; place-items: center; font-style: normal; font-size: 7.5px; font-weight: 800; letter-spacing: -.2px; color: #fff; background: hsl(var(--h, 120) 50% 34%); object-fit: contain; }
img.bsl-crest { background: transparent; border-radius: 0; }

/* Classement sous un championnat */
.bsl-league-foot { display: flex; justify-content: flex-end; padding: 2px 6px; border-top: 1px solid var(--bsl-line); }
.bsl .bsl-tbl-btn { display: inline-flex; align-items: center; gap: 6px; border: 0; background: transparent; border-radius: 999px; padding: 3px 8px; font-size: 11.5px; font-weight: 700; color: var(--bsl-pitch); }
.bsl .bsl-tbl-btn:hover { background: var(--bsl-surface-2); }
.bsl-tbl-btn svg { width: 14px; height: 14px; }
.bsl-inline-tbl { border-top: 1px solid var(--bsl-line); max-height: 420px; overflow: auto; }
.bsl table.bsl-mini td, .bsl table.bsl-mini th { padding: 5px 8px; }
.bsl-mini .bsl-hot td { background: color-mix(in srgb, var(--bsl-gold) 14%, transparent); font-weight: 600; }

/* Téléphone : voir tous les matchs */
.bsl .bsl-more-btn { display: flex; width: 100%; justify-content: center; align-items: center; gap: 6px; border: 0; border-top: 1px solid var(--bsl-line); background: var(--bsl-surface); padding: 11px; font-size: 13px; font-weight: 700; color: var(--bsl-pitch); }
.bsl .bsl-more-btn b { font-weight: 700; background: var(--bsl-surface-2); border-radius: 999px; padding: 0 7px; color: var(--bsl-ink); }

/* Données indisponibles */
.bsl-down { display: grid; justify-items: center; gap: 6px; padding: 26px 18px; text-align: center; }
.bsl-down svg { width: 34px; height: 34px; color: var(--bsl-pitch); animation: bsl-spin 6s linear infinite; }
.bsl-down b { font-family: var(--bsl-display); font-weight: 800; font-size: 15px; }
.bsl-down span { color: var(--bsl-muted); font-size: 12.5px; max-width: 30ch; }
@keyframes bsl-spin { to { transform: rotate(360deg); } }

/* Pied */
.bsl-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; }

/* Bandeau */
.bsl-ticker { background: var(--bsl-pitch); color: #fff; }
.bsl-tk-track { display: flex; gap: 10px; overflow-x: auto; padding: 10px 16px; scrollbar-width: thin; }
.bsl-tk { flex: none; min-width: 180px; background: rgba(0, 0, 0, .18); border-radius: 8px; padding: 7px 11px; display: grid; gap: 2px; font-size: 13px; }
.bsl-tk-h { display: flex; justify-content: space-between; gap: 8px; font-size: 11px; text-transform: uppercase; letter-spacing: .5px; opacity: .9; }
.bsl-tk-r { display: flex; justify-content: space-between; gap: 10px; font-weight: 600; }
.bsl-tk-ft .bsl-tk-r:not(.bsl-win) { opacity: .75; }
.bsl-tk-r b { font-family: var(--bsl-display); font-weight: 800; font-size: 14px; line-height: 1.3; }
.bsl-tk-empty { padding: 10px 16px; font-size: 13px; opacity: .85; }
.bsl-live { background: var(--bsl-live); color: #fff; border-radius: 3px; padding: 0 5px; font-weight: 700; display: inline-flex; align-items: center; gap: 4px; }
.bsl-live::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: bsl-pulse 1.4s infinite; }
@keyframes bsl-pulse { 50% { opacity: .25; } }

/* Classement */
.bsl-tabs { display: flex; gap: 4px; padding: 8px 14px; border-bottom: 1px solid var(--bsl-line); overflow-x: auto; scrollbar-width: none; }
.bsl-tabs button { border: 0; background: transparent; border-radius: 5px; padding: 5px 9px; font-size: 13px; font-weight: 600; color: var(--bsl-muted); white-space: nowrap; }
.bsl-tabs button[aria-pressed="true"] { background: var(--bsl-surface-2); color: var(--bsl-ink); }
.bsl-group { font-size: 12px; text-transform: uppercase; letter-spacing: .5px; color: var(--bsl-muted); margin: 0; padding: 10px 14px 0; }
.bsl-tbl { overflow-x: auto; container-type: inline-size; }
.bsl table { width: 100%; border-collapse: collapse; font-size: 13px; margin: 0; }
.bsl th { font-size: 11px; font-weight: 700; color: var(--bsl-muted); text-transform: uppercase; letter-spacing: .5px; text-align: right; padding: 7px 8px; border: 0; background: none; }
.bsl td { padding: 7px 8px; border: 0; border-top: 1px solid var(--bsl-line); text-align: right; background: none; }
.bsl th:nth-child(2), .bsl td.bsl-team { text-align: left; }
.bsl td.bsl-team { width: 100%; max-width: 0; }
.bsl-team > span { display: flex; align-items: center; gap: 7px; white-space: nowrap; min-width: 0; }
.bsl-team > span > span { overflow: hidden; text-overflow: ellipsis; }
@container (max-width: 360px) { .bsl th, .bsl td { padding-left: 5px; padding-right: 5px; } }
.bsl-pos { text-align: center !important; font-weight: 700; position: relative; width: 30px; }
.bsl-pos::before { content: ""; position: absolute; left: 0; top: 5px; bottom: 5px; width: 3px; border-radius: 2px; background: var(--z, transparent); }
.bsl-pts { font-family: var(--bsl-display); font-weight: 800; font-size: 13px; }
.bsl-form { white-space: nowrap; }
.bsl-f { display: inline-grid; place-items: center; width: 14px; height: 14px; margin-left: 2px; border-radius: 3px; font-style: normal; font-size: 9px; font-weight: 800; color: #fff; }
.bsl-f-V { background: var(--bsl-pitch); }
.bsl-f-N { background: #8b948d; }
.bsl-f-D { background: var(--bsl-live); }
.bsl-more td { color: var(--bsl-muted); text-align: left; }
.bsl-legend { display: flex; flex-wrap: wrap; gap: 6px 12px; padding: 10px 14px; font-size: 11px; color: var(--bsl-muted); border-top: 1px solid var(--bsl-line); }
.bsl-legend span { display: inline-flex; align-items: center; gap: 5px; }
.bsl-legend i { width: 10px; height: 10px; border-radius: 2px; }
@container (max-width: 360px) { .bsl .bsl-form { display: none; } }

.bsl-admin-note { padding: 10px 12px; border: 1px dashed #d63638; color: #d63638; font-size: 13px; }

@media (prefers-reduced-motion: reduce) { .bsl-live::before, .bsl-m-live .bsl-st::after { animation: none; } .bsl-chev { transition: none; } .bsl-down svg { animation: none; } }
