/* portal.css — shared theme system. 4 themes x {light,dark}.
   Pages keep their inline :root (normal-light) as fallback; these rules win
   via higher specificity (html[data-theme][data-mode]). JS writes concrete
   data-theme + data-mode (light|dark) on <html>; "auto" resolves to OS mode. */

/* ---------- NORMAL ---------- */
html[data-theme="normal"][data-mode="light"]{
  --bg:#f6f8fa; --card:#fff; --border:#e2e6ea; --border-s:#eef1f4;
  --text:#1f2933; --muted:#6b7280; --muted2:#9aa4b2;
  --primary:#2563eb; --primary-d:#1d4ed8; --primary-l:#eff4ff;
  --danger:#dc2626; --danger-l:#fef2f2; --ok:#16a34a; --ok-l:#f0fdf4; --warn:#d97706;
  --hover:#f9fafb; --subtle:#fafbfc; --chip-bg:#eef2f7; --chip-fg:#475569;
  --shadow:0 1px 3px rgba(16,24,40,.08),0 1px 2px rgba(16,24,40,.04);
  --shadow-l:0 12px 40px rgba(16,24,40,.18);
}
html[data-theme="normal"][data-mode="dark"]{
  --bg:#0f1420; --card:#1a2233; --border:#2a3547; --border-s:#232d3d;
  --text:#e6edf5; --muted:#93a1b5; --muted2:#6b7a90;
  --primary:#3b82f6; --primary-d:#60a5fa; --primary-l:#1e293b;
  --danger:#f87171; --danger-l:#3a1e1e; --ok:#4ade80; --ok-l:#14301f; --warn:#fbbf24;
  --hover:#232d3d; --subtle:#202a3a; --chip-bg:#293244; --chip-fg:#c3cede;
  --shadow:0 1px 3px rgba(0,0,0,.4),0 1px 2px rgba(0,0,0,.3);
  --shadow-l:0 12px 40px rgba(0,0,0,.6);
}

/* ---------- INTELLIJ (IntelliJ Light / Darcula) ---------- */
html[data-theme="intellij"][data-mode="light"]{
  --bg:#f7f8fa; --card:#ffffff; --border:#ebecf0; --border-s:#f0f1f3;
  --text:#2b2b2b; --muted:#6e6e6e; --muted2:#9a9a9a;
  --primary:#3574f0; --primary-d:#2b5fd0; --primary-l:#edf3ff;
  --danger:#e00000; --danger-l:#fdecec; --ok:#369650; --ok-l:#ecf6ee; --warn:#b78400;
  --hover:#f2f3f5; --subtle:#f0f1f3; --chip-bg:#e8eaee; --chip-fg:#494b57;
  --shadow:0 1px 3px rgba(0,0,0,.08),0 1px 2px rgba(0,0,0,.05);
  --shadow-l:0 12px 40px rgba(0,0,0,.2);
}
html[data-theme="intellij"][data-mode="dark"]{
  --bg:#1e1f22; --card:#2b2d30; --border:#393b40; --border-s:#303235;
  --text:#dfe1e5; --muted:#9da0a8; --muted2:#6f737a;
  --primary:#548af7; --primary-d:#75a4ff; --primary-l:#25324d;
  --danger:#f75464; --danger-l:#3d2325; --ok:#5fad65; --ok-l:#26331f; --warn:#d6a740;
  --hover:#323438; --subtle:#26282e; --chip-bg:#3c3f41; --chip-fg:#c5c8cf;
  --shadow:0 1px 3px rgba(0,0,0,.5),0 1px 2px rgba(0,0,0,.4);
  --shadow-l:0 12px 40px rgba(0,0,0,.7);
}
/* IntelliJ = boxy. Flatten radii (specificity beats page inline .card 0,1,0). */
html[data-theme="intellij"]{--radius:4px}
html[data-theme="intellij"] .card,
html[data-theme="intellij"] input,
html[data-theme="intellij"] textarea,
html[data-theme="intellij"] select,
html[data-theme="intellij"] .btn,
html[data-theme="intellij"] button.btn,
html[data-theme="intellij"] .field input,
html[data-theme="intellij"] .field select,
html[data-theme="intellij"] .field textarea,
html[data-theme="intellij"] .search input,
html[data-theme="intellij"] .nav a,
html[data-theme="intellij"] .top a,
html[data-theme="intellij"] .top button,
html[data-theme="intellij"] .top .logo,
html[data-theme="intellij"] .logo,
html[data-theme="intellij"] .sb-brand .logo,
html[data-theme="intellij"] .sb-foot button,
html[data-theme="intellij"] .hamb,
html[data-theme="intellij"] .drawer header .x,
html[data-theme="intellij"] .nodecat,
html[data-theme="intellij"] .ovrow select,
html[data-theme="intellij"] .ovrow .del,
html[data-theme="intellij"] .badge,
html[data-theme="intellij"] .chip,
html[data-theme="intellij"] .banner,
html[data-theme="intellij"] .avatar,
html[data-theme="intellij"] .av,
html[data-theme="intellij"] .sb-foot .av,
html[data-theme="intellij"] .avedit .pic,
html[data-theme="intellij"] #toast,
html[data-theme="intellij"] #pui-panel,
html[data-theme="intellij"] .pui-seg button,
html[data-theme="intellij"] .pui-themes button,
html[data-theme="intellij"] #pui-lang,
html[data-theme="intellij"] .pui-sw{border-radius:4px}
html[data-theme="intellij"] #pui-btn{border-radius:6px}

