:root{
  --bg:#f1ebdd;            /* warm linen */
  --bg2:#eae2cf;
  --panel:#fffdf7;         /* warm white */
  --ink:#2c352e;           /* deep herbal charcoal */
  --muted:#7c7464;
  --line:#e6dcc6;
  --accent:#356a57;        /* deep jade / herbal green */
  --accent-dark:#264f41;
  --gold:#c39a3e;          /* turmeric */
  --clay:#b46343;          /* terracotta */
  --danger:#b5483a;
  --serif:"Roboto Slab","Iowan Old Style",Georgia,"Times New Roman",serif;
  --sans:"Roboto",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --name-w:168px;
  --hour-w:150px;          /* width of one hour */
  --mrow-h:64px;           /* height of one member row (compact) */
  --time-h:40px;
  --time-w:62px;
  --shadow:0 1px 3px rgba(60,45,20,.08),0 8px 22px rgba(60,45,20,.07);
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:var(--sans);
  color:var(--ink);font-size:14px;letter-spacing:.1px;
  background:linear-gradient(rgba(245,240,229,.66),rgba(245,240,229,.66)),var(--bg) url("../img/app-bg.jpg") center top / cover fixed no-repeat}
button,input,select{font-family:inherit;font-size:14px}
h1,h2,h3,.brand-name{font-family:var(--serif);letter-spacing:.1px}

