/* NatureCure HMS — Complete Stylesheet v14 */
/* Fonts loaded from Google — fallback to system sans-serif */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Playfair+Display:wght@500;600&display=swap');

:root{
  --g900:#052010;--g800:#0a3320;--g700:#0f4a2e;--g600:#166038;
  --g500:#1d7d48;--g400:#25a05c;--g300:#4eba7a;--g200:#8ed4a8;
  --g100:#c8edda;--g50:#edf8f2;
  --n900:#111827;--n800:#1f2937;--n700:#374151;--n600:#4b5563;
  --n500:#6b7280;--n400:#9ca3af;--n300:#d1d5db;--n200:#e5e7eb;
  --n100:#f3f4f6;--n50:#f9fafb;
  --red:#dc2626;--red-bg:#fee2e2;--red-text:#991b1b;
  --amber:#d97706;--amber-bg:#fef3c7;--amber-text:#92400e;
  --blue:#2563eb;--blue-bg:#dbeafe;--blue-text:#1e40af;
  --SB:240px;--SB0:56px;--TB:56px;
  --r:8px;--r2:5px;
  --sh:0 1px 3px rgba(0,0,0,.08),0 1px 2px rgba(0,0,0,.04);
  --sh2:0 4px 12px rgba(0,0,0,.1),0 2px 4px rgba(0,0,0,.06);
  --sh3:0 8px 24px rgba(0,0,0,.14),0 3px 8px rgba(0,0,0,.07);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{font-size:14px;}
body{font-family:'Inter',system-ui,sans-serif;color:var(--n900);background:var(--n100);min-height:100vh;}
a{text-decoration:none;color:inherit;}
button{font-family:inherit;cursor:pointer;}

/* ━━━━━━━━━━━━━━━━━━━━━━ LOGIN ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.lp{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;}
.lp-l{background:var(--g800);display:flex;flex-direction:column;justify-content:center;padding:60px;position:relative;overflow:hidden;}
.lp-l::before{content:'';position:absolute;top:-80px;right:-80px;width:300px;height:300px;border-radius:50%;background:rgba(255,255,255,.04);}
.lp-l::after{content:'';position:absolute;bottom:-60px;left:-60px;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.03);}
.lp-brand{position:relative;z-index:1;}
.lp-mark{width:50px;height:50px;background:var(--g500);border-radius:11px;display:flex;align-items:center;justify-content:center;margin-bottom:24px;}
.lp-mark svg{width:26px;height:26px;stroke:white;fill:none;stroke-width:1.8;}
.lp-brand h1{font-family:'Playfair Display',Georgia,serif;font-size:30px;color:white;line-height:1.2;margin-bottom:10px;}
.lp-brand p{font-size:14px;color:var(--g200);line-height:1.6;max-width:320px;}
.lp-feats{margin-top:44px;position:relative;z-index:1;}
.lp-feat{display:flex;align-items:flex-start;gap:13px;margin-bottom:18px;}
.lp-feat-ic{width:34px;height:34px;border-radius:7px;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.lp-feat-ic svg{width:16px;height:16px;stroke:var(--g200);fill:none;stroke-width:1.8;}
.lp-feat h3{font-size:13px;font-weight:600;color:white;margin-bottom:2px;}
.lp-feat p{font-size:12px;color:rgba(255,255,255,.45);}
.lp-r{background:white;display:flex;align-items:center;justify-content:center;padding:60px;}
.lp-box{width:100%;max-width:380px;}
.lp-box h2{font-size:22px;font-weight:600;margin-bottom:6px;}
.lp-box .sub{font-size:14px;color:var(--n500);margin-bottom:32px;}
.fi,.form-input{width:100%;padding:10px 13px;border:1.5px solid var(--n300);border-radius:var(--r2);font-size:14px;font-family:inherit;color:var(--n900);background:white;outline:none;transition:border-color .15s,box-shadow .15s;}
.fi:focus,.form-input:focus{border-color:var(--g500);box-shadow:0 0 0 3px rgba(29,125,72,.12);}
.fi::placeholder,.form-input::placeholder{color:var(--n400);}
select.form-input{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 11px center;padding-right:32px;}
textarea.form-input{resize:vertical;min-height:80px;}
.ff{margin-bottom:18px;}
.ff label{display:block;font-size:11px;font-weight:600;color:var(--n700);margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px;}
.btn-login{width:100%;padding:11px;background:var(--g700);color:white;border:none;border-radius:var(--r2);font-size:14px;font-weight:600;font-family:inherit;transition:background .15s;}
.btn-login:hover{background:var(--g800);}

/* ━━━━━━━━━━━━━━━━━━━━━━ APP SHELL ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.app{display:block;min-height:100vh;width:100%;}

/* ━━━━━━━━━━━━━━━━━━━━━━ SIDEBAR ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sidebar{
  position:fixed;top:0;left:0;z-index:300;
  width:var(--SB);height:100vh;
  background:var(--g900);
  display:flex;flex-direction:column;
  transition:width .2s ease;
  overflow:hidden;
}
.sidebar.coll{width:var(--SB0);}
/* scroll area */
.sb-body{flex:1;overflow-y:auto;overflow-x:hidden;padding-bottom:8px;}
.sb-body::-webkit-scrollbar{width:3px;}
.sb-body::-webkit-scrollbar-track{background:rgba(255,255,255,.04);}
.sb-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:3px;}
.sb-body::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.3);}
.sb-top{height:var(--TB);display:flex;align-items:center;gap:10px;padding:0 13px;border-bottom:1px solid rgba(255,255,255,.08);flex-shrink:0;overflow:hidden;}
.sb-logo{width:28px;height:28px;border-radius:6px;object-fit:cover;flex-shrink:0;}
.sb-ico{width:28px;height:28px;border-radius:6px;background:var(--g600);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.sb-ico svg{width:15px;height:15px;}
.sb-txt{overflow:hidden;white-space:nowrap;}
.sb-nm{font-family:'Playfair Display',Georgia,serif;font-size:14px;color:white;line-height:1.2;}
.sb-tg{font-size:9px;color:rgba(255,255,255,.38);text-transform:uppercase;letter-spacing:.7px;}
.sidebar.coll .sb-txt{display:none;}
/* section label */
.sb-sec{padding:12px 13px 4px;font-size:9px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:rgba(255,255,255,.26);white-space:nowrap;}
.sidebar.coll .sb-sec{height:6px;padding:0;overflow:hidden;visibility:hidden;}
/* nav links */
.sb-a{display:flex;align-items:center;gap:10px;padding:9px 13px;font-size:13px;color:rgba(255,255,255,.62);border-left:3px solid transparent;white-space:nowrap;overflow:hidden;transition:background .12s,color .12s;position:relative;}
.sb-a svg{flex-shrink:0;display:block;}
.sb-a:hover{color:white;background:rgba(255,255,255,.07);}
.sb-a.on{color:white;background:rgba(255,255,255,.1);border-left-color:var(--g300);}
.sidebar.coll .sb-a{justify-content:center;padding:9px 0;}
.sidebar.coll .sb-a span{display:none;}
.sidebar.coll .sb-a:hover::after{content:attr(data-t);position:absolute;left:62px;top:50%;transform:translateY(-50%);background:var(--g700);color:white;font-size:12px;white-space:nowrap;padding:4px 10px;border-radius:5px;box-shadow:var(--sh2);z-index:999;pointer-events:none;}
/* bottom */
.sb-bot{flex-shrink:0;border-top:1px solid rgba(255,255,255,.08);}

/* ━━━━━━━━━━━━━━━━━━━━━━ MAIN WRAP ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.mw{position:relative;margin-left:var(--SB);width:calc(100vw - var(--SB));display:flex;flex-direction:column;min-height:100vh;transition:margin-left .2s ease,width .2s ease;}
.mw.coll{margin-left:var(--SB0);width:calc(100vw - var(--SB0));}

/* ━━━━━━━━━━━━━━━━━━━━━━ TOPBAR ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.tb{height:var(--TB);background:white;border-bottom:1px solid var(--n200);display:flex;align-items:center;gap:10px;padding:0 20px;position:sticky;top:0;z-index:100;width:100%;min-width:0;}
/* hamburger */
.hbg{width:32px;height:32px;padding:0;background:none;border:1.5px solid var(--n200);border-radius:6px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;flex-shrink:0;transition:background .12s;}
.hbg:hover{background:var(--n100);border-color:var(--n300);}
.hbg span{display:block;width:15px;height:1.5px;background:var(--n600);border-radius:1px;transition:all .18s ease;transform-origin:center;}
.hbg.x span:nth-child(1){transform:translateY(5.5px) rotate(45deg);}
.hbg.x span:nth-child(2){opacity:0;transform:scaleX(0);}
.hbg.x span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg);}
.tb-title{font-size:15px;font-weight:600;color:var(--n900);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tb-right{display:flex;align-items:center;gap:8px;flex-shrink:0;}
/* user chip */
.uw{position:relative;}
.uc{display:flex;align-items:center;gap:7px;padding:4px 10px 4px 4px;background:white;border:1.5px solid var(--n200);border-radius:20px;cursor:pointer;transition:all .12s;user-select:none;}
.uc:hover{background:var(--n50);border-color:var(--n300);}
.ua{width:28px;height:28px;border-radius:50%;background:var(--g700);color:white;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0;}
.ui{display:flex;flex-direction:column;line-height:1.2;}
.un{font-size:12px;font-weight:600;color:var(--n900);max-width:100px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ur{font-size:10px;color:var(--n500);}
.uarr{color:var(--n400);flex-shrink:0;display:flex;}
/* user dropdown */
.udd{display:none;position:absolute;top:calc(100% + 8px);right:0;min-width:200px;background:white;border:1px solid var(--n200);border-radius:var(--r);box-shadow:var(--sh3);z-index:9999;overflow:hidden;}
.udd.show{display:block;}
.udd-hd{padding:12px 15px 10px;background:var(--n50);border-bottom:1px solid var(--n100);}
.udd-nm{font-size:13px;font-weight:600;color:var(--n900);}
.udd-rl{font-size:11px;color:var(--n500);margin-top:2px;}
.udd-a{display:flex;align-items:center;gap:9px;padding:9px 15px;font-size:13px;color:var(--n700);transition:background .1s;}
.udd-a:hover{background:var(--n50);}
.udd-sep{height:1px;background:var(--n100);}
.udd-out{color:var(--red)!important;}
.udd-out:hover{background:var(--red-bg)!important;}

/* ━━━━━━━━━━━━━━━━━━━━━━ PAGE ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.pc,.page-content{padding:22px;flex:1;width:100%;min-width:0;}

/* ━━━━━━━━━━━━━━━━━━━━━━ BUTTONS ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 15px;border-radius:var(--r2);font-size:13px;font-weight:500;border:1.5px solid transparent;cursor:pointer;transition:all .13s;white-space:nowrap;line-height:1;font-family:inherit;}
.btn svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2;flex-shrink:0;}
.btn-sm{padding:5px 12px;font-size:12px;}
.btn-xs{padding:3px 9px;font-size:11px;}
.btn-primary{background:var(--g700);color:white;border-color:var(--g700);}
.btn-primary:hover{background:var(--g800);}
.btn-secondary{background:var(--g50);color:var(--g700);border-color:var(--g200);}
.btn-secondary:hover{background:var(--g100);}
.btn-outline{background:white;color:var(--n700);border-color:var(--n300);}
.btn-outline:hover{background:var(--n50);border-color:var(--n400);}
.btn-danger{background:var(--red-bg);color:var(--red-text);border-color:#fca5a5;}
.btn-danger:hover{background:#fecaca;}
.btn-ghost{background:transparent;color:var(--n600);border-color:transparent;}
.btn-ghost:hover{background:var(--n100);}
.btn-white{background:white;color:var(--g800);border-color:white;font-weight:600;}
.btn-white:hover{background:var(--g50);}
.btn-white-outline{background:rgba(255,255,255,.12);color:white;border-color:rgba(255,255,255,.3);}
.btn-white-outline:hover{background:rgba(255,255,255,.2);}

/* ━━━━━━━━━━━━━━━━━━━━━━ CARD ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.card{background:white;border:1px solid var(--n200);border-radius:var(--r);box-shadow:var(--sh);overflow:visible;}
/* Card children that need clipping for border-radius */
.card > table,.card > .card-header:first-child,.card > div > table{border-radius:var(--r) var(--r) 0 0;}
/* Dropdown containers inside cards must escape overflow */
.card .dropdown-anchor{position:relative;}
.card-header{display:flex;align-items:center;justify-content:space-between;padding:13px 18px;border-bottom:1px solid var(--n200);}
.card-header h2{font-size:14px;font-weight:600;color:var(--n900);}
.card-header .actions{display:flex;gap:8px;}
.card-body{padding:18px;}

/* ━━━━━━━━━━━━━━━━━━━━━━ STATS ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px;}
.stat-card{background:white;border:1px solid var(--n200);border-radius:var(--r);padding:16px 18px;display:flex;align-items:flex-start;gap:13px;box-shadow:var(--sh);position:relative;overflow:hidden;transition:box-shadow .15s;}
.stat-card:hover{box-shadow:var(--sh2);}
.stat-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--g500);opacity:0;transition:opacity .2s;}
.stat-card:hover::after{opacity:1;}
.stat-icon{width:40px;height:40px;border-radius:8px;background:var(--g50);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.stat-icon svg{width:19px;height:19px;stroke:var(--g600);fill:none;stroke-width:1.8;}
.stat-icon.amber{background:var(--amber-bg);}
.stat-icon.amber svg{stroke:var(--amber)!important;}
.stat-icon.blue{background:var(--blue-bg);}
.stat-icon.blue svg{stroke:var(--blue)!important;}
.stat-icon.red{background:var(--red-bg);}
.stat-icon.red svg{stroke:var(--red)!important;}
.stat-label{font-size:10px;font-weight:600;color:var(--n500);text-transform:uppercase;letter-spacing:.5px;}
.stat-value{font-size:23px;font-weight:700;color:var(--n900);margin-top:3px;line-height:1;}
.stat-sub{font-size:11px;color:var(--n500);margin-top:3px;}

/* ━━━━━━━━━━━━━━━━━━━━━━ TABLE ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.table-wrap{overflow-x:auto;}
table{width:100%;border-collapse:collapse;}
thead th{padding:9px 13px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--n500);background:var(--n50);border-bottom:1px solid var(--n200);text-align:left;white-space:nowrap;}
tbody td{padding:11px 13px;border-bottom:1px solid var(--n100);color:var(--n700);vertical-align:middle;font-size:13px;}
tbody tr:last-child td{border-bottom:none;}
tbody tr:hover td{background:var(--g50);}
td strong{color:var(--n900);font-weight:500;}

/* ━━━━━━━━━━━━━━━━━━━━━━ BADGES ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.badge{display:inline-flex;align-items:center;padding:3px 9px;border-radius:20px;font-size:11px;font-weight:600;white-space:nowrap;}
.badge-waiting{background:var(--amber-bg);color:var(--amber-text);}
.badge-progress{background:var(--blue-bg);color:var(--blue-text);}
.badge-done{background:var(--g100);color:var(--g700);}
.badge-cancelled{background:var(--red-bg);color:var(--red-text);}
.badge-admin{background:#ede9fe;color:#5b21b6;}
.badge-doctor{background:var(--blue-bg);color:var(--blue-text);}
.badge-recept{background:var(--g100);color:var(--g700);}
.badge-pharma{background:var(--amber-bg);color:var(--amber-text);}
.badge-active{background:var(--g100);color:var(--g700);}
.badge-inactive{background:var(--red-bg);color:var(--red-text);}
.badge-lowstock{background:var(--red-bg);color:var(--red-text);}
.badge-ok{background:var(--g100);color:var(--g700);}
.badge-warning{background:var(--amber-bg);color:var(--amber-text);}

/* ━━━━━━━━━━━━━━━━━━━━━━ FORMS ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.form-group{margin-bottom:16px;}
.form-group label{display:block;font-size:11px;font-weight:600;color:var(--n600);margin-bottom:6px;text-transform:uppercase;letter-spacing:.4px;}
.form-group .help{font-size:11px;color:var(--n500);margin-top:4px;}
.form-group .error{font-size:11px;color:var(--red);margin-top:4px;}
.form-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.form-grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;}

/* ━━━━━━━━━━━━━━━━━━━━━━ PAGE HEADER ━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.page-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:20px;}
.page-header h1{font-size:20px;font-weight:700;color:var(--n900);}
.page-header p{font-size:13px;color:var(--n500);margin-top:3px;}
.page-header .actions{display:flex;gap:8px;flex-shrink:0;}

/* ━━━━━━━━━━━━━━━━━━━━━━ PROFILE BANNER ━━━━━━━━━━━━━━━━━━━━━━━ */
.profile-banner{background:linear-gradient(135deg,var(--g900),var(--g700));border-radius:var(--r);padding:22px 26px;margin-bottom:20px;display:flex;align-items:center;gap:18px;box-shadow:var(--sh2);}
.profile-avatar{width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.15);border:2px solid rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;color:white;flex-shrink:0;}
.profile-name{font-family:'Playfair Display',Georgia,serif;font-size:20px;font-weight:600;color:white;}
.profile-meta{display:flex;flex-wrap:wrap;gap:13px;margin-top:4px;}
.profile-meta span{font-size:12px;color:rgba(255,255,255,.62);display:flex;align-items:center;gap:4px;}
.profile-meta svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.8;}
.profile-actions{margin-left:auto;display:flex;gap:8px;flex-shrink:0;}

