/**
 * Sprint 8 — Final enterprise UI polish (visual only).
 * Reuses --theme-* / --ex-* tokens. Keep tiny; no redesign, no new features.
 */

.exchange-app {
  --ex-polish-ease: var(--theme-ease-default, ease-out);
  --ex-polish-fast: var(--theme-duration-fast, 100ms);
  --ex-polish-default: var(--theme-duration-default, 150ms);
  --ex-polish-hover-bg: color-mix(in srgb, var(--theme-accent, #38bdf8) 12%, transparent);
  --ex-polish-hover-border: color-mix(in srgb, var(--theme-accent, #38bdf8) 55%, transparent);
  --ex-polish-pressed: color-mix(in srgb, var(--theme-accent, #38bdf8) 18%, transparent);
}

/* ── Shared chip / pill contract (My Bets · Workspace · Smart · Jump) ── */
.exchange-app .ex-mybets-chip,
.exchange-app .ex-market-jump__chip,
.exchange-app .ex-workspace-nav__chip,
.exchange-app .ex-workspace-nav__item,
.exchange-app .ex-workspace-actions__btn,
.exchange-app .ex-smart-hub__chip,
.exchange-app .ex-smart-hub__layout-btn,
.exchange-app .ex-workspace-float-jump__chip,
.exchange-app .ex-personalization-chip__link {
  transition:
    background-color var(--ex-polish-default) var(--ex-polish-ease),
    border-color var(--ex-polish-default) var(--ex-polish-ease),
    color var(--ex-polish-default) var(--ex-polish-ease),
    opacity var(--ex-polish-fast) var(--ex-polish-ease),
    box-shadow var(--ex-polish-default) var(--ex-polish-ease);
}

.exchange-app .ex-market-jump__chip:hover,
.exchange-app .ex-workspace-nav__chip:hover,
.exchange-app .ex-workspace-nav__item:hover,
.exchange-app .ex-workspace-actions__btn:hover,
.exchange-app .ex-smart-hub__chip:hover,
.exchange-app .ex-smart-hub__layout-btn:hover,
.exchange-app .ex-workspace-float-jump__chip:hover {
  border-color: var(--ex-polish-hover-border);
  background: var(--ex-polish-hover-bg);
}

.exchange-app .ex-market-jump__chip:active,
.exchange-app .ex-workspace-nav__chip:active,
.exchange-app .ex-workspace-actions__btn:active,
.exchange-app .ex-smart-hub__layout-btn:active,
.exchange-app .ex-load-more-btn:active,
.exchange-app .ex-trading-section__toggle:active,
.exchange-app .ex-trading-subgroup__toggle:active {
  background: var(--ex-polish-pressed);
}

/* ── Buttons / secondary CTAs ── */
.exchange-app .ex-load-more-btn,
.exchange-app a.ex-load-more-btn,
.exchange-app button.ex-load-more-btn,
.exchange-app .ex-empty__cta,
.exchange-app .ex-inplay-page__empty-cta {
  transition:
    background-color var(--ex-polish-default) var(--ex-polish-ease),
    border-color var(--ex-polish-default) var(--ex-polish-ease),
    opacity var(--ex-polish-fast) var(--ex-polish-ease),
    transform var(--ex-polish-fast) var(--ex-polish-ease);
}

.exchange-app .ex-load-more-btn:hover,
.exchange-app a.ex-load-more-btn:hover {
  opacity: 0.96;
}

/* ── Expand / collapse chevrons ── */
.exchange-app .ex-trading-section__chevron,
.exchange-app .ex-inplay-group__caret {
  transition: transform var(--ex-polish-default) var(--ex-polish-ease);
}

/* ── Cards / panels rhythm ── */
.exchange-app .ex-trading-section,
.exchange-app .ex-smart-hub,
.exchange-app .ex-workspace-nav,
.exchange-app .ex-personalization-strip {
  border-radius: var(--theme-radius-panel, 8px);
}

.exchange-app .ex-smart-hub__section + .ex-smart-hub__section {
  margin-top: 0.15rem;
}

.exchange-app .ex-mybets-filters,
.exchange-app .ex-bet-log-date-filter {
  margin-bottom: 0.85rem;
}

/* ── Tables / bet cards alignment ── */
.exchange-app .ex-mybets-table .ex-mybets-card__selection,
.exchange-app .ex-mybets-table .ex-mybets-card__market {
  font-weight: var(--theme-weight-semibold, 600);
}

.exchange-app .ex-mybets-status,
.exchange-app .ex-open-bets__status,
.exchange-app .bet-type-badge {
  letter-spacing: 0.03em;
}

/* ── Badges hierarchy ── */
.exchange-app .bet-type-badge--back,
.exchange-app .ex-open-bets__type.bet-type-badge--back {
  font-weight: 700;
}

.exchange-app .bet-type-badge--lay,
.exchange-app .ex-open-bets__type.bet-type-badge--lay {
  font-weight: 700;
}

/* ── Inputs ── */
.exchange-app .ex-match-search__input,
.exchange-app .ex-bet-log-date-filter__input,
.exchange-app .ex-bet-log-date-filter__select,
.exchange-app .ex-mybets-client-select {
  transition:
    border-color var(--ex-polish-default) var(--ex-polish-ease),
    box-shadow var(--ex-polish-default) var(--ex-polish-ease);
}

.exchange-app .ex-match-search:focus-within {
  border-color: var(--ex-polish-hover-border);
}

/* ── Empty / filter-empty / dock empty parity ── */
.exchange-app .ex-mybets-filter-empty,
.exchange-app .ex-open-bets-filter-empty,
.exchange-app .ex-smart-hub__empty,
.exchange-app .ex-workspace-nav__empty {
  color: var(--ex-muted, var(--para-color));
  font-size: var(--theme-text-sm, 0.75rem);
  line-height: 1.45;
}

.exchange-app .ex-mybets-filter-empty,
.exchange-app .ex-open-bets-filter-empty {
  border-radius: var(--theme-radius-panel, 8px);
  border: 1px solid color-mix(in srgb, var(--theme-border, #2a2a2a) 75%, transparent);
  background: color-mix(in srgb, var(--theme-surface, #121212) 88%, transparent);
  padding: 0.85rem 1rem;
}

/* ── Loading / skeleton polish ── */
.exchange-app .ex-schedule-skeleton {
  opacity: 0.92;
}

.exchange-app.is-schedule-loading .ex-inplay-group__list {
  transition: opacity var(--ex-polish-default) var(--ex-polish-ease);
}

/* ── Success / error flash (toast + inline) — tone only ── */
.exchange-app .toast-success,
.exchange-app .bootoast-success {
  border-radius: var(--theme-radius-control, 8px);
}

/* ── Sticky stack consistency ── */
.exchange-app .ex-markets-unified--trading .ex-market-jump {
  z-index: 34;
}

.exchange-app .ex-workspace-sticky-head {
  z-index: 30;
}

.exchange-app .ex-trading-section__head {
  z-index: 22;
}

/* ── Selection / jump highlight fade ── */
.exchange-app .is-selection-highlight,
.exchange-app .ex-markets-group.is-jump-target {
  transition:
    outline-color var(--ex-polish-default) var(--ex-polish-ease),
    box-shadow var(--ex-polish-default) var(--ex-polish-ease),
    background-color var(--ex-polish-default) var(--ex-polish-ease);
}

/* ── Focus ring — align polish surfaces to theme focus token ── */
.exchange-app .ex-mybets-chip:focus-visible,
.exchange-app .ex-workspace-nav__chip:focus-visible,
.exchange-app .ex-workspace-nav__item:focus-visible,
.exchange-app .ex-smart-hub__chip:focus-visible,
.exchange-app .ex-personalization-chip__link:focus-visible,
.exchange-app .ex-trading-section__tool:focus-visible,
.exchange-app .ex-smart-pin:focus-visible,
.exchange-app .ex-workspace-search-fab:focus-visible,
.exchange-app .ex-workspace-float-jump__chip:focus-visible {
  outline: var(--theme-focus-ring-width, 2px) solid var(--theme-focus-ring, var(--theme-accent, #38bdf8));
  outline-offset: var(--theme-focus-offset, 2px);
}

/* ── Dark / light parity for Sprint surfaces ── */
html.theme-light .exchange-app .ex-mybets-filter-empty,
.theme-light .exchange-app .ex-mybets-filter-empty,
html.theme-light .exchange-app .ex-open-bets-filter-empty,
.theme-light .exchange-app .ex-open-bets-filter-empty {
  background: color-mix(in srgb, #fff 96%, #e5e7eb);
  border-color: rgba(15, 23, 42, 0.1);
}

html.theme-light .exchange-app .ex-trading-section,
.theme-light .exchange-app .ex-trading-section {
  box-shadow: none;
}

html.theme-dark .exchange-app .ex-smart-hub,
.theme-dark .exchange-app .ex-smart-hub,
html.theme-dark .exchange-app .ex-workspace-nav,
.theme-dark .exchange-app .ex-workspace-nav {
  box-shadow: none;
}

/* ── Tabs / subnav ── */
.exchange-app .ex-subnav-tabs .nav-link,
.exchange-app .ex-inplay-match-tab {
  transition:
    background-color var(--ex-polish-default) var(--ex-polish-ease),
    color var(--ex-polish-default) var(--ex-polish-ease),
    opacity var(--ex-polish-fast) var(--ex-polish-ease);
}

.exchange-app .ex-subnav-tabs .nav-link:hover,
.exchange-app .ex-inplay-match-tab:hover {
  opacity: 0.95;
}

/* ── Mobile spacing consistency under sticky trays ── */
@media (max-width: 991.98px) {
  .exchange-app .ex-workspace-page .ex-match-detail-ledger,
  .exchange-app .ex-mybets-page {
    scroll-padding-bottom: 5.5rem;
  }

  .exchange-app .ex-smart-hub {
    margin-inline: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .exchange-app .ex-mybets-chip,
  .exchange-app .ex-market-jump__chip,
  .exchange-app .ex-workspace-nav__chip,
  .exchange-app .ex-workspace-actions__btn,
  .exchange-app .ex-smart-hub__chip,
  .exchange-app .ex-load-more-btn,
  .exchange-app .ex-trading-section__chevron,
  .exchange-app .is-selection-highlight,
  .exchange-app .ex-markets-group.is-jump-target {
    transition: none !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
 * UI Excellence v1 — production closed-beta polish (visual / a11y only)
 * No workflow, API, or engine changes.
 * ═══════════════════════════════════════════════════════════════════════════ */

/* ── Focus rings — trading + betslip + jump (keyboard / switch control) ── */
.exchange-app .ex-market-jump__chip:focus-visible,
.exchange-app .ex-workspace-actions__btn:focus-visible,
.exchange-app .ex-trading-section__toggle:focus-visible,
.exchange-app .ex-trading-subgroup__toggle:focus-visible,
.exchange-app .ex-load-more-btn:focus-visible,
.exchange-app .ex-empty__cta:focus-visible,
.exchange-app .ex-betslip-selection-row__stake-input:focus-visible,
.exchange-app .ex-betslip-stake-step:focus-visible,
.exchange-app .ex-betslip-selection-row__remove:focus-visible,
.exchange-app .ex-betslip-sheet__submit:focus-visible,
.exchange-app .ex-betslip-quick-stake:focus-visible,
.exchange-app .ex-open-bets__filter:focus-visible,
.exchange-app .ex-mybets-client-select:focus-visible,
.exchange-app .ex-match-search__input:focus-visible {
  outline: var(--theme-focus-ring-width, 2px) solid var(--theme-focus-ring, var(--theme-accent, #38bdf8));
  outline-offset: var(--theme-focus-offset, 2px);
}

/* ── Odds cell selection feedback (press only — no flashy motion) ── */
.exchange-app .ex-indibet-cell:active,
.exchange-app .ex-odds-price-cell:active,
.exchange-app button.ex-indibet-cell:active {
  filter: brightness(1.06);
}

.exchange-app .ex-indibet-cell,
.exchange-app .ex-odds-price-cell {
  transition:
    filter var(--ex-polish-fast) var(--ex-polish-ease),
    box-shadow var(--ex-polish-default) var(--ex-polish-ease),
    background-color var(--ex-polish-fast) var(--ex-polish-ease);
}

/* ── Live pulse score readability ── */
.exchange-app .ex-match-pulse__score strong {
  font-size: 1rem;
  letter-spacing: 0.01em;
}

.exchange-app .ex-match-pulse__live.is-live {
  background: color-mix(in srgb, var(--ex-live-green-bright, #22c55e) 22%, transparent);
  color: var(--ex-live-green-bright, #4ade80);
}

/* Bet slip visual chrome: leave enterprise CSS as-is (focus-visible only above) */

/* ── My Bets / Open Bets chip + card consistency ── */
.exchange-app .ex-mybets-chip,
.exchange-app .ex-open-bets__filter {
  border-radius: var(--theme-radius-chip, 4px);
  min-height: 2.25rem;
}

.exchange-app .ex-mybets-table .ex-mybets-card,
.exchange-app .ex-open-bets__card {
  border-radius: var(--theme-radius-panel, 8px);
  transition:
    border-color var(--ex-polish-default) var(--ex-polish-ease),
    background-color var(--ex-polish-default) var(--ex-polish-ease);
}

.exchange-app .ex-mybets-table .ex-mybets-card:hover,
.exchange-app .ex-open-bets__card:hover {
  border-color: var(--ex-polish-hover-border);
}

/* ── Home: In-Play weight + personalization quiet rhythm ── */
.exchange-app .ex-inplay-group--live > .ex-inplay-group__head,
.exchange-app .ex-home-section--inplay .ex-home-section__title {
  font-weight: 700;
}

.exchange-app .ex-smart-hub {
  border: 1px solid color-mix(in srgb, var(--theme-border, #2a2a2a) 70%, transparent);
}

.exchange-app .ex-personalization-strip__title {
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* ── Auth / account quiet polish (login · register · profile · wallet) ── */
.exchange-app .auth-form .form-control:focus,
.exchange-app .account-card .form-control:focus,
.exchange-app .ex-wallet-panel .form-control:focus {
  border-color: var(--ex-polish-hover-border);
  box-shadow: 0 0 0 1px var(--ex-polish-hover-border);
}

.exchange-app .auth-form .btn-primary,
.exchange-app .account-card .btn-primary {
  transition:
    opacity var(--ex-polish-fast) var(--ex-polish-ease),
    transform var(--ex-polish-fast) var(--ex-polish-ease);
}

.exchange-app .auth-form .btn-primary:active,
.exchange-app .account-card .btn-primary:active {
  transform: translateY(1px);
}

/* ── Mobile thumb / safe-area / keyboard ── */
@media (max-width: 991.98px) {
  .exchange-app .ex-market-jump__chip,
  .exchange-app .ex-workspace-actions__btn,
  .exchange-app .ex-mybets-chip {
    min-height: 2.5rem;
  }

  .exchange-app .ex-open-bets-sheet {
    padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
  }

  .exchange-app .ex-workspace-page {
    scroll-padding-top: 3.25rem;
    scroll-padding-bottom: max(6rem, calc(5.5rem + env(safe-area-inset-bottom, 0px)));
  }

  .exchange-app .ex-match-pulse__score strong {
    font-size: 1.05rem;
  }
}

@media (max-width: 991.98px) and (orientation: landscape) {
  .exchange-app .ex-match-pulse {
    padding: 0.45rem 0.65rem;
    margin-bottom: 0.45rem;
  }

  .exchange-app .ex-markets-unified--trading .ex-market-jump__chip {
    min-height: 2.25rem;
    padding-inline: 0.75rem;
  }
}

/* ── Reduced motion for excellence additions ── */
@media (prefers-reduced-motion: reduce) {
  .exchange-app .ex-indibet-cell,
  .exchange-app .ex-odds-price-cell,
  .exchange-app .ex-mybets-table .ex-mybets-card,
  .exchange-app .ex-open-bets__card,
  .exchange-app .auth-form .btn-primary {
    transition: none !important;
  }
}
