/* ============ BET BUILDER PAGE: the Showroom finishing pass ============
   Same laws as the match page: square jewellery frames, Bodoni gold
   section voice, foil numbers, warm bright text tiers. */

/* square-corner law across the page content */
.bet-builder-card, .bet-builder-card *, .legs .leg, .mv-block, .mv-block *,
.how-this-works, .how-this-works *, .alternatives, .alternatives *,
.player-form-list, .player-form-row, .tier-head, .reasoning, .prob-bar,
.tracked-chip, [class*="chip"], [class*="badge"], [class*="pill"] {
    border-radius: 0 !important;
}

/* section titles speak Bodoni gold */
main h2, .tier-head h2 {
    font-family: 'Bodoni Moda', Georgia, serif !important;
    text-transform: none !important;
    letter-spacing: 0.01em !important;
    font-weight: 600 !important;
    color: #E6C860 !important;
}

/* leg cards join the jewellery system */
.legs .leg {
    border: 1px solid transparent !important;
    background:
        linear-gradient(#0C0C0C, #0B0B0B) padding-box,
        linear-gradient(135deg, rgba(212, 175, 55, 0.4), rgba(212, 175, 55, 0.07) 45%, rgba(230, 200, 96, 0.25)) border-box !important;
    border-left: 2px solid rgba(212, 175, 55, 0.6) !important;
}

/* market board rows: same voice as the match page breakdown */
.mv-sub { color: #F5F2EA !important; }
.mv-sub span { color: #A8A399 !important; }
.mv-label { color: #E2DED5 !important; }
.mv-implied { color: #E6C860 !important; font-weight: 700 !important; font-family: ui-monospace, Consolas, monospace !important; }
.mv-best { color: #DAD6CC !important; font-family: ui-monospace, Consolas, monospace !important; }
.mv-book { color: #A8A399 !important; font-family: ui-monospace, Consolas, monospace !important; }
.mv-row { border-bottom: 1px solid rgba(255, 255, 255, 0.09); }

/* warm text tiers - no cold or dim greys */
main p, main li { color: #DAD6CC; }
main .fine, main small, main em { color: #B8B3A9; }

/* numbers pop */
.num-pop { color: #F3DD92 !important; font-weight: 700 !important; font-variant-numeric: tabular-nums; }
main { font-variant-numeric: tabular-nums; }

/* DIRECTION B: builder page numbers to ivory; odds chips interactive */
.mv-implied { color: #FAF7EF !important; }
.mv-best {
    border: 1px solid rgba(255, 255, 255, 0.18);
    padding: 2px 9px;
    color: #FAF7EF !important;
    transition: border-color 140ms ease, background 140ms ease;
}
.mv-row:hover .mv-best { border-color: #D4AF37; background: rgba(212, 175, 55, 0.12); }

/* ============ QUIET LEDGER on the builder page (match-page approved level) ============ */
/* header: eyebrow stacks above the centred title */
.bb-head { text-align: center; }
.bb-head .lb-eyebrow { display: block !important; margin: 0 auto 10px !important; float: none !important; color: #A9A49B !important; }

/* leg cards speak the approved cell language: slim gold spine, ivory
   title, white mono numbers, flat key chips */
.legs .leg {
    background: #101010 !important;
    border: 1px solid rgba(255, 255, 255, 0.09) !important;
    border-left: 2px solid rgba(212, 175, 55, 0.6) !important;
    box-shadow: none !important;
    padding: 16px 18px !important;
}
.legs .leg h3 { color: #F2F0EA !important; font-family: 'Outfit', sans-serif !important; font-weight: 700 !important; }
.legs .leg .prob-bar { color: #A9A49B !important; }
.legs .leg .prob-bar strong {
    font-family: ui-monospace, Consolas, monospace !important;
    color: #FAF7EF !important;
    font-size: 1.02rem;
}
.leg-record-badge {
    background: transparent !important;
    border: 1px solid rgba(230, 200, 96, 0.5) !important;
    color: #E6C860 !important;
    border-radius: 0 !important;
}

/* card + headings: ivory, gold retired from paint duty */
.bet-builder-card { background: #101010 !important; border: 1px solid rgba(255, 255, 255, 0.12) !important; box-shadow: none !important; }
.bet-builder-card h2, .alternatives h2, main h2 { color: #F0EDE6 !important; }
.bet-builder-card > p strong, .bb-combined-line strong { color: #FAF7EF !important; }

/* alternatives: quiet ledger rows */
.alternatives { background: #101010 !important; border: 1px solid rgba(255, 255, 255, 0.09) !important; }
.alternatives p { border-bottom: 1px solid rgba(255, 255, 255, 0.07); padding: 9px 0; margin: 0; }
.alternatives p:last-child { border-bottom: 0; }
.alternatives b, .alternatives strong { color: #FAF7EF !important; font-family: ui-monospace, Consolas, monospace !important; }

/* tracking chip + notes quiet */
main [class*="chip"], main [class*="badge"] { color: #A9A49B !important; border-color: rgba(255, 255, 255, 0.2) !important; background: transparent !important; }

/* ============ v6: SPORTSBOOK-GRADE SLIP CARD + ALIGNED LEDGER ============ */

/* hero: collapse the dead band, quiet the stray blue note */
.bet-builder-page { padding-top: 0 !important; }
.bb-head { margin: 6px 0 30px !important; }
.bb-head h1 { margin-bottom: 8px !important; }
.builder-tool-note { color: #A9A49B !important; }

/* --- slip-card header: title left, combined odds as the focal right --- */
.bbx-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 6px; }
.bbx-head h2 { margin: 0 0 6px !important; }
.bbx-sub { color: #A9A49B !important; font-size: 0.82rem !important; margin: 0 !important; }
.bbx-sub span, .bbx-sub .num-pop { color: #E6C860 !important; font-family: ui-monospace, Consolas, monospace; font-weight: 700; }
.bbx-odds { text-align: right; flex-shrink: 0; }
.bbx-odds-k { display: block; font: 600 0.62rem 'Outfit', sans-serif; letter-spacing: 0.12em; text-transform: uppercase; color: #A9A49B; margin-bottom: 2px; }
.bbx-odds-v { font-family: 'Bodoni Moda', Georgia, serif; font-weight: 600; font-size: 2.1rem; line-height: 1; color: #FAF7EF; }

/* --- legs: tappable cells with the model rail --- */
.legs { display: flex; flex-direction: column; gap: 10px; margin: 16px 0 0 !important; padding: 0 !important; }
.legs .leg { position: relative; margin: 0 !important; cursor: pointer; transition: border-color 140ms ease, background 140ms ease; }
.legs .leg:hover { border-color: rgba(212, 175, 55, 0.5) !important; }
.legs .leg.in-slip { background: rgba(255, 255, 255, 0.06) !important; border-color: rgba(212, 175, 55, 0.55) !important; }
.bbx-leg-top { display: flex; align-items: baseline; gap: 12px; padding-right: 34px; }
.bbx-leg-top h3 { flex: 1; margin: 0 !important; font-size: 1.02rem !important; }
.bbx-key {
    font: 700 0.84rem ui-monospace, Consolas, monospace; color: #FAF7EF;
    border: 1px solid rgba(255, 255, 255, 0.18); padding: 3px 10px; white-space: nowrap;
    transition: border-color 140ms ease, background 140ms ease;
}
.legs .leg:hover .bbx-key { border-color: #D4AF37; background: rgba(212, 175, 55, 0.12); }
.legs .leg .fbb-add { position: absolute; top: 17px; right: 16px; margin: 0; }

/* model rail: hairline track, gold fill, diamond at the model number */
.bbx-duo { position: relative; height: 18px; margin: 12px 0 4px; }
.bbx-duo::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: rgba(255, 255, 255, 0.14); }
.bbx-duo i { position: absolute; left: 0; top: 50%; height: 1px; width: calc(var(--m) * 1%); background: linear-gradient(90deg, rgba(212, 175, 55, 0.25), #D4AF37); }
.bbx-duo i::after { content: ""; position: absolute; right: -4px; top: -3px; width: 7px; height: 7px; background: #E6C860; transform: rotate(45deg); }
.bbx-duo-val {
    position: absolute; top: 50%; transform: translateY(-50%);
    left: min(calc(var(--m) * 1% + 12px), calc(100% - 52px));
    font: 700 0.78rem ui-monospace, Consolas, monospace; color: #E6C860;
}
.bbx-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.legs .leg .reasoning { margin: 8px 0 0 !important; font-size: 0.84rem !important; }

/* add-all: the flat gold action under the legs */
.bbx-add-all {
    display: block; width: 100%; margin-top: 14px; padding: 12px;
    background: #D4AF37; border: 0; color: #141005;
    font: 700 0.9rem 'Outfit', sans-serif; cursor: pointer;
    transition: background 140ms ease;
}
.bbx-add-all:hover { background: #E6C860; }
.bbx-add-all:disabled { background: transparent; border: 1px solid rgba(212, 175, 55, 0.5); color: #E6C860; cursor: default; }

/* --- alternatives: aligned, tappable ledger rows --- */
.alternatives ul { list-style: none; margin: 0; padding: 0; }
.alternatives li {
    display: grid; grid-template-columns: 1fr auto 76px 30px; gap: 12px; align-items: center;
    padding: 10px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    cursor: pointer;
}
.alternatives li:last-child { border-bottom: 0; }
.alternatives li.in-slip { background: rgba(255, 255, 255, 0.05); }
.alt-name b { color: #F2F0EA !important; font-family: 'Outfit', sans-serif !important; font-weight: 600 !important; font-size: 0.92rem; }
.alt-name .alt-market { display: block; color: #A9A49B !important; font-size: 0.72rem; margin-top: 1px; }
.alt-prob { font: 700 0.84rem ui-monospace, Consolas, monospace; color: #E6C860 !important; }
.alt-key {
    font: 700 0.8rem ui-monospace, Consolas, monospace !important; color: #FAF7EF !important;
    border: 1px solid rgba(255, 255, 255, 0.18); padding: 3px 8px; text-align: center;
    justify-self: end;
}
.alternatives li:hover .alt-key { border-color: #D4AF37; background: rgba(212, 175, 55, 0.12); }
.alternatives li .fbb-add { justify-self: end; margin: 0; }

/* --- market rows: everything on shared column edges --- */
.mv-row { display: flex !important; align-items: center !important; gap: 12px; }
.mv-label { flex: 1; min-width: 0; }
.mv-figs { display: grid !important; grid-template-columns: 50px 104px 108px; gap: 10px; align-items: center; }
.mv-implied { justify-self: end; border: 1px solid rgba(230, 200, 96, 0.35); padding: 2px 7px; }
.mv-best { justify-self: end; }
.mv-book { justify-self: start; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 108px; }
.mv-row .fbb-add { margin: 0; }
.mv-smart, .mv-row [class*="smart"] {
    background: transparent !important; border: 1px solid rgba(212, 175, 55, 0.5) !important;
    color: #E6C860 !important; font-weight: 700 !important;
}

/* phones: rails full width, figures keep their columns */
@media (max-width: 620px) {
    .bbx-head { flex-direction: column; gap: 8px; }
    .bbx-odds { text-align: left; }
    .bbx-odds-v { font-size: 1.8rem; }
    .mv-figs { grid-template-columns: 44px 88px; }
    .mv-book { display: none; }
    .alternatives li { grid-template-columns: 1fr auto auto 26px; gap: 8px; }
    .alt-prob, .alt-key { font-size: 0.74rem !important; }
}