/* ============================================================
   Standard Providers — doctor/clinic portal
   Clean medical white · bone · baby blue · deep navy (Standard family).
   Screen UI + a print stylesheet for the order sheet.
   ============================================================ */
:root{
  --white:#fff; --bone:#f6f9fc; --panel:#fff; --mist:#eaf3fb;
  --sky:#8fc6f0; --sky-soft:#cfe6f8; --sky-deep:#1f72bd; --sky-line:#dce9f5;
  --navy:#0d2c49; --navy-2:#123a5f;
  --ink:#13273c; --ink-2:#45566a; --ink-soft:#6b7a8c;
  --hair:#dfe8f1; --hair-2:#cddbe9;
  --ok:#1f9d6b; --warn:#b9791b; --bad:#c0392b;
  --radius:12px;
  --font-head:"Spectral",Georgia,serif;
  --font:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,monospace;
  --maxw:1040px;
}
*{box-sizing:border-box;}
html,body{margin:0;}
body{background:var(--bone);color:var(--ink-2);font-family:var(--font);line-height:1.5;
  -webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;min-height:100vh;}
h1,h2,h3{color:var(--ink);margin:0;font-weight:600;}
a{color:var(--sky-deep);}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px;}
.hidden{display:none!important;}
.muted{color:var(--ink-soft);} .small{font-size:12.5px;}

/* ---- login gate ---- */
.gate{min-height:100vh;display:grid;place-items:center;padding:40px 20px;
  background:radial-gradient(120% 90% at 50% -10%,#eaf3fb,var(--bone) 60%);}
.gate-card{width:min(410px,100%);background:var(--white);border:1px solid var(--hair);border-radius:16px;
  padding:clamp(26px,5vw,38px);box-shadow:0 30px 70px -34px rgba(13,44,73,.35);}
.gate-card .eyebrow{color:var(--sky-deep);font-weight:700;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;margin:0 0 6px;}
.gate-card h1{font-family:var(--font-head);font-size:clamp(1.5rem,5vw,1.9rem);margin:0 0 4px;}
.gate-card .sub{color:var(--ink-soft);margin:0 0 22px;font-size:14px;}
.field{margin-bottom:14px;}
.field label{display:block;font-size:12.5px;font-weight:600;color:var(--ink);margin-bottom:5px;}
.field label .req{color:var(--bad);}
.field input,.field textarea,.field select{width:100%;padding:11px 13px;border:1px solid var(--hair-2);border-radius:10px;
  font:inherit;font-size:15px;color:var(--ink);background:var(--white);}
.field input:focus,.field textarea:focus{outline:2px solid var(--sky);outline-offset:1px;border-color:var(--sky);}
.msg{font-size:13px;margin:10px 0 0;min-height:18px;} .msg.err{color:var(--bad);} .msg.ok{color:var(--ok);}

/* ---- buttons ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;border:1px solid transparent;
  border-radius:10px;padding:11px 18px;font:inherit;font-weight:600;font-size:14px;transition:background .15s,transform .1s,box-shadow .15s;}
.btn:active{transform:translateY(1px);}
.btn-primary{background:var(--navy);color:#fff;} .btn-primary:hover{background:var(--navy-2);box-shadow:0 10px 24px -12px rgba(13,44,73,.6);}
.btn-primary.full{width:100%;}
.btn-sky{background:var(--sky-deep);color:#fff;}
.btn-ghost{background:var(--white);border-color:var(--hair-2);color:var(--ink);} .btn-ghost:hover{background:var(--mist);}
.btn-sm{padding:8px 13px;font-size:13px;border-radius:9px;}

/* ---- portal shell ---- */
.top{background:var(--white);border-bottom:1px solid var(--hair);position:sticky;top:0;z-index:20;}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 20px;flex-wrap:wrap;}
.brand{display:flex;flex-direction:column;gap:1px;}
.brand .name{font-family:var(--font-head);font-weight:600;font-size:1.2rem;color:var(--navy);}
.brand .sub{font-size:11.5px;color:var(--ink-soft);letter-spacing:.02em;}
.who{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--ink-soft);}
.who b{color:var(--ink);}
.role-chip{font-size:10px;letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border-radius:999px;border:1px solid var(--hair-2);color:var(--sky-deep);}
.tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding:10px 20px 0;max-width:var(--maxw);margin:0 auto;}
.tabs::-webkit-scrollbar{display:none;}
.tab{white-space:nowrap;border:1px solid transparent;background:transparent;color:var(--ink-soft);
  padding:9px 16px;border-radius:9px 9px 0 0;font-weight:600;font-size:13.5px;cursor:pointer;}
.tab:hover{color:var(--ink);}
.tab[aria-selected="true"]{background:var(--white);color:var(--navy);border-color:var(--hair);border-bottom-color:var(--white);box-shadow:0 -2px 0 var(--sky-deep) inset;}
.main{padding:22px 0 70px;}
.view{display:none;} .view.active{display:block;}
.view-head{margin-bottom:16px;}
.view-head h2{font-family:var(--font-head);font-size:clamp(1.3rem,3vw,1.7rem);}
.view-head p{margin:4px 0 0;color:var(--ink-soft);font-size:14px;max-width:66ch;}

