/* Bet-Mate v2 additions on top of lovable.css (the redesign's compiled stylesheet).
   Only what the redesign's own classes do not cover. */
[hidden] { display: none !important; }
html.dark .bm-when-light, html:not(.dark) .bm-when-dark { display: none; }
.bm-chev { transition: transform .15s; }
.bm-open .bm-chev { transform: rotate(90deg); }
.bm-faded { opacity: .32; }
.bm-mcells-2 { grid-template-columns: repeat(2, minmax(108px, 1fr)); }
.bm-mcells-3 { grid-template-columns: repeat(3, minmax(100px, 1fr)); }
.bm-detail-table th, .bm-detail-table td { padding: 2px 6px 2px 0; text-align: left; font-weight: 500; }
.bm-detail-table thead th { color: var(--muted-foreground); font-size: 10px; text-transform: uppercase; }
.bm-overlay { position: fixed; inset: 0; z-index: 60; background: var(--overlay); }
.bm-modal { position: fixed; z-index: 61; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(94vw, 520px); max-height: 86vh; display: flex; flex-direction: column; background: var(--card); }
.bm-modal-list { max-height: 48vh; overflow-y: auto; }
.bm-prose h2 { font-family: var(--font-display, inherit); font-weight: 700; font-size: 1.05rem; margin-top: 1.6rem; }
.bm-prose h3 { font-weight: 700; font-size: .95rem; margin-top: 1.2rem; }
.bm-prose p, .bm-prose ul, .bm-prose ol { margin-top: .6rem; line-height: 1.6; }
.bm-prose ul { list-style: disc; padding-left: 1.2rem; }
.bm-prose ol { list-style: decimal; padding-left: 1.2rem; }
.bm-prose a { color: var(--primary); text-decoration: underline; }
.bm-field { display: block; width: 100%; max-width: none; min-height: 2.5rem; font-size: .875rem; }

/* utilities the redesign's compiled CSS does not contain (it only ships the classes it used) */
.gap-y-2 { row-gap: .5rem; }
.max-h-40 { max-height: 10rem; }
.max-w-\[100px\] { max-width: 100px; }
.max-w-xl { max-width: 36rem; }
.pr-4 { padding-right: 1rem; }
.py-16 { padding-top: 4rem; padding-bottom: 4rem; }
.self-end { align-self: flex-end; }
.space-y-0\.5 > :not(:last-child) { margin-bottom: .125rem; }
.w-20 { width: 5rem; }
.w-24 { width: 6rem; }
.rotate-180 { transform: rotate(180deg); }
@media (min-width: 40rem) { .sm\:col-span-2 { grid-column: span 2 / span 2; } }
@media (min-width: 48rem) { .md\:col-span-2 { grid-column: span 2 / span 2; } }
@media (min-width: 64rem) { .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.bm-alert a { color: var(--primary); text-decoration: underline; }
.bm-alert ul { list-style: disc; padding-left: 1.2rem; margin-top: .25rem; }
.bm-alert h5 { font-weight: 700; }
.bm-payform input[type=submit], .bm-payform button { display: inline-flex; height: 2.25rem; align-items: center; border-radius: .375rem; background: var(--destructive); color: var(--destructive-foreground); padding: 0 1rem; font-weight: 600; cursor: pointer; }
.bm-payform p { margin-top: .5rem; }

/* cookie / notification bar in the new design (classic layout keeps bm-consent.css as is) */
.bm-consent { background: var(--premium); color: var(--premium-foreground); font: inherit; font-size: 13px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--border); box-shadow: var(--panel-shadow); }
.bm-consent__text a { color: var(--premium-foreground); }
.bm-consent__btn { font: inherit; font-size: 13px; font-weight: 600; border-radius: .375rem; padding: 9px 18px; min-width: 0; }
.bm-consent__btn--accept { background: var(--primary); color: var(--primary-foreground); }
.bm-consent__btn--reject { color: var(--premium-foreground); border-color: var(--premium-muted); }
.contents { display: contents; }
/* lovable.css lists .inline-flex after .hidden, so "hidden sm:inline-flex" on a button stays visible on phones */
.bm-sm-only { display: none !important; }
@media (min-width: 40rem) { .bm-sm-only { display: inline-flex !important; } }
.bm-cap::first-letter { text-transform: uppercase; }
@media (min-width: 64rem) { .lg\:inline { display: inline; } }
.bm-locked-league .f24.flag { margin: 0 4px 0 0; flex-shrink: 0; }
[data-bm-lockednotice] .f24.flag { margin: 0 4px 0 0; transform: scale(.75); }