/* ━━━━━━━━━━━━━━━━━━━━━━ VISIT CARDS ━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.visit-card{border:1px solid var(--n200);border-radius:var(--r);margin-bottom:11px;overflow:hidden;box-shadow:var(--sh);}
.visit-card-head{background:var(--n50);padding:11px 15px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--n200);}
.visit-card-head .vdate{font-weight:600;font-size:13px;color:var(--g800);}
.visit-card-head .vdoc{font-size:12px;color:var(--n500);}
.visit-card-body{padding:14px 15px;}
.field-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--n400);margin-bottom:4px;}
.field-value{font-size:13px;color:var(--n700);line-height:1.5;margin-bottom:12px;}

/* ━━━━━━━━━━━━━━━━━━━━━━ RX / PRESCRIPTION ━━━━━━━━━━━━━━━━━━━━ */
.rx-wrap{border:1px solid var(--n200);border-radius:7px;overflow:hidden;margin-top:5px;}
.rx-table{width:100%;border-collapse:collapse;font-size:12.5px;}
.rx-table th{background:var(--g800);color:white;padding:7px 11px;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;text-align:left;}
.rx-table td{padding:8px 11px;border-bottom:1px solid var(--n100);}
.rx-table tr:last-child td{border-bottom:none;}
/* prescription form rows */
.rx-row{background:var(--n50);border:1px solid var(--n200);border-radius:7px;padding:14px;margin-bottom:11px;position:relative;}
.rx-row-num{position:absolute;top:11px;left:12px;width:20px;height:20px;background:var(--g700);color:white;border-radius:50%;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;}
.rx-row-inner{padding-left:30px;}

