/* Client dashboard — builds on the tokens in brokerage.css */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.dash-shell { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 28px; width: min(1380px, calc(100% - 72px)); min-height: 100vh; margin: 0 auto; padding: 128px 0 64px; }

/* Sidebar */
.dash-sidebar { position: sticky; top: 112px; align-self: start; padding: 18px; border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(160deg, rgba(24,23,26,.92), rgba(11,11,13,.92)); }
.dash-user { display: flex; gap: 12px; align-items: center; padding: 4px 4px 18px; border-bottom: 1px solid var(--line); }
.dash-user strong { display: block; color: #f0ece4; font-size: 12px; font-weight: 500; }
.dash-user small { display: block; max-width: 160px; overflow: hidden; color: #827d75; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.dash-avatar { display: grid; flex: 0 0 38px; height: 38px; place-items: center; border: 1px solid rgba(200,185,154,.45); border-radius: 50%; background: rgba(200,185,154,.1); color: var(--gold); font: 600 14px var(--font-editorial); }
.dash-nav { display: grid; gap: 2px; padding-top: 14px; }
.dash-nav a, .dash-nav button { display: flex; align-items: center; gap: 11px; min-height: 40px; padding: 0 12px; border: 0; border-radius: 12px; background: none; color: #b8b3aa; cursor: pointer; font: 11px var(--font-body); text-align: left; transition: background .2s ease, color .2s ease; }
.dash-nav svg { width: 15px; height: 15px; color: #827d75; }
.dash-nav a:hover, .dash-nav button:hover { background: rgba(255,255,255,.05); color: #f0ece4; }
.dash-nav a[aria-current="page"] { background: linear-gradient(135deg, rgba(237,234,225,.13), rgba(91,89,87,.08)); color: #f6f2ea; box-shadow: inset 0 0 0 1px rgba(221,215,203,.16); }
.dash-nav a[aria-current="page"] svg { color: var(--gold); }
.dash-nav-label { margin: 14px 12px 4px; color: #6e6a64; font: 8px var(--font-mono); letter-spacing: .16em; text-transform: uppercase; }

/* Main column */
.dash-main { min-width: 0; }
.dash-heading { display: flex; flex-wrap: wrap; gap: 18px; align-items: flex-end; justify-content: space-between; margin-bottom: 24px; }
.dash-heading h1 { margin: 12px 0 0; font: 400 clamp(26px, 3vw, 38px) var(--font-editorial); }
.dash-heading h1 em { color: #b5a381; }
.dash-cta { min-height: 44px; min-width: 0; }

.dash-messages { display: grid; gap: 8px; margin-bottom: 20px; }
.dash-message { margin: 0; padding: 12px 15px; border: 1px solid rgba(200,185,154,.35); background: rgba(200,185,154,.07); color: #e6dcc6; font-size: 11px; }
.dash-message-success { border-color: rgba(120,200,150,.4); background: rgba(120,200,150,.07); color: #b9e4c7; }
.dash-message-error { border-color: rgba(226,120,110,.45); background: rgba(226,120,110,.08); color: #efb8b0; }

/* Stat tiles */
.dash-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.dash-stat { display: grid; gap: 7px; padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.025); }
.dash-stat span { color: #8d887f; font: 8px var(--font-mono); letter-spacing: .14em; text-transform: uppercase; }
.dash-stat strong { color: #f3efe7; font: 500 22px var(--font-mono); font-variant-numeric: tabular-nums; }
.dash-stat small { color: #7d786f; font-size: 9px; }
.is-up { color: #8fd3a8 !important; }
.is-down { color: #ee9a90 !important; }

/* Panels */
.dash-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.dash-grid-order { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: start; }
.dash-grid-even { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.dash-panel { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.02); }
.dash-panel-wide { grid-column: span 2; }
.dash-panel-full { grid-column: 1 / -1; }
.dash-panel-head { display: flex; gap: 12px; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.dash-panel-head h2 { margin: 0; color: #ede8df; font: 500 13px var(--font-body); }
.dash-panel-head a, .dash-link-button { padding: 0; border: 0; background: none; color: var(--gold); cursor: pointer; font: 10px var(--font-body); }
.dash-panel-head a:hover, .dash-link-button:hover { text-decoration: underline; }
.dash-muted { color: #8d887f; font-size: 10px; }
.dash-empty { margin: 0; color: #8d887f; font-size: 11px; line-height: 1.7; }
.dash-empty a { color: var(--gold); }
.dash-danger { color: #ee9a90; }

.dash-list { display: grid; margin: 0; padding: 0; list-style: none; }
.dash-list li { display: flex; gap: 14px; align-items: center; justify-content: space-between; padding: 12px 0; border-top: 1px solid rgba(255,255,255,.07); }
.dash-list li:first-child { border-top: 0; padding-top: 2px; }
.dash-list strong { display: block; color: #ece7de; font-size: 11px; font-weight: 500; }
.dash-list small { display: block; margin-top: 3px; color: #827d75; font-size: 9px; line-height: 1.5; }
.dash-list-compact li.is-unread strong::before { display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: var(--gold); content: ""; vertical-align: middle; }
.dash-ticket { align-items: flex-start !important; }
.dash-ticket p { margin: 8px 0 0; color: #b8b3aa; font-size: 10px; line-height: 1.6; }
.dash-ticket .dash-reply { padding-left: 10px; border-left: 2px solid rgba(200,185,154,.4); }

.dash-badge { display: inline-flex; flex: 0 0 auto; padding: 4px 9px; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; color: #d8d3ca; font: 8px var(--font-mono); letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.dash-badge-submitted { border-color: rgba(200,185,154,.5); color: #e2d3b2; }
.dash-badge-in_review { border-color: rgba(158,138,224,.55); color: #c8bbf2; }
.dash-badge-confirmed { border-color: rgba(120,200,150,.5); color: #a9dfbc; }
.dash-badge-completed { border-color: rgba(120,180,230,.5); color: #a9cff0; }
.dash-badge-cancelled { border-color: rgba(226,120,110,.45); color: #efa99f; }

.dash-quick { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.dash-quick-card { display: grid; gap: 4px; padding: 8px 8px 12px; border: 1px solid rgba(255,255,255,.08); border-radius: 14px; background: rgba(255,255,255,.02); transition: border-color .2s ease, transform .2s ease; }
.dash-quick-card:hover { border-color: rgba(200,185,154,.5); transform: translateY(-2px); }
.dash-quick-card img { width: 100%; height: 76px; margin-bottom: 6px; border-radius: 9px; object-fit: cover; background: #141417; }
.dash-quick-card span { color: #7d786f; font: 7px var(--font-mono); letter-spacing: .12em; text-transform: uppercase; }
.dash-quick-card strong { color: #ece7de; font-size: 11px; font-weight: 500; }

.dash-shortcuts { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.dash-shortcuts a { display: flex; gap: 10px; align-items: center; min-height: 40px; padding: 0 12px; border: 1px solid rgba(255,255,255,.08); border-radius: 12px; color: #d8d3ca; font-size: 11px; }
.dash-shortcuts a:hover { border-color: rgba(200,185,154,.45); }
.dash-shortcuts svg { width: 15px; height: 15px; color: var(--gold); }

/* Forms */
.dash-form { display: grid; gap: 4px; }
.dash-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 12px; }
.dash-field { display: grid; gap: 7px; color: #aaa397; font: 8px var(--font-mono); letter-spacing: .08em; text-transform: uppercase; }
.dash-field-full { grid-column: 1 / -1; }
.dash-field input, .dash-field select, .dash-field textarea, .dash-inline-form select, .dash-inline-form input { width: 100%; min-height: 42px; padding: 0 12px; border: 1px solid rgba(255,255,255,.14); border-radius: 10px; outline: 0; background: rgba(255,255,255,.03); color: #ece7de; font: 11px var(--font-body); letter-spacing: 0; text-transform: none; }
.dash-field textarea { min-height: 88px; padding: 11px 12px; resize: vertical; }
.dash-field select option, .dash-inline-form select option { background: #141417; }
.dash-field input:focus, .dash-field select:focus, .dash-field textarea:focus, .dash-inline-form select:focus, .dash-inline-form input:focus { border-color: rgba(218,198,157,.72); box-shadow: 0 0 0 2px rgba(218,198,157,.09); }
.dash-field input:disabled { color: #8d887f; }
.dash-field.has-error input, .dash-field.has-error select, .dash-field.has-error textarea { border-color: rgba(226,120,110,.6); }
.dash-field-error { color: #efb8b0; font: 10px var(--font-body); letter-spacing: 0; text-transform: none; }
.dash-submit { width: 100%; min-height: 46px; margin-top: 16px; }
.dash-footnote { margin: 10px 0 0; color: #77716a; font-size: 9px; line-height: 1.6; }

.dash-segmented { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-bottom: 12px; padding: 4px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; }
.dash-segmented input { position: absolute; opacity: 0; }
.dash-segmented span { display: grid; min-height: 34px; place-items: center; border-radius: 999px; color: #938e85; cursor: pointer; font: 9px var(--font-mono); letter-spacing: .12em; text-transform: uppercase; }
.dash-segmented input:checked + span { background: linear-gradient(135deg, rgba(237,234,225,.16), rgba(91,89,87,.1)); color: #f0eee8; }
.dash-segmented input:focus-visible + span { outline: 1px solid rgba(218,198,157,.72); }

/* Order preview */
.dash-order-preview { position: sticky; top: 112px; }
.dash-preview-item img { width: 100%; height: 190px; margin-bottom: 14px; border-radius: 12px; object-fit: cover; background: #141417; }
.dash-preview-kicker { color: #8d887f; font: 8px var(--font-mono); letter-spacing: .14em; text-transform: uppercase; }
.dash-preview-item h2 { margin: 6px 0 8px; font: 400 22px var(--font-editorial); }
.dash-preview-item p { margin: 0 0 12px; color: #a39e95; font-size: 11px; line-height: 1.7; }
.dash-preview-item a { display: inline-flex; gap: 6px; align-items: center; margin-top: 14px; color: var(--gold); font-size: 10px; }
.dash-preview-item a svg { width: 13px; height: 13px; }
.dash-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.dash-tags li { padding: 4px 9px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; color: #b8b3aa; font-size: 9px; }

/* Tables */
.dash-table-wrap { overflow-x: auto; }
.dash-table { width: 100%; border-collapse: collapse; font-size: 11px; }
.dash-table th { padding: 0 10px 10px; color: #7d786f; font: 8px var(--font-mono); letter-spacing: .12em; text-align: left; text-transform: uppercase; white-space: nowrap; }
.dash-table td { padding: 12px 10px; border-top: 1px solid rgba(255,255,255,.07); color: #d8d3ca; vertical-align: top; font-variant-numeric: tabular-nums; }
.dash-table td strong { display: block; color: #ece7de; font-weight: 500; }
.dash-table td small { display: block; margin-top: 4px; color: #827d75; font-size: 9px; line-height: 1.5; }
.dash-table-actions { text-align: right; }
.dash-inline-form { display: grid; grid-template-columns: 130px minmax(140px, 1fr) auto; gap: 8px; align-items: center; }
.dash-inline-form select, .dash-inline-form input { min-height: 36px; }
.dash-inline-form .button-nav { min-height: 36px; }

.dash-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.dash-filters a { display: inline-flex; gap: 7px; align-items: center; min-height: 34px; padding: 0 14px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; color: #b8b3aa; font-size: 10px; }
.dash-filters a span { color: #7d786f; }
.dash-filters a[aria-current="page"] { border-color: rgba(200,185,154,.55); color: #f0ece4; }

/* Responsive */
@media (max-width: 1050px) {
  .dash-shell { grid-template-columns: 1fr; width: calc(100% - 32px); padding-top: 112px; }
  .dash-sidebar { position: static; padding: 12px; }
  .dash-user { padding-bottom: 12px; }
  .dash-nav { display: flex; gap: 4px; overflow-x: auto; padding-top: 10px; scrollbar-width: none; }
  .dash-nav a, .dash-nav button { flex: 0 0 auto; white-space: nowrap; }
  .dash-nav-label { display: none; }
  .dash-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dash-grid, .dash-grid-order, .dash-grid-even { grid-template-columns: 1fr; }
  .dash-panel-wide, .dash-panel-full { grid-column: auto; }
  .dash-order-preview { position: static; order: -1; }
}
@media (max-width: 760px) {
  .dash-shell { padding-top: 104px; }
  .dash-stats { grid-template-columns: 1fr 1fr; gap: 10px; }
  .dash-stat { padding: 14px; }
  .dash-stat strong { font-size: 17px; }
  .dash-form-grid { grid-template-columns: 1fr; }
  .dash-quick { grid-template-columns: 1fr 1fr; }
  .dash-table thead { display: none; }
  .dash-table, .dash-table tbody, .dash-table tr, .dash-table td { display: block; width: 100%; }
  .dash-table tr { padding: 10px 0; border-top: 1px solid rgba(255,255,255,.08); }
  .dash-table td { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 10px; padding: 6px 0; border: 0; }
  .dash-table td::before { color: #7d786f; content: attr(data-label); font: 8px var(--font-mono); letter-spacing: .1em; text-transform: uppercase; }
  .dash-table td.dash-table-actions { display: block; text-align: left; }
  .dash-table td.dash-table-actions::before { content: none; }
  .dash-inline-form { grid-template-columns: 1fr; }
}

/* Standalone account pages (email verification, password reset) */
.auth-page { display: grid; min-height: calc(100vh - 160px); place-items: center; padding: 120px 16px 60px; }
.auth-page-panel { width: 100%; max-width: 460px; padding: 30px 28px; }
.auth-page-panel h1 { margin: 6px 0 14px; color: #eeeae2; font: 500 30px var(--font-display); letter-spacing: -.04em; }
.auth-page-text { margin: 0 0 18px; color: #a7a198; font-size: 12px; line-height: 1.7; }
.auth-page-small { margin: 16px 0 0; font-size: 11px; }
.auth-page-text a { color: #e0d4bd; text-decoration: underline; text-underline-offset: 3px; }
.auth-page .dash-submit { width: 100%; margin-top: 14px; }

/* Unverified-email banner in the dashboard */
.dash-verify-banner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; padding: 13px 15px; border: 1px solid rgba(226,190,110,.45); background: rgba(226,190,110,.08); color: #ecd9ae; font-size: 11px; line-height: 1.6; }
.dash-verify-banner form { margin: 0; }
.dash-verify-banner .button-nav { min-height: 34px; }

/* Online payment states (Stripe) */
.dash-badge-pay-pending { border-color: rgba(226,190,110,.5); color: #ecd9ae; }
.dash-badge-pay-paid { border-color: rgba(120,200,150,.5); color: #a9dfbc; }
.dash-badge-pay-failed { border-color: rgba(226,120,110,.45); color: #efa99f; }
.dash-badge-pay-refunded { border-color: rgba(120,180,230,.5); color: #a9cff0; }
.dash-pay-mode { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: #a7a198; font-size: 11px; }
