/* Vaccine Stock Control. Lifted from the prototype; the second block was its inline page style. */
:root{--ink:#17201d;--muted:#65716c;--line:#d8ded9;--soft:#f4f7f3;--panel:#fff;--green:#1f7a4c;--blue:#255f85;--amber:#9a6500;--red:#9a2c2c;--shadow:0 10px 30px rgba(26,43,35,.09)}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:#eef3ee;color:var(--ink);font-family:Inter,Segoe UI,system-ui,sans-serif}
body.tutorial-active{overflow:hidden}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
main{margin:0 auto;max-width:1180px;padding:1rem}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(1.2rem,2.2vw,1.8rem);line-height:1.1;margin-bottom:0;overflow-wrap:anywhere}
h2{font-size:1.2rem;margin-bottom:.3rem}
h3{font-size:1.05rem}
label{color:var(--muted);display:grid;font-size:.82rem;font-weight:800;gap:.35rem}
input,select,textarea{background:#fff;border:1px solid #bfc9c3;border-radius:6px;color:var(--ink);min-height:2.55rem;padding:.62rem .72rem}
textarea{resize:vertical}
.muted{color:var(--muted);font-size:.9rem}
.eyebrow{color:var(--blue);font-size:.78rem;font-weight:800;margin:0 0 .2rem;text-transform:uppercase}
.app-header{align-items:center;background:#fcfefb;border-bottom:1px solid var(--line);display:flex;gap:1rem;justify-content:space-between;padding:1rem clamp(1rem,3vw,2rem);position:sticky;top:0;z-index:10}
.brand-lockup{align-items:center;display:flex;gap:.8rem;min-width:0}
.site-logo{background:#fff;border:1px solid var(--line);border-radius:8px;height:54px;object-fit:contain;padding:.25rem;width:54px}
.header-actions,.filters,.card-actions,.form-actions,.maintenance-actions{display:flex;flex-wrap:wrap;gap:.6rem}
.notice,.identity-strip,.dashboard article,.view,.transfer-card,.admin-panel,.help-grid article,.login-card,.welcome-panel,.tutorial-panel{background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow)}
.notice,.identity-strip{margin-bottom:1rem;padding:.9rem 1rem}
.identity-strip{align-items:end;display:flex;flex-wrap:wrap;gap:.8rem 1rem;justify-content:space-between}
.login-shell{align-content:center;align-items:stretch;display:grid;gap:1.2rem;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);min-height:calc(100vh - 4.5rem);padding:clamp(1rem,4vw,3rem) 0}
.welcome-panel{align-content:center;display:grid;padding:clamp(1.2rem,4vw,2rem)}
.welcome-panel h1{font-size:clamp(2rem,4vw,3.4rem);line-height:1.03;margin-bottom:1rem;max-width:48rem}
.welcome-logo-wrap{align-items:center;display:flex;height:86px;margin-bottom:1rem}
.welcome-logo{background:#fff;border:1px solid var(--line);border-radius:8px;height:86px;object-fit:contain;padding:.35rem;width:86px}
.welcome-logo-fallback{align-items:center;background:var(--green);border-radius:8px;color:#fff;display:flex;font-size:2.1rem;font-weight:900;height:86px;justify-content:center;width:86px}
.welcome-copy{color:var(--muted);font-size:1.05rem;line-height:1.5;max-width:42rem}
.login-card{align-content:center;display:grid;gap:.85rem;padding:1.2rem}
.login-card .primary{width:100%}
.form-message:empty{display:none}
.form-message{border-radius:6px;font-size:.9rem;font-weight:800;line-height:1.35;padding:.7rem .8rem}
.form-message.error{background:#f8dddd;border:1px solid #e1a8a8;color:var(--red)}
.form-message.success{background:#dff1e7;border:1px solid #a7ceb8;color:var(--green)}
.link-button{background:transparent;border:0;color:var(--blue);font-weight:900;min-height:2.2rem;padding:.35rem;text-align:left}
.dashboard{display:grid;gap:.75rem;margin-bottom:1rem}
.dashboard article{min-height:6rem;padding:.9rem}
.dashboard span{color:var(--muted);display:block;font-size:.82rem;font-weight:800;margin-bottom:.4rem}
.dashboard strong{display:block;font-size:1.9rem;line-height:1}
.risk strong{color:var(--red)}
.tabs{display:flex;gap:.4rem;margin:0 0 1rem;overflow-x:auto;padding-bottom:.2rem}
.tab,.primary,.secondary,.danger{border:1px solid transparent;border-radius:6px;font-weight:800;min-height:2.55rem;padding:.6rem .85rem;white-space:nowrap}
.tab{background:#dfe8e0;color:#27342f}
.tab.active{background:var(--ink);color:#fff}
.primary{background:var(--green);color:#fff}
.secondary{background:#fff;border-color:#aebbb3;color:var(--ink)}
.danger{background:#f8dddd;border-color:#e1a8a8;color:var(--red)}
.view{display:none;padding:1rem}
.view.active{display:block}
.section-head{align-items:start;display:flex;gap:1rem;justify-content:space-between;margin-bottom:1rem}
.form-grid{display:grid;gap:.85rem;grid-template-columns:repeat(4,minmax(0,1fr))}
.wide{grid-column:1/-1}
.transfer-list,.editable-list,.activity-log,.admin-list,.stacked-form{display:grid;gap:.75rem}
.transfer-card{padding:1rem}
.transfer-main,.admin-item-head{align-items:start;display:flex;gap:1rem;justify-content:space-between}
.transfer-id{color:var(--blue);font-size:.78rem;font-weight:900;margin-bottom:.2rem}
.meta,.transfer-details,.label-text{color:var(--muted);font-size:.9rem}
.transfer-details{display:grid;gap:.35rem;grid-template-columns:repeat(4,minmax(0,1fr));margin:.8rem 0}
.status-pill,.small-pill{border-radius:999px;display:inline-flex;font-size:.78rem;font-weight:900;padding:.45rem .7rem;text-align:center}
.status-requested{background:#e2eef5;color:var(--blue)}
.status-prepared,.status-ready-for-collection{background:#fff0cf;color:var(--amber)}
.status-collected{background:#e5e2f5;color:#4c3b82}
.status-stored,.status-received{background:#dff1e7;color:var(--green)}
.status-used{background:#dde9ef;color:#23485d}
.status-query{background:#f8dddd;color:var(--red)}
.status-journey{display:grid;gap:.45rem;grid-template-columns:repeat(6,minmax(0,1fr));margin-top:.8rem}
.journey-step{align-items:center;color:var(--muted);display:grid;font-size:.75rem;font-weight:800;gap:.3rem;text-align:center}
.journey-dot{background:#d7e1d9;border-radius:999px;height:.55rem;width:100%}
.journey-step.done .journey-dot,.journey-step.current .journey-dot{background:var(--green)}
.journey-step.current{color:var(--ink)}
.edit-row,.admin-item{background:var(--soft);border:1px solid var(--line);border-radius:8px;display:grid;gap:.75rem;padding:.8rem}
.edit-row{align-items:end;grid-template-columns:1.3fr repeat(4,minmax(100px,1fr)) auto}
.admin-grid{display:grid;gap:1rem;grid-template-columns:repeat(2,minmax(0,1fr))}
.admin-panel{background:var(--soft);padding:1rem}
.wide-admin-panel{grid-column:1/-1}
.admin-item{background:#fff}
.admin-item-actions{display:flex;flex-wrap:wrap;gap:.5rem}
.small-pill{background:#e2eef5;color:var(--blue)}
.small-pill.inactive{background:#ecefed;color:var(--muted)}
.help-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.help-grid article{padding:1rem}
.help-grid ol{margin-bottom:0;padding-left:1.2rem}
.help-grid li{margin:.45rem 0}
.option-grid{align-items:start;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.option-category{align-content:start;align-self:start;background:#fff;border:1px solid var(--line);border-radius:8px;display:grid;gap:.75rem;padding:1rem}
.option-row{display:grid;gap:.5rem;grid-template-columns:1fr}
.option-row input{min-width:0}
.option-actions{display:flex;flex-wrap:wrap;gap:.45rem}
.clinic-card,.stock-card,.check-card{background:#fff;border:1px solid var(--line);border-radius:8px;display:grid;gap:.75rem;padding:1rem}
.clinic-grid,.stock-grid{display:grid;gap:.75rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.return-field,.waste-field{display:none}
form.is-return .return-field,form.is-waste .waste-field{display:grid}
.stock-bar{background:#dfe8e0;border-radius:999px;height:.7rem;overflow:hidden}
.stock-bar span{background:var(--green);display:block;height:100%;min-width:2px}
.variance-bad{color:var(--red);font-weight:900}
.tutorial-backdrop{background:rgba(11,20,17,.62);inset:0;position:fixed;z-index:40}
.tutorial-spotlight{border:3px solid #fff;border-radius:10px;box-shadow:0 0 0 9999px rgba(11,20,17,.58),0 0 0 6px rgba(31,122,76,.45);pointer-events:none;position:fixed;transition:all .18s ease;z-index:45}
.tutorial-panel{bottom:1rem;max-width:min(420px,calc(100vw - 2rem));padding:1rem;position:fixed;right:1rem;z-index:50}
.site-footer{color:var(--muted);font-size:.85rem;margin:0 auto;max-width:1180px;padding:0 1rem 1.4rem;text-align:center}
.checkbox-label{align-items:center;color:var(--ink);display:flex;font-weight:800;gap:.5rem}
.checkbox-label input{min-height:auto}
.empty{background:var(--soft);border:1px dashed #bac7be;border-radius:8px;color:var(--muted);padding:1rem}
.admin-only,.creator-only{display:none}
body.is-admin .admin-only,body.can-create .creator-only{display:inline-flex}
body.can-create section.creator-only{display:none}
body.can-create section.creator-only.active{display:block}
body:not(.is-logged-out) .login-shell{display:none!important}
body.is-logged-out .app-header,body.is-logged-out .app-notice,body.is-logged-out #sessionCard,body.is-logged-out .tabs,body.is-logged-out .dashboard,body.is-logged-out .view{display:none!important}
.busy-indicator{align-items:center;background:#fff;border:1px solid var(--line);border-radius:999px;box-shadow:var(--shadow);display:flex;gap:.75rem;left:50%;min-height:4rem;padding:.8rem 1.2rem;position:fixed;top:50%;transform:translate(-50%,-50%);z-index:80}
.busy-indicator span{animation:spin .8s linear infinite;border:4px solid #d8ded9;border-top-color:var(--green);border-radius:50%;height:30px;width:30px}
.busy-indicator strong{font-size:1rem}
.login-shell{animation:pageIn .38s ease-out both}
.welcome-panel{animation:softRise .45s ease-out both}
.login-card{animation:softRise .45s ease-out .08s both}
.tab,.primary,.secondary,.danger,.transfer-card,.admin-item,.edit-row,.help-grid article{transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.tab:hover,.primary:hover,.secondary:hover,.danger:hover{transform:translateY(-1px)}
.view.active{animation:viewIn .24s ease-out both}
.dashboard article,.transfer-card,.admin-item,.edit-row,.help-grid article{animation:itemIn .22s ease-out both}
.transfer-card:hover,.admin-item:hover{box-shadow:0 12px 32px rgba(26,43,35,.13);transform:translateY(-1px)}
body.is-busy .primary,body.is-busy .secondary,body.is-busy .danger{cursor:progress}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes softRise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes viewIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes itemIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(max-width:920px){.app-header,.section-head,.transfer-main,.admin-item-head{align-items:stretch;flex-direction:column}.login-shell{grid-template-columns:1fr;min-height:auto}.welcome-panel h1{font-size:2rem}.dashboard{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid,.transfer-details,.edit-row,.admin-grid,.help-grid{grid-template-columns:1fr}.tutorial-panel{bottom:.5rem;left:.5rem;right:.5rem;max-width:none}.busy-indicator{min-width:min(320px,calc(100vw - 2rem));justify-content:center}.option-row{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}}

.dashboard{grid-template-columns:repeat(7,minmax(0,1fr))}
body.is-clinician .tab:not(.clinical-only):not(.stock-tab):not(.help-tab){display:none}
.clinical-only{display:none!important}
body.can-clinical .tab.clinical-only{display:inline-flex!important}
body.can-clinical section.view.clinical-only.active{display:block!important}
body.can-clinical .clinic-card.clinical-only{display:grid!important}
.status-pill{font-size:.96rem;justify-content:center;min-width:7.5rem;padding:.6rem .85rem}
.status-stored{background:#dff1e7;color:var(--green)}
.status-used{background:#dde9ef;color:#23485d}
.status-corrector{align-items:center;display:flex;flex-direction:row;gap:.45rem}
.status-corrector select{min-height:2.35rem}
.busy-indicator{border-radius:8px;gap:.85rem;left:50%;min-height:4.4rem;min-width:250px;padding:1.05rem 1.25rem;right:auto;top:50%;transform:translate(-50%,-50%);z-index:90}
.busy-indicator span{border-width:4px;height:30px;width:30px}
.busy-indicator strong{font-size:1.15rem}
.status-toast{background:var(--ink);border:1px solid rgba(255,255,255,.25);border-radius:8px;box-shadow:0 18px 50px rgba(20,30,25,.24);color:#fff;font-size:1.2rem;font-weight:900;left:50%;min-width:240px;padding:1rem 1.2rem;position:fixed;text-align:center;top:50%;transform:translate(-50%,-50%);z-index:85}
.status-toast.flash{animation:statusPop 1.4s ease-out both}
.modal-backdrop{background:rgba(11,20,17,.58);inset:0;position:fixed;z-index:86}
.status-modal{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 22px 72px rgba(20,30,25,.32);display:grid;gap:.85rem;left:50%;max-width:min(540px,calc(100vw - 2rem));padding:1.25rem;position:fixed;top:50%;transform:translate(-50%,-50%);width:100%;z-index:91}
.modal-warning{background:#fff4d8;border:1px solid #e7c36e;border-radius:8px;color:#5a3b00;font-weight:800;line-height:1.4;margin:0;padding:.75rem}
.modal-error{color:var(--red);font-weight:900;margin:0}
.status-journey{display:grid;gap:.4rem;grid-template-columns:repeat(6,minmax(0,1fr));margin-top:.95rem}
.journey-step{align-items:center;color:var(--muted);display:grid;gap:.35rem;justify-items:center;text-align:center}
.journey-dot{background:#dfe8e0;border:2px solid #c1cdc5;border-radius:50%;height:1rem;width:1rem}
.journey-label{font-size:.72rem;font-weight:900;line-height:1.15}
.journey-step.done{color:var(--green)}
.journey-step.done .journey-dot{background:var(--green);border-color:var(--green)}
.journey-step.current{color:var(--ink)}
.journey-step.current .journey-dot{background:#fff;border-color:var(--green);box-shadow:0 0 0 4px rgba(31,122,76,.18)}
.transfer-card.is-query .status-journey{border-left:4px solid var(--red);padding-left:.75rem}
.audit-warning{background:#f8dddd;border:1px solid #e1a8a8;border-radius:8px;color:var(--red);font-weight:900;padding:.65rem .8rem}
.option-grid{align-items:start;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.option-category{align-content:start;align-self:start;background:#fff;border:1px solid var(--line);border-radius:8px;display:grid;gap:.75rem;padding:.85rem}
.option-category h4{margin:0}
.option-row{display:grid;gap:.5rem;grid-template-columns:1fr}
.option-row input{min-width:0}
.option-actions{display:flex;flex-wrap:wrap;gap:.45rem}
.clinic-card,.stock-card,.check-card{background:#fff;border:1px solid var(--line);border-radius:8px;display:grid;gap:.75rem;padding:1rem}
.clinic-grid,.stock-grid{display:grid;gap:.75rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.return-field,.waste-field{display:none}
form.is-return .return-field,form.is-waste .waste-field{display:grid}
.stock-bar{background:#dfe8e0;border-radius:999px;height:.7rem;overflow:hidden}
.stock-bar span{background:var(--green);display:block;height:100%;min-width:2px}
.variance-bad{color:var(--red);font-weight:900}
@keyframes statusPop{0%{opacity:0;transform:translate(-50%,-44%) scale(.94)}18%{opacity:1;transform:translate(-50%,-50%) scale(1.03)}80%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-56%) scale(.98)}}
@media(max-width:920px){.dashboard{grid-template-columns:repeat(2,minmax(0,1fr))}.busy-indicator{left:50%;right:auto;top:50%;justify-content:flex-start;transform:translate(-50%,-50%);width:max-content}.status-toast{max-width:calc(100vw - 2rem);min-width:min(260px,calc(100vw - 2rem))}.status-journey{grid-template-columns:repeat(3,minmax(0,1fr))}.option-row{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.status-toast.flash{animation:none}}
.field-hint{color:var(--muted);font-size:.76rem;font-weight:600}
.login-card .link-button{width:auto}
.adjust-list{display:grid;gap:.6rem}
.adjust-item{background:var(--soft);border:1px solid var(--line);border-radius:8px;padding:.7rem .85rem}
.adjust-item strong.minus{color:var(--red)}
.adjust-item strong.plus{color:var(--green)}
body.is-clinician .app-notice{display:none}
body.is-clinician .dashboard{grid-template-columns:repeat(3,minmax(0,1fr))}
body.is-clinician .dashboard article:not(.clinic-stat){display:none}
.adjuster-only{display:none}
body.can-adjust .adjuster-only{display:grid}
.identity-strip > div{align-items:baseline;display:flex;flex-wrap:wrap;gap:.5rem}
.admin-panel{align-content:start;display:grid;gap:1rem}
.admin-panel > h3,.admin-panel > p{margin:0}
#stockView > :not(.section-head) + *{margin-top:1rem}