:root{
  --bg:#f4f6fb;
  --card:#ffffff;
  --text:#172033;
  --muted:#64748b;
  --border:#e2e8f0;
  --soft:#f8fafc;
  --primary:#1d4ed8;
  --primary2:#2563eb;
  --primary-soft:#dbeafe;
  --danger:#b91c1c;
  --danger-soft:#fee2e2;
  --ok:#047857;
  --ok-soft:#dcfce7;
  --warning:#b45309;
  --warning-soft:#fef3c7;
  --dark:#0f172a;
}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text);line-height:1.55}
a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}
.topbar{background:var(--dark);color:white;padding:14px 24px;display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;box-shadow:0 6px 24px rgba(15,23,42,.16)}
.brand-wrap{display:flex;align-items:center;gap:12px;min-width:260px}.brand-mark{width:42px;height:42px;border-radius:14px;background:#1d4ed8;color:white;display:grid;place-items:center;font-weight:800;letter-spacing:.5px}.brand a{color:white;text-decoration:none;font-size:20px;font-weight:800}.brand-subtitle{font-size:12px;color:#cbd5e1;margin-top:1px}.main-nav{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.main-nav a{color:#dbeafe;text-decoration:none;font-size:14px;padding:8px 10px;border-radius:10px}.main-nav a:hover,.main-nav a.active{background:rgba(255,255,255,.12);color:white}
.container{max-width:1200px;margin:24px auto;padding:0 18px}.userbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:14px;color:var(--muted);margin-bottom:16px}.role-pill{display:inline-block;border-radius:999px;padding:3px 10px;background:var(--primary-soft);color:#1e3a8a;font-weight:700;font-size:12px}
h1{font-size:30px;margin:0 0 8px}h2{font-size:22px;margin:24px 0 12px}h3{font-size:18px;margin:0 0 8px}.muted{color:var(--muted)}.small{font-size:13px}.page-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;flex-wrap:wrap;margin-bottom:18px}.page-kicker{text-transform:uppercase;letter-spacing:.08em;font-weight:800;color:var(--primary);font-size:12px;margin-bottom:4px}.page-actions{display:flex;gap:8px;flex-wrap:wrap}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}.admin-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin-top:16px}.two-col{display:grid;grid-template-columns:minmax(320px,420px) 1fr;gap:18px;align-items:start}.card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:18px;box-shadow:0 1px 2px rgba(15,23,42,.04)}.card h2,.card h3{margin-top:0}.admin-card{position:relative;overflow:hidden}.admin-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--primary)}.metric-card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:16px;display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.metric-value{font-size:30px;font-weight:800;color:var(--primary);line-height:1}.metric-label{font-weight:800}.metric-note{font-size:13px;color:var(--muted);margin-top:4px}.icon-badge{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:var(--primary-soft);color:#1e3a8a;font-weight:900}
.btn{display:inline-block;background:var(--primary);color:white!important;text-decoration:none;border:0;border-radius:12px;padding:10px 14px;cursor:pointer;font-weight:700;font-size:14px}.btn:hover{background:var(--primary2);text-decoration:none}.btn.secondary{background:#475569}.btn.light{background:#e2e8f0;color:#0f172a!important}.btn.danger{background:var(--danger)}.btn.ok{background:var(--ok)}.btn.smallbtn{font-size:13px;padding:7px 10px;border-radius:10px}
input,select,textarea{width:100%;padding:11px 12px;border:1px solid var(--border);border-radius:12px;background:white;font:inherit}input:focus,select:focus,textarea:focus{outline:3px solid var(--primary-soft);border-color:#93c5fd}label{font-weight:700;display:block;margin:11px 0 6px}.checkline{display:flex;gap:8px;align-items:center;margin:12px 0}.checkline input{width:auto}.form-row{margin-bottom:12px}.helptext{font-size:13px;color:var(--muted);margin-top:5px}.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:16px;background:white}.table{width:100%;border-collapse:collapse;background:white}.table th,.table td{border-bottom:1px solid var(--border);padding:12px;text-align:left;vertical-align:top}.table tr:last-child td{border-bottom:0}.table th{background:#f1f5f9;font-size:13px;color:#334155;text-transform:uppercase;letter-spacing:.03em}.table td{font-size:14px}.badge{display:inline-block;border-radius:999px;padding:3px 9px;background:#e0e7ff;color:#3730a3;font-size:12px;font-weight:700}.badge.ok{background:var(--ok-soft);color:#065f46}.badge.warn{background:var(--warning-soft);color:#92400e}.alert{padding:12px 14px;border-radius:12px;margin-bottom:12px}.alert.error{background:var(--danger-soft);color:#991b1b}.alert.success{background:var(--ok-soft);color:#166534}.alert.info{background:var(--primary-soft);color:#1e3a8a}.searchbar{display:flex;gap:8px;margin:12px 0}.searchbar input{flex:1}.manual-content{background:white;border:1px solid var(--border);border-radius:18px;padding:24px}.manual-content h1,.manual-content h2,.manual-content h3{color:#111827}.footer{text-align:center;color:var(--muted);padding:28px}.login-box{max-width:430px;margin:60px auto}.actions{display:flex;gap:8px;flex-wrap:wrap}.chapter-list a,.doc-list a{font-weight:800;color:var(--primary)}.empty-state{padding:26px;border:1px dashed var(--border);border-radius:16px;background:var(--soft);color:var(--muted);text-align:center}.admin-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:18px 0}.section-title{display:flex;align-items:center;gap:10px;margin:24px 0 12px}.section-title:before{content:"";width:8px;height:24px;border-radius:99px;background:var(--primary)}
@media(max-width:850px){.two-col{grid-template-columns:1fr}.topbar{align-items:flex-start}.main-nav{width:100%}.searchbar{flex-direction:column}.table{font-size:14px}h1{font-size:26px}}

/* Role and user management update */
.role-box { margin-top: 14px; padding: 12px; border: 1px solid #dbe3ef; border-radius: 14px; background: #f8fafc; }
.role-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 12px; margin-top: 10px; }
.compact-table th { width: 160px; text-align: left; }
.user-card-list { display: grid; gap: 14px; }
.user-admin-card { padding: 16px; }
.compact-form { margin-top: 12px; padding-top: 12px; border-top: 1px solid #e5e7eb; }
.form-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: end; }
.form-bottom-align { padding-bottom: 10px; }
.password-reset-row { background: #f8fafc; padding: 12px; border-radius: 12px; border: 1px solid #e5e7eb; }
.alert.ok { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
@media (max-width: 800px) {
  .role-grid, .form-grid-2 { grid-template-columns: 1fr; }
}

/* Admin delete and password management update */
.action-cell { min-width: 150px; }
.inline-delete { display: inline-block; margin-left: 6px; }
.inline-delete button { vertical-align: middle; }
.danger-zone { background: #fff7f7; border: 1px solid #fecaca; border-radius: 12px; padding: 12px; }
.danger-zone .btn { margin-right: 8px; }