/* ━━━━━━━━━━━━━━━━━━━━━━ TOKEN ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.token{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:28px;background:var(--g700);color:white;border-radius:6px;font-weight:700;font-size:12px;padding:0 6px;}

/* ━━━━━━━━━━━━━━━━━━━━━━ ALERTS ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.alert{display:flex;align-items:center;gap:9px;padding:11px 14px;border-radius:var(--r2);font-size:13px;margin-bottom:12px;border:1px solid;}
.alert svg{flex-shrink:0;}
.alert-success{background:var(--g50);color:var(--g700);border-color:var(--g200);}
.alert-error{background:var(--red-bg);color:var(--red-text);border-color:#fca5a5;}
.alert-warning{background:var(--amber-bg);color:var(--amber-text);border-color:#fcd34d;}
.alert-info{background:var(--blue-bg);color:var(--blue-text);border-color:#93c5fd;}

/* ━━━━━━━━━━━━━━━━━━━━━━ REPORT ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.report-header{background:var(--g900);color:white;padding:22px 26px;border-radius:var(--r) var(--r) 0 0;display:flex;justify-content:space-between;align-items:flex-start;}
.report-title{font-family:'Playfair Display',Georgia,serif;font-size:19px;font-weight:600;}
.report-subtitle{font-size:10px;color:var(--g200);margin-top:2px;letter-spacing:.5px;text-transform:uppercase;}

/* ━━━━━━━━━━━━━━━━━━━━━━ ACCESS DENIED ━━━━━━━━━━━━━━━━━━━━━━━━ */
.denied-page{display:flex;align-items:center;justify-content:center;min-height:60vh;}
.denied-box{text-align:center;max-width:400px;}
.denied-box svg{width:48px;height:48px;stroke:var(--n300);fill:none;stroke-width:1.5;margin-bottom:16px;}
.denied-box h2{font-size:20px;font-weight:600;margin-bottom:8px;}
.denied-box p{color:var(--n500);font-size:14px;margin-bottom:20px;}

