/* Portal-wide dark/green re-skin, aligned to the /services design system.
   Scoped to body.is-portal (set for every page under /portal/ by
   portal/_layout.php), so it covers login, register and the dashboard in
   one pass without touching the still-light public site. */

body.is-portal{
  --svc-bg:#0a0a0c;
  --svc-panel:#131316;
  --svc-panel2:#1a1b1f;
  --svc-ink:#f2f4f7;
  --svc-muted:#9aa0ab;
  --svc-line:rgba(255,255,255,.14);
  --svc-gold-light:#4ade80;
  --svc-gold:#22c55e;
  --svc-gold-deep:#16a34a;
  --svc-gold-glow:rgba(34,197,94,.35);
  /* transparent so fin-dark.css's ambient grid layer shows; html carries the #0a0a0c */
  background:transparent !important;
  color:var(--svc-ink);
}
body.is-portal main{ background:transparent; }

/* ---- Login page's own containers (portal/login/index.php inline style) ---- */
body.is-portal .phead{
  background:linear-gradient(120deg, rgba(34,197,94,.10), rgba(74,222,128,.06), rgba(22,163,74,.08));
  border:1px solid var(--svc-line);
}
body.is-portal .hleft h2,
body.is-portal .card-title h3,
body.is-portal .side h3{ color:var(--svc-ink); }
body.is-portal .sub,
body.is-portal .micro,
body.is-portal .help,
body.is-portal .ktext,
body.is-portal .link-row{ color:var(--svc-muted); }
body.is-portal .ktext b{ color:var(--svc-ink); }

body.is-portal .pcard,
body.is-portal .side{
  background:var(--svc-panel2);
  border:1px solid var(--svc-line);
  box-shadow:none;
}
body.is-portal .badge-mini{
  background:rgba(34,197,94,.12);
  border:1px solid rgba(34,197,94,.28);
  color:var(--svc-gold-light);
}
body.is-portal .pill{
  background:var(--svc-panel);
  border:1px solid var(--svc-line);
  color:var(--svc-ink);
}
body.is-portal .oauth a{
  background:rgba(255,255,255,.06);
  border:1px solid var(--svc-line);
  color:var(--svc-ink) !important;
}
body.is-portal .oauth a:hover{ background:rgba(255,255,255,.11); }
body.is-portal .oauth small{ color:var(--svc-muted); }
body.is-portal .kicon{
  background:rgba(34,197,94,.12);
  border:1px solid rgba(34,197,94,.28);
  color:var(--svc-gold-light);
}
body.is-portal .label{ color:var(--svc-ink); }
body.is-portal label{ color:var(--svc-muted); }

/* ---- Shared portal buttons ---- */
body.is-portal .ps-btn{
  background:rgba(255,255,255,.07);
  border:1px solid var(--svc-line);
  color:var(--svc-ink);
  box-shadow:none;
}
body.is-portal .ps-btn:hover{ background:rgba(255,255,255,.12); }
body.is-portal .ps-btn.primary,
body.is-portal .ps-btn-primary{
  background:linear-gradient(135deg,#86efac 0%,#4ade80 48%,#22c55e 100%);
  border-color:transparent;
  color:#05140b;
  box-shadow:0 10px 30px rgba(34,197,94,.28), inset 0 1px 0 rgba(255,255,255,.35);
}
body.is-portal .ps-btn.primary:hover,
body.is-portal .ps-btn-primary:hover{
  transform:translateY(-1px);
  box-shadow:0 16px 38px rgba(34,197,94,.38), inset 0 1px 0 rgba(255,255,255,.35);
}

/* ---- Inputs (shared .ps-input + the raw selectors portal.css targets) ---- */
body.is-portal .ps-input,
body.is-portal .ps-wrap input[type="text"],
body.is-portal .ps-wrap input[type="email"],
body.is-portal .ps-wrap input[type="password"],
body.is-portal .ps-wrap select,
body.is-portal .ps-wrap textarea,
body.is-portal .portal-login-card input[type="email"],
body.is-portal .portal-login-card input[type="password"]{
  background:var(--svc-panel);
  border:1px solid var(--svc-line);
  color:var(--svc-ink);
}
body.is-portal input::placeholder,
body.is-portal textarea::placeholder{ color:var(--svc-muted); opacity:1; }

/* Browser autofill (Chrome/Edge) paints its own light background via UA
   styles that no ordinary CSS property can override — only this
   transition/box-shadow trick can force it to match the dark field. */
body.is-portal input:-webkit-autofill,
body.is-portal input:-webkit-autofill:hover,
body.is-portal input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--svc-ink);
  -webkit-box-shadow:0 0 0 1000px var(--svc-panel) inset;
  box-shadow:0 0 0 1000px var(--svc-panel) inset;
  caret-color:var(--svc-ink);
  transition:background-color 9999s ease-in-out 0s;
}