/* cards / panels */
.card{background:var(--white);border:1px solid var(--hair);border-radius:var(--radius);padding:20px 22px;box-shadow:0 1px 0 rgba(13,44,73,.03);}
.card + .card{margin-top:14px;}
.card h3{font-size:15px;margin:0 0 12px;}
.sec{margin:22px 0 10px;display:flex;align-items:baseline;gap:12px;}
.sec h2{font-family:var(--font-head);font-size:1.1rem;color:var(--navy);} .sec .rule{flex:1;height:1px;background:var(--hair);} .sec .hint{font-size:12px;color:var(--ink-soft);}
.catswitch{display:flex;gap:8px;margin-bottom:14px;}
.catswitch button{border:1px solid var(--hair-2);background:var(--white);color:var(--ink-2);padding:9px 16px;border-radius:10px;font:inherit;font-weight:600;font-size:14px;cursor:pointer;}
.catswitch button[aria-pressed="true"]{background:var(--navy);color:#fff;border-color:var(--navy);}

/* product table */
.tbl-wrap{overflow-x:auto;border:1px solid var(--hair);border-radius:10px;}
table{width:100%;border-collapse:collapse;min-width:560px;}
thead th{background:var(--mist);color:var(--navy);font-size:11px;letter-spacing:.05em;text-transform:uppercase;text-align:left;padding:10px 14px;font-weight:700;border-bottom:1px solid var(--hair);white-space:nowrap;}
th.num,td.num{text-align:right;}
tbody td{padding:9px 14px;border-bottom:1px solid var(--hair);font-size:14px;color:var(--ink);vertical-align:middle;}
tbody tr:last-child td{border-bottom:none;}
tbody tr.on{background:#f2f8fe;}
.prod{font-weight:600;} .spec{color:var(--ink-soft);font-size:12.5px;}
.grp td{background:var(--navy);color:#fff;font-weight:600;font-size:12px;letter-spacing:.05em;text-transform:uppercase;padding:8px 14px;}
input.qty{width:64px;padding:7px 8px;border:1px solid var(--hair-2);border-radius:8px;font:inherit;font-size:14px;text-align:right;color:var(--ink);}
input.qty:focus{outline:2px solid var(--sky);outline-offset:1px;border-color:var(--sky);}
.line{font-weight:600;color:var(--navy);}

.totals{position:sticky;bottom:0;margin-top:16px;display:flex;justify-content:flex-end;gap:24px;align-items:center;background:var(--navy);color:#fff;border-radius:10px;padding:13px 20px;flex-wrap:wrap;}
.totals .items{margin-right:auto;font-size:13px;color:var(--sky-soft);}
.totals .lbl{font-size:11.5px;color:var(--sky-soft);letter-spacing:.04em;text-transform:uppercase;}
.totals .amt{font-family:var(--font-head);font-weight:600;font-size:1.45rem;margin-left:8px;}

.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:13px 16px;}
.field.full{grid-column:1/-1;}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px;padding-top:18px;border-top:1px solid var(--hair);}
.note{font-size:12px;color:var(--ink-soft);margin-top:12px;line-height:1.6;}

/* resources */
.res{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:13px 0;border-bottom:1px solid var(--hair);}
.res:last-child{border-bottom:none;}
.res .rt{font-weight:600;color:var(--ink);} .res .rn{font-size:12.5px;color:var(--ink-soft);}
.res .badge{font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:3px 8px;border-radius:6px;color:var(--sky-deep);background:var(--mist);margin-right:auto;margin-left:12px;}

/* order history */
.order{border:1px solid var(--hair);border-radius:12px;padding:14px 16px;margin-bottom:12px;background:var(--white);}
.order .oh{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:baseline;}
.order .oh .cat{font-weight:700;color:var(--navy);text-transform:capitalize;}
.order .oh .when{font-size:12px;color:var(--ink-soft);}
.order .amt{font-family:var(--font-head);font-weight:600;color:var(--navy);}
.order ul{margin:8px 0 0;padding-left:18px;font-size:13px;color:var(--ink-2);}
.pill{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11px;font-weight:600;border:1px solid var(--hair-2);color:var(--sky-deep);background:var(--mist);}

.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:var(--navy);color:#fff;padding:11px 20px;border-radius:10px;font-size:14px;opacity:0;pointer-events:none;transition:.2s;z-index:40;}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

#print-sheet{display:none;}
@media print{
  @page{margin:14mm;}
  body{background:#fff;color:#000;}
  .top,.tabs,.main,.toast{display:none!important;}
  #print-sheet{display:block!important;color:#000;}
  #print-sheet .ph{display:flex;justify-content:space-between;border-bottom:2px solid #0d2c49;padding-bottom:10px;margin-bottom:14px;}
  #print-sheet .ph .name{font-family:var(--font-head);font-size:20px;font-weight:600;color:#0d2c49;}
  #print-sheet .ph .meta{font-size:11px;text-align:right;color:#333;}
  #print-sheet h3{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#0d2c49;margin:14px 0 6px;border-bottom:1px solid #bcd;padding-bottom:3px;}
  #print-sheet table{width:100%;border-collapse:collapse;}
  #print-sheet th,#print-sheet td{border:1px solid #cbd6e2;padding:5px 8px;font-size:11px;text-align:left;}
  #print-sheet th{background:#eaf3fb;color:#0d2c49;} #print-sheet td.num,#print-sheet th.num{text-align:right;}
  #print-sheet .kv{display:grid;grid-template-columns:1fr 1fr;gap:2px 24px;font-size:11px;}
  #print-sheet .kv div{padding:2px 0;border-bottom:1px dotted #cbd6e2;} #print-sheet .kv b{color:#0d2c49;}
  #print-sheet .grand{text-align:right;font-size:14px;font-weight:700;color:#0d2c49;margin-top:8px;}
  #print-sheet .terms{font-size:9.5px;color:#444;margin-top:14px;border-top:1px solid #cbd6e2;padding-top:8px;line-height:1.5;}
}