/* CyberOps console — dark "control-room" theme, matching the Solo console.
   Class names are unchanged from the light theme so every ported SOC view
   renders as-is; only the visual system (colours, fonts, surfaces) changed. */
@import url('https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root{
  --m-bg:#0b0e14; --m-surface:#12161f; --m-surface-2:#171c27; --m-border:#232a37;
  --m-text:#e6e9ef; --m-muted:#8b94a7;
  --m-accent:#14b8a6; --m-accent-ink:#04211d; --m-accent-dim:#0e7c72;
  --m-side:#0e1119; --m-side-ink:#8b94a7; --m-side-active:#14b8a6;
  --m-danger:#f85149; --m-warn:#f5a524; --m-green:#3fb950; --m-blue:#58a6ff;
  --m-radius:12px;
}
/* Light theme — fully light (light sidebar too), matching the Solo console. */
:root[data-theme="light"]{
  --m-bg:#f4f6f9; --m-surface:#ffffff; --m-surface-2:#f8fafc; --m-border:#e3e8ef;
  --m-text:#0f172a; --m-muted:#64748b;
  --m-accent:#0f766e; --m-accent-ink:#ffffff; --m-accent-dim:#0b5c55;
  --m-side:#ffffff; --m-side-ink:#475569; --m-side-active:#0f766e;
  --m-danger:#b91c1c; --m-warn:#b45309; --m-green:#047857; --m-blue:#0969da;
}
:root[data-theme="light"] .button:hover{background:var(--m-accent-dim);}
/* light sidebar: recolour the elements that were hardcoded for a dark rail */
:root[data-theme="light"] .side{border-right:1px solid var(--m-border);}
:root[data-theme="light"] .brand{color:#0f172a;}
:root[data-theme="light"] .side h6{color:#94a3b8;}
:root[data-theme="light"] .side a.nav:hover{background:#eef2f7;color:#0f172a;}
:root[data-theme="light"] .side a.nav.on{background:rgba(15,118,110,.10);color:#0f766e;}
:root[data-theme="light"] .side .who{border-top-color:var(--m-border);}
:root[data-theme="light"] .side .who > div:first-child{color:#0f172a !important;}
:root[data-theme="light"] .side .count{color:#fff;}
:root[data-theme="light"] .theme-toggle{color:#475569;border-color:var(--m-border);}
:root[data-theme="light"] .theme-toggle:hover{color:#0f172a;background:#eef2f7;}
:root[data-theme="light"] .topbar{background:#ffffff;border-bottom:1px solid var(--m-border);}
:root[data-theme="light"] .topbar a{color:#0f172a;}
:root[data-theme="light"] .topbar button{color:#0f172a;border-color:var(--m-border);}
:root[data-theme="light"] .alert-success{background:#ecfdf5;border-color:#a7f3d0;color:#065f46;}
:root[data-theme="light"] .alert-error{background:#fef2f2;border-color:#fecaca;color:#991b1b;}
:root[data-theme="light"] .badge{background:#f1f5f9;color:#334155;}
:root[data-theme="light"] .badge-open{background:#fee2e2;color:#991b1b;}
:root[data-theme="light"] .badge-in_progress{background:#fef3c7;color:#92400e;}
:root[data-theme="light"] .badge-waiting_customer{background:#e0e7ff;color:#3730a3;}
:root[data-theme="light"] .badge-resolved,:root[data-theme="light"] .badge-closed{background:#ecfdf5;color:#065f46;}
:root[data-theme="light"] .prio-critical{color:#7f1d1d;}
:root[data-theme="light"] .prio-high{color:#b91c1c;}
:root[data-theme="light"] .prio-medium{color:#b45309;}
:root[data-theme="light"] .prio-low{color:#64748b;}
:root[data-theme="light"] .side .count{color:#fff;}
:root[data-theme="light"] input::placeholder,:root[data-theme="light"] textarea::placeholder{color:#94a3b8;}
*{box-sizing:border-box;}
html,body{margin:0;}
body{background:var(--m-bg);color:var(--m-text);
  font:14px/1.5 'Hanken Grotesk',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased;}
a{color:var(--m-blue);}
code,.mono{font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;}

.shell{display:flex;min-height:100vh;background:var(--m-bg);}
.side{width:220px;flex:0 0 220px;background:var(--m-side);color:var(--m-side-ink);
  padding:18px 0;position:sticky;top:0;height:100vh;overflow-y:auto;border-right:1px solid var(--m-border);}
.brand{display:flex;align-items:center;gap:9px;padding:0 18px 18px;font-weight:700;letter-spacing:.02em;color:#fff;font-size:16px;text-decoration:none;}
.brand i{width:26px;height:26px;border-radius:7px;background:linear-gradient(135deg,#14b8a6,#0e7490);display:inline-block;box-shadow:0 0 14px rgba(20,184,166,.4);}
.side h6{margin:16px 18px 6px;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:#5b6472;}
.side a.nav{display:flex;justify-content:space-between;align-items:center;padding:8px 18px;color:var(--m-side-ink);text-decoration:none;font-size:13.5px;border-left:3px solid transparent;}
.side a.nav:hover{background:var(--m-surface-2);color:#fff;}
.side a.nav.on{border-left-color:var(--m-side-active);color:#fff;background:rgba(20,184,166,.10);}
.side .count{background:var(--m-danger);color:#1a0605;border-radius:999px;font-size:11px;font-weight:700;padding:0 7px;}
.side .who{margin-top:24px;padding:14px 18px;border-top:1px solid var(--m-border);font-size:12.5px;color:var(--m-muted);}
.side .who button{background:none;border:0;color:var(--m-muted);padding:0;cursor:pointer;font-size:12.5px;}
.side .who button:hover{color:#fff;text-decoration:underline;}
.main{flex:1;min-width:0;padding:24px 28px 60px;}
.topbar{display:none;}

.admin-toolbar{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:18px;}
.admin-toolbar h1{margin:0 0 4px;font-size:22px;}
.admin-toolbar p{margin:0;color:var(--m-muted);max-width:760px;}
.admin-toolbar > div:last-child{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}

.button{display:inline-flex;align-items:center;gap:6px;background:var(--m-accent);color:var(--m-accent-ink);border:1px solid var(--m-accent);border-radius:9px;padding:8px 15px;font-size:13.5px;font-weight:600;font-family:inherit;text-decoration:none;cursor:pointer;}
.button:hover{background:#19cdbb;}
.button-ghost{background:transparent;color:var(--m-muted);border-color:var(--m-border);}
.button-ghost:hover{background:var(--m-surface-2);color:var(--m-text);}
.button-danger{background:transparent;border-color:var(--m-danger);color:var(--m-danger);}
.button-danger:hover{background:rgba(248,81,73,.12);}
.button-sm{padding:5px 11px;font-size:12.5px;}

.alert{border-radius:9px;padding:10px 14px;margin-bottom:14px;font-size:13.5px;}
.alert-success{background:rgba(63,185,80,.12);border:1px solid rgba(63,185,80,.35);color:#9be8a6;}
.alert-error{background:rgba(248,81,73,.12);border:1px solid rgba(248,81,73,.35);color:#ffb3ae;}

.admin-table-wrap{background:var(--m-surface);border:1px solid var(--m-border);border-radius:var(--m-radius);overflow-x:auto;}
.admin-table{width:100%;border-collapse:collapse;font-size:13.5px;}
.admin-table th{text-align:left;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--m-muted);padding:11px 12px;border-bottom:1px solid var(--m-border);background:var(--m-surface-2);white-space:nowrap;}
.admin-table td{padding:11px 12px;border-bottom:1px solid var(--m-border);vertical-align:top;}
.admin-table tr:last-child td{border-bottom:0;}
.action-link{color:var(--m-blue);text-decoration:none;font-weight:600;}
.action-link:hover{text-decoration:underline;}
.badge{display:inline-block;background:var(--m-surface-2);color:var(--m-muted);border-radius:999px;padding:2px 9px;font-size:11.5px;font-weight:600;white-space:nowrap;}
.badge-open{background:rgba(248,81,73,.16);color:#ffb3ae;} .badge-in_progress{background:rgba(245,165,36,.16);color:#f5c877;}
.badge-waiting_customer{background:rgba(88,166,255,.16);color:#a9cbff;} .badge-resolved,.badge-closed{background:rgba(63,185,80,.16);color:#9be8a6;}
.prio{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;}
.prio-critical{color:#ff6b63;} .prio-high{color:#f85149;} .prio-medium{color:#f5a524;} .prio-low{color:#8b94a7;}

.form-card{background:var(--m-surface);border:1px solid var(--m-border);border-radius:var(--m-radius);padding:16px 20px;margin-bottom:16px;}
.form-card h3{margin:0 0 12px;font-size:15px;}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px 16px;margin-bottom:10px;}
label{display:block;font-size:12.5px;font-weight:600;margin-bottom:4px;}
input[type=text],input[type=email],input[type=number],input[type=password],input[type=date],input[type=datetime-local],input[type=search],select,textarea{
  width:100%;border:1px solid var(--m-border);border-radius:9px;padding:8px 11px;font:inherit;background:var(--m-surface-2);color:var(--m-text);}
textarea{resize:vertical;}
input::placeholder,textarea::placeholder{color:#5b6472;}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--m-accent);}
.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;margin-bottom:14px;}
.filters select,.filters input{width:auto;min-width:140px;}
.muted{color:var(--m-muted);}
.pager{margin-top:14px;display:flex;gap:6px;flex-wrap:wrap;}
.pager a,.pager span{padding:5px 10px;border:1px solid var(--m-border);border-radius:7px;background:var(--m-surface);color:var(--m-text);text-decoration:none;font-size:13px;}
.pager .on{background:var(--m-accent);color:var(--m-accent-ink);border-color:var(--m-accent);}

@media (max-width:860px){
  .shell{display:block;background:var(--m-bg);}
  .side{position:static;width:auto;height:auto;padding:10px 0;display:none;border-right:0;border-bottom:1px solid var(--m-border);}
  .side.open{display:block;}
  .topbar{display:flex;justify-content:space-between;align-items:center;background:var(--m-side);padding:10px 16px;border-bottom:1px solid var(--m-border);}
  .topbar a{color:#fff;font-weight:700;text-decoration:none;}
  .topbar button{background:none;border:1px solid var(--m-border);color:#fff;border-radius:6px;padding:4px 10px;}
  .main{padding:16px;}
}
.filters input[type=checkbox]{min-width:0;width:auto;}
.theme-toggle{background:transparent;border:1px solid var(--m-border);color:var(--m-side-ink);width:30px;height:30px;border-radius:7px;cursor:pointer;font-size:15px;line-height:1;display:inline-flex;align-items:center;justify-content:center;}
.theme-toggle:hover{color:#fff;background:rgba(255,255,255,.06);}