/* ---- Dashboard cards / grid / table / badges (rest of the portal) ---- */
body.is-portal .ps-card{
  background:var(--svc-panel2);
  border:1px solid var(--svc-line);
  box-shadow:none;
}
body.is-portal .ps-card h3{ color:var(--svc-ink); }
body.is-portal .ps-card .kpi{ color:var(--svc-gold-light); }
body.is-portal .ps-top h2{ color:var(--svc-ink); }
body.is-portal .ps-muted{ color:var(--svc-muted); }
body.is-portal .ps-badge{
  background:rgba(34,197,94,.12);
  border:1px solid rgba(34,197,94,.28);
  color:var(--svc-gold-light);
}
body.is-portal .ps-table th,
body.is-portal .ps-table td{ border-bottom-color:var(--svc-line); }
body.is-portal .ps-table th{ color:var(--svc-muted); }
body.is-portal .ps-table td{ color:var(--svc-ink); }
body.is-portal .ps-success{
  background:rgba(34,197,94,.14);
  border:1px solid rgba(34,197,94,.30);
  color:var(--svc-gold-light);
}
body.is-portal .ps-error{
  background:rgba(239,68,68,.14);
  border:1px solid rgba(239,68,68,.32);
  color:#fca5a5;
}

/* ---- Chat widget ---- */
body.is-portal .cw{ background:var(--svc-panel2); border:1px solid var(--svc-line); }
body.is-portal .cw-head{ border-bottom:1px solid var(--svc-line); }
body.is-portal .cw-sub{ color:var(--svc-muted); }
body.is-portal .cw-body{ background:var(--svc-bg); }
body.is-portal .cw-row.mine .cw-bubble{ background:rgba(34,197,94,.16); color:var(--svc-ink); }
body.is-portal .cw-row.theirs .cw-bubble{ background:var(--svc-panel); color:var(--svc-ink); }
body.is-portal .cw-foot{ border-top:1px solid var(--svc-line); }
body.is-portal .cw-foot textarea{ background:var(--svc-panel); border:1px solid var(--svc-line); color:var(--svc-ink); }

@media(max-width:720px){
  body.is-portal .phead{ flex-direction:column; }
}

/* =====================================================================
   Page-level components. Every portal page carries its own inline <style>
   with light surfaces (.pcard/.card #fff, slate text rgba(15,23,42,..));
   body.is-portal out-specifies those plain class rules regardless of order.
   ===================================================================== */
body.is-portal{
  --svc-surface:linear-gradient(145deg,rgba(27,28,32,.94),rgba(17,17,20,.96));
  --svc-soft:rgba(255,255,255,.035);
  --svc-soft2:rgba(255,255,255,.06);
}

