:root {
    color-scheme: dark;
    --bg: #06111e;
    --surface: #0e1d30;
    --surface-2: #10243b;
    --border: rgba(151, 184, 216, .15);
    --text: #eef6ff;
    --muted: #8fa7bf;
    --primary: #278fff;
    --primary-2: #54c8ff;
    --success: #42d89b;
    --danger: #ff7181;
    --shadow: 0 25px 70px rgba(0,0,0,.28);
}

html[data-theme="light"] {
    color-scheme: light;
    --bg: #eef4f9;
    --surface: #ffffff;
    --surface-2: #f5f8fb;
    --border: rgba(25, 55, 85, .12);
    --text: #17314a;
    --muted: #6f8498;
    --primary: #2588ed;
    --primary-2: #4db7eb;
    --success: #24ad76;
    --danger: #df5d6d;
    --shadow: 0 24px 60px rgba(29, 61, 91, .12);
}

* { box-sizing: border-box; }
html { font-family: Tahoma, Arial, sans-serif; }
body {
    margin: 0;
    color: var(--text);
    background:
        radial-gradient(circle at 85% 5%, rgba(39,143,255,.12), transparent 30%),
        linear-gradient(135deg, var(--bg), #081523);
    min-height: 100vh;
}
html[data-theme="light"] body {
    background:
        radial-gradient(circle at 85% 5%, rgba(39,143,255,.09), transparent 30%),
        linear-gradient(135deg, #f6f9fc, #eaf1f7);
}
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }

.app-shell { display: grid; grid-template-columns: 260px minmax(0,1fr); min-height: 100vh; }
.sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    padding: 22px 18px;
    background: rgba(9,22,37,.94);
    border-left: 1px solid var(--border);
    display: flex;
    flex-direction: column;
}
html[data-theme="light"] .sidebar { background: rgba(255,255,255,.94); }
.sidebar-brand { display:flex; align-items:center; gap:12px; margin-bottom:28px; }
.sidebar-brand span { display:block; margin-top:4px; color:var(--muted); font-size:12px; }
.brand-badge { width:42px; height:42px; border-radius:14px; display:grid; place-items:center; background:linear-gradient(135deg,var(--primary),var(--primary-2)); font-weight:800; }
.sidebar nav { display:grid; gap:8px; }
.sidebar nav a, .account-link, .logout-link, .theme-toggle {
    min-height:46px; padding:0 14px; border-radius:13px; display:flex; align-items:center; gap:12px;
    color:#b9d6ec; border:1px solid transparent; background:transparent;
}
html[data-theme="light"] .sidebar nav a,
html[data-theme="light"] .account-link,
html[data-theme="light"] .logout-link,
html[data-theme="light"] .theme-toggle { color:#4e6b83; }
.sidebar nav a:hover, .sidebar nav a.active { background:rgba(39,143,255,.09); border-color:rgba(39,143,255,.13); }
.sidebar nav .disabled { opacity:.55; pointer-events:none; }
.sidebar nav small { margin-right:auto; color:var(--muted); }
.theme-toggle { width:100%; margin-top:auto; border-color:var(--border); }
.account-link { margin-top:8px; background:rgba(39,143,255,.05); }
.logout-link { margin-top:8px; color:#ffadb7; }

.main-content { padding:32px; min-width:0; }
.page-header { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:24px; }
.page-header h1 { margin:0; }
.eyebrow { margin:0 0 7px; color:var(--primary-2); font-size:13px; font-weight:700; }
.muted { color:var(--muted); }
.panel-card {
    padding:24px;
    border:1px solid var(--border);
    border-radius:22px;
    background:rgba(14,29,48,.92);
    box-shadow:var(--shadow);
}
html[data-theme="light"] .panel-card { background:rgba(255,255,255,.94); }
.stats-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-bottom:18px; }
.stat-card { padding:20px; border:1px solid var(--border); border-radius:18px; background:var(--surface); }
.stat-card strong { display:block; margin-top:7px; font-size:28px; }
.button-link, button[type="submit"], .small-button {
    border:0; border-radius:13px; color:white; font-weight:700;
    background:linear-gradient(135deg,var(--primary),var(--primary-2));
    box-shadow:0 12px 28px rgba(39,143,255,.22);
}
.button-link { display:inline-flex; min-height:46px; padding:0 18px; align-items:center; justify-content:center; gap:9px; }
.small-button { padding:10px 14px; width:auto; }
.secondary-link { display:inline-flex; min-height:42px; padding:0 15px; align-items:center; border:1px solid var(--border); border-radius:12px; color:var(--muted); }
.alert { margin-bottom:18px; padding:14px 16px; border-radius:14px; line-height:1.9; }
.alert-error { color:#ffbdc5; background:rgba(255,113,129,.1); border:1px solid rgba(255,113,129,.25); }
.alert-success { color:#baf7dc; background:rgba(66,216,155,.1); border:1px solid rgba(66,216,155,.28); }

.filters { display:grid; grid-template-columns:minmax(0,1fr) 170px 130px; gap:12px; }
input, select, textarea {
    width:100%; min-height:50px; padding:13px 14px; border:1px solid #28415d;
    border-radius:13px; background:#081522; color:white; outline:none;
}
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea { background:white; color:var(--text); border-color:#cad7e3; }
input:focus, select:focus, textarea:focus { border-color:var(--primary); box-shadow:0 0 0 4px rgba(39,143,255,.12); }
textarea { min-height:120px; resize:vertical; }
label { display:block; margin-bottom:8px; color:#c9d8e8; }
html[data-theme="light"] label { color:#36536d; }
.field small { display:block; margin-top:7px; color:var(--muted); line-height:1.7; }

.table-card { margin-top:18px; padding:0; overflow:hidden; }
.table-wrap { overflow:auto; }
table { width:100%; border-collapse:collapse; min-width:850px; }
th, td { padding:17px 18px; text-align:right; border-bottom:1px solid var(--border); }
th { color:#a9c7df; background:rgba(39,143,255,.05); font-size:13px; }
html[data-theme="light"] th { color:#58738c; }
tr:last-child td { border-bottom:0; }
.customer-row:hover { background:rgba(84,200,255,.035); }
.row-actions { display:flex; gap:8px; }
.row-actions a {
    min-width:76px; min-height:38px; padding:0 12px; display:inline-flex; align-items:center; justify-content:center;
    border-radius:11px; font-size:12px; font-weight:700; border:1px solid transparent;
}
.action-view { color:#bfe6ff; background:rgba(39,143,255,.12); border-color:rgba(39,143,255,.22)!important; }
.action-edit { color:#c8f5df; background:rgba(66,216,155,.10); border-color:rgba(66,216,155,.18)!important; }

.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.span-2 { grid-column:span 2; }
.stack-form { display:grid; gap:18px; }
.section-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:20px; }
.section-heading h2 { margin:0; }
.repeat-list { display:grid; gap:12px; }
.repeat-row { display:grid; gap:12px; padding:15px; border:1px solid var(--border); border-radius:16px; background:rgba(255,255,255,.025); }
.medication-row { grid-template-columns:1fr .8fr 1.2fr 1fr auto; align-items:end; }
.relation-row { grid-template-columns:1.4fr 1fr auto; align-items:end; }
.remove-row { width:auto; min-height:45px; padding:0 14px; border:0; border-radius:11px; background:rgba(255,113,129,.12); color:#ffb2bb; }
.form-actions { display:flex; align-items:center; gap:12px; }
.form-actions button { width:auto; min-width:160px; min-height:46px; padding:0 18px; }
.checkbox-field label { min-height:50px; margin:0; padding:0 14px; display:flex; align-items:center; gap:10px; border:1px solid #28415d; border-radius:13px; background:#081522; }
.checkbox-field input { width:auto; min-height:auto; }
.is-hidden { display:none!important; }

.profile-table, .medication-table { min-width:760px; border:1px solid var(--border); border-radius:16px; overflow:hidden; }
.profile-table th { width:170px; white-space:nowrap; background:rgba(39,143,255,.06); }
.cards-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }
.mini-card { padding:17px; border:1px solid var(--border); border-radius:15px; background:rgba(255,255,255,.025); }

.login-page { display:grid; place-items:center; min-height:100vh; padding:24px; }
.login-card { width:min(480px,100%); }
.login-card button { width:100%; min-height:50px; margin-top:18px; }
.login-theme-toggle { position:fixed; top:18px; left:18px; width:auto; margin:0; border:1px solid var(--border); }

.permission-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.permission-choice { padding:16px; border:1px solid var(--border); border-radius:15px; background:rgba(255,255,255,.025); display:flex; gap:10px; }
.permission-choice input { width:auto; min-height:auto; }
.permissions-disabled { opacity:.6; }

@media (max-width: 900px) {
    .app-shell { grid-template-columns:1fr; }
    .sidebar { position:static; height:auto; }
    .main-content { padding:20px; }
    .stats-grid, .cards-list { grid-template-columns:1fr; }
    .medication-row, .relation-row { grid-template-columns:1fr 1fr; }
}
@media (max-width: 650px) {
    .page-header, .section-heading { flex-direction:column; align-items:stretch; }
    .filters, .form-grid, .permission-grid, .medication-row, .relation-row { grid-template-columns:1fr; }
    .span-2 { grid-column:auto; }
}