/* ━━━━━━━━━━━━━━━━━━━━━━ USER AVATAR (small) ━━━━━━━━━━━━━━━━━━ */
.user-avatar-sm{width:30px;height:30px;border-radius:50%;background:var(--g600);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:white;flex-shrink:0;}

/* ━━━━━━━━━━━━━━━━━━━━━━ LAYOUT GRID ━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;}
.grid-2-1{display:grid;grid-template-columns:2fr 1fr;gap:18px;}
.grid-1-2{display:grid;grid-template-columns:1fr 2fr;gap:18px;}

/* ━━━━━━━━━━━━━━━━━━━━━━ UTILITIES ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.mb-6{margin-bottom:6px;}.mb-12{margin-bottom:12px;}.mb-14{margin-bottom:14px;}.mb-16{margin-bottom:16px;}.mb-20{margin-bottom:20px;}.mb-24{margin-bottom:24px;}
.mt-12{margin-top:12px;}.mt-14{margin-top:14px;}.mt-20{margin-top:20px;}
.text-muted{color:var(--n500);}.text-sm{font-size:12px;}.fw-500{font-weight:500;}.fw-600{font-weight:600;}
.stock-low{color:var(--red)!important;font-weight:600;}
.stock-ok{color:var(--g600)!important;font-weight:600;}
.no-print{} /* placeholder so templates can reference */