/* surfaces */
body.is-portal .pcard,
body.is-portal .card,
body.is-portal .side-card,
body.is-portal details.sec,
body.is-portal .ps-alert,
body.is-portal .ps-modal,
body.is-portal .tier{
  background:var(--svc-surface);
  border-color:var(--svc-line);
  color:var(--svc-ink);
  box-shadow:0 24px 64px rgba(0,0,0,.32);
}
body.is-portal .pcard:hover{ border-color:rgba(74,222,128,.35); }
body.is-portal .item,
body.is-portal .m-item,
body.is-portal .m-card,
body.is-portal .box,
body.is-portal .file,
body.is-portal .docRow,
body.is-portal .upload,
body.is-portal .mod,
body.is-portal .kpi-mini,
body.is-portal .m-quick a,
body.is-portal .catBtn,
body.is-portal .svcBtn,
body.is-portal .ghostBtn{
  background:var(--svc-soft);
  border-color:var(--svc-line);
  color:var(--svc-ink);
  box-shadow:none;
}
body.is-portal .catBtn:hover,
body.is-portal .svcBtn:hover,
body.is-portal .m-quick a:hover{ border-color:rgba(74,222,128,.45); background:rgba(34,197,94,.06); }
body.is-portal .empty,
body.is-portal .note{
  background:rgba(255,255,255,.02);
  border-color:rgba(255,255,255,.16);
  color:var(--svc-muted);
}
body.is-portal .alert{ background:rgba(245,158,11,.1); border-color:rgba(245,158,11,.35); color:#fde68a; }
body.is-portal .ps-table tr{ background:transparent; }
body.is-portal .ps-table tbody tr:hover{ background:rgba(255,255,255,.025); }
body.is-portal .ps-table thead th,
body.is-portal .tbl th{ color:var(--svc-muted); font:700 11px var(--svc-num, ui-monospace); letter-spacing:.08em; text-transform:uppercase; }
body.is-portal .tbl th,
body.is-portal .tbl td{ border-bottom-color:var(--svc-line); }

/* sidebar / nav (dashboard) */
body.is-portal .side-head,
body.is-portal .side-foot,
body.is-portal .head{ border-color:var(--svc-line); }
body.is-portal .nav-item{ color:var(--svc-ink); }
body.is-portal .nav-item:hover{ background:rgba(255,255,255,.04); }
body.is-portal .nav-ico,
body.is-portal .kpi-ico,
body.is-portal .kicon,
body.is-portal .titleIco{
  background:rgba(34,197,94,.1);
  border-color:rgba(74,222,128,.28);
  color:var(--svc-gold-light);
}
body.is-portal .nav-ico i,
body.is-portal .t-set .nav-ico i{ color:var(--svc-gold-light); }
body.is-portal .t-set .nav-ico{ background:rgba(255,255,255,.06); border-color:var(--svc-line); }

/* pills, tags, filters, chips, badges */
body.is-portal .pill,
body.is-portal .tag,
body.is-portal .chip,
body.is-portal .badge,
body.is-portal .tier-badge,
body.is-portal .picked .badge,
body.is-portal .m-ver,
body.is-portal .ext,
body.is-portal .dlg-close{
  background:var(--svc-soft2);
  border-color:var(--svc-line);
  color:var(--svc-ink);
}
body.is-portal .pill::before,
body.is-portal .dot,
body.is-portal .dot-gray,
body.is-portal .tier-dot{ background-color:rgba(255,255,255,.3); box-shadow:none; }
body.is-portal .dot-red{ background:#ef4444; }
body.is-portal .dot-yellow{ background:#f59e0b; }
body.is-portal .tag-normal{ background:rgba(255,255,255,.06); border-color:var(--svc-line); color:var(--svc-ink); }
body.is-portal .tag-open,
body.is-portal .tone-info{ color:#93c5fd; }
body.is-portal .badge-urgent{ background:rgba(239,68,68,.14); border-color:rgba(248,113,113,.4); color:#fecaca; }
body.is-portal .fbtn{ background:var(--svc-soft); border-color:var(--svc-line); color:var(--svc-ink); }
body.is-portal .fbtn:hover{ border-color:rgba(74,222,128,.4); }
body.is-portal .fbtn.active{ background:rgba(34,197,94,.14); border-color:rgba(74,222,128,.55); color:var(--svc-gold-light); }

/* text */
body.is-portal .side-head .sub,
body.is-portal .nav-text small,
body.is-portal .m-meta,
body.is-portal .m-dt,
body.is-portal .sum-count,
body.is-portal .muted,
body.is-portal .fsub,
body.is-portal .tier-sub,
body.is-portal .dtstack .t,
body.is-portal .hint{ color:var(--svc-muted); }
body.is-portal .dtstack .d,
body.is-portal .sectionTitle,
body.is-portal .section-title{ color:#d8dbe1; }
body.is-portal .m-dt b,
body.is-portal .m-v,
body.is-portal .v,
body.is-portal .tier-title,
body.is-portal .ktext b{ color:var(--svc-ink); }

/* collapsible sections, dialogs */
body.is-portal details.sec summary{ background:rgba(255,255,255,.03); color:var(--svc-ink); }
body.is-portal .dlg-head{ background:var(--svc-panel2); border-bottom-color:var(--svc-line); }

/* request / document forms that use their own button + input classes */
body.is-portal .card .btn,
body.is-portal .body .btn{ background:rgba(255,255,255,.05); border-color:var(--svc-line-strong, rgba(255,255,255,.18)); color:var(--svc-ink); }
body.is-portal .btn.primary{ background:linear-gradient(135deg,#86efac 0%,#4ade80 48%,#22c55e 100%); border-color:transparent; color:#05140b; }
body.is-portal .inp,
body.is-portal .ps-in{ background:rgba(255,255,255,.045); border-color:rgba(255,255,255,.13); color:var(--svc-ink); }

/* tiers (settings) */
body.is-portal .tier.premium{ background:linear-gradient(120deg, rgba(34,197,94,.14), rgba(22,163,74,.04) 60%), var(--svc-panel); border-color:rgba(74,222,128,.35); }
body.is-portal .tier.normal{ background:linear-gradient(120deg, rgba(245,158,11,.10), rgba(245,158,11,.02) 60%), var(--svc-panel); }

/* new_request.php header card: keep its compact card geometry */
body.is-portal .hero{
  padding:16px 18px;
  border:1px solid var(--svc-line);
  border-radius:22px;
  background:radial-gradient(70% 120% at 100% 0%, rgba(34,197,94,.14), transparent 60%), var(--svc-panel);
  box-shadow:none;
}
body.is-portal .hero h2{ color:var(--svc-ink); font-weight:900; letter-spacing:-.025em; }
body.is-portal .hero .sub{ font-size:13px; max-width:none !important; }
body.is-portal .hero .container > *,
body.is-portal .hero > *{ animation:none; }

/* mobile: dashboard cards breathe a little less */
@media (max-width:560px){
  body.is-portal .pcard,
  body.is-portal .card{ border-radius:18px; }
}