/* ==========================================================================
   PORTAL-CLEAN.CSS — light, calm, premium admin skin
   Layered after portal.css. Linked on admin-dashboard.html for review.
   Goal (client feedback): the dashboard should not feel overwhelming —
   light surface, clear hierarchy, simple navigation, minimal noise.
   ========================================================================== */
:root{
  --pc:        #0E7A4B;      /* accent → navy, not purple */
  --pc-navy:   #0E7A4B;
  --pc-ink:    #1A1A1A;
  --pc-soft:   #57534E;
  --pc-line:   #E7E1D4;
  --pc-line-2: #EFEAE0;
  --pc-tint:   #EEF5F1;
  --pc-bg:     #F2EEE7;
}

/* ---------- canvas ---------- */
body.portal{ background:var(--pc-bg) !important; color:var(--pc-ink) !important; }

/* ---------- sidebar: white, quiet, clear ---------- */
.p-side{
  background:#fff !important; border-right:1px solid var(--pc-line) !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
.p-side .brand b{ color:var(--pc-ink) !important; }
.p-side .brand small{ color:var(--pc-soft) !important; }
.p-side .brand .mark{ background:var(--pc-navy); color:#fff; border-radius:8px; }
.role-chip{ background:var(--pc-bg) !important; border-color:var(--pc-line) !important; }
.role-chip .av{ background:var(--pc-navy) !important; border-radius:10px; }
.role-chip b{ color:var(--pc-ink) !important; }
.role-chip small{ color:var(--pc-soft) !important; }

.p-nav .grp{ color:#928C7F !important; }
.p-nav a{ color:#4A463E !important; font-weight:600; }
.p-nav a svg{ opacity:.8; }
.p-nav a:hover{ background:#F3EFE7 !important; color:var(--pc-navy) !important; }
.p-nav a.on{
  background:var(--pc-tint) !important; color:var(--pc-navy) !important;
  border:1px solid #D6E5DC !important;
}
.p-nav a.on svg{ opacity:1; }
.p-nav a .bdg{ background:var(--pc-navy) !important; }
.p-side .backlink a{ color:var(--pc-soft) !important; border-color:#D8D2C4 !important; }
.p-side .backlink a:hover{ color:var(--pc-navy) !important; border-color:var(--pc-navy) !important; }

/* ---------- top bar ---------- */
.p-top{
  background:rgba(255,255,255,.92) !important; border-bottom:1px solid var(--pc-line) !important;
  backdrop-filter:saturate(120%) blur(8px) !important; -webkit-backdrop-filter:saturate(120%) blur(8px) !important;
}
.p-top .pburger{ background:#F3EFE7 !important; border-color:#E2DCCF !important; color:var(--pc-ink) !important; }
.p-top h1{ color:var(--pc-ink) !important; }
.p-top .sub{ color:var(--pc-soft) !important; }
.p-top .case-pill{ background:#E4F3EA !important; color:#0E7A4B !important; border-color:#BFE3CD !important; }

/* ---------- stat cards ---------- */
.p-stat{
  background:#fff !important; border:1px solid var(--pc-line) !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  box-shadow:0 1px 2px rgba(38,35,28,.05) !important;
}
.p-stat .k{ color:var(--pc-soft) !important; }
.p-stat .v{ color:var(--pc-navy) !important; }
.p-stat .v small{ color:var(--pc-soft) !important; }
.p-stat .d.up{ color:#0E7A4B !important; }
.p-stat .d.dn{ color:#B4462F !important; }

/* ---------- panels ---------- */
.p-panel{
  background:#fff !important; border:1px solid var(--pc-line) !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  box-shadow:0 1px 2px rgba(38,35,28,.05) !important;
}
.p-panel h2{ color:var(--pc-ink) !important; }

/* ---------- table ---------- */
.p-table th{ color:var(--pc-soft) !important; border-bottom:1px solid var(--pc-line) !important; }
.p-table td{ color:#2B2925 !important; border-bottom:1px solid var(--pc-line-2) !important; }
.p-table td b{ color:var(--pc-ink) !important; }
.p-table tr:hover td{ background:#F8F5EF !important; }

/* ---------- status pills (readable on light) ---------- */
.status.ok{ background:#E4F3EA !important; color:#0B6B41 !important; }
.status.warn{ background:#FCEEDD !important; color:#9A5B12 !important; }
.status.info{ background:#E7F1EB !important; color:#0E7A4B !important; }
.status.bad{ background:#FBE6E0 !important; color:#B4462F !important; }

/* ---------- payout / doc rows ---------- */
.doc-row{ border-bottom:1px solid var(--pc-line-2) !important; }
.doc-row .fico{ background:var(--pc-tint) !important; color:var(--pc-navy) !important; }
.doc-row b{ color:var(--pc-ink) !important; }
.doc-row small{ color:var(--pc-soft) !important; }
.doc-row .end b{ color:var(--pc-navy) !important; }

/* ---------- buttons: flat navy, matches the site ---------- */
.btn{
  background:var(--pc-navy) !important; background-image:none !important;
  color:#fff !important; border-radius:8px !important; box-shadow:none !important;
}
.btn:hover{ background:#0A5C39 !important; }

/* ---------- phase tracker ---------- */
.phase-line .ph{ color:var(--pc-soft) !important; }
.phase-line .ph i{ background:#F2EEE7 !important; border:1px solid var(--pc-line) !important; color:var(--pc-soft) !important; }
.phase-line .ph.done i{ background:#0E7A4B !important; border-color:#0E7A4B !important; color:#fff !important; }
.phase-line .ph.now{ color:var(--pc-ink) !important; }
.phase-line .ph.now i{ background:var(--pc-navy) !important; border-color:var(--pc-navy) !important; color:#fff !important; box-shadow:0 0 0 4px rgba(14,122,75,.15) !important; }

/* ---------- timeline ---------- */
.p-timeline .ev::before{ background:var(--pc-line) !important; }
.p-timeline .dot{ background:#F2EEE7 !important; border:1px solid var(--pc-line) !important; color:var(--pc-ink) !important; }
.p-timeline .dot.acc{ background:var(--pc-navy) !important; border-color:var(--pc-navy) !important; color:#fff !important; }
.p-timeline .dot.okc{ background:#0E7A4B !important; border-color:#0E7A4B !important; color:#fff !important; }
.p-timeline b{ color:var(--pc-ink) !important; }
.p-timeline p{ color:var(--pc-soft) !important; }
.p-timeline small{ color:#928C7F !important; }

/* ---------- chat / messages ---------- */
.msg{ background:#F5F1E9 !important; border:1px solid var(--pc-line) !important; color:var(--pc-ink) !important; }
.msg small{ color:var(--pc-soft) !important; }
.msg.me{ background:var(--pc-tint) !important; border-color:#D6E5DC !important; color:var(--pc-ink) !important; }
.msg-input input{ background:#fff !important; border:1px solid var(--pc-line) !important; color:var(--pc-ink) !important; }
.msg-input input:focus{ border-color:var(--pc-navy) !important; }

/* ---------- portal forms ---------- */
.p-field label{ color:var(--pc-soft) !important; }
.p-field input, .p-field select, .p-field textarea{
  background:#fff !important; border:1px solid var(--pc-line) !important; color:var(--pc-ink) !important;
}
.p-field input:focus, .p-field select:focus, .p-field textarea:focus{ border-color:var(--pc-navy) !important; }
.p-field select option{ background:#fff !important; color:var(--pc-ink) !important; }

/* ---------- upload drop zone ---------- */
.drop{ border:1.5px dashed #D4CDBD !important; color:var(--pc-soft) !important; background:#FBF9F4 !important; }
.drop:hover{ border-color:var(--pc-navy) !important; background:var(--pc-tint) !important; }
.drop b{ color:var(--pc-navy) !important; }

/* ---------- kanban (ops) ---------- */
.kb-col{ background:#F5F1E9 !important; border:1px solid var(--pc-line) !important; }
.kb-col > b{ color:var(--pc-soft) !important; }
.kb-card{ background:#fff !important; border:1px solid var(--pc-line) !important; box-shadow:0 1px 2px rgba(38,35,28,.05) !important; }
.kb-card b{ color:var(--pc-ink) !important; }
.kb-card small{ color:var(--pc-soft) !important; }

/* ---------- misc dark-assuming utilities inside portal ---------- */
.p-body .pill.dark{ background:#F2EEE7 !important; color:var(--pc-ink) !important; border:1px solid var(--pc-line) !important; }

/* inline dark-theme colour variables used in page content → readable on light */
.p-body [style*="var(--on-dark-soft)"]{ color:var(--pc-soft) !important; }
.p-body [style*="var(--on-dark)"]:not([style*="var(--on-dark-soft)"]){ color:var(--pc-ink) !important; }
.p-body a[style*="var(--saffron)"], .p-body [style*="color:var(--saffron)"]{ color:#0E7A4B !important; }

/* ---------- language selector (injected into the top bar) ---------- */
.p-top .lang-btn{ background:#fff !important; border:1px solid var(--pc-line) !important; color:var(--pc-ink) !important; }
.p-top .lang-cur{ color:var(--pc-ink) !important; }
.p-top .lang-menu{ background:#fff !important; border:1px solid var(--pc-line) !important; box-shadow:0 8px 22px rgba(38,35,28,.14) !important; }
.p-top .lang-menu button{ color:var(--pc-ink) !important; }
.p-top .lang-menu button:hover{ background:#F3EFE7 !important; }

/* ---------- accessible focus ---------- */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline:3px solid #FFBF47 !important; outline-offset:2px;
}

/* ---------- theme v2: serif display + warm polish (Emergent reference) ---------- */
.p-top h1, .p-panel h2{ font-family:Georgia,"Times New Roman",serif; font-weight:600; letter-spacing:0; }
.p-panel, .p-stat{ border-radius:16px !important; }
.p-body .btn{ border-radius:999px !important; }

/* ---------- elegance pass: calm typography & spacing (palette unchanged) ---------- */
/* stat tiles: serif figures, quiet labels */
.p-stat{ padding:20px 22px !important; }
.p-stat .k{ font-size:11px !important; font-weight:700 !important; letter-spacing:.12em; text-transform:uppercase; color:#928C7F !important; }
.p-stat .v{ font-family:Georgia,"Times New Roman",serif; font-weight:600; font-size:30px !important; letter-spacing:0 !important; color:#1A1A1A !important; }

/* panels: a touch more air, softer edge */
.p-panel{ padding:22px 24px !important; box-shadow:0 1px 2px rgba(38,35,28,.04), 0 8px 24px -18px rgba(38,35,28,.18) !important; }
.ph-row{ margin-bottom:14px !important; }
.ph-row h2{ font-size:19px !important; }

/* tables: hairline rows, roomy cells, whisper-quiet headers */
.p-table th{ font-size:10.5px !important; font-weight:700 !important; letter-spacing:.12em; text-transform:uppercase; color:#928C7F !important; padding:8px 12px !important; }
.p-table td{ padding:13px 12px !important; }

/* status chips: one consistent geometry */
.status{ border-radius:999px !important; font-weight:700 !important; letter-spacing:.02em; padding:4px 12px !important; }

/* header: clear hierarchy */
.p-top h1{ font-size:22px !important; }
.p-top .sub{ font-size:13px !important; color:#57534E !important; }

/* sidebar: quieter groups, comfortable targets */
.p-nav .grp{ font-size:10px !important; letter-spacing:.16em !important; margin-top:14px; }
.p-nav a{ padding:9px 12px !important; border-radius:10px !important; }