/* QuoteDesk: shared styles on top of Bootstrap 5.3. Mobile first; tables collapse to cards below md. */
:root {
    --qd-live: #d63384;
    --qd-accent: #0d6efd;
    --qd-muted-bg: #f6f7f9;
}

body { background: var(--qd-muted-bg); padding-bottom: 4rem; }
.navbar-brand { font-weight: 700; letter-spacing: .02em; }
.clickable { cursor: pointer; }
.tabular { font-variant-numeric: tabular-nums; }

/* Live badge with a pulsing dot */
.badge-live { background: var(--qd-live); }
.badge-live::before {
    content: ""; display: inline-block; width: .5em; height: .5em; margin-right: .35em;
    border-radius: 50%; background: #fff; animation: qd-pulse 1.2s infinite; vertical-align: middle;
}
@keyframes qd-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .2; } }

/* Event list */
.event-row { border-left: 4px solid transparent; }
.event-row.live { border-left-color: var(--qd-live); }
.event-row:hover { background: #eef3ff; }
.event-row .teams { font-weight: 600; }
.event-row .score { font-weight: 700; font-size: 1.05rem; }
.event-row.not-bettable { opacity: .55; }

/* Quote cards (bettor tray and trader desk) */
.quote-card { border-left: 5px solid #adb5bd; }
.quote-card.state-Requested { border-left-color: #6c757d; }
.quote-card.state-Priced { border-left-color: #198754; }
.quote-card.state-StakeProposed { border-left-color: #fd7e14; }
.quote-card.state-Countered { border-left-color: #6f42c1; }
.quote-card.state-Accepted { border-left-color: #0d6efd; }
.quote-card.needs-action { box-shadow: 0 0 0 .2rem rgba(253, 126, 20, .35); }
.quote-card.flash { animation: qd-flash 1.2s ease-out 2; }
@keyframes qd-flash { from { background: #fff3cd; } to { background: #fff; } }

.odds-big { font-size: 2rem; font-weight: 800; line-height: 1; }
.countdown { height: .5rem; }
.countdown .progress-bar { transition: width .25s linear; }

.pick { font-weight: 600; }
.small-muted { font-size: .8rem; color: #6c757d; }

/* Active tray: pending quotes pinned above the page content */
#active-tray:empty { display: none; }

/* Sticky filter bar */
.filter-bar { position: sticky; top: 0; z-index: 1010; background: var(--qd-muted-bg); padding-top: .5rem; }

/* Connection indicator */
.conn-dot { display: inline-block; width: .6rem; height: .6rem; border-radius: 50%; background: #dc3545; }
.conn-dot.on { background: #20c997; }

/* Audit timeline */
.timeline { list-style: none; padding-left: 0; }
.timeline li { border-left: 2px solid #dee2e6; padding: 0 0 .75rem .9rem; position: relative; }
.timeline li::before {
    content: ""; position: absolute; left: -6px; top: .3rem; width: 10px; height: 10px;
    border-radius: 50%; background: var(--qd-accent);
}

/* Responsive table -> cards below md */
@media (max-width: 767.98px) {
    table.table-cards thead { display: none; }
    table.table-cards, table.table-cards tbody, table.table-cards tr, table.table-cards td { display: block; width: 100%; }
    table.table-cards tr { background: #fff; border: 1px solid #dee2e6; border-radius: .5rem; margin-bottom: .6rem; padding: .4rem .6rem; }
    table.table-cards td { border: none; padding: .15rem 0; }
    table.table-cards td[data-label]::before { content: attr(data-label) ": "; font-weight: 600; color: #6c757d; }
    .odds-big { font-size: 1.6rem; }
}

/* Bet statement (trader "Bets & export"), after the traders' back-office sheet */
.statement-head { background: #fff; border: 1px solid #dee2e6; border-radius: .375rem; padding: .5rem .9rem; }
.statement-kv { display: grid; grid-template-columns: auto auto; column-gap: 1rem; font-size: .9rem; }
.statement-kv dt { font-weight: 600; text-align: right; }
.statement-kv dd { margin: 0; }
.statement-kv .stake { color: #3a9a1f; }
.statement-name { color: #8e44ad; font-weight: 600; }
table.statement { background: #fff; font-size: .85rem; }
table.statement thead th { background: #a9bcd6; color: #1f2d3d; text-align: center; vertical-align: middle; font-weight: 600; border-color: #fff; }
table.statement tbody tr:nth-child(odd) td { background: #f2f2f2; }
table.statement tbody tr:hover td { background: #e6eefb; }
table.statement td { text-align: center; }
table.statement .dim { color: #9aa0a6; }
table.statement .vs { color: #d62828; font-weight: 600; }
table.statement .league { color: #b07d48; text-transform: uppercase; }
table.statement .give { color: #d62828; }   /* giving the handicap */
table.statement .take { color: #1f6fd1; }   /* taking it, totals, 1X2 */
table.statement .stake { color: #3a9a1f; }
table.statement .win { color: #1f6fd1; }
table.statement .lose { color: #d62828; }
table.statement .info-dot { display: inline-block; width: 1.1rem; height: 1.1rem; line-height: 1.1rem; border-radius: 50%;
    background: #343a40; color: #fff; font-size: .7rem; font-weight: 700; font-style: italic; cursor: pointer; }
@media (max-width: 767.98px) { table.statement td { text-align: left; } }

.auth-card { max-width: 420px; margin: 8vh auto 0; }

/* Help pages */
.help-page { max-width: 860px; background: #fff; border-radius: .375rem; }
.help-page h2 { border-bottom: 1px solid #dee2e6; padding-bottom: .25rem; }
.help-steps > li { margin-bottom: .6rem; }
.help-dl dt { margin-top: .6rem; }
.help-dl dd { margin-left: 1rem; }
