:root{
--primary:#4361ee; --primary-dark:#3f37c9; --accent:#4cc9f0; --danger:#f72585;
--bg:#f8fafc; --card:#ffffff; --text:#0f172a; --muted:#6c757d; --radius:16px;
--shadow: 0 10px 30px rgba(67,97,238,.12);
}
html,body{height:100%}
body{font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial; background:var(--bg); color:var(--text)}


.app-shell{display:flex; min-height:100vh}
.sidebar{width:280px; background:#0f172a; color:#e2e8f0; position:sticky; top:0; height:100vh}
.sidebar .brand{display:flex; gap:.75rem; align-items:center; padding:18px 20px; border-bottom:1px solid rgba(255,255,255,.08)}
.sidebar .brand img{height:36px}
.sidebar .menu a{display:flex; gap:.75rem; align-items:center; padding:12px 20px; text-decoration:none; color:#e2e8f0; border-left:3px solid transparent}
.sidebar .menu a:hover{background:rgba(255,255,255,.06)}
.sidebar .menu a.active{background:rgba(67,97,238,.15); border-left-color:var(--accent)}


.content{flex:1; min-width:0}
.topbar{display:flex; align-items:center; justify-content:space-between; padding:14px 20px; background:#ffffff; box-shadow:var(--shadow); position:sticky; top:0; z-index:10}
.container-page{padding:20px;}
.card{background:var(--card); border:none; border-radius:var(--radius); box-shadow:var(--shadow)}
.card h5{margin:0 0 .25rem 0}
.kpi{display:grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap:16px}
.btn-primary{background:var(--primary); border-color:var(--primary)}
.btn-primary:hover{background:var(--primary-dark); border-color:var(--primary-dark)}
.table thead th{background:#eef2ff}
.badge-active{background:#10b981}
.badge-inactive{background:#f97316}


.login-wrapper{min-height:100vh; display:grid; place-items:center; background:linear-gradient(120deg, #ffffff, #eef2ff)}
.login-card{width:min(420px,92%); padding:28px; border-radius:20px; background:#fff; box-shadow:var(--shadow)}
.logo-big{height:56px}

/* Icon-only buttons */
.icon-btn{
  width: 34px; height: 34px;
  display:inline-flex; align-items:center; justify-content:center;
  padding:0; border-radius:10px;
}
.icon-btn i{ pointer-events:none; font-size:14px; }