:root { color-scheme: dark; --bg:#0a0a0b; --panel:#131315; --panel2:#1b1b1e; --line:#303035; --text:#f4f2ed; --muted:#aaa7a2; --red:#df2029; --green:#40c786; font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; min-height:100vh; background:radial-gradient(circle at 80% 0,#351014 0,transparent 28rem),var(--bg); color:var(--text); }
button,input,select,textarea { font:inherit; }
button { border:0; border-radius:.55rem; padding:.72rem 1rem; background:var(--red); color:white; font-weight:750; cursor:pointer; }
button:hover { filter:brightness(1.12); } button:disabled { opacity:.5; cursor:wait; }
.secondary { background:var(--panel2); border:1px solid var(--line); }
.link-button { padding:0; color:var(--muted); background:none; text-align:left; }
.eyebrow { color:#ef4a50; font-size:.72rem; font-weight:850; letter-spacing:.15em; text-transform:uppercase; margin:0 0 .35rem; }
.login-shell { min-height:100vh; display:grid; place-items:center; padding:2rem; }
.back-link { position:fixed; top:1.5rem; left:1.5rem; color:var(--muted); text-decoration:none; }
.login-card { width:min(100%,430px); background:rgba(19,19,21,.96); border:1px solid var(--line); border-radius:1.25rem; padding:2.2rem; box-shadow:0 2rem 5rem #0008; }
.login-card img { border-radius:50%; object-fit:cover; float:right; }
.login-card h1 { margin:.15rem 0 .4rem; font-size:2rem; }.login-card>p:not(.eyebrow) { color:var(--muted); margin-bottom:2rem; }
label { display:grid; gap:.4rem; color:var(--muted); font-size:.86rem; }
input,select,textarea { min-width:0; width:100%; padding:.7rem .75rem; color:var(--text); background:#0d0d0f; border:1px solid var(--line); border-radius:.45rem; }
input:focus,select:focus,textarea:focus { outline:2px solid #df202988; border-color:var(--red); }
.login-card label { margin:.9rem 0; }.login-card button { width:100%; margin-top:.8rem; }
.form-alert,.global-alert { color:#ffc8ca; background:#44181b; border:1px solid #843039; padding:.75rem; border-radius:.5rem; }
.app-shell { min-height:100vh; display:grid; grid-template-columns:230px 1fr; }
.sidebar { position:sticky; top:0; height:100vh; display:flex; flex-direction:column; gap:2rem; padding:1.25rem; background:#0d0d0f; border-right:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:.7rem; color:white; text-decoration:none; font-weight:900; line-height:.88; text-transform:uppercase; font-style:italic; }.brand img { border-radius:50%; object-fit:cover; }
.sidebar nav { display:grid; gap:.35rem; }.nav-item { display:flex; justify-content:space-between; background:transparent; color:var(--muted); text-align:left; }.nav-item.active { background:#2b1417; color:white; box-shadow:inset 3px 0 var(--red); }
.badge { display:inline-grid; place-items:center; min-width:1.35rem; height:1.35rem; padding:0 .3rem; background:var(--red); border-radius:2rem; font-size:.7rem; }
.sidebar-bottom { margin-top:auto; display:grid; gap:.75rem; overflow-wrap:anywhere; color:var(--muted); }
.workspace { padding:2rem clamp(1rem,3vw,3rem); min-width:0; }.topbar { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.25rem; }.topbar h1 { margin:0; font-size:clamp(1.8rem,4vw,3.2rem); text-transform:uppercase; font-style:italic; }.email-health { color:var(--muted); font-size:.82rem; }.email-health.problem { color:#ff8e92; }
.panel { display:none; }.panel.active { display:block; }.panel-intro,.panel-heading p { color:var(--muted); }.panel-heading,.toolbar { display:flex; gap:.7rem; align-items:center; justify-content:space-between; flex-wrap:wrap; margin-bottom:1rem; }
.calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(145px,1fr)); gap:.7rem; overflow-x:auto; padding-bottom:1rem; }.day-column { min-height:23rem; background:var(--panel); border:1px solid var(--line); border-radius:.8rem; padding:.7rem; }.day-column.today { border-color:var(--red); }.day-column h2 { font-size:.8rem; text-transform:uppercase; color:var(--muted); margin:.2rem 0 .7rem; }.day-column h2 strong { display:block; color:white; font-size:1.6rem; }.appointment { width:100%; margin:.35rem 0; padding:.65rem; background:#231416; border-left:3px solid var(--red); border-radius:.35rem; color:white; text-align:left; font-size:.78rem; }.appointment.completed { opacity:.55;border-left-color:var(--green)}.appointment.cancelled { opacity:.4;text-decoration:line-through}.appointment time { display:block;color:#ff7b80;font-weight:850}.empty { color:#6f6e6b;font-size:.8rem; }
.card-list { display:grid; gap:.8rem; }.data-card { background:var(--panel); border:1px solid var(--line); border-radius:.8rem; padding:1rem; }.data-card h2 { margin:.1rem 0 .5rem; font-size:1.1rem; }.data-card p { color:var(--muted); margin:.3rem 0; }.card-actions { display:flex; gap:.55rem; flex-wrap:wrap; margin-top:.8rem; }.schedule-fields { display:grid; grid-template-columns:repeat(3,minmax(110px,1fr)); gap:.5rem; margin-top:.8rem; }
.table-wrap { overflow:auto; border:1px solid var(--line); border-radius:.8rem; }table { width:100%; border-collapse:collapse; background:var(--panel); }th,td { padding:.65rem; border-bottom:1px solid var(--line); text-align:left; }th { color:var(--muted); font-size:.75rem; text-transform:uppercase; }td input { min-width:110px; }td:first-child input { min-width:220px; }.icon-danger { background:#351417;color:#ff969a; }
.hours-list { display:grid; gap:.6rem; margin-bottom:1rem; }.hours-row { display:grid; grid-template-columns:150px 80px 1fr 1fr 1fr; gap:.7rem; align-items:end; background:var(--panel); border:1px solid var(--line); border-radius:.7rem; padding:.8rem; }.hours-row strong { align-self:center; }.check { display:flex; align-items:center; gap:.4rem; }.check input { width:auto; }
.inline-form { display:grid; grid-template-columns:1fr 1fr 1fr 2fr auto; align-items:end; gap:.6rem; margin-bottom:1.2rem; padding:1rem; background:var(--panel); border:1px solid var(--line); border-radius:.8rem; }
dialog { width:min(95vw,620px); border:1px solid var(--line); border-radius:1rem; background:var(--panel); color:var(--text); padding:1.25rem; }dialog::backdrop { background:#000b; }.detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:.8rem; }.detail-grid dt { color:var(--muted); font-size:.75rem; }.detail-grid dd { margin:.15rem 0 0; overflow-wrap:anywhere; }
@media (max-width:800px) { .app-shell { display:block; }.sidebar { position:static;height:auto; }.sidebar nav { grid-template-columns:repeat(2,1fr); }.sidebar-bottom { display:flex;justify-content:space-between}.calendar-grid { grid-template-columns:repeat(7,145px); }.hours-row,.inline-form { grid-template-columns:1fr 1fr; }.hours-row strong,.inline-form button { grid-column:1/-1; }.topbar { align-items:flex-start;flex-direction:column; } }
