:root{--pine:#0f3d3e;--pine-deep:#0a2b2c;--saffron:#e08a2b;--cream:#f4f1ea;--ink:#1c2321;--muted:#5c6b68;--line:#e3ddce;}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--cream);color:var(--ink)}
a{text-decoration:none;color:inherit}

/* Login */
.login-body{min-height:100vh;display:grid;place-items:center;background:radial-gradient(120% 90% at 80% 10%,#2a6f70,#0f3d3e 55%,#08201f)}
.login-card{background:#fff;width:100%;max-width:360px;border-radius:18px;padding:34px 30px;box-shadow:0 20px 50px rgba(0,0,0,.3);text-align:center}
.login-logo{width:56px;height:56px;border-radius:14px;background:linear-gradient(150deg,var(--pine),var(--saffron));color:#fff;display:grid;place-items:center;font-size:1.6rem;font-weight:700;margin:0 auto 14px}
.login-card h1{font-size:1.3rem}
.login-card .muted{color:var(--muted);font-size:.9rem;margin-bottom:18px}
.login-card .small{font-size:.8rem;margin-top:16px;margin-bottom:0}
.login-card label{display:block;text-align:left;font-size:13px;font-weight:600;color:var(--muted);margin:10px 0 5px}
.login-card input{width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:10px;font-size:15px}
.abtn{margin-top:16px;width:100%;background:var(--saffron);color:#fff;border:none;padding:12px;border-radius:10px;font-weight:600;font-size:15px;cursor:pointer}
.abtn:hover{background:#c9772f}
.err{background:#fde8e6;color:#c0392b;border-radius:8px;padding:9px;font-size:13.5px;margin-bottom:8px}

/* Layout */
.admin-wrap{display:flex;min-height:100vh}
.sidebar{width:240px;background:var(--pine-deep);color:#cfe0dd;flex-shrink:0;position:sticky;top:0;height:100vh;display:flex;flex-direction:column}
.brand{display:flex;align-items:center;gap:10px;padding:20px 20px;border-bottom:1px solid rgba(255,255,255,.1)}
.brand .mk{width:34px;height:34px;border-radius:9px;background:linear-gradient(150deg,var(--pine),var(--saffron));display:grid;place-items:center;color:#fff;font-weight:700}
.brand b{font-size:1rem;color:#fff}
.sidebar nav{display:flex;flex-direction:column;padding:12px 10px;gap:2px}
.sidebar nav a{padding:11px 14px;border-radius:9px;font-size:14.5px;font-weight:500;color:#cfe0dd;transition:background .15s}
.sidebar nav a:hover{background:rgba(255,255,255,.07)}
.sidebar nav a.on{background:var(--saffron);color:#fff}
.sidebar nav a.logout{margin-top:14px;color:#f4b860}
.content{flex:1;min-width:0}
.topbar-admin{background:#fff;border-bottom:1px solid var(--line);padding:18px 28px;position:sticky;top:0;z-index:5}
.topbar-admin h1{font-size:1.3rem}
.pad{padding:26px 28px}

/* Cards / stats */
.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:26px}
.mini{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px}
.mini b{font-size:2rem;display:block;color:var(--pine)}
.mini span{color:var(--muted);font-size:.88rem}
.panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px;margin-bottom:22px}
.panel h2{font-size:1.1rem;margin-bottom:14px}

/* Tables */
table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
th,td{text-align:left;padding:11px 13px;border-bottom:1px solid #eee;font-size:13.5px;vertical-align:top}
th{background:var(--pine);color:#fff;font-weight:600;white-space:nowrap}
tr:hover td{background:#faf8f2}
td.actions{white-space:nowrap}
.badge{display:inline-block;padding:3px 9px;border-radius:20px;font-size:11.5px;font-weight:600}
.badge.new{background:#fdecd2;color:#a5641a}
.badge.done{background:#d8ede2;color:#1c6b46}
.badge.off{background:#eee;color:#888}
.badge.on{background:#d8ede2;color:#1c6b46}

/* Buttons */
.btn2{display:inline-block;background:var(--saffron);color:#fff;border:none;padding:9px 16px;border-radius:8px;font-weight:600;font-size:13.5px;cursor:pointer}
.btn2:hover{background:#c9772f}
.btn2.ghost{background:#fff;color:var(--pine);border:1px solid var(--pine)}
.btn2.ghost:hover{background:var(--pine);color:#fff}
.btn2.sm{padding:6px 11px;font-size:12.5px}
.btn2.del{background:#fff;color:#c0392b;border:1px solid #e3b4ae}
.btn2.del:hover{background:#c0392b;color:#fff}
.rowbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;gap:10px;flex-wrap:wrap}

/* Forms */
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fld{margin-bottom:15px}
.fld.full{grid-column:1/-1}
.fld label{display:block;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:5px}
.fld input,.fld select,.fld textarea{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:9px;font-size:14px;font-family:inherit;background:#fff}
.fld textarea{resize:vertical;min-height:90px}
.fld .hint{font-size:12px;color:var(--muted);margin-top:4px}
.ok{background:#d8ede2;color:#1c6b46;border-radius:9px;padding:11px 14px;margin-bottom:18px;font-weight:600;font-size:14px}
.muted{color:var(--muted)}

@media(max-width:820px){
 .sidebar{width:64px}.brand b{display:none}.sidebar nav a{font-size:0;text-align:center;padding:12px 0}
 .stat-row{grid-template-columns:1fr 1fr}.fgrid{grid-template-columns:1fr}
 table{display:block;overflow-x:auto;white-space:nowrap}
}
