
:root{
  --bg:#f6f8fd;
  --panel:#ffffff;
  --text:#0b1020;
  --muted:#5d6575;
  --brand:#1a73e8;
  --brand-2:#0b57d0;
  --ok:#188038;
  --warn:#b06000;
  --bad:#c5221f;
  --border:#e8ecf6;
  --chip:#f1f4fb;
}
.theme-dark:root{
  --bg: #0b1020;
  --panel:#0f1530;
  --text:#e8ebf6;
  --muted:#9aa3b2;
  --brand:#1a73e8;
  --brand-2:#0b57d0;
  --ok:#34a853;
  --warn:#fbbc05;
  --bad:#ea4335;
  --border: #202744;
  --chip:#1b2242;
}

/* AdConsole (AdSense-inspired) */
:root{
  --bg: #0b1020;
  --panel:#0f1530;
  --text:#e8ebf6;
  --muted:#9aa3b2;
  --brand:#1a73e8;
  --brand-2:#0b57d0;
  --ok:#34a853;
  --warn:#fbbc05;
  --bad:#ea4335;
  --border: #202744;
  --chip:#1b2242;
}
:root.theme-dark{}
html,body{height:100%}
body.admc-body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Roboto,system-ui,-apple-system,Segoe UI,Arial,sans-serif;}

.admc-app{display:flex;min-height:100vh}
.admc-sidebar{width:260px;min-width:260px;background:var(--panel);border-inline-end:1px solid var(--border);position:sticky;top:0;height:100vh}
.sidebar-collapsed .admc-sidebar{width:88px;min-width:88px}
.admc-logo{display:flex;gap:10px;align-items:center;padding:16px;border-bottom:1px solid var(--border)}
.logo-mark{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,var(--brand),var(--brand-2));display:grid;place-items:center;font-weight:700}
.logo-text{font-weight:700;letter-spacing:.3px}

.admc-nav{padding:10px}
.admc-nav .nav-section{color:var(--muted);font-size:12px;margin:14px 10px 6px}
.nav-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;color:var(--text);text-decoration:none}
.nav-item:hover{background:#141b3a}
.nav-item.active{background:#17224a;outline:1px solid #1e2b57}
.mi{font-family:'Material Symbols Outlined';font-variation-settings:'wght' 400,'FILL' 0,'GRAD' 0,'opsz' 24;}

.sidebar-collapsed .nav-item span:last-child{display:none}

.admc-main{flex:1;display:flex;flex-direction:column}
.admc-topbar{height:60px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid var(--border);background:rgba(10,14,30,.7);backdrop-filter: blur(6px);position:sticky;top:0;z-index:5}
.icon-btn{background:transparent;border:1px solid var(--border);color:var(--text);border-radius:10px;padding:6px 8px;cursor:pointer}
.admc-top-actions{display:flex;align-items:center;gap:12px}
.user-chip{display:flex;align-items:center;gap:10px;background:var(--chip);border:1px solid var(--border);padding:6px 10px;border-radius:12px}
.user-chip .avatar{width:28px;height:28px;border-radius:8px;background:#26305b;display:grid;place-items:center;font-weight:700}

.admc-content{padding:18px;max-width:1400px;margin:0 auto;width:100%}
.admc-footer{display:flex;justify-content:space-between;align-items:center;padding:16px;border-top:1px solid var(--border);color:var(--muted)}

.grid{display:grid;gap:14px}
.grid.kpi{grid-template-columns:repeat(4,1fr)}
@media (max-width:1200px){.grid.kpi{grid-template-columns:repeat(2,1fr)}}
@media (max-width:700px){.grid.kpi{grid-template-columns:1fr}}

.card{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:14px}
.card .card-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-weight:600}
.kpi{display:flex;flex-direction:column;gap:4px}
.kpi .value{font-size:22px;font-weight:700}
.kpi .delta.up{color:var(--ok)} .kpi .delta.down{color:var(--bad)}
.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.select, .input, .btn{background:#111733;border:1px solid var(--border);color:var(--text);border-radius:10px;padding:8px 12px}
.btn{cursor:pointer}
.btn.primary{background:linear-gradient(135deg,var(--brand),var(--brand-2));border:0}

.table{width:100%;border-collapse:separate;border-spacing:0 8px}
.table th{color:var(--muted);text-align:start;font-weight:600;padding:10px 12px}
.table td{background:var(--panel);border:1px solid var(--border);border-left:none;border-right:none;padding:12px}
.table tr{border-radius:12px;overflow:hidden}
.badge{border:1px solid var(--border);padding:4px 8px;border-radius:999px;font-size:12px;color:var(--muted)}
.filter-chip{display:inline-flex;align-items:center;gap:6px;background:#121a39;border:1px solid var(--border);padding:6px 10px;border-radius:999px;font-size:12px}
.empty{color:var(--muted);text-align:center;padding:24px}