/* ---- mobile / tablet fixes (2026-10-08 mobile QA) ---- */
.bm-titlebar { min-height: 58px; }
.bm-lg-flex { display: none; }
@media (min-width: 64rem) { .bm-lg-flex { display: flex; } }
/* the My leagues dialog: body scrolls so Save/Cancel stay on screen (landscape phones) */
.bm-modal-body { overflow-y: auto; min-height: 0; flex: 1 1 auto; }
.bm-noscroll { overflow: hidden; }
/* short screens (phones in landscape): the three header bars scroll away instead of staying */
@media (max-height: 500px) { #bm-header { position: static; } }
/* the league select must not squeeze the sub-tabs out; the tab row fades where it scrolls */
[data-bm-leagueselect] { max-width: 8.5rem; }
.bm-subtabs.bm-overflowing { mask-image: linear-gradient(to right, #000 calc(100% - 18px), transparent); -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 18px), transparent); }
/* tap targets on phones */
@media (max-width: 47.99rem) {
	[data-bm-seg] button { min-height: 2rem; }
	.bm-subtabs a { min-height: 2rem; display: inline-flex; align-items: center; }
	[data-bm-clear] { padding: .5rem .35rem; }
	[data-bm-filter][type=checkbox], .bm-modal input[type=checkbox] { width: 1.1rem; height: 1.1rem; }
}
/* narrow phones: sub-tabs wrap onto a second line instead of hiding behind the league select */
@media (max-width: 30rem) {
	.bm-subtabs-bar { height: auto; min-height: 2.5rem; padding-block: .25rem; flex-wrap: wrap; }
	.bm-subtabs { flex-wrap: wrap; overflow: visible; flex-basis: 100%; }
	.bm-subtabs.bm-overflowing { mask-image: none; -webkit-mask-image: none; }
	[data-bm-leagueselect] { max-width: none; flex: 1 1 auto; }
}
@media (max-width: 25rem) { .bm-logo-text { display: none; } }

/* cookie notice, btfstats style: dark bar, green rule, one OK */
.bm-consent--notice { background: #1b1b1b; color: #eee; border-top: 3px solid var(--success); font-size: 13px; line-height: 1.45; padding: 0; }
.bm-consent--notice .bm-consent__inner { max-width: 1200px; margin: 0 auto; padding: 14px 18px calc(14px + env(safe-area-inset-bottom, 0px)); display: flex; align-items: center; gap: 18px; }
.bm-consent--notice .bm-consent__text { flex: 1; }
.bm-consent--notice strong { display: block; margin-bottom: 4px; font-size: 14px; color: #fff; }
.bm-consent--notice p { margin: 0; color: #cfcfcf; }
.bm-consent--notice a { color: #8fd14f; text-decoration: underline; }
.bm-consent--notice .bm-consent__actions { display: flex; align-items: center; gap: 14px; flex-shrink: 0; }
.bm-consent--notice .bm-consent__btn--accept { background: var(--success); color: #fff; border: 0; border-radius: 4px; padding: 9px 26px; font-size: 14px; font-weight: 700; min-width: 0; }
.bm-consent__link { background: none; border: 0; color: #cfcfcf; text-decoration: underline; font-size: 12px; cursor: pointer; padding: 6px 0; }
@media (max-width: 640px) {
	.bm-consent--notice .bm-consent__inner { flex-direction: column; align-items: stretch; gap: 10px; padding: 12px 14px calc(12px + env(safe-area-inset-bottom, 0px)); }
	.bm-consent--notice .bm-consent__actions { flex-direction: column-reverse; align-items: stretch; gap: 6px; }
	.bm-consent--notice .bm-consent__btn--accept { width: 100%; padding: 11px 0; }
}

/* ---- guided entry + landing ---- */
.bm-guided-choices { grid-template-columns: 1fr; }
@media (min-width: 40rem) { .bm-guided-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 80rem) { .bm-guided-choices { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.bm-guided-dismissible .bm-guided-choices { margin-right: 1.5rem; }
.bm-hero { background: radial-gradient(1200px 400px at 85% -10%, color-mix(in oklab, var(--primary) 35%, transparent), transparent 60%), linear-gradient(135deg, var(--premium), color-mix(in oklab, var(--premium) 80%, var(--primary))); }
.bm-spark { height: 70px; display: block; }
.bm-blurred { filter: blur(4px); user-select: none; }
#bm-guide .bm-modal { width: min(94vw, 460px); }
/* utilities used by the landing page that lovable.css does not ship */
.bg-background\/5 { background: color-mix(in oklab, var(--background) 5%, transparent); }
.bg-background\/10, .hover\:bg-background\/10:hover { background: color-mix(in oklab, var(--background) 10%, transparent); }
.bg-background\/40 { background: color-mix(in oklab, var(--background) 40%, transparent); }
.border-premium-muted\/25 { border-color: color-mix(in oklab, var(--premium-muted) 25%, transparent); }
.border-premium-muted\/40 { border-color: color-mix(in oklab, var(--premium-muted) 40%, transparent); }
.gap-x-5 { column-gap: 1.25rem; }
.hover\:bg-success:hover { background: var(--success); }
.hover\:opacity-90:hover { opacity: .9; }
.items-baseline { align-items: baseline; }
.min-h-9 { min-height: 2.25rem; }
.min-h-\[220px\] { min-height: 220px; }
.min-w-\[640px\] { min-width: 640px; }
.pb-16 { padding-bottom: 4rem; }
.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.py-5 { padding-top: 1.25rem; padding-bottom: 1.25rem; }
.size-6 { width: 1.5rem; height: 1.5rem; }
.size-9 { width: 2.25rem; height: 2.25rem; }
.size-11 { width: 2.75rem; height: 2.75rem; }
.top-2 { top: .5rem; }
@media (min-width: 40rem) { .sm\:px-8 { padding-left: 2rem; padding-right: 2rem; } .sm\:text-4xl { font-size: 2.25rem; line-height: 2.5rem; } .sm\:text-base { font-size: 1rem; line-height: 1.5rem; } }
@media (min-width: 64rem) {
	.bm-hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); }
	.bm-landing-cols { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); align-items: start; }
}
/* guided choices take a full row below wide desktop; the Premium box stacks on phones */
.bm-guided-choices { flex-basis: 100%; order: 3; }
@media (min-width: 80rem) { .bm-guided-choices { flex-basis: auto; order: 0; } }
@media (max-width: 40rem) { .bm-cta { flex-direction: column; align-items: stretch; text-align: center; } .bm-cta a { justify-content: center; } }
#bm-guide [data-bm-guide-done] { height: auto; min-height: 2rem; white-space: normal; text-align: center; padding-block: .35rem; }
/* team / league search in the toolbar */
.bm-search input::placeholder { color: var(--muted-foreground); }
.outline-none { outline: none; }
@media (max-width: 47.99rem) { .bm-search { flex: 1 1 100%; order: 10; } .bm-search input { width: 100%; } }

/* ---- mobile QA round 2 ---- */
/* on the tables the guided strip is one line on phones/tablets until tapped */
.bm-guided-caret { display: none; }
@media (max-width: 79.99rem) {
	.bm-guided-dismissible .bm-guided-choices { display: none; }
	.bm-guided-dismissible.bm-expanded .bm-guided-choices { display: grid; }
	.bm-guided-caret { display: inline; }
	.bm-guided-dismissible [data-bm-guide-open] small { display: none; }
}
/* tap targets on phones */
@media (max-width: 47.99rem) {
	[data-bm-toggle], .premium-panel a, [data-bm-lockednotice] a { min-height: 2.25rem; }
	[data-bm-panel-toggle] { width: 2rem; height: 2rem; }
	[data-bm-landing] a.text-xs, [data-bm-landing] a.text-sm { display: inline-flex; align-items: center; min-height: 2rem; }
}
@media (max-width: 63.99rem) {
	[data-bm-seg] button { min-height: 2rem; }
	.bm-subtabs a { min-height: 2rem; display: inline-flex; align-items: center; }
	[data-bm-clear] { padding: .5rem .35rem; }
}
.min-h-8 { min-height: 2rem; }
.h-8.whitespace-nowrap { white-space: nowrap; }
.whitespace-nowrap { white-space: nowrap; }

/* ---- hand cursor on everything clickable (Tailwind's reset gives buttons the arrow) ---- */
button:not(:disabled), [role="button"], summary, select, label:has(> input[type="checkbox"]), label:has(> input[type="radio"]),
input[type="checkbox"], input[type="radio"], input[type="submit"], input[type="button"], input[type="color"],
[data-bm-row], [data-bm-seg] > *, [data-bm-toggle], [data-bm-panel-toggle], [data-bm-sound], [data-bm-feedpage], [data-bm-lang] { cursor: pointer; }
button:disabled, input:disabled, select:disabled, [aria-disabled="true"] { cursor: not-allowed; }
[data-bm-row] a, [data-bm-row] button { cursor: pointer; }
/* small controls in the side feeds and the register checkboxes: bigger tap targets on phones */
[data-bm-sound], [data-bm-feedpage] { display: inline-flex; align-items: center; justify-content: center; min-width: 1.75rem; min-height: 1.75rem; }
input[type="checkbox"] { width: 1.05rem; height: 1.05rem; flex-shrink: 0; }

/* ---- Help assistant (layout.php bm_help_assistant, app.js helpAssistant) ---- */
.bm-help-fab { position: fixed; right: 1rem; bottom: calc(1rem + env(safe-area-inset-bottom, 0px)); z-index: 55; display: inline-flex; align-items: center; gap: .4rem; height: 2.75rem; padding: 0 1rem; border-radius: 9999px; background: var(--primary); color: var(--primary-foreground); font-size: .875rem; font-weight: 600; box-shadow: 0 6px 20px rgb(0 0 0 / .2); cursor: pointer; }
.bm-help-fab:hover { filter: brightness(1.08); }
.bm-help-fab:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; }
.bm-help-panel { position: fixed; right: 1rem; bottom: calc(1rem + env(safe-area-inset-bottom, 0px)); z-index: 62; display: flex; flex-direction: column; width: min(26rem, calc(100vw - 2rem)); height: min(38rem, calc(100vh - 2rem)); background: var(--background); color: var(--foreground); border: 1px solid var(--border); border-radius: .75rem; box-shadow: 0 16px 48px rgb(0 0 0 / .25); overflow: hidden; }
.bm-help-panel[hidden], .bm-help-fab[hidden] { display: none !important; }
.bm-help-body { flex: 1 1 auto; overflow-y: auto; }
.bm-help-chip { border: 1px solid var(--border); background: var(--card); border-radius: 9999px; padding: .4rem .8rem; font-size: .8rem; text-align: left; cursor: pointer; }
.bm-help-chip:hover { border-color: var(--primary); color: var(--primary); }
.bm-help-hit { border: 1px solid var(--border); background: var(--card); border-radius: .5rem; padding: .6rem .75rem; }
.bm-help-hit b { display: block; font-size: .875rem; }
.bm-help-hit p { margin-top: .25rem; font-size: .8125rem; line-height: 1.45; color: var(--foreground); }
.bm-help-hit a { display: inline-block; margin-top: .3rem; font-size: .75rem; font-weight: 600; color: var(--primary); }
@media (max-width: 40rem) {
	.bm-help-panel { inset: 0; right: 0; bottom: 0; width: auto; height: auto; border-radius: 0; border: 0; padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px); }
	.bm-help-fab { width: 2.75rem; padding: 0; justify-content: center; }
	.bm-help-fab span { display: none; }
}
@media print { .bm-help-fab, .bm-help-panel { display: none !important; } }

/* ---- click-through audit fixes (2026-10-08) ---- */
/* dialogs (My leagues editor, guide) and the open Help panel sit above the cookie bar (z 9999),
   so their buttons stay reachable on phones before a cookie choice is made */
.bm-overlay { z-index: 10000; }
.bm-modal { z-index: 10001; }
#bm-guide { position: relative; z-index: 10001; }
.bm-help-panel { z-index: 10002; }
/* the team/league search shows where the keyboard focus is */
.bm-search:focus-within { outline: 2px solid var(--ring); outline-offset: 1px; }
/* room under the last content, so the floating Help button never covers it */
body { padding-bottom: 4.5rem; }
/* phones: the "Premium leagues this week" bar is one swipeable line instead of several rows */
@media (max-width: 47.99rem) {
	[data-bm-lockednotice] > div { flex-wrap: nowrap; overflow-x: auto; white-space: nowrap; scrollbar-width: none; }
	[data-bm-lockednotice] > div::-webkit-scrollbar { display: none; }
	[data-bm-lockednotice] > div > * { flex-shrink: 0; }
}

/* ---- expanded match row (app.js detail) ---- */
.bm-detail { display: grid; gap: .75rem; }
.bm-detail-ev { display: grid; gap: .35rem; font-size: .8125rem; }
.bm-detail-grid { display: grid; gap: .75rem; grid-template-columns: 1fr; }
@media (min-width: 64rem) { .bm-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.bm-detail-src { background: var(--card); border: 1px solid var(--border); border-radius: .5rem; padding: .6rem .75rem; min-width: 0; }
.bm-detail-table { border-collapse: collapse; font-variant-numeric: tabular-nums; font-size: .78rem; }
.bm-detail-table thead th { color: var(--muted-foreground); font-size: .65rem; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; padding: .3rem .6rem .3rem 0; text-align: left; white-space: nowrap; }
.bm-detail-table tbody th { font-family: var(--font-mono, ui-monospace, monospace); font-weight: 700; padding: .35rem .6rem .35rem 0; text-align: left; width: 3rem; }
.bm-detail-table td { padding: .35rem .6rem .35rem 0; white-space: nowrap; font-family: var(--font-mono, ui-monospace, monospace); }
.bm-detail-table tbody tr:not(.bm-hist) { border-top: 1px solid var(--border); }
.bm-detail-table td.bm-now { font-weight: 700; font-size: .9rem; color: var(--foreground); }
.bm-detail-table tr.bm-hist td { padding-top: 0; padding-bottom: .45rem; white-space: normal; }
.bm-chg { display: inline-block; border-radius: .25rem; padding: 0 .3rem; font-size: .68rem; font-weight: 700; color: var(--muted-foreground); background: var(--accent); }
.bm-chg-down { color: #fff; background: var(--destructive); }
.bm-chg-up { color: var(--foreground); background: var(--accent); }
.bm-hchip { display: inline-block; margin: .15rem .3rem 0 0; border: 1px solid var(--border); border-radius: 9999px; padding: .05rem .5rem; font-size: .68rem; color: var(--muted-foreground); background: var(--background); }
.bm-hchip.bm-chg-down { border-color: color-mix(in oklab, var(--destructive) 45%, transparent); color: var(--destructive); background: transparent; }
.bm-hchip.bm-chg-up { color: var(--foreground); }
@media (max-width: 40rem) { .bm-detail-table .bm-lc { display: none; } } /* phones: the first change chip shows the same time */

/* ---- Free plan: locked filter controls (app.js FREE_LOCK) ---- */
[data-bm-locked] { opacity: .55; cursor: not-allowed !important; }
[data-bm-seg] button[data-bm-locked][aria-pressed="true"], [data-bm-seg] button[data-bm-locked].bg-primary { opacity: 1; }
.bm-locktoast { position: fixed; left: 50%; bottom: calc(5rem + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); z-index: 10003; display: flex; align-items: center; gap: .5rem; max-width: calc(100vw - 2rem); padding: .6rem .9rem; border-radius: .6rem; background: var(--foreground); color: var(--background); font-size: .8125rem; box-shadow: 0 8px 24px rgb(0 0 0 / .25); }
.bm-locktoast svg { width: 1rem; height: 1rem; flex-shrink: 0; }
.bm-locktoast a { font-weight: 700; text-decoration: underline; white-space: nowrap; }
.bm-locktoast[hidden] { display: none !important; }

/* show/hide password (app.js) */
.bm-pwwrap { position: relative; display: block; }
.bm-pwwrap input { width: 100%; padding-right: 4.5rem; }
.bm-pwtoggle { position: absolute; right: .35rem; top: 50%; transform: translateY(-50%); padding: .2rem .5rem; border-radius: .3rem; font-size: .75rem; font-weight: 600; color: var(--primary); }
.bm-pwtoggle:hover { background: var(--accent); }

/* Free plan, Filters panel: the note spans the whole panel; every control is visibly locked */
#bm-filters > p.bg-notice { grid-column: 1 / -1; }
#bm-filters [data-bm-filter]:disabled, #bm-filters .control.opacity-70 { opacity: .45; cursor: not-allowed; background: var(--muted, var(--accent)); }
#bm-filters label:has([data-bm-filter]:disabled) > span:first-of-type::after,
#bm-filters label:has(input[data-bm-filter]:disabled) span::after { content: " 🔒"; }
[data-bm-locked].bm-search, .bm-search:has([data-bm-locked]) { opacity: .55; cursor: not-allowed; }

/* ---- phones: data higher on the screen (2026-10-08) ---- */
.bm-freechip { display: none; }
@media (max-width: 40rem) {
	.bm-titlebar { padding-top: .35rem; padding-bottom: .35rem; }
	.bm-titlebar p.truncate { display: none; }            /* the market line repeats the tab */
	/* Free: locked controls fold into one chip */
	.bm-free [data-bm-seg="date"], .bm-free [data-bm-seg="sort"], .bm-free label:has(> select[data-bm-filter="sort"]),
	.bm-free .bm-search, .bm-free [data-bm-clear] { display: none !important; }
	.bm-free .bm-freechip { display: inline-flex; align-items: center; gap: .35rem; height: 2rem; padding: 0 .6rem; border: 1px solid var(--notice-border); border-radius: .375rem; background: var(--notice); color: var(--notice-foreground); font-size: .75rem; font-weight: 600; }
	/* one subscribe prompt at a time: the Premium-leagues bar replaces the dark banner */
	.bm-free:has([data-bm-lockednotice]:not([hidden])) .bm-mpremium { display: none; }
	/* the "New here?" strip: first table visit only (homepage and footer keep the guide) */
	html.bm-seen-tables .bm-guided-dismissible { display: none !important; }
}