/* ━━━━━━━━━━━━━━━━━━━━━━ PRINT ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* ── RESPONSIVE / MOBILE ──────────────────────────────────────────────── */
@media (max-width:900px){
  .stats-row{grid-template-columns:repeat(2,1fr)!important;}
  .stats-row-3{grid-template-columns:repeat(2,1fr)!important;}
  .grid-2,.grid-2-1,.grid-1-2{grid-template-columns:1fr!important;}
  .grid-3{grid-template-columns:1fr 1fr!important;}
  .bill-patient-grid{grid-template-columns:1fr 1fr!important;}
  .slot-grid{grid-template-columns:repeat(3,1fr)!important;}
}

@media (max-width:768px){
  :root{--SB:240px;--SB0:0px;}

  /* ── Sidebar: hidden off-screen, slides in on hamburger ── */
  .sidebar{
    position:fixed!important;left:-244px!important;top:0;bottom:0;
    width:240px!important;z-index:500;
    transition:left .22s ease;
    box-shadow:none;
    overflow:hidden!important;
  }
  .sidebar.open{
    left:0!important;
    box-shadow:6px 0 32px rgba(0,0,0,.32)!important;
  }
  /* Dim overlay */
  #sb-overlay{
    display:none;position:fixed;inset:0;
    background:rgba(0,0,0,.45);z-index:499;
  }
  #sb-overlay.show{display:block;}

  /* ── Main: always full width ── */
  .mw,.mw.coll{
    margin-left:0!important;
    width:100vw!important;
    min-width:0!important;
  }

  /* ── Topbar ── */
  .tb{padding:0 12px;}
  .tb-title{font-size:14px;}
  /* hide search + bill buttons on mobile topbar to save space */
  .tb .btn-outline,.tb .btn-primary:not(.tb-keep){
    display:none;
  }
  /* user chip — hide name */
  .un,.ur,.uarr{display:none!important;}
  .uc{padding:4px;}

  /* ── Page content ── */
  .pc,.page-content{padding:12px 10px!important;}

  /* ── Cards ── */
  .card{border-radius:7px;}

  /* ── Page header ── */
  .page-header{flex-direction:column;align-items:stretch;gap:10px;}
  .page-header .actions,.page-header > a,.page-header > div:last-child{
    display:flex;flex-wrap:wrap;gap:6px;
  }

  /* ── Form grids ── */
  .form-grid-2,.form-grid-3,
  .grid-2,.grid-3,.grid-2-1,.grid-1-2{
    grid-template-columns:1fr!important;
  }

  /* ── Stats ── */
  .stats-row,.stats-row-3{grid-template-columns:1fr 1fr!important;}
  .stat-value{font-size:20px!important;}

  /* ── Tables: horizontal scroll ── */
  .card table,table{
    display:block;overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    min-width:0;
  }
  thead,tbody,tfoot,tr{width:100%;}

  /* ── Package form: stack medicine rows vertically ── */
  .med-row{
    display:flex!important;
    flex-direction:column!important;
    gap:8px!important;
    padding:12px!important;
    grid-template-columns:unset!important;
  }
  .med-row input,.med-row select{
    width:100%!important;
    font-size:13px!important;
  }
  /* show labels above each field */
  .med-row::before{
    content:'Medicine';
    font-size:10px;font-weight:700;
    text-transform:uppercase;color:var(--n400);
  }

  /* ── Prescription rows: stack ── */
  .rx-row-inner > div[style*="grid"]{
    display:flex!important;flex-direction:column!important;gap:8px!important;
  }

  /* ── Bill / estimation layout ── */
  .bill-create-layout{flex-direction:column!important;}
  .bill-sidebar{width:100%!important;position:static!important;}
  .bill-patient-grid{grid-template-columns:1fr 1fr!important;}

  /* ── Day picker ── */
  .day-picker{grid-template-columns:repeat(4,1fr)!important;}

  /* ── Slot grid ── */
  .slot-grid{grid-template-columns:repeat(3,1fr)!important;}

  /* ── Profile banner ── */
  .profile-banner{flex-direction:column;gap:12px;}
  .profile-actions{margin-left:0!important;width:100%;flex-wrap:wrap;}
  .profile-actions .btn{flex:1;}

  /* ── Filter bar ── */
  .filter-bar{flex-direction:column;align-items:stretch;}
  .filter-bar .form-input,.filter-bar select{width:100%;}

  /* ── Topbar buttons show in page instead ── */
  .mobile-actions{display:flex!important;flex-wrap:wrap;gap:8px;margin-bottom:12px;}

  /* ── Doctor picker cards ── */
  .doc-pick-label{padding:9px 11px;}

  /* ── Totals block ── */
  .totals-block{justify-content:stretch;}
  .totals-inner{min-width:0!important;width:100%!important;}
}