/* ---------- top bar ---------- */
.topbar{display:flex;align-items:center;justify-content:space-between;
  background:linear-gradient(rgba(24,46,35,.55),rgba(24,46,35,.62)),var(--accent-dark) url("../img/top-texture.jpg") center/cover no-repeat;
  color:#fff;padding:5px 18px;box-shadow:var(--shadow);border-bottom:2px solid var(--gold)}
.brand{display:flex;align-items:center;gap:12px}
.logo{width:40px;height:40px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#e6c25e,var(--gold));
  color:#3a2c06;display:grid;place-items:center;font-weight:800;font-size:20px;font-family:var(--serif);
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.35)}
.brand-name{font-weight:700;font-size:18px;line-height:1.1;letter-spacing:.3px}
.brand-app{font-family:var(--serif);font-weight:500;font-size:12.5px;line-height:1.05;letter-spacing:.1px;max-width:340px}
.brand-sub{font-size:11px;opacity:.82;letter-spacing:.4px}
.topbar .brand-logo{box-shadow:0 2px 8px rgba(0,0,0,.25)}
.topnav{display:flex;align-items:center;gap:4px}
.topnav a{color:#fff;text-decoration:none;padding:8px 13px;border-radius:8px;opacity:.86;font-weight:500;text-transform:capitalize}
.topnav a:hover{opacity:1;background:rgba(255,255,255,.13)}
.topnav a.active{background:rgba(255,255,255,.2);opacity:1}
.nav-user{color:#fff;opacity:.82;font-size:13px;margin-left:10px;font-weight:600}
.nav-logout{font-weight:600}

/* ---------- login ---------- */
.login-page{display:grid;place-items:center;min-height:100vh;
  background:linear-gradient(135deg,var(--accent),var(--accent-dark))}
.login-card{position:relative;overflow:hidden;background:var(--panel);border-radius:18px;width:min(390px,92vw);
  box-shadow:0 26px 70px rgba(0,0,0,.45);border-top:4px solid var(--gold)}
.login-inner{position:relative;z-index:1;padding:26px 30px 30px;display:flex;flex-direction:column;gap:14px}
.login-leaf{position:absolute;right:-46px;bottom:-30px;width:240px;opacity:.12;pointer-events:none;z-index:0}
.login-sub{margin:-2px 0 2px;text-align:center;font-size:12px;letter-spacing:.4px;color:var(--muted)}
.login-brand{display:flex;align-items:center;gap:12px;color:var(--ink);margin-bottom:4px}
.login-card h1{margin:2px 0 6px;font-size:22px}
.login-card label{display:flex;flex-direction:column;gap:5px;font-weight:600;font-size:13px}
.login-card input{padding:10px 11px;border:1px solid var(--line);border-radius:9px;font-size:14px;background:#fff;width:100%;box-sizing:border-box}
.login-card input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(38,128,90,.15)}
.login-card input.is-error{border-color:var(--danger);background:#fff7f6}
.login-card input.is-error:focus{box-shadow:0 0 0 3px rgba(192,80,77,.18)}
.login-btn{margin-top:6px;padding:11px}
/* show / hide password */
.pw-wrap{position:relative;display:block}
.pw-wrap input{padding-right:40px}
.pw-toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);border:none;background:transparent;
  cursor:pointer;font-size:16px;line-height:1;padding:6px;border-radius:7px;opacity:.55}
.pw-toggle:hover{opacity:.9;background:rgba(0,0,0,.05)}
.pw-toggle.on{opacity:1}
/* login error + caps warning */
.login-error{display:flex;align-items:center;gap:7px}
.login-error .err-ico{font-size:15px}
.caps-warn{margin:-4px 0 0;font-size:12px;font-weight:600;color:#b45309;background:#fff5e6;
  border:1px solid #f3d49a;border-radius:7px;padding:5px 8px}
@keyframes shake{10%,90%{transform:translateX(-2px)}20%,80%{transform:translateX(4px)}
  30%,50%,70%{transform:translateX(-7px)}40%,60%{transform:translateX(7px)}}
.login-card.shake{animation:shake .5s cubic-bezier(.36,.07,.19,.97) both}

/* ===== side-by-side sign-in (Nattika Life) ===== */
.auth-page{min-height:100vh;display:grid;place-items:center;padding:22px;
  background:#2f4a3f url("../img/login-bg.jpg") center/cover fixed no-repeat}
.auth-card{position:relative;display:grid;grid-template-columns:1fr 1fr;width:min(680px,94vw);
  border-radius:20px;overflow:hidden;box-shadow:0 26px 70px rgba(15,35,25,.42);
  background:rgba(255,255,255,.80);border:1px solid rgba(255,255,255,.55);
  backdrop-filter:blur(18px) saturate(1.05);-webkit-backdrop-filter:blur(18px) saturate(1.05)}
.auth-card::before{content:"";position:absolute;top:0;left:0;right:0;height:6px;z-index:2;
  background:linear-gradient(90deg,#234f3b,#3f7d55 55%,#8cbf5c)}
/* left brand panel — frosted white glass */
.auth-left{position:relative;overflow:hidden;padding:34px 30px 96px;text-align:center;color:#274a38;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  background:linear-gradient(150deg,rgba(255,255,255,.55) 0%,rgba(255,255,255,.18) 100%);
  border-right:1px solid rgba(255,255,255,.5)}
.auth-logo{position:relative;z-index:1;max-width:178px;max-height:92px;object-fit:contain;margin-bottom:2px}
.auth-rule{position:relative;z-index:1;display:block;width:46px;height:2px;border-radius:2px;margin:11px auto;
  background:linear-gradient(90deg,#c39a3e,#e8c766)}
.auth-maintitle{position:relative;z-index:1;font-family:var(--serif);font-size:21px;line-height:1.22;margin:0 auto 2px;
  max-width:280px;color:#2c4a3b;font-weight:500;letter-spacing:.1px}
.auth-tag{position:relative;z-index:1;font-style:italic;color:#5a7264;max-width:258px;margin:9px auto 0;line-height:1.45;font-size:13.5px}
/* two solid-green leaves framing the BOTTOM of the panel — clearly visible, sit below the text */
.auth-leaf{position:absolute;bottom:4px;z-index:0;width:104px;opacity:.9;pointer-events:none}
.auth-leaf.leaf-a{left:6px;transform:rotate(22deg)}
.auth-leaf.leaf-b{right:6px;transform:scaleX(-1) rotate(22deg)}
/* right form panel — glass white */
.auth-right{padding:38px 38px;display:flex;flex-direction:column;gap:12px;justify-content:center;
  background:linear-gradient(150deg,rgba(255,255,255,.62),rgba(255,255,255,.82))}
.auth-title{font-family:var(--serif);font-size:28px;margin:0;color:#243;font-weight:600}
.auth-desc{color:var(--muted);margin:0 0 8px;font-size:14px}
.auth-label{display:flex;flex-direction:column;gap:6px;font-size:11px;font-weight:600;
  letter-spacing:.5px;text-transform:uppercase;color:#6a726b}
.auth-right input{padding:12px 12px;border:1px solid var(--line);border-radius:10px;font-size:14px;
  background:#fff;width:100%;box-sizing:border-box;font-weight:400;letter-spacing:normal;text-transform:none;color:var(--ink)}
.auth-right input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(53,106,87,.15)}
.auth-right input.is-error{border-color:var(--danger);background:#fff7f6}
.auth-btn{margin-top:10px;padding:13px;font-size:15px}
.auth-card.shake{animation:shake .5s cubic-bezier(.36,.07,.19,.97) both}
@media (max-width:720px){
  .auth-card{grid-template-columns:1fr;width:min(420px,96vw)}
  .auth-left{padding:26px 24px 76px}
  .auth-maintitle{font-size:19px}
  .auth-tag{display:none}
  .auth-leaf{width:82px;opacity:.85}
  .auth-right{padding:24px 26px 30px}
}

main{padding:16px 18px}

/* ---------- buttons ---------- */
.btn{border:1px solid var(--line);background:#fff;color:var(--ink);padding:8px 14px;border-radius:9px;
  cursor:pointer;font-weight:600;transition:.12s}
.btn:hover{border-color:#d8ccae;background:#fbf7ed}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.primary:hover{background:var(--accent-dark)}
.btn.danger{background:#fff;border-color:var(--danger);color:var(--danger)}
.btn.danger:hover{background:#fbeae7}
.btn.icon{padding:8px 12px;font-size:18px;line-height:1}
.btn.ghost{border:none;background:transparent;font-size:22px}

/* ---------- toolbar ---------- */
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--panel);
  border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:14px;box-shadow:var(--shadow);flex-wrap:wrap}
.date-nav{display:flex;align-items:center;gap:8px}
.day-label{font-weight:700;margin-left:6px;font-family:var(--serif);font-size:15px}
.toolbar-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.filter{display:flex;align-items:center;gap:6px;color:var(--muted)}
.filter select{padding:7px 8px;border-radius:8px;border:1px solid var(--line)}
input[type=date],input[type=time]{padding:7px 8px;border:1px solid var(--line);border-radius:8px;background:#fff}

/* ---------- calendar (members = rows, time = columns) ---------- */
.planner-panel{display:block}
.cal-scroll{overflow:auto;border:1px solid var(--line);border-radius:12px;background:var(--panel);
  box-shadow:var(--shadow);max-height:calc(100vh - 210px)}
.cal-grid{display:grid;width:max-content}
.corner{position:sticky;left:0;top:0;z-index:16;background:var(--panel);border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);width:var(--name-w);height:var(--time-h)}
.time-axis{position:sticky;top:0;z-index:5;height:var(--time-h);background:var(--panel);border-bottom:1px solid var(--line)}
.time-axis .hlabel{position:absolute;top:0;height:var(--time-h);display:flex;align-items:center;font-size:11px;
  color:var(--muted);border-left:1px solid var(--line);padding-left:5px;font-weight:600}
.mrow-name{position:sticky;left:0;z-index:4;width:var(--name-w);height:var(--mrow-h);background:var(--panel);
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;
  justify-content:center;padding:5px 10px}
.mrow-name .mn{font-weight:700;font-size:12.5px;display:flex;align-items:center;gap:7px}
.mrow-name .mr{font-size:11px;color:var(--muted);margin-top:1px}
.mrow-name .dot{width:10px;height:10px;border-radius:50%;flex:0 0 auto}
.track{position:relative;height:var(--mrow-h);border-bottom:1px solid var(--line);cursor:pointer}
.track:nth-child(even){background:rgba(0,0,0,.012)}
.track.drop-target{background:rgba(195,154,62,.16)!important}

.booking{position:absolute;top:4px;bottom:4px;border-radius:8px;padding:3px 7px 9px;overflow:hidden;cursor:grab;
  color:#1d2625;box-shadow:0 1px 2px rgba(0,0,0,.18);border:1px solid rgba(0,0,0,.10);font-size:11px;
  line-height:1.2;z-index:2;touch-action:none;user-select:none}
.booking:hover{box-shadow:0 3px 10px rgba(0,0,0,.24)}
.booking:active{cursor:grabbing}
.booking.drag-live{box-shadow:0 14px 32px rgba(0,0,0,.34);opacity:.96;transform:scale(1.02);cursor:grabbing}
.booking .b-guest{font-weight:700;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  display:flex;align-items:center;gap:4px}
.booking .b-time{font-size:10.5px;font-weight:600;opacity:.95;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.booking .b-line{font-size:10px;opacity:.9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.booking .b-treat{font-weight:600;opacity:1}
/* Nattika block: larger doctor/companion/time lines + treatment corner marker */
.booking .b-big{font-size:12px;font-weight:600;opacity:1;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.booking .b-corner{position:absolute;right:4px;bottom:4px;width:12px;height:12px;border-radius:50%;z-index:2}
.booking .b-corner.white{background:#fff;border:1.5px solid #6f6f6f;box-shadow:0 0 2px rgba(0,0,0,.35)}
.booking .b-corner.black{background:#111;border:1px solid #000}
/* Nattika: just-tall-enough rows so the Guest / Doctors / Companion / Time-Room lines fit snugly */
.cal-tall .track,.cal-tall .mrow-name{min-height:78px}
.cal-tall .booking{padding-bottom:4px}
.btn.on{background:#356a57;color:#fff;border-color:#356a57}

/* therapist-wise schedule view */
.ts-panel{display:flex;flex-direction:column}
.ts-scroll{overflow-y:auto;max-height:calc(100vh - 150px);padding:2px}
.ts-panel:fullscreen{background:var(--bg,#f4f0e4);padding:18px 30px}
.ts-panel:fullscreen .ts-scroll{max-height:calc(100vh - 90px);padding:2px 6px}
.ts-panel:fullscreen .toolbar{padding:0 6px 8px}
.ts-summary{font-weight:600;color:var(--muted);margin:2px 0 12px;font-size:13px}
.ts-ther{margin:0 0 14px;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.ts-ther h3{font-family:var(--serif,Georgia);margin:0;font-size:15px;display:flex;align-items:center;gap:8px;padding:8px 12px;color:#2c352e}
.ts-count{color:var(--muted);font-weight:400;font-size:13px}
/* fixed layout so every therapist table has identical column widths -> headers line up across all tables */
.ts-table{width:100%;margin:0;table-layout:fixed;border-collapse:collapse}
.ts-table th{background:#efe9da;white-space:nowrap}
.ts-table th,.ts-table td{font-size:13px;padding:6px 10px;vertical-align:top;word-break:break-word;text-align:left;border:1px solid #d8d0bd}
.ts-table th:nth-child(1),.ts-table td:nth-child(1){width:4%;min-width:30px;text-align:center;color:var(--muted)}   /* # */
.ts-table th:nth-child(2),.ts-table td:nth-child(2){width:11%}   /* Time Slot */
.ts-table th:nth-child(3),.ts-table td:nth-child(3){width:15%}   /* Guest Name */
.ts-table th:nth-child(4),.ts-table td:nth-child(4){width:9%}    /* Resort Room */
.ts-table th:nth-child(5),.ts-table td:nth-child(5){width:10%}   /* Treatment Room */
.ts-table th:nth-child(6),.ts-table td:nth-child(6){width:14%}   /* Primary Doctor */
.ts-table th:nth-child(7),.ts-table td:nth-child(7){width:14%}   /* Secondary Doctor */
.ts-table th:nth-child(8),.ts-table td:nth-child(8){width:13%}   /* Companion */
.ts-table th:nth-child(9),.ts-table td:nth-child(9){width:10%}   /* Treatment/Service */
.ts-dot{display:inline-block;width:13px;height:13px;border-radius:50%;vertical-align:middle;box-shadow:0 0 0 1px rgba(0,0,0,.15)}
.booking.conflict{outline:2px solid var(--danger);outline-offset:-2px}
.booking.leave-conflict{outline:2px dashed #bf6a34;outline-offset:-2px}
/* note indicators (strong, bottom strip) — shared by day tiles and week chips */
.b-flags{position:absolute;left:0;right:0;bottom:0;height:9px;display:flex;overflow:hidden;border-radius:0 0 7px 7px;box-shadow:inset 0 1px 0 rgba(255,255,255,.45)}
.b-flags .bf{flex:1}
.b-flags .bf.gn{background:#2563eb}
.b-flags .bf.fb{background:#ea580c}
.b-flags .bf.yg{background:#16a34a}
.note-legend{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--muted);margin-left:4px}
.note-legend .lg{width:14px;height:9px;border-radius:2px;display:inline-block}
.note-legend .lg.gn{background:#2563eb}
.note-legend .lg.fb{background:#ea580c}
.note-legend .lg.yg{background:#16a34a}

/* therapist break blocks on the day calendar */
.brk{position:absolute;top:3px;bottom:3px;background:repeating-linear-gradient(45deg,rgba(120,120,120,.16) 0 6px,rgba(120,120,120,.30) 6px 12px);
  border:1px dashed rgba(90,90,90,.55);border-radius:6px;pointer-events:none;display:flex;align-items:center;justify-content:center;z-index:1}
.brk span{font-size:9px;font-weight:700;letter-spacing:.5px;color:#5a5a5a;text-transform:uppercase;opacity:.8}
.hlabel-end{transform:translateX(-100%);padding-right:2px;color:var(--accent-dark);font-weight:700}

/* swap / series choice popup */
.choice-modal{width:min(420px,94vw)}
.choice-text{margin:0 0 6px;color:var(--ink);font-size:14px;line-height:1.4}
.choice-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}

/* sign-in logo */
.login-logo-img{display:block;width:auto;max-width:228px;max-height:118px;object-fit:contain;margin:0 auto 2px}

/* ---------- full screen ---------- */
#plannerPanel:fullscreen{background:var(--bg);padding:16px;overflow:auto}
#plannerPanel:-webkit-full-screen{background:var(--bg);padding:16px;overflow:auto}
#plannerPanel:fullscreen .cal-scroll{max-height:calc(100vh - 90px)}
#plannerPanel:-webkit-full-screen .cal-scroll{max-height:calc(100vh - 90px)}

/* ---------- modal ---------- */
.modal-overlay{position:fixed;inset:0;background:rgba(25,30,24,.46);display:grid;place-items:center;z-index:50;padding:14px}
.modal-overlay.hidden{display:none}
.modal{background:var(--panel);border-radius:14px;width:min(560px,100%);max-height:94vh;overflow:auto;
  box-shadow:0 24px 64px rgba(0,0,0,.32);border-top:4px solid var(--gold)}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:13px 18px;border-bottom:1px solid var(--line)}
.modal-head h2{margin:0;font-size:19px}
.modal-body{padding:14px 18px;display:flex;flex-direction:column;gap:10px;overflow-x:hidden}
.modal-body label{display:flex;flex-direction:column;gap:5px;font-weight:600;font-size:13px;min-width:0}
.modal-body input,.modal-body select{width:100%;min-width:0;max-width:100%;padding:9px 10px;border:1px solid var(--line);
  border-radius:9px;font-weight:400;background:#fff}
.modal-body input[type=number]{width:70px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:end}
.row3{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:12px;align-items:end}
.row2>label,.row3>label{min-width:0}
.members-field{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin:0}
.members-field legend{font-weight:700;font-size:13px;padding:0 6px}
.members-check{display:grid;grid-template-columns:1fr 1fr;gap:4px 18px}
.members-check label{display:flex;flex-direction:row;align-items:center;gap:7px;font-weight:500;font-size:12.5px;padding:1px 0;cursor:pointer}
.members-check input[type=checkbox]{flex:0 0 auto;margin:0;width:16px;height:16px}
.members-check .grp{grid-column:1/-1;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-top:6px;font-weight:700}
.members-check .swatch{width:11px;height:11px;border-radius:50%;display:inline-block;flex:0 0 auto}
.members-check .mname{flex:1;min-width:0;line-height:1.2}
.lbl-hint{font-weight:400;color:var(--muted);font-size:11px}
.repeat-field{flex-direction:row !important;align-items:center;gap:8px;font-weight:600}
.repeat-field small{color:var(--muted);font-weight:400}
.modal-actions{display:flex;align-items:center;gap:10px;margin-top:4px}
.modal-actions .spacer{flex:1}
.form-error{background:#fbeae7;color:var(--danger);border:1px solid #ecc3bc;padding:8px 10px;border-radius:8px;margin:0;font-size:13px}

/* ---------- settings ---------- */
.settings-wrap{display:flex;flex-direction:column;gap:18px;max-width:980px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px;box-shadow:var(--shadow)}
.card h2{margin:0 0 12px}
.card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.card-head h2{margin:0}
.hint{color:var(--muted);font-size:13px;margin:4px 0 14px}
.grid-table{width:100%;border-collapse:collapse}
.grid-table th{text-align:left;font-size:12px;color:var(--muted);padding:8px 10px;border-bottom:2px solid var(--line)}
.grid-table td{padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
.grid-table input[type=text]{padding:7px 9px;border:1px solid var(--line);border-radius:8px;width:100%}
.grid-table select{padding:7px 9px;border:1px solid var(--line);border-radius:8px}
.grid-table input[type=color]{width:42px;height:32px;border:1px solid var(--line);border-radius:8px;background:#fff;cursor:pointer;padding:2px}
.card .row3{margin-bottom:10px}
.card label{display:flex;flex-direction:column;gap:5px;font-weight:600;font-size:13px}
.card input[type=text],.card input[type=time],.card input[type=password],.card input[type=number],.card select{
  padding:9px 10px;border:1px solid var(--line);border-radius:9px;font-weight:400;background:#fff}
.switch{display:inline-flex;align-items:center;cursor:pointer}
.switch input{width:18px;height:18px}

/* ---------- reports ---------- */
.report-toolbar{align-items:flex-end}
.rep-controls{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}
.rep-field{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted);font-weight:600}
.rep-field select,.rep-field input{padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-weight:400;color:var(--ink);background:#fff}
.rep-actions{display:flex;gap:8px}
.report-result{margin-top:0}
.print-head h2{margin:0 0 2px;font-size:20px}
.muted-line{color:#5c5443;font-size:13px;margin:4px 0 12px}
.report-table{width:100%;border-collapse:collapse;font-size:13px}
.report-table th{text-align:left;background:#f3ecdb;color:var(--ink);padding:8px 10px;border-bottom:2px solid var(--line);font-weight:700}
.report-table td{padding:7px 10px;border-bottom:1px solid var(--line)}
.report-table tbody tr:nth-child(even){background:rgba(0,0,0,.018)}

/* ---------- toast ---------- */
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;
  padding:11px 18px;border-radius:10px;z-index:80;box-shadow:0 8px 24px rgba(0,0,0,.25);font-weight:600}
.toast.err{background:var(--danger)}
.hidden{display:none !important}

/* ---------- brand logo + drag time badge ---------- */
.brand-logo{height:32px;max-width:180px;object-fit:contain;background:#fff;border-radius:8px;padding:3px 7px}
.drag-badge{position:fixed;z-index:10000;background:var(--ink);color:#fff;font-weight:700;font-size:12px;padding:4px 8px;border-radius:7px;pointer-events:none;box-shadow:0 4px 12px rgba(0,0,0,.3);white-space:nowrap}

/* ---------- property switcher ---------- */
.prop-switch{background:rgba(255,255,255,.15);color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:8px;padding:7px 8px;font-weight:600;margin-right:6px;max-width:230px}
.prop-switch option{color:#1d2625}

/* ---------- dashboard ---------- */
.dash-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.dash-head h1{margin:0;font-size:24px}
.dash-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:16px}
@media (max-width:820px){.dash-grid{grid-template-columns:1fr}}
.chip{display:inline-block;background:#efe7d4;color:#5c5036;border-radius:20px;padding:2px 10px;font-size:12px;font-weight:600;margin-left:6px;vertical-align:middle}
.dash-row{display:flex;align-items:flex-start;gap:10px;padding:9px 4px;border-bottom:1px solid var(--line)}
.dash-row:last-child{border-bottom:none}
.dash-dot{width:12px;height:12px;border-radius:50%;margin-top:4px;flex:0 0 auto}
.dash-time{font-weight:700;font-size:13px;white-space:nowrap;min-width:118px}
.dash-main{flex:1;min-width:0}
.dash-meta{font-size:12px;color:var(--muted);margin-top:1px}
.muted-inline{color:var(--muted);font-size:12px}
.dash-note{border-left:3px solid var(--gold);background:#fbf6ea;padding:8px 10px;border-radius:6px;margin-bottom:8px;font-size:13px}
.dn-head{margin-bottom:2px}

/* ---------- reports groups ---------- */
.rep-group{display:flex;align-items:center;justify-content:space-between;margin:16px 0 6px;gap:10px}
.rep-group h3{margin:0;font-size:16px;font-family:var(--serif)}

/* ---------- users / access ---------- */
.access-grid{display:flex;flex-direction:column;gap:6px}
.access-grid{display:flex;flex-direction:column}
.access-row{display:flex;flex-direction:column;gap:6px;padding:9px 0;border-bottom:1px solid var(--line)}
.access-row:last-child{border-bottom:0}
.access-row .acc-name{font-weight:600;font-size:13px;color:var(--ink,#2c352e)}
.acc-controls{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.acc-controls select{padding:6px 8px;border:1px solid var(--line);border-radius:8px;min-width:150px}
.acc-roster{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:500;color:var(--muted);white-space:nowrap}
.acc-roster input{margin:0}
.acc-roster:has(input:disabled){opacity:.45}
.menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px}
.menu-chk{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:500}
.menu-chk input{margin:0}
@media (max-width:520px){.menu-grid{grid-template-columns:1fr}}
.prop-banner{background:#fbf6ea;border:1px solid var(--line);border-radius:10px;padding:9px 12px;color:var(--muted);font-size:13px;margin:0}

/* textarea in booking modal */
.modal-body textarea{width:100%;min-width:0;padding:9px 10px;border:1px solid var(--line);border-radius:9px;font-family:inherit;font-size:14px;resize:vertical}

/* ---------- analytics ---------- */
.an-kpis{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 20px;box-shadow:var(--shadow);min-width:130px}
.kpi-val{font-size:26px;font-weight:800;font-family:var(--serif);color:var(--accent-dark)}
.kpi-lbl{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-top:2px}
.ut-row{display:grid;grid-template-columns:1fr 130px 44px;align-items:center;gap:10px;padding:6px 0;border-bottom:1px solid var(--line)}
.ut-row:last-child{border-bottom:none}
.ut-label{font-weight:600;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ut-sub{color:var(--muted);font-weight:400;font-size:11px}
.ut-track{height:12px;background:#ece4d2;border-radius:7px;overflow:hidden}
.ut-fill{height:100%;border-radius:7px;min-width:2px}
.ut-pct{text-align:right;font-weight:700;font-size:13px}

/* ---------- find a free slot ---------- */
.fs-go{justify-content:flex-end}
.fs-go .btn{width:100%}
.fs-results{margin-top:6px;max-height:330px;overflow:auto;display:flex;flex-direction:column;gap:6px}
.fs-slot{display:flex;flex-direction:column;align-items:flex-start;gap:1px;text-align:left;border:1px solid var(--line);background:#fff;border-radius:9px;padding:8px 11px;cursor:pointer;width:100%}
.fs-slot:hover{border-color:var(--accent);background:#f4f8f4}
.fs-when{font-weight:700;font-size:13px}
.fs-who{font-size:12px;color:var(--muted)}

/* ---------- weekday picker (settings) ---------- */
.wd-row{display:flex;gap:7px;flex-wrap:wrap}
.wd{display:inline-flex;align-items:center;gap:3px;font-size:12px;font-weight:600;color:var(--muted)}
.wd input{width:15px;height:15px}

/* ---------- view switch ---------- */
.view-switch{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.view-switch .seg{border:none;border-radius:0;padding:8px 13px;background:#fff;font-weight:600}
.view-switch .seg.active{background:var(--accent);color:#fff}

/* ---------- week view (roster: members down, days across) ---------- */
.wk-head{height:var(--time-h);position:sticky;top:0;z-index:15;background:var(--panel);border-bottom:1px solid var(--line);border-left:1px solid var(--line);display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:12px;box-shadow:0 3px 5px rgba(60,45,20,.10)}
.wk-head .ch-name{font-weight:700}
.wk-head .ch-role{color:var(--muted);font-size:11px}
.wk-head.wk-today{background:rgba(195,154,62,.18)}
.wk-name{justify-content:flex-start !important;padding-top:8px;height:auto !important;align-self:stretch}
.wk-cell{border-left:1px solid var(--line);border-bottom:1px solid var(--line);min-height:44px;padding:4px;display:flex;flex-direction:column;gap:4px;cursor:pointer}
.wk-cell.wk-today{background:rgba(195,154,62,.06)}
.wk-cell:hover{background:rgba(15,118,110,.04)}
.wk-chip{position:relative;background:#fff;border:1px solid var(--line);border-left:3px solid #ccc;border-radius:6px;padding:3px 6px 9px;font-size:11px;line-height:1.25;cursor:pointer;box-shadow:0 1px 1px rgba(0,0,0,.06)}
.wk-chip:hover{box-shadow:0 2px 6px rgba(0,0,0,.16)}
.wk-chip .wc-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wk-chip .wc-time{font-weight:700}

/* ---------- dashboard side column ---------- */
.dash-side{display:flex;flex-direction:column;gap:16px}

/* ---------- day-sheet print ---------- */
#printArea{display:none}
.ds-head h2{margin:0 0 2px;font-family:var(--serif)}

/* ---------- responsive / mobile ---------- */
.nav-toggle{display:none}
.cal-scroll{-webkit-overflow-scrolling:touch}
.row-actions{display:flex;flex-wrap:wrap;gap:5px}

@media (max-width:760px){
  /* compact calendar metrics so it fits a phone (still scrolls horizontally) */
  :root{--name-w:118px;--hour-w:118px;--mrow-h:56px}

  /* top bar + collapsible nav */
  .topbar{flex-wrap:wrap;padding:9px 13px;gap:8px}
  .brand-sub{display:none}
  .brand-logo{height:34px;max-width:160px}
  .nav-toggle{display:block;margin-left:auto;background:rgba(255,255,255,.16);color:#fff;
    border:1px solid rgba(255,255,255,.4);border-radius:9px;font-size:18px;line-height:1;padding:6px 12px;cursor:pointer}
  .topnav{display:none;order:3;width:100%;flex-direction:column;align-items:stretch;gap:2px;margin-top:6px}
  .topnav.open{display:flex}
  .topnav a{padding:12px 12px;border-radius:9px;opacity:.95}
  .nav-user{margin-left:0}
  .prop-switch{width:100%;max-width:none;margin:0 0 4px}

  main{padding:12px 11px}

  /* planner toolbar stacks */
  .toolbar{flex-direction:column;align-items:stretch;gap:9px}
  .date-nav,.toolbar-right{flex-wrap:wrap;gap:8px}
  .toolbar-right{justify-content:flex-start}
  .day-label{width:100%}
  .toolbar .btn{flex:0 0 auto}
  .cal-scroll{max-height:70vh}

  /* modals become near full-screen, fields go single-column */
  .modal-overlay{padding:0}
  .modal{width:100%;max-width:100%;min-height:100%;max-height:100%;border-radius:0}
  .row2,.row3{grid-template-columns:1fr}

  /* wide tables scroll inside their card instead of overflowing the page */
  .card{overflow-x:auto}
  .report-table{min-width:560px}

  h1{font-size:20px}
}

@media (max-width:420px){
  .brand-name{font-size:15px}
  .toolbar .btn,.toolbar-right .btn{font-size:13px;padding:8px 10px}
}

/* ---------- duty roster + leave markers ---------- */
.row-badge{display:inline-block;margin-left:6px;font-size:10px;font-weight:800;letter-spacing:.3px;padding:1px 6px;border-radius:10px;vertical-align:middle}
.row-badge.leave{background:#fbe4e2;color:#b5483a;border:1px solid #eec3bc}
.row-badge.off{background:#eceae3;color:#7c7464;border:1px solid #ddd6c6}
.row-badge.half{background:#fdf0d8;color:#8a6d18;border:1px solid #f0dca6}
.mrow-name.row-dim .mn{opacity:.55}
.track-dim{background-color:rgba(150,140,120,.10) !important}
.warn-card h2{color:#b5731f}
.warn-note{border-left:3px solid #d9a441;background:#fdf6e8}
.dash-datenav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dash-datenav input[type=date]{padding:7px 8px;border:1px solid var(--line);border-radius:8px;background:#fff}
.dash-row[data-open]{cursor:pointer;border-radius:8px;transition:background .12s}
.dash-row[data-open]:hover{background:rgba(53,106,87,.07)}
.note-legend .lg-alert{font-size:12px;color:var(--muted);margin-left:2px}
.roster-reminder{display:block;text-decoration:none;background:#fdf0d8;color:#8a6d18;border:1px solid #f0dca6;
  border-radius:11px;padding:11px 14px;margin:0 0 14px;font-size:14px;font-weight:600}
.roster-reminder:hover{background:#fbe9c6}

.roster-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.wk-pick{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.wk-pick label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:600}
.wk-pick input{padding:7px 8px;border:1px solid var(--line);border-radius:8px}
.table-scroll{overflow-x:auto;margin-top:10px}
.roster-table{width:100%;border-collapse:collapse;font-size:13px}
.roster-table th,.roster-table td{border:1px solid var(--line);padding:6px 8px;text-align:center}
.roster-table th{background:var(--bg2);font-weight:700}
.roster-table td.rt-name,.roster-table th:first-child{text-align:left;white-space:nowrap}
.roster-table td.rt-name .role{color:var(--muted);font-size:11px;font-weight:400}
.roster-table td.rt-day input{width:16px;height:16px}
.roster-table input[type="time"]{padding:5px 6px;border:1px solid var(--line);border-radius:7px;font-size:12px}
.roster-actions{display:flex;align-items:center;gap:10px;margin-top:12px;flex-wrap:wrap}
.row4{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.4fr;gap:12px;align-items:end}
.row4 label{display:flex;flex-direction:column;gap:5px;font-weight:600;font-size:13px}
.row4 select,.row4 input{padding:8px 9px;border:1px solid var(--line);border-radius:8px;background:#fff}
.lv-times{display:flex;align-items:center;gap:6px}
.lv-times input{flex:1}
@media (max-width:760px){.row4{grid-template-columns:1fr 1fr}}

/* roster week grid */
.wk-nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.week-label{font-weight:700;font-family:var(--serif);min-width:170px;text-align:center}
.roster-legend{display:flex;gap:8px;flex-wrap:wrap}
.roster-legend .rl{font-size:11px;font-weight:800;padding:2px 9px;border-radius:10px}
.roster-legend .rl.p{background:#e3f0e6;color:#2f6f50}
.roster-legend .rl.o{background:#fbe4e2;color:#b5483a}
.roster-legend .rl.h{background:#fdf0d8;color:#8a6d18}
.roster-grid{width:100%;border-collapse:collapse;font-size:12.5px;min-width:760px}
.roster-grid th,.roster-grid td{border:1px solid var(--line);padding:6px 8px;text-align:center}
.roster-grid th{background:var(--bg2);font-weight:700}
.roster-grid th .rg-date{font-size:10px;color:var(--muted);font-weight:400}
.roster-grid td.rg-name{text-align:left;white-space:nowrap}
.roster-grid td.rg-name .role{color:var(--muted);font-size:11px}
.roster-grid td.rg-shift{white-space:nowrap}
.roster-grid td.rg-shift input{width:72px;padding:4px 5px;border:1px solid var(--line);border-radius:6px;font-size:11px}
.roster-grid td.rg-shift span{margin:0 3px;color:var(--muted)}
.rg-cell{cursor:pointer;font-weight:700;user-select:none}
.rg-cell.present{background:#eef6f0;color:#2f6f50}
.rg-cell.off{background:#fbe4e2;color:#b5483a}
.rg-cell.half{background:#fdf0d8;color:#8a6d18}
.rg-cell:hover{filter:brightness(.96)}
.rg-cell .rg-sub{font-size:9px;font-weight:400;opacity:.85}

/* email settings + report send */
.chk{display:flex;align-items:center;gap:8px;font-weight:600;margin:4px 0 8px}
.report-send{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.report-send .rs-group{display:inline-flex;align-items:center;gap:6px;background:var(--bg);padding:5px 9px;border-radius:9px;font-size:13px}
.card .row2 > label > input, .card > label > input{width:100%;box-sizing:border-box}
.report-block{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin:10px 0;background:rgba(255,255,255,.4)}
.report-block h3{margin:0 0 6px;font-size:14px}
.report-views .rv-controls{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.report-views .rv-controls input{padding:8px 9px;border:1px solid var(--line);border-radius:8px}
.report-views .rv-links{display:flex;flex-wrap:wrap;gap:8px}
.report-views .rv-links .btn{text-decoration:none}
.rep-tabs{display:flex;gap:6px;margin-bottom:14px;border-bottom:2px solid var(--line)}
.rep-tab{border:none;background:transparent;padding:9px 16px;font-weight:600;font-size:14px;color:var(--muted);
  cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-2px;border-radius:8px 8px 0 0}
.rep-tab.active{color:var(--accent-dark);border-bottom-color:var(--gold);background:rgba(255,255,255,.5)}

/* ---- uniform settings form fields (professional, aligned) ---- */
.card > label,.card .row2 > label,.card .row3 > label,.card .row4 > label{
  display:flex;flex-direction:column;gap:5px;font-weight:600;font-size:13px;margin-bottom:13px;color:var(--ink)}
.card > label input,.card > label select,.card > label textarea,
.card .row2 > label input,.card .row2 > label select,.card .row2 > label textarea,
.card .row3 > label input,.card .row3 > label select,.card .row3 > label textarea,
.card .row4 > label input,.card .row4 > label select{
  width:100%;box-sizing:border-box;padding:9px 11px;border:1px solid var(--line);border-radius:9px;
  background:#fff;font-size:14px;font-weight:400;color:var(--ink)}
.card > label input:focus,.card > label select:focus,.card > label textarea:focus,
.card .row2 > label input:focus,.card .row2 > label select:focus,.card .row2 > label textarea:focus,
.card .row3 > label input:focus,.card .row3 > label select:focus,.card .row4 > label input:focus{
  outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(53,106,87,.13)}
.card .hint{color:var(--muted);font-size:13px;margin:2px 0 14px;line-height:1.5}
.card .chk{justify-content:flex-start;margin:4px 0 14px}
.card h2{font-size:19px;margin:0 0 4px}
.card .report-block h3{font-size:14px;color:#2c4a3b}

/* clickable member name (set attendance from the planner) */
.mrow-name.mrow-clickable{cursor:pointer}
.mrow-name.mrow-clickable:hover{background:rgba(53,106,87,.07)}

/* alternative-staff popup */
.alt-modal .alt-row{display:flex;flex-direction:column;gap:5px;margin:8px 0;padding:8px 10px;background:var(--bg);border-radius:9px}
.alt-modal .alt-lbl{font-size:13px}
.alt-modal select{padding:8px 9px;border:1px solid var(--line);border-radius:8px;background:#fff}
.status-actions{justify-content:center;flex-wrap:wrap}
.status-actions .btn{min-width:112px;font-weight:700;line-height:1.15}
.status-actions .btn small{display:block;font-weight:400;font-size:10px;opacity:.72;margin-top:2px}
.status-actions .stat-p{background:#e3f0e6;color:#2f6f50;border:1px solid #bcd9c3}
.status-actions .stat-h{background:#fdf0d8;color:#8a6d18;border:1px solid #f0dca6}
.status-actions .stat-o{background:#fbe4e2;color:#b5483a;border:1px solid #eec3bc}

/* ---------- appointment request ---------- */
.appt-wrap{max-width:720px;margin:0 auto;padding:6px 0}
.appt-card{padding:22px 24px}
.appt-form{display:flex;flex-direction:column;gap:14px;margin-top:6px}
.appt-form label{display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:600;color:#4a4230}
.appt-form input,.appt-form select,.appt-form textarea{padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;font:inherit;font-weight:400}
.appt-form textarea{resize:vertical}
.appt-form .row2,.appt-form .row3{margin:0}
.appt-done{text-align:center;padding:26px 10px}
.appt-tick{width:56px;height:56px;line-height:56px;margin:0 auto 10px;border-radius:50%;background:#e3f0e6;color:#2f6f50;font-size:30px;font-weight:700}
.appt-done h3{margin:0 0 6px;font-family:var(--serif)}
.appt-done p{color:#7c7464;margin:0 0 16px}
.appt-tabs{display:flex;gap:8px;margin-bottom:14px}
.appt-tab{padding:8px 16px;border:1px solid var(--line);border-radius:9px;background:#fff;font-weight:700;color:#6b6350;cursor:pointer;font:inherit;font-weight:700}
.appt-tab.active{background:#2f5d4e;color:#fff;border-color:#2f5d4e}
.appt-tab .chip{margin-left:6px}
.alert-chip{background:#d9483b;color:#fff}
.ap-showall{font-size:12px;font-weight:600;color:#6b6350}
.ap-list{display:flex;flex-direction:column;gap:10px;margin-top:4px}
.ap-item{display:flex;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:10px;padding:11px 13px;background:#fff}
.ap-item[data-status="dismissed"]{opacity:.62}
.ap-item-top{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:3px}
.ap-item-top b{font-size:14px}
.ap-date{color:#6b6350;font-size:12.5px}
.ap-item-meta{color:#4a4230;font-size:12.5px}
.ap-item-notes{color:#6b6350;font-size:12px;margin-top:3px;font-style:italic}
.ap-item-sub{color:#a49a84;font-size:11px;margin-top:4px}
.ap-stat{font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:20px}
.st-new{background:#fbe9c6;color:#8a6111}
.st-sched{background:#dcefe0;color:#2f6f50}
.st-dism{background:#eceae3;color:#8a8474}
.ap-item-actions{display:flex;flex-direction:column;gap:6px;align-items:flex-end;flex-shrink:0}
.btn.sm{padding:5px 10px;font-size:12px;min-width:120px}
.btn.sm.danger{background:#fbe4e2;color:#b5483a;border:1px solid #eec3bc}
.ap-flash{animation:apFlash 1.6s ease}
@keyframes apFlash{0%,40%{box-shadow:0 0 0 3px #f4d58a}100%{box-shadow:none}}
.appt-pill{display:inline-flex;align-items:center;gap:6px;padding:8px 13px;border-radius:20px;
  background:#fbe9c6;color:#8a5a11;border:1px solid #eccd8f;font-weight:700;font-size:13px;
  text-decoration:none;white-space:nowrap;animation:apPulse 2.4s ease-in-out infinite}
.appt-pill:hover{background:#f8dfa8}
@keyframes apPulse{0%,100%{box-shadow:0 0 0 0 rgba(217,72,59,.0)}50%{box-shadow:0 0 0 4px rgba(217,72,59,.16)}}
.appt-alert{max-width:440px}
.appt-alert-list{margin:8px 0 4px;padding-left:18px;color:#4a4230;font-size:13px;line-height:1.7}
.appt-dash h2 .chip{vertical-align:middle}
.appt-note{cursor:pointer;border-left:3px solid #eccd8f;transition:background .12s}
.appt-note:hover{background:#fbf4e2}
.appt-note-by{color:#a49a84;font-size:11px;margin-top:3px}
@media (max-width:640px){.appt-card{padding:16px 14px}.appt-form .row2,.appt-form .row3{grid-template-columns:1fr}
  .ap-item{flex-direction:column}.ap-item-actions{flex-direction:row;align-items:stretch}.btn.sm{min-width:0;flex:1}}

/* ---------- print ---------- */
.print-only{display:none}
#printArea{display:none}
@media print{
  @page{size:A4 landscape;margin:8mm}
  body{background:#fff}
  main{padding:0 !important}
  .topbar,.no-print,.report-toolbar,.toast,.btn,.toolbar,.modal-overlay,.prop-banner,.cal-scroll{display:none !important}
  .card{box-shadow:none;border:none;padding:0}
  .report-table th{background:#eee !important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .report-table tbody tr:nth-child(even){background:#f5f5f5 !important;-webkit-print-color-adjust:exact;print-color-adjust:exact}

  /* ---- dedicated day-calendar print sheet (proportional tiles, one A4 landscape page) ---- */
  body.print-sheet #printArea{display:block !important}
  .ptitle{text-align:center;font-family:var(--serif);font-size:14pt;margin:0 0 3mm;color:#000}
  .pcal{display:flex;flex-direction:column;height:181mm;border:1px solid #888;border-bottom:none}
  .prow{display:flex;flex:1 1 0;min-height:0;border-bottom:1px solid #888}
  .phead{flex:0 0 7mm;background:#efe9da !important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .pname{flex:0 0 32mm;border-right:1px solid #888;padding:.4mm 2mm;font-size:8pt;display:flex;flex-direction:column;justify-content:center;line-height:1.12;overflow:hidden;color:#000}
  .pname b{font-weight:700}
  .pname span{color:#555;font-size:6.5pt}
  .plane{position:relative;flex:1 1 auto;overflow:hidden}
  .pcols{position:absolute;inset:0;display:flex}
  .pcols>div{flex:1;border-right:1px solid #cfcfcf}
  .pcols>div.pcol-half{flex:.5}
  .pcols>div:last-child{border-right:none}
  .phours{position:absolute;inset:0;display:flex}
  .phours .phr{flex:1;border-right:1px solid #888;font-size:7pt;display:flex;align-items:center;justify-content:center;color:#000}
  .phours .phr.phr-half{flex:.5}
  .phours .phr:last-child{border-right:none}
  .ptile{position:absolute;top:.8mm;bottom:.8mm;border:1px solid rgba(0,0,0,.3);border-radius:1.4mm;padding:.6mm 1.1mm;overflow:hidden;font-size:7.5pt;line-height:1.14;color:#1a1a1a;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .pbreak{position:absolute;top:.8mm;bottom:.8mm;background:repeating-linear-gradient(45deg,#ded9cb 0 1.6mm,#eae6db 1.6mm 3.2mm);border:1px dashed #b3ab97;border-radius:1mm;display:flex;align-items:center;justify-content:center;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .pbreak span{font-size:6pt;color:#857c6b;font-weight:700;letter-spacing:.4px;text-transform:uppercase}
  .ptile .pt-g{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ptile .pt-r{font-size:7pt;opacity:.92;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ptile .pt-d{position:absolute;right:1mm;bottom:.6mm;line-height:0}
  .ptile .pd{display:inline-block;width:1.8mm;height:1.8mm;border-radius:.4mm;margin-left:.6mm;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .ptile .pd.gn{background:#1d4ed8}
  .ptile .pd.fb{background:#ea580c}
}

/* ---- RMO on Duty card (dashboard) ---- */
.rmo-card{margin-bottom:14px;border-left:4px solid #2f7d5b}
.rmo-card .rmo-row{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.rmo-card h2{margin:0}
.rmo-pick{display:flex;flex-direction:column;font-size:12px;color:#6b6357;gap:4px;min-width:240px}
.rmo-pick select{font-size:14px;padding:7px 9px;border:1px solid #d8cfbe;border-radius:8px;background:#fff}
.rmo-card.rmo-missing{border-left-color:#c2410c;background:#fff7ed}
.rmo-card .alert-chip{background:#c2410c;color:#fff}

/* ---- Duty-roster role groups + doctor phone ---- */
.roster-grid .rg-group-row td.rg-group-head{
  background:#efe7d6;color:#5b4b32;font-weight:700;text-transform:uppercase;
  letter-spacing:.04em;font-size:12px;padding:6px 12px;border-top:2px solid #d8cfbe}
.roster-grid .rg-name .rg-phone{font-size:11px;color:#2f7d5b;margin-top:2px}

/* ---- Settings: member contact number ---- */
#membersTable input.mem-phone{width:120px;font-size:13px;padding:5px 7px;border:1px solid #d8cfbe;border-radius:6px}

/* ---- Team management: doctor group editor ---- */
.grp-room{border:1px solid #e2dac9;border-radius:10px;padding:12px 14px;margin-bottom:12px;background:#fbf8f1}
.grp-room .grp-row{display:flex;gap:18px;flex-wrap:wrap;margin-bottom:8px}
.grp-room .grp-label{display:flex;flex-direction:column;font-size:12px;color:#6b6357;gap:4px;min-width:240px}
.grp-room .grp-label input,.grp-room .grp-label select{padding:7px 9px;border:1px solid #d8cfbe;border-radius:8px;background:#fff;font-size:14px}
.grp-support{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center}
.grp-support .grp-cap{width:100%;font-size:12px;color:#6b6357;font-weight:600;margin-bottom:2px}
.grp-chk{font-size:13px;display:inline-flex;align-items:center;gap:5px;background:#fff;border:1px solid #e2dac9;border-radius:20px;padding:4px 10px}

/* ---- Dashboard: RMO + Sales row ---- */
.rmo-sales-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.rmo-sales-row .rmo-card,.rmo-sales-row .sales-card{margin-bottom:0}
@media (max-width:900px){.rmo-sales-row{grid-template-columns:1fr}}
.sales-card{border-left:4px solid #b5731f}
.sales-card .sales-totals .chip{background:#efe7d6;color:#5b4b32;margin-left:6px}
.sales-form{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:8px 0}
.sales-form input,.sales-form select{padding:7px 9px;border:1px solid #d8cfbe;border-radius:8px;background:#fff;font-size:13px}
.sales-form .s-room{width:90px}.sales-form .s-bill{width:110px}.sales-form .s-amt{width:100px}
.sales-table{border-collapse:collapse;width:100%;margin-top:4px;font-size:13px}
.sales-table th,.sales-table td{border:1px solid #e2dac9;padding:5px 8px;text-align:left}
.sales-table th{background:#efe9da;font-size:12px}
.sales-table .btn.danger{padding:2px 8px;font-size:12px}

/* ---- Dashboard: Maintenance Works ---- */
.maint-card{margin-bottom:14px;border-left:4px solid #6b7a52}
.maint-card .maint-input{flex:1;min-width:220px}
.maint-list{margin:6px 0 0;padding-left:20px;font-size:14px}
.maint-list li{margin:3px 0}
.maint-list .btn.danger{padding:1px 7px;font-size:12px;margin-left:6px}

/* ---- Duty roster: freeze the date header row while scrolling ---- */
.roster-scroll{max-height:calc(100vh - 210px);overflow:auto}
.roster-scroll thead th{position:sticky;top:0;z-index:6;background:var(--bg2)}
.roster-scroll thead th.rg-name,.roster-scroll thead th.rg-shift{z-index:7}