/* Baskit Ops console — Baskit brand CI
   Palette (from brand deck): Forrest Green #264000, Egg Shell #fbf9d2,
   Lime Green #c4e427, Warm Yellow #f6cc45. Type: Poppins. */
:root{
  --forrest:#264000;      /* primary dark base */
  --forrest2:#38590a;     /* lighter forrest for hovers/labels */
  --olive:#2C3F09;        /* deep olive (sidebar) */
  --eggshell:#fbf9d2;     /* pale cream */
  --cream:#f7f4df;        /* soft cream surface */
  --lime:#c4e427;         /* bright accent */
  --lime-d:#9fbf10;       /* darker lime for hover on light */
  --yellow:#f6cc45;       /* warm secondary accent */
  --green:#5e891e;        /* mid green (links, success) */

  --ink:#20260f;          /* near-black olive ink */
  --muted:#6b7357;        /* muted olive-grey */
  --line:#e6e8d6;         /* hairline (warm) */
  --bg:#f6f6ec;           /* app background (warm off-white) */

  --ok:#4c7a1e;--warn:#a9791a;--bad:#c0562f;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--ink);font-family:'Poppins',system-ui,Segoe UI,Arial,sans-serif;font-size:14.5px;line-height:1.55}
a{color:var(--green);text-decoration:none}
a:hover{color:var(--forrest);text-decoration:underline}

/* Shell */
.shell{display:flex;min-height:100vh}
.side{width:224px;flex:none;background:var(--forrest);color:var(--eggshell);display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.side .brand{padding:22px 18px 16px}
.side .brand img{height:40px;width:auto;display:block}
.side nav{padding:6px 0;overflow-y:auto;flex:1}
.side nav a{display:flex;align-items:center;gap:10px;padding:9px 18px;font-size:13.5px;color:var(--eggshell);opacity:.86}
.side nav a,.side nav a:hover{text-decoration:none}
.side nav a:hover{background:rgba(255,255,255,.07);opacity:1;color:var(--eggshell)}
.side .who a,.side .who a:hover{text-decoration:none}
.side nav a.on{background:var(--lime);color:var(--forrest);font-weight:600;opacity:1}
.side .who{padding:12px 18px;border-top:1px solid rgba(255,255,255,.14);font-size:12px;color:#c8cfa8}
.side .who .n{color:#fff;font-weight:600;display:block}
.side .who a{color:var(--lime)}
.side .who a:hover{color:var(--lime)}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.top{background:#fff;border-bottom:1px solid var(--line);padding:14px 26px;display:flex;align-items:center;justify-content:space-between}
.top h1{font-size:19px;margin:0;color:var(--forrest);font-weight:600}
.top .crumb{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.content{padding:24px 26px;flex:1}

/* Cards / KPI */
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}.g6{grid-template-columns:repeat(6,1fr)}
.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px}
.card h3{margin:0 0 12px;font-size:14px;color:var(--forrest);font-weight:600}
.kpi{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px;position:relative;overflow:hidden}
.kpi .v{font-size:26px;font-weight:700;color:var(--forrest)}
.kpi .l{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-top:2px}

/* Tables */
table.t{width:100%;border-collapse:collapse;font-size:13.5px;background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 0 0 1px var(--line)}
table.t th{background:var(--forrest);color:var(--eggshell);text-align:left;padding:10px 13px;font-weight:600;font-size:11px;letter-spacing:.05em;text-transform:uppercase}
table.t td{padding:10px 13px;border-top:1px solid #eef1e3;vertical-align:middle}
table.t tr:nth-child(even) td{background:#fbfbf3}
table.t .right{text-align:right}

/* Badges */
.badge{font-weight:700;font-size:10.5px;padding:3px 9px;border-radius:999px;text-transform:uppercase;letter-spacing:.03em;display:inline-block}
.badge.ok{background:#e8f2d6;color:var(--ok)}
.badge.warn{background:#fbeecb;color:var(--warn)}
.badge.bad{background:#f8ded2;color:var(--bad)}
.badge.info{background:var(--eggshell);color:var(--forrest2)}
.badge.mute{background:#eceee0;color:#6a7355}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:8px;padding:8px 14px;font-size:13.5px;font-weight:500;cursor:pointer;font-family:inherit}
.btn:hover{border-color:#cfd3ba;text-decoration:none}
.btn.primary{background:var(--forrest);border-color:var(--forrest);color:var(--eggshell)}
.btn.primary:hover{background:var(--forrest2);color:var(--eggshell)}
.btn.lime{background:var(--lime);border-color:var(--lime);color:var(--forrest);font-weight:600}
.btn.lime:hover{background:var(--lime-d);color:var(--forrest)}
.btn.danger{background:#fff;border-color:#e6b3a5;color:var(--bad)}
.btn.sm{padding:5px 10px;font-size:12.5px}

/* Forms */
.field{margin-bottom:16px}
.field label{display:block;font-size:12.5px;font-weight:600;color:var(--forrest2);margin-bottom:5px}
.field input,.field select,.field textarea{width:100%;padding:9px 11px;border:1px solid #d4d8c0;border-radius:8px;font:inherit;font-size:14px;background:#fff}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(196,228,39,.35)}
.field .hint{font-size:12px;color:var(--muted);margin-top:4px}
.row{display:flex;gap:16px;flex-wrap:wrap}.row>*{flex:1;min-width:200px}

/* Alerts */
.alert{padding:11px 15px;border-radius:9px;margin-bottom:16px;font-size:13.5px;border-left:4px solid}
.alert.err{background:#fbf0ea;border-color:var(--bad);color:#7a2d18}
.alert.ok{background:#eef5df;border-color:var(--green);color:#3c5a13}
.alert.info{background:var(--eggshell);border-color:var(--lime);color:var(--forrest2)}

/* Permission matrix */
.matrix{width:100%;border-collapse:collapse;font-size:13px;background:#fff;box-shadow:0 0 0 1px var(--line);border-radius:10px;overflow:hidden}
.matrix th{background:var(--forrest);color:var(--eggshell);text-align:left;padding:9px 12px;font-size:11px;text-transform:uppercase;letter-spacing:.04em}
.matrix td{padding:8px 12px;border-top:1px solid #eef1e3}
.matrix .modrow td{background:var(--eggshell);font-weight:600;color:var(--forrest);text-transform:uppercase;font-size:11px;letter-spacing:.05em}
.matrix .permname{font-weight:500}
.matrix .permkey{font:12px ui-monospace,Menlo,Consolas,monospace;color:var(--muted)}
.seg{display:inline-flex;border:1px solid #d4d8c0;border-radius:7px;overflow:hidden}
.seg label{padding:4px 10px;font-size:12px;cursor:pointer;background:#fff;border-right:1px solid #d4d8c0}
.seg label:last-child{border-right:0}
.seg input{display:none}
.seg .inh{color:var(--muted)}
.seg label:has(input:checked){background:var(--eggshell)}
.seg label.allow:has(input:checked){background:#e8f2d6;color:var(--ok);font-weight:700}
.seg label.deny:has(input:checked){background:#f8ded2;color:var(--bad);font-weight:700}

/* Auth screens — two-plane layout */
.auth{display:flex;min-height:100vh}
.auth .aside{flex:1.05;background:linear-gradient(155deg,#2f4d06,#264000 55%,#1c3000);color:var(--eggshell);padding:56px 60px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
.auth .aside .glow{position:absolute;border-radius:50%;filter:blur(10px);opacity:.16}
.auth .aside .glow.g1{width:340px;height:340px;background:var(--lime);top:-90px;right:-70px}
.auth .aside .glow.g2{width:260px;height:260px;background:var(--yellow);bottom:-80px;left:-60px;opacity:.13}
.auth .aside .logo img{height:52px;width:auto;position:relative;z-index:1}
.auth .aside .pitch{position:relative;z-index:1;max-width:460px}
.auth .aside .pitch .eyebrow{color:var(--lime);letter-spacing:.28em;text-transform:uppercase;font-size:11px;font-weight:600}
.auth .aside .pitch h2{font-size:30px;line-height:1.18;font-weight:600;margin:12px 0 14px}
.auth .aside .pitch p{color:#dfe6c2;font-size:15px;margin:0 0 26px}
.auth .aside .feats{list-style:none;padding:0;margin:0;display:grid;gap:14px}
.auth .aside .feats li{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:#eaf0d6}
.auth .aside .feats .ic{width:30px;height:30px;border-radius:8px;background:rgba(196,228,39,.16);color:var(--lime);display:flex;align-items:center;justify-content:center;flex:none;font-weight:700}
.auth .aside .foot{position:relative;z-index:1;color:#aeb98a;font-size:12px}
.auth .aside .foot b{color:var(--eggshell)}

.auth .panel{flex:1;background:#fff;display:flex;align-items:center;justify-content:center;padding:48px 40px}
.auth .form{width:100%;max-width:360px}
.auth .form .h{font-size:24px;font-weight:600;color:var(--forrest);margin:0 0 4px}
.auth .form .sub{color:var(--muted);font-size:13.5px;margin:0 0 26px}
.auth .form .between{display:flex;align-items:center;justify-content:space-between;margin:2px 0 18px;font-size:13px}
.auth .form .check{display:flex;align-items:center;gap:8px;color:var(--muted)}
.auth .form .check input{width:auto}
.auth .form .btn.block{width:100%;justify-content:center;padding:11px}
.auth .form .alt{text-align:center;margin-top:18px;font-size:13px;color:var(--muted)}
.auth .mini-logo{display:none}

.muted{color:var(--muted)}
.mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12.5px}
.stub{border:2px dashed #cfd3ba;border-radius:12px;padding:40px;text-align:center;color:var(--muted)}
.stub h3{color:var(--forrest)}

@media(max-width:920px){
  .auth .aside{display:none}
  .auth .mini-logo{display:block;text-align:center;margin-bottom:22px}
  .auth .mini-logo img{height:44px}
}
@media(max-width:820px){.g4,.g3,.g6{grid-template-columns:repeat(2,1fr)}.side{width:64px}.side .brand img{height:28px}.side nav a span,.side .who{display:none}}