@media (max-width:480px){
  .stats-row,.stats-row-3{grid-template-columns:1fr!important;}
  .day-picker{grid-template-columns:repeat(4,1fr)!important;}
  .slot-grid{grid-template-columns:repeat(2,1fr)!important;}
  .pc,.page-content{padding:8px 6px!important;}
  .card-body{padding:12px!important;}
  .page-header h1{font-size:17px!important;}
}

/* Mobile actions div — hidden on desktop */
.mobile-actions{display:none;}

@media print{
  .sidebar,.tb,.btn,.no-print{display:none!important;}
  .mw{margin-left:0!important;width:100%!important;}
  .pc,.page-content{padding:0!important;}
  body{background:white!important;}
  .card{box-shadow:none!important;border:1px solid #ccc!important;}
}

/* ━━━━━━━━━━━━━━━━━━━━ MISSING & ENHANCEMENT CSS ━━━━━━━━━━━━━━━━━━ */

/* visit-card inner elements */
.vdate{font-weight:600;font-size:13px;color:var(--g800);}
.vdoc{font-size:12px;color:var(--n500);}

/* form helpers */
.help{font-size:11px;color:var(--n500);margin-top:4px;}
.error{font-size:11px;color:var(--red);margin-top:4px;}
.form-input-lg{font-size:16px!important;padding:12px 16px!important;}

/* inline table row classes for bill/purchase forms */
.row-med,.row-qty,.row-prc,.row-price,.row-gst,
.por-med,.por-qty,.por-cost,.por-gst{
  width:100%;padding:6px 8px;border:1.5px solid var(--n300);
  border-radius:var(--r2);font-size:12px;font-family:inherit;
  color:var(--n900);background:white;outline:none;
  transition:border-color .15s;
}
.row-med:focus,.row-qty:focus,.row-prc:focus,.row-price:focus,.row-gst:focus,
.por-med:focus,.por-qty:focus,.por-cost:focus,.por-gst:focus{
  border-color:var(--g500);box-shadow:0 0 0 2px rgba(29,125,72,.1);
}
.row-qty,.row-prc,.row-price,.por-qty,.por-cost{text-align:right;}

/* stats-row 3-col variant */
.stats-row-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:20px;}

/* search-box */
.search-box{display:flex;gap:8px;align-items:stretch;}
.search-box .form-input{flex:1;}

/* user-avatar-sm */
.user-avatar-sm{width:30px;height:30px;border-radius:50%;background:var(--g600);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:white;flex-shrink:0;}

/* period button active state for sales report */
.period-active{background:var(--g700)!important;color:white!important;border-color:var(--g700)!important;}

