/* Customer workspace: the platform console palette over the retained layouts.
   Keep these values aligned with platform.css and shared/theme.ts. */
:root {
  color-scheme: light;
  --bg: var(--bt-bg);
  --surface: var(--bt-surface);
  --surface2: var(--bt-pale-green);
  --line: var(--bt-line);
  --txt: var(--bt-ink);
  --muted: var(--bt-muted);
  --accent: var(--bt-brand);
  --ok: var(--bt-green);
  --warn: var(--bt-amber);
  --no: var(--bt-danger);
  --down: var(--no);
  --navy: var(--bt-navy);
  --selected: var(--bt-selected);
  --focus: var(--bt-focus);
}

.customer-workspace { background: var(--bg); color: var(--txt); }
.customer-workspace :is(h1,h2,h3,h4,button,summary,nav a,.nav-inactive,
  .res-t,.res-kind,.res-btn,.jobname,.jobproject,.stat .num,.stat .val,
  .hp-hstat .v,.cb-head,.cb-sec,.cwt th,.cwt td,.pd-ovk .v,.pf-stat .v) {
  font-family: 'Barlow', sans-serif;
}
header { background: var(--navy); border-color: var(--navy); }
header .brand { background: #faf9f7; padding: 5px 10px; border-radius: 7px; }
header .wordmark { width: 190px; }
nav a {
  color: #d6e1e3; background: transparent; border-color: transparent;
  text-transform: none; letter-spacing: 0; font-weight: 500; border-radius: 7px;
}
nav a:hover { color: #fff; background: var(--selected); }
nav a.active { color: #fff; background: var(--selected); border-color: #487862; }
nav .nav-inactive { color: #a8babe; text-transform: none; letter-spacing: 0; }
.hamburger span { background: #d6e1e3; }
.account-bar {
  padding: 15px 18px; border: 1px solid var(--line); border-radius: 10px;
  background: var(--surface); font-size: 14px; flex-wrap: wrap;
}
.account-bar a { color: var(--accent); }
.pagehead { margin-bottom: 22px; }
.pagetitle,.sectiontitle,.info h1,.coming h1 {
  color: var(--txt); font-weight: 600; font-size: 30px;
  text-transform: none; letter-spacing: -.6px;
}
.sectiontitle { border-bottom: 1px solid var(--line); }
.pagesub { color: var(--muted); }
.customer-workspace :is(input,select,textarea) { background-color: var(--surface); }
:is(a,button,input,select,textarea,summary):focus-visible {
  outline: 2px solid var(--focus); outline-offset: 3px;
}
.primary-button,.rgrid-btn,.wa-reply-row button,.planbtn,.ub-btn,
.res-up,.hp-revform button,.pd-costform button {
  background: var(--accent); color: #fff; border-color: var(--accent);
  border-radius: 8px; text-transform: none; letter-spacing: 0;
}
.primary-button:hover,.rgrid-btn:hover,.res-up:hover { background: #24676a; }
.ub-btn2 { background: var(--surface); color: var(--accent); border-color: var(--line); }
.res-btn { background: var(--surface); text-transform: none; letter-spacing: 0; }
.res-btn:hover { background: var(--surface2); border-color: #b9d2c5; }
.skip,.pm-reset:hover,.wa-unread { color: #fff; }
.library-tabs a.active { background: var(--accent); color: #fff; }
[role=alert],.pd-circle.no,.cb-invrow.low .cb-ohin { color: var(--no); }

.job,.crew,.res-card,.res-upload,.cboard,.login-card,.folder,.wa-wrap,.proj-sec {
  box-shadow: 0 2px 8px #102a2f03;
}
.crewhead,.jobhead {
  background: var(--surface2); color: var(--txt); border-bottom: 1px solid var(--line);
}
.hp-hstat { background: #fff; }
.hp-links a,.hp-links .hp-fs {
  color: var(--accent); background: #fff; border-color: #b9d2c5;
}
.hp-links a:hover { color: var(--accent); background: #f5f7f7; border-color: var(--accent); }
.hp-links .hp-fs.no { color: var(--no); background: #fdecea; border-color: #edc8c2; }
.hp-srow.cur .hp-sname { color: var(--accent); }
.hp-seg.cur { outline-color: var(--accent); }
.chip-pick.on { background: var(--surface2); }
.proj-sec>summary:hover,.proj-job>summary:hover { background: var(--surface2); }
.pd-kv,.cwt td { border-bottom-color: var(--line); }
.cwt th,.ptable thead th { background: #f9fbfa; }
.badge.ok,.liveflag.live,.cb-auto { color: var(--ok); background: var(--surface2); }
.badge.warn,.ub-tag { color: var(--warn); background: #fcf5e8; }
.badge.no,.res-kind.res-pdf { color: var(--no); background: #fdecea; }
.res-kind.res-html,.kpa-tag { color: var(--accent); background: var(--surface2); }
.man-tag { color: var(--muted); background: var(--bg); }

.wa-list a { color: var(--txt); }
.wa-list a.active { background: var(--surface2); color: var(--accent); }
.wa-thread-head { background: var(--surface); }
.wa-msgs { background: var(--bg); }
.message { background: var(--surface); }
.message.own,.wa-out { background: var(--surface2); color: var(--txt); border-color: #b9d2c5; }
.wa-out .wa-sender { color: var(--accent); }
.wa-reply { background: var(--surface); }
.wa-reply-row button { height: auto; min-height: 44px; }

@media (max-width: 720px) {
  header nav { background: var(--navy); border-color: var(--selected); }
}
@media (max-width: 640px) {
  .account-bar { padding: 12px; gap: 10px; }
  .pagetitle,.sectiontitle { font-size: 26px; }
  header .wordmark { width: 170px; }
}