/* Admin Panel — app shell */
*, *::before, *::after{ box-sizing:border-box; }
:root{
  --a-ink:#16302E; --a-accent:#2F6F62; --a-cta:#E08E45;
  --a-bg:#F5F6F4; --a-white:#fff; --a-line:#E3E6E1; --a-muted:#63706A;
  --a-danger:#C0392B; --a-radius:12px;
  --font-body:'Inter',sans-serif; --font-display:'Fraunces',serif; --font-mono:'IBM Plex Mono',monospace;
}
body{ margin:0; font-family:var(--font-body); background:var(--a-bg); color:var(--a-ink); }
a{ color:var(--a-accent); }
h1,h2,h3{ font-family:var(--font-display); margin:0 0 .4em; }
.admin-shell{ display:flex; min-height:100vh; }

/* Sidebar */
.admin-sidebar{ width:250px; flex-shrink:0; background:var(--a-ink); color:#fff; display:flex; flex-direction:column; padding:22px 16px; position:sticky; top:0; height:100vh; }
.admin-brand{ display:flex; align-items:center; gap:.6rem; font-family:var(--font-display); font-weight:600; font-size:1.1rem; padding:0 8px 20px; border-bottom:1px solid rgba(255,255,255,.12); margin-bottom:14px; }
.admin-nav{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; flex:1; }
.admin-nav a{ display:flex; align-items:center; gap:.65rem; color:rgba(255,255,255,.78); text-decoration:none; padding:.65em .8em; border-radius:9px; font-size:.94rem; font-weight:500; }
.admin-nav a:hover{ background:rgba(255,255,255,.08); color:#fff; }
.admin-nav a.is-active{ background:var(--a-accent); color:#fff; }
.admin-nav .nav-section{ font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; color:rgba(255,255,255,.4); padding:14px 8px 4px; }
.admin-sidebar__footer{ border-top:1px solid rgba(255,255,255,.12); padding-top:14px; margin-top:10px; font-size:.85rem; color:rgba(255,255,255,.6); }

/* Main area */
.admin-main{ flex:1; min-width:0; }
.admin-topbar{ display:flex; align-items:center; justify-content:space-between; padding:16px 28px; background:var(--a-white); border-bottom:1px solid var(--a-line); }
.admin-topbar .who{ font-size:.9rem; color:var(--a-muted); }
.admin-topbar .role-badge{ font-family:var(--font-mono); font-size:.72rem; text-transform:uppercase; background:color-mix(in srgb, var(--a-accent) 14%, white); color:var(--a-accent); padding:.25em .6em; border-radius:999px; margin-left:.5em; }
.admin-content{ padding:28px; max-width:1200px; }

/* Cards / panels */
.panel{ background:var(--a-white); border:1px solid var(--a-line); border-radius:var(--a-radius); padding:24px; margin-bottom:22px; }
.panel-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; gap:1rem; flex-wrap:wrap; }
.panel-head p{ color:var(--a-muted); margin:.2em 0 0; }

.stat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:22px; }
.stat-card{ background:var(--a-white); border:1px solid var(--a-line); border-radius:var(--a-radius); padding:18px 20px; }
.stat-card .num{ font-family:var(--font-display); font-size:1.9rem; font-weight:600; }
.stat-card .label{ color:var(--a-muted); font-size:.85rem; }

/* Forms */
.field{ margin-bottom:1rem; }
.field label{ display:block; font-weight:600; font-size:.88rem; margin-bottom:.35rem; }
.field input, .field select, .field textarea{
  width:100%; padding:.65em .85em; border-radius:9px; border:1.5px solid var(--a-line);
  font-family:var(--font-body); font-size:.95rem; background:#fff; color:var(--a-ink);
}
.field input:focus, .field select:focus, .field textarea:focus{ outline:none; border-color:var(--a-accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--a-accent) 18%, transparent); }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.field-row--3{ grid-template-columns:1fr 1fr 1fr; }
.hint{ font-size:.8rem; color:var(--a-muted); margin-top:.3rem; }
input[type=color]{ padding:.2em; height:42px; }

.btn{ display:inline-flex; align-items:center; gap:.5em; padding:.65em 1.3em; border-radius:9px; font-weight:600; font-size:.9rem; border:1.5px solid transparent; cursor:pointer; }
.btn--primary{ background:var(--a-accent); color:#fff; }
.btn--dark{ background:var(--a-ink); color:#fff; }
.btn--outline{ background:transparent; border-color:var(--a-line); color:var(--a-ink); }
.btn--danger{ background:#FBE9E7; color:var(--a-danger); border-color:#F0C6BF; }
.btn--sm{ padding:.4em .9em; font-size:.82rem; }
.btn[disabled]{ opacity:.5; cursor:not-allowed; }

/* Table */
.table-wrap{ overflow-x:auto; }
table.data-table{ width:100%; border-collapse:collapse; font-size:.9rem; }
.data-table th, .data-table td{ text-align:left; padding:.75em .8em; border-bottom:1px solid var(--a-line); white-space:nowrap; }
.data-table th{ color:var(--a-muted); font-weight:600; font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; }
.data-table tr:hover td{ background:#FAFAF8; }

.badge{ display:inline-block; padding:.25em .7em; border-radius:999px; font-size:.75rem; font-weight:600; text-transform:capitalize; }
.badge--pending{ background:#FFF3E0; color:#9A5B10; }
.badge--confirmed{ background:#E4F1E9; color:#1C5E3C; }
.badge--completed{ background:#E7ECFB; color:#2B3E8F; }
.badge--cancelled{ background:#FBE9E7; color:#9C3A2E; }
.badge--super_admin{ background:#F1E7FB; color:#5A2E9C; }
.badge--admin{ background:#E4F1E9; color:#1C5E3C; }
.badge--doctor{ background:#E7ECFB; color:#2B3E8F; }

.alert{ padding:.9em 1.1em; border-radius:9px; margin-bottom:1.1rem; font-size:.9rem; }
.alert--success{ background:#E4F1E9; color:#1C5E3C; border:1px solid #BEE0CB; }
.alert--error{ background:#FBE9E7; color:#9C3A2E; border:1px solid #F0C6BF; }

.theme-swatch{ display:inline-block; width:20px; height:20px; border-radius:6px; vertical-align:middle; border:1px solid rgba(0,0,0,.1); }

@media (max-width: 900px){
  .admin-shell{ flex-direction:column; }
  .admin-sidebar{ width:100%; height:auto; position:relative; flex-direction:row; overflow-x:auto; }
  .admin-nav{ flex-direction:row; }
  .admin-brand, .admin-sidebar__footer{ display:none; }
  .stat-grid{ grid-template-columns:1fr 1fr; }
  .field-row, .field-row--3{ grid-template-columns:1fr; }
}

/* Login page */
.login-wrap{ min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(160deg, var(--a-ink), var(--a-accent)); padding:20px; }
.login-card{ background:#fff; border-radius:16px; padding:40px; width:100%; max-width:400px; box-shadow:0 30px 60px -20px rgba(0,0,0,.4); }
.login-card h1{ font-size:1.5rem; }
.login-card .eyebrow{ font-family:var(--font-mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.1em; color:var(--a-accent); font-weight:600; }