/* inline item table (bill/purchase forms) */
.item-table{width:100%;border-collapse:collapse;}
.item-table th{padding:8px 10px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:rgba(255,255,255,.75);background:var(--g900);text-align:left;white-space:nowrap;}
.item-table td{padding:7px 6px;border-bottom:1px solid var(--n100);vertical-align:middle;}
.item-table tr:last-child td{border-bottom:none;}

/* patient search result box */
.pat-results-box{position:absolute;left:0;right:0;border:1px solid var(--n200);border-radius:0 0 var(--r) var(--r);background:white;z-index:200;max-height:220px;overflow-y:auto;box-shadow:var(--sh2);}
.pat-result-item{padding:10px 14px;cursor:pointer;border-bottom:1px solid var(--n100);font-size:13px;display:flex;justify-content:space-between;align-items:center;}
.pat-result-item:hover{background:var(--g50);}
.pat-selected-card{background:var(--g50);border:1.5px solid var(--g300);border-radius:var(--r);padding:12px 16px;display:flex;align-items:center;justify-content:space-between;}

/* bill/est summary sidebar */
.summary-sidebar{background:white;border:1px solid var(--n200);border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);}
.summary-sidebar-header{background:var(--g900);padding:14px 18px;}
.summary-sidebar-title{font-size:11px;color:var(--g200);text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px;}
.summary-sidebar-name{font-size:16px;font-weight:600;color:white;}
.summary-item-row{display:flex;justify-content:space-between;align-items:baseline;padding:5px 0;border-bottom:1px solid var(--n100);font-size:12px;}
.summary-total-row{display:flex;justify-content:space-between;font-size:18px;font-weight:700;color:var(--g700);padding:10px 0;border-top:2px solid var(--g700);}
.summary-sub-row{display:flex;justify-content:space-between;font-size:13px;color:var(--n500);margin-bottom:5px;}
.summary-gst-row{display:flex;justify-content:space-between;font-size:13px;color:var(--n700);margin-bottom:5px;}
.summary-disc-row{display:flex;justify-content:space-between;font-size:13px;color:var(--amber);margin-bottom:5px;}

/* profile banner action buttons */
.btn-white{background:white;color:var(--g800);border-color:white;font-weight:600;}
.btn-white:hover{background:var(--g50);}
.btn-white-outline{background:rgba(255,255,255,.12);color:white;border-color:rgba(255,255,255,.3);}
.btn-white-outline:hover{background:rgba(255,255,255,.2);}

/* stat sub text */
.stat-sub{font-size:11px;color:var(--n500);margin-top:3px;}

/* doctor schedule card */
.doc-card{background:white;border:1px solid var(--n200);border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);transition:box-shadow .15s;}
.doc-card:hover{box-shadow:var(--sh2);}
.doc-card-header{background:var(--g900);padding:16px 18px;display:flex;align-items:center;gap:12px;}
.doc-avatar{width:40px;height:40px;border-radius:50%;background:var(--g500);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:white;flex-shrink:0;}
.doc-name{font-size:14px;font-weight:600;color:white;}
.doc-spec{font-size:12px;color:var(--g200);}
.doc-body{padding:14px 18px;}
.doc-sched{background:var(--n50);border-radius:6px;padding:11px 13px;margin-bottom:12px;}
.doc-day{display:inline-flex;align-items:center;justify-content:center;width:32px;height:26px;border-radius:5px;font-size:10px;font-weight:600;margin-right:3px;}
.doc-day-on{background:var(--g700);color:white;}
.doc-day-off{background:var(--n100);color:var(--n400);}

/* supplier card */
.sup-card{background:white;border:1px solid var(--n200);border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);}
.sup-card-header{background:var(--g900);padding:14px 18px;display:flex;align-items:center;gap:12px;}

/* empty state */
.empty-state{text-align:center;padding:48px 20px;color:var(--n400);}
.empty-state svg{width:40px;height:40px;stroke:var(--n300);fill:none;stroke-width:1.5;margin-bottom:12px;}
.empty-state p{font-size:14px;font-weight:500;margin-bottom:4px;}
.empty-state .sub{font-size:13px;color:var(--n400);margin-bottom:16px;}

/* input group / inline forms */
.input-group{display:flex;gap:8px;align-items:center;}
.input-group .form-input{flex:1;}

/* status select inline */
.status-select{padding:5px 28px 5px 10px;font-size:12px;border:1px solid var(--n200);border-radius:var(--r2);background:white;cursor:pointer;}

/* scrollbar */
::-webkit-scrollbar{width:5px;height:5px;}
::-webkit-scrollbar-track{background:var(--n100);}
::-webkit-scrollbar-thumb{background:var(--n300);border-radius:3px;}
::-webkit-scrollbar-thumb:hover{background:var(--n400);}

/* purchase/bill form table wrapper */
.po-table-wrap{overflow-x:auto;border:1px solid var(--n200);border-radius:var(--r);margin-bottom:14px;}
.po-table{width:100%;border-collapse:collapse;min-width:640px;}
.po-table th{padding:9px 10px;font-size:11px;font-weight:600;text-transform:uppercase;color:rgba(255,255,255,.75);background:var(--g900);text-align:left;white-space:nowrap;}
.po-table td{padding:7px 7px;border-bottom:1px solid var(--n100);vertical-align:middle;}
.po-table tr:last-child td{border-bottom:none;}
.po-table tfoot td{padding:8px 10px;background:var(--n50);}