/* ---------- SOLARIZED ---------- */
html[data-theme="solarized"][data-mode="light"]{
  --bg:#fdf6e3; --card:#fffbf0; --border:#e6dfc8; --border-s:#eee8d5;
  --text:#586e75; --muted:#93a1a1; --muted2:#a8b3b3;
  --primary:#268bd2; --primary-d:#1a6ea8; --primary-l:#e8eff5;
  --danger:#dc322f; --danger-l:#fbe6e2; --ok:#859900; --ok-l:#f0f2df; --warn:#b58900;
  --hover:#f5eed3; --subtle:#eee8d5; --chip-bg:#eee8d5; --chip-fg:#657b83;
  --shadow:0 1px 3px rgba(101,123,131,.15),0 1px 2px rgba(101,123,131,.1);
  --shadow-l:0 12px 40px rgba(101,123,131,.3);
}
html[data-theme="solarized"][data-mode="dark"]{
  --bg:#002b36; --card:#073642; --border:#0d4653; --border-s:#0a3d49;
  --text:#93a1a1; --muted:#657b83; --muted2:#586e75;
  --primary:#268bd2; --primary-d:#3ba0e6; --primary-l:#0d3b49;
  --danger:#dc322f; --danger-l:#3a2020; --ok:#859900; --ok-l:#20301a; --warn:#b58900;
  --hover:#0d4653; --subtle:#073642; --chip-bg:#0d4653; --chip-fg:#93a1a1;
  --shadow:0 1px 3px rgba(0,0,0,.4),0 1px 2px rgba(0,0,0,.3);
  --shadow-l:0 12px 40px rgba(0,0,0,.6);
}

/* ---------- HIGH CONTRAST ---------- */
html[data-theme="contrast"][data-mode="light"]{
  --bg:#ffffff; --card:#ffffff; --border:#000000; --border-s:#000000;
  --text:#000000; --muted:#333333; --muted2:#444444;
  --primary:#0000cc; --primary-d:#000099; --primary-l:#e6e6ff;
  --danger:#cc0000; --danger-l:#ffe6e6; --ok:#006600; --ok-l:#e6ffe6; --warn:#805500;
  --hover:#f0f0f0; --subtle:#f0f0f0; --chip-bg:#000000; --chip-fg:#ffffff;
  --shadow:0 0 0 1px #000; --shadow-l:0 0 0 2px #000,0 12px 40px rgba(0,0,0,.3);
}
html[data-theme="contrast"][data-mode="dark"]{
  --bg:#000000; --card:#000000; --border:#ffffff; --border-s:#ffffff;
  --text:#ffffff; --muted:#cccccc; --muted2:#bbbbbb;
  --primary:#66aaff; --primary-d:#99ccff; --primary-l:#001a33;
  --danger:#ff6666; --danger-l:#330000; --ok:#66ff66; --ok-l:#003300; --warn:#ffcc00;
  --hover:#1a1a1a; --subtle:#1a1a1a; --chip-bg:#ffffff; --chip-fg:#000000;
  --shadow:0 0 0 1px #fff; --shadow-l:0 0 0 2px #fff,0 12px 40px rgba(0,0,0,.7);
}

/* ---------- control widget ---------- */
#pui-btn{position:fixed;right:16px;bottom:16px;z-index:200;width:44px;height:44px;border-radius:50%;
  border:1px solid var(--border);background:var(--card);color:var(--text);font-size:19px;line-height:1;
  box-shadow:var(--shadow-l);display:grid;place-items:center}
#pui-panel{position:fixed;right:16px;bottom:70px;z-index:200;width:260px;max-width:calc(100vw - 32px);
  background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:14px;
  box-shadow:var(--shadow-l);padding:14px;font:14px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
#pui-panel h5{margin:2px 0 8px;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
#pui-panel h5:not(:first-child){margin-top:14px}
.pui-seg{display:flex;gap:6px}
.pui-seg button{flex:1;padding:7px 4px;border:1px solid var(--border);border-radius:8px;background:var(--card);
  color:var(--text);font-size:12.5px;font-weight:600}
.pui-seg button.on{background:var(--primary);border-color:var(--primary);color:#fff}
.pui-themes{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.pui-themes button{display:flex;align-items:center;gap:7px;padding:7px 9px;border:1px solid var(--border);
  border-radius:8px;background:var(--card);color:var(--text);font-size:12.5px;font-weight:600;text-align:left}
.pui-themes button.on{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-l)}
.pui-sw{width:14px;height:14px;border-radius:4px;border:1px solid rgba(0,0,0,.15);flex-shrink:0}
#pui-lang{width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--card);
  color:var(--text);font:inherit;font-weight:600}
[dir] #pui-panel{text-align:left}