/* ============================================================
   BAUCH HR — shared UI kit (preview)
   Charcoal structure · white surfaces · single deep-red accent
   ============================================================ */
:root{
  --charcoal:#1e2d3d; --charcoal-2:#27384b;
  --ink:#212b36; --ink-2:#3d4b5c; --muted:#6b7785; --muted-2:#92a0ad;
  --line:#e4e8ec; --line-2:#eef1f4;
  --surface:#ffffff; --canvas:#f3f5f7; --canvas-2:#eaeef1;
  --accent:#8B1A1A; --accent-hover:#731515; --accent-tint:#f6ecec; --accent-tint-bd:#e7cccc; --accent-soft:#fbf6f6;
  --neu-bg:#eef1f4; --neu-fg:#46566a; --neu-bd:#dde3ea; --neu-dot:#7a8a9c;
  --amb-bg:#fbf4e5; --amb-fg:#86600f; --amb-bd:#eee0c0; --amb-dot:#c0902e;
  --blu-bg:#eaf0f7; --blu-fg:#2c4a78; --blu-bd:#d3ddee; --blu-dot:#3f6098;
  --red-bg:#f8ecec; --red-fg:#8a2f2f; --red-bd:#eccfcf; --red-dot:#b0494a;
  --grn-bg:#e9f1ec; --grn-fg:#2f5d40; --grn-bd:#d2e3d8; --grn-dot:#4f8163;
  --vio-bg:#efecf7; --vio-fg:#4a3d78; --vio-bd:#ddd5ee; --vio-dot:#6a5aa0;
}
*{box-sizing:border-box;}
html,body{margin:0;}
body{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--canvas);color:var(--ink);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;}
a{text-decoration:none;color:inherit;}
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-0.01em;}
.mono{font-family:'JetBrains Mono',ui-monospace,monospace;}

/* icons */
.ic{width:1em;height:1em;display:inline-block;vertical-align:-0.14em;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none;}

/* ===== NAVBAR ===== */
.nav{background:var(--surface);border-bottom:1px solid var(--line);height:60px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;position:sticky;top:0;z-index:40;}
.nav-l{display:flex;align-items:center;gap:30px;}
.brand{display:flex;align-items:center;gap:11px;}
.brand img{height:38px;width:auto;display:block;}
.brand .bm{width:34px;height:34px;border-radius:7px;background:var(--charcoal);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:14px;letter-spacing:.5px;position:relative;}
.brand .bm::after{content:"";position:absolute;left:6px;top:6px;width:8px;height:8px;border-radius:50%;background:var(--accent);}
.brand .bt{line-height:1.05;}
.brand .bt b{font-size:16px;font-weight:700;letter-spacing:.3px;color:var(--ink);}
.brand .bt span{display:block;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-top:1px;}
.nav-menu{display:flex;align-items:center;gap:4px;}
.nav-menu a{display:flex;align-items:center;gap:7px;padding:8px 13px;border-radius:7px;font-size:13.5px;font-weight:500;color:var(--ink-2);transition:all .15s;}
.nav-menu a .ic{width:15px;height:15px;}
.nav-menu a:hover{background:var(--canvas);color:var(--ink);}
.nav-menu a.on{color:var(--accent);background:var(--accent-tint);font-weight:600;}
/* nav dropdown (More / language) */
.nav-menu .dropdown > a,.nav-more{display:flex;align-items:center;gap:7px;padding:8px 13px;border-radius:7px;font-size:13.5px;font-weight:500;color:var(--ink-2);cursor:pointer;transition:all .15s;}
.nav-menu .dropdown > a:hover,.nav-more:hover{background:var(--canvas);color:var(--ink);}
.nav-menu .dropdown > a .ic.chev{width:11px;height:11px;}
.nav-dd{border:1px solid var(--line);border-radius:9px;box-shadow:0 10px 30px rgba(30,45,61,.13);padding:5px;min-width:210px;margin-top:6px;}
.nav-dd li{list-style:none;}
.nav-dd a{display:flex;align-items:center;gap:10px;padding:8px 11px;border-radius:7px;font-size:13px;font-weight:500;color:var(--ink-2);text-decoration:none;}
.nav-dd a .ic{width:15px;height:15px;color:var(--muted);}
.nav-dd a:hover{background:var(--accent-tint);color:var(--accent);}
.nav-dd a:hover .ic{color:var(--accent);}
.nav-dd a.danger{color:var(--red-fg);}
.nav-dd a.danger .ic{color:var(--red-dot);}
.nav-dd a.danger:hover{background:var(--red-bg);}
.nav-dd .sep{height:1px;background:var(--line-2);margin:5px 4px;}
.nav-r{display:flex;align-items:center;gap:18px;}
.brand-logos{display:flex;align-items:center;gap:20px;padding-right:4px;}
.brand-logos img{height:30px;width:auto;display:block;}
.blogo{font-size:11px;font-weight:800;letter-spacing:.04em;color:#3a4654;line-height:.95;text-align:center;opacity:.85;}
.blogo span{display:block;font-size:7.5px;font-weight:700;letter-spacing:.18em;color:var(--muted-2);}
.blogo.schermer{font-style:italic;color:#2c4a78;}
.nav-ctl{display:flex;align-items:center;gap:8px;}
.ipill{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px;border:1px solid var(--line);border-radius:7px;font-size:13px;font-weight:500;color:var(--ink-2);background:var(--surface);cursor:pointer;transition:all .15s;}
.ipill .ic{width:15px;height:15px;}
.ipill:hover{background:var(--canvas);}
.ipill.logout{color:var(--accent);border-color:var(--accent-tint-bd);}
.ipill.logout:hover{background:var(--accent-tint);}

/* ===== PAGE ===== */
.page{max-width:1240px;margin:0 auto;padding:26px 26px 80px;}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap;}
.page-head .ttl{font-size:20px;font-weight:700;color:var(--ink);letter-spacing:-0.02em;display:flex;align-items:center;gap:11px;}
.page-head .ttl .tic{width:34px;height:34px;border-radius:8px;background:var(--accent-tint);color:var(--accent);display:flex;align-items:center;justify-content:center;}
.page-head .ttl .tic .ic{width:19px;height:19px;}
.page-head .sub{font-size:13px;color:var(--muted);margin-top:4px;}

/* ===== BUTTONS ===== */
.btn{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 14px;border-radius:7px;font-size:13px;font-weight:600;border:1px solid var(--line);background:var(--surface);color:var(--ink-2);cursor:pointer;transition:all .15s;white-space:nowrap;}
.btn .ic{width:15px;height:15px;}
.btn:hover{background:var(--canvas);border-color:var(--muted-2);}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff;}
.btn.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover);}
.btn.ghost{border-color:transparent;color:var(--accent);background:transparent;padding:0 8px;}
.btn.ghost:hover{background:var(--accent-tint);}
.btn.sm{height:32px;padding:0 11px;font-size:12.5px;}