/* page sections / separators */
.section-title{font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--n500);margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--n200);}

/* appointment booking slots */
.slot-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;min-height:60px;}
.slot-btn{padding:7px 4px;text-align:center;border-radius:6px;font-size:11px;font-weight:500;border:1.5px solid var(--g300);background:white;color:var(--g700);cursor:pointer;transition:all .12s;}
.slot-btn:hover{background:var(--g50);}
.slot-btn.selected{background:var(--g700);border-color:var(--g700);color:white;}
.slot-btn.booked{background:var(--n100);border-color:var(--n200);color:var(--n400);cursor:not-allowed;}

/* patient search phone box */
.search-phone-box{background:white;border:1px solid var(--n200);border-radius:var(--r);padding:30px;box-shadow:var(--sh);max-width:520px;margin:60px auto;}
.search-phone-box h2{font-size:18px;font-weight:600;margin-bottom:6px;}
.search-phone-box p{color:var(--n500);font-size:13px;margin-bottom:22px;}

/* consultation past history sidebar */
.history-sidebar-card{background:white;border:1px solid var(--n200);border-radius:var(--r);margin-bottom:10px;overflow:hidden;box-shadow:var(--sh);}
.history-sidebar-head{background:var(--g900);padding:9px 13px;display:flex;justify-content:space-between;align-items:center;}
.history-sidebar-date{font-size:12px;font-weight:600;color:white;}
.history-sidebar-body{padding:11px 13px;}
.history-field-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--n400);margin-bottom:3px;}
.history-field-value{font-size:12px;color:var(--n700);margin-bottom:7px;line-height:1.5;}
.history-rx-row{font-size:12px;color:var(--g700);padding:3px 0;border-bottom:1px solid var(--n100);display:flex;justify-content:space-between;}

/* bill detail patient info */
.bill-patient-info{background:var(--g50);border:1px solid var(--g200);border-radius:var(--r);padding:13px 16px;margin-bottom:18px;}
.bill-patient-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;font-size:13px;}
.bill-info-label{font-size:10px;color:var(--n400);text-transform:uppercase;letter-spacing:.4px;margin-bottom:2px;}
.bill-info-value{font-weight:500;color:var(--n900);}

/* totals block */
.totals-block{display:flex;justify-content:flex-end;}
.totals-inner{min-width:260px;}
.total-row{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--n100);font-size:13px;color:var(--n500);}
.total-row-gst{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--n100);font-size:13px;color:var(--n700);}
.total-row-disc{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--n100);font-size:13px;color:var(--amber);}
.total-row-final{display:flex;justify-content:space-between;padding:12px 0;font-size:19px;font-weight:700;color:var(--g700);}

/* day picker in doctor form */
.day-picker{display:grid;grid-template-columns:repeat(7,1fr);gap:7px;}
.day-label{display:flex;flex-direction:column;align-items:center;gap:5px;padding:11px 6px;border:1.5px solid var(--n200);border-radius:7px;cursor:pointer;transition:all .13s;text-align:center;}
.day-label.active{border-color:var(--g500);background:var(--g50);}
.day-label .day-name{font-size:12px;font-weight:600;color:var(--n700);}
.day-label .day-full{font-size:9px;color:var(--n400);}

/* step circles (booking form) */
.step-num{background:var(--g700);color:white;width:22px;height:22px;border-radius:50%;font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;}

/* doctor booking card */
.doc-pick-label{display:flex;align-items:center;gap:12px;padding:11px 13px;border:1.5px solid var(--n200);border-radius:7px;cursor:pointer;transition:all .14s;margin-bottom:7px;}
.doc-pick-label:hover{border-color:var(--g300);background:var(--g50);}
.doc-pick-label.selected{border-color:var(--g500);background:var(--g50);}

/* Clinic settings preview */
.settings-preview{background:var(--g900);padding:14px 16px;border-radius:7px;}
.settings-preview-name{font-size:14px;font-weight:700;color:white;}
.settings-preview-tag{font-size:10px;color:var(--g200);margin-top:2px;}
.settings-preview-addr{font-size:10px;color:rgba(168,223,192,.7);margin-top:5px;}
.settings-preview-gstin{font-size:10px;color:rgba(168,223,192,.6);}

/* Filter bar */
.filter-bar{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;padding:14px 18px;background:var(--n50);border-bottom:1px solid var(--n200);}

/* info box variants */
.info-box{padding:12px 16px;border-radius:var(--r);font-size:13px;}
.info-box-green{background:var(--g50);border:1px solid var(--g200);color:var(--g700);}
.info-box-amber{background:var(--amber-bg);border:1px solid #fcd34d;color:var(--amber-text);}
.info-box-blue{background:var(--blue-bg);border:1px solid #93c5fd;color:var(--blue-text);}