/* ===== ACTION ICON BUTTONS ===== */
.act-group{display:inline-flex;gap:4px;}
.act-btn{width:30px;height:30px;border-radius:6px;border:1px solid var(--line);background:var(--surface);color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:all .15s;}
.act-btn .ic{width:15px;height:15px;}
.act-btn:hover{background:var(--accent-tint);border-color:var(--accent-tint-bd);color:var(--accent);}
.act-btn--danger:hover{background:var(--red-bg);border-color:var(--red-bd);color:var(--red-fg);}

/* ===== PILLS ===== */
.pill{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:5px;font-size:11.5px;font-weight:600;line-height:1.45;white-space:nowrap;}
.pill .pdot{width:6px;height:6px;border-radius:50%;flex:none;}
.pill-neu{background:var(--neu-bg);color:var(--neu-fg);border:1px solid var(--neu-bd);} .pill-neu .pdot{background:var(--neu-dot);}
.pill-amb{background:var(--amb-bg);color:var(--amb-fg);border:1px solid var(--amb-bd);} .pill-amb .pdot{background:var(--amb-dot);}
.pill-blu{background:var(--blu-bg);color:var(--blu-fg);border:1px solid var(--blu-bd);} .pill-blu .pdot{background:var(--blu-dot);}
.pill-red{background:var(--red-bg);color:var(--red-fg);border:1px solid var(--red-bd);} .pill-red .pdot{background:var(--red-dot);}
.pill-grn{background:var(--grn-bg);color:var(--grn-fg);border:1px solid var(--grn-bd);} .pill-grn .pdot{background:var(--grn-dot);}
.pill-vio{background:var(--vio-bg);color:var(--vio-fg);border:1px solid var(--vio-bd);} .pill-vio .pdot{background:var(--vio-dot);}

/* tags */
.tag-co{display:inline-flex;align-items:center;padding:2px 8px;border-radius:5px;background:var(--charcoal);color:#fff;font-size:11.5px;font-weight:600;white-space:nowrap;}
.tag-soft{display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:5px;background:var(--neu-bg);color:var(--neu-fg);border:1px solid var(--neu-bd);font-size:11.5px;font-weight:600;}
.tag-soft .ic{width:12px;height:12px;}

/* ===== PANEL ===== */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:10px;}
.panel-pad{padding:18px 20px;}

/* ===== TABLE ===== */
.tbl-wrap{background:var(--surface);border:1px solid var(--line);border-radius:10px;overflow-x:auto;overflow-y:visible;}
.tbl{width:100%;border-collapse:collapse;font-size:13px;}
.tbl thead th{background:var(--charcoal);color:#dce4ec;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;text-align:left;padding:11px 12px;white-space:nowrap;}
.tbl tbody td{padding:10px 12px;border-bottom:1px solid var(--line-2);vertical-align:middle;color:var(--ink-2);}
.tbl tbody tr:last-child td{border-bottom:0;}
.tbl tbody tr:hover{background:var(--accent-soft);}
.tbl .c-name{font-weight:600;color:var(--ink);font-size:13.5px;}
.tbl .c-name a{color:var(--accent);}
.tbl .c-name a:hover{text-decoration:underline;}
.tbl .c-sub{color:var(--muted);font-size:12px;font-weight:400;margin-top:2px;}
.tbl .c-meta{color:var(--muted);font-family:'JetBrains Mono',ui-monospace,monospace;font-size:12px;white-space:nowrap;}
.tbl .cvchip{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:22px;padding:0 8px;border-radius:5px;background:var(--canvas-2);color:var(--ink-2);font-size:12px;font-weight:600;}
.tbl .dash-cell{color:var(--muted-2);}