/* Rajaswa LIMS v0.8 — colours from the Rajaswa logo (blue "P") and letterhead (purple name, navy / gold bars) */
:root{
 --ink:#17213a;--muted:#5f6b82;--line:#e1e6ef;--line2:#cfd7e4;--bg:#f2f5fa;--card:#fff;
 --brand:#1e6fd0;--brand-d:#134a93;--brand-l:#e8f1fc;--brand2:#6b2fa0;--brand2-l:#f3ecfa;--navy:#14284b;--gold:#f2b705;
 --ok:#16794a;--okbg:#e3f5ec;--bad:#b42318;--badbg:#fdecea;--warn:#8a5a00;--warnbg:#fff3d6;
 --r:12px;--sh:0 1px 2px rgba(20,40,75,.06),0 4px 14px rgba(20,40,75,.06)
}
*{box-sizing:border-box}
body{margin:0;font:14px/1.5 "Segoe UI",Roboto,"Noto Sans",Arial,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--brand);text-decoration:none}a:hover{text-decoration:underline}
code{background:#f1f4f9;border:1px solid var(--line);border-radius:5px;padding:0 5px;font-size:12.5px}
.ic{flex:none;vertical-align:-3px}

/* ---- header ---- */
header.top{position:sticky;top:0;z-index:20;height:60px;display:flex;align-items:center;gap:12px;padding:0 22px 0 16px;
 background:#fff;box-shadow:0 1px 0 var(--line)}
header.top:after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:3px;background:linear-gradient(90deg,var(--brand) 0,#4fb0f0 35%,var(--brand2) 75%,var(--gold) 100%)}
header.top .brandbars{display:flex;gap:3px;height:60px;margin-left:-16px;margin-right:4px}
header.top .brandbars i{display:block;width:9px;transform:skewX(-14deg)}
header.top .brandbars i:nth-child(1){background:var(--brand-d)}header.top .brandbars i:nth-child(2){background:#8db3e8}header.top .brandbars i:nth-child(3){background:var(--gold);width:5px}
header.top img{height:38px}
header.top .name{font-weight:800;color:var(--brand2);letter-spacing:.4px;line-height:1.1;font-size:16px}
header.top .name small{display:block;color:var(--muted);font-weight:500;font-size:11.5px;letter-spacing:0}
header.top .user{margin-left:auto;display:flex;align-items:center;gap:12px;font-size:12.5px;color:var(--muted)}
header.top .who{text-align:right;line-height:1.25}header.top .who b{color:var(--ink);display:block;font-size:13px}
.avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}
header.top .user a.hl{color:var(--muted);display:inline-flex;align-items:center;gap:4px;padding:5px 8px;border-radius:8px}
header.top .user a.hl:hover{background:var(--brand-l);color:var(--brand);text-decoration:none}

/* ---- side menu ---- */
nav.side{position:fixed;top:63px;left:0;bottom:0;width:232px;background:var(--navy);padding:10px 0 30px;overflow:auto;
 background-image:linear-gradient(180deg,#16305a 0,#122442 100%)}
nav.side a{display:flex;align-items:center;gap:10px;padding:7px 18px;margin:1px 10px;border-radius:8px;color:#d6def0;font-size:13.5px}
nav.side a .ic{opacity:.8}
nav.side a:hover{background:rgba(255,255,255,.08);text-decoration:none;color:#fff}
nav.side a.on{background:linear-gradient(90deg,var(--brand),#2b84e6);color:#fff;box-shadow:0 2px 8px rgba(30,111,208,.35)}
nav.side a.on .ic{opacity:1}
nav.side .h{padding:14px 28px 4px;font-size:10.5px;text-transform:uppercase;color:#8fa0c4;letter-spacing:.9px;font-weight:700}
nav.side details summary{display:flex;align-items:center;gap:10px;padding:7px 18px;margin:1px 10px;border-radius:8px;color:#d6def0;font-size:13.5px;cursor:pointer;list-style:none}
nav.side details summary::-webkit-details-marker{display:none}
nav.side details summary:hover{background:rgba(255,255,255,.08)}
nav.side details a{padding-left:46px;font-size:13px}
nav.side .badge{margin-left:auto;background:var(--gold);color:#3b2a00;font-size:11px;font-weight:800;border-radius:10px;padding:0 7px}
main{margin-left:232px;padding:26px 32px 70px;max-width:1380px}

/* ---- headings ---- */
h1{font-size:22px;margin:0 0 14px;letter-spacing:-.2px}h2{font-size:16px;margin:22px 0 10px}
.pagehead{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.pagehead .badge-ic{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;
 background:linear-gradient(135deg,var(--brand),var(--brand2));box-shadow:0 4px 12px rgba(30,111,208,.25)}
.pagehead h1{margin:0}.pagehead p{margin:2px 0 0;color:var(--muted);font-size:13px}
.pagehead .acts{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}

/* ---- cards, grids ---- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;margin-bottom:16px;box-shadow:var(--sh)}
.card>h2:first-child,.card>.cardhead:first-child h2{margin-top:0}
.cardhead{display:flex;align-items:center;gap:10px;justify-content:space-between;margin-bottom:10px}
.cardhead h2{margin:0;display:flex;align-items:center;gap:8px}.cardhead h2 .ic{color:var(--brand)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px 18px}
.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;margin-bottom:16px}
.kpi{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;box-shadow:var(--sh)}
.kpi b{display:block;font-size:24px}.kpi span{color:var(--muted);font-size:12.5px}

/* ---- forms ---- */
label{display:block;font-size:12px;color:var(--muted);margin-bottom:4px;font-weight:600}
input,select,textarea{width:100%;padding:8px 10px;border:1px solid var(--line2);border-radius:8px;font:inherit;background:#fff;color:var(--ink);transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 3px rgba(30,111,208,.15)}
input[type=checkbox],input[type=radio]{width:auto;accent-color:var(--brand);margin-right:4px}
input[type=file]{padding:6px;background:#fafbfd}
button,.btn{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(180deg,#2b7fe0,var(--brand));color:#fff;border:0;border-radius:8px;padding:8px 15px;font:inherit;font-weight:600;cursor:pointer;
 box-shadow:0 1px 2px rgba(19,74,147,.3);white-space:nowrap}
button:hover,.btn:hover{text-decoration:none;filter:brightness(1.06)}
button.sec,.btn.sec{background:#fff;color:var(--brand);border:1px solid #b9d2f3;box-shadow:none}
button.sec:hover,.btn.sec:hover{background:var(--brand-l)}
button.danger,.btn.danger{background:linear-gradient(180deg,#cf3a2e,var(--bad))}
button.ok,.btn.ok{background:linear-gradient(180deg,#1f9a5f,var(--ok))}
button.small,.btn.small{padding:3px 10px;font-size:12px}

/* ---- tables ---- */
table.t{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--sh)}
.card table.t{box-shadow:none}
table.t th,table.t td{border-bottom:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top;font-size:13px}
table.t th{background:linear-gradient(180deg,#f5f8fd,#edf2f9);font-size:11.5px;color:#41506b;font-weight:700;text-transform:uppercase;letter-spacing:.35px}
table.t tr:last-child td{border-bottom:0}
table.t tbody tr:nth-child(even) td,table.t tr:nth-child(odd):not(:first-child) td{background:#fff}
table.t tr:nth-child(even) td{background:#fafcff}
table.t tr:hover td{background:#f1f6fe}
table.t td.num,table.t th.num{text-align:right;font-variant-numeric:tabular-nums}
.tablewrap{overflow:auto}

/* ---- pills, flash ---- */
.pill{display:inline-flex;align-items:center;gap:4px;padding:1px 9px;border-radius:20px;font-size:11.5px;font-weight:700;background:var(--brand-l);color:var(--brand-d);white-space:nowrap}
.pill.ok{background:var(--okbg);color:var(--ok)}.pill.bad{background:var(--badbg);color:var(--bad)}.pill.warn{background:var(--warnbg);color:var(--warn)}
.pill.purple{background:var(--brand2-l);color:var(--brand2)}.pill.grey{background:#eef0f4;color:#566}
.flash{padding:10px 14px 10px 40px;border-radius:10px;margin-bottom:12px;border:1px solid transparent;position:relative}
.flash:before{position:absolute;left:13px;top:9px;width:18px;height:18px;border-radius:50%;color:#fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center}
.flash.ok:before{content:"✓";background:var(--ok)}.flash.error:before{content:"!";background:var(--bad)}
.flash.ok{background:var(--okbg);color:var(--ok);border-color:#bfe6d1}.flash.error{background:var(--badbg);color:var(--bad);border-color:#f5c2bd}
.muted{color:var(--muted)}.small{font-size:12px}.right{text-align:right}
.sign{background:linear-gradient(180deg,#faf6fe,#f5effc);border:1px dashed #b996dc;border-radius:10px;padding:12px 14px;margin-top:12px}
.sign b{color:var(--brand2)}
.row{display:flex;gap:10px;align-items:end;flex-wrap:wrap}

/* ---- login ---- */
body.loginpage{background:radial-gradient(circle at 15% 20%,#dbe9fb 0,transparent 40%),radial-gradient(circle at 85% 80%,#eadcf7 0,transparent 40%),var(--bg)}
.loginwrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.login{width:100%;max-width:400px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:30px 30px 26px;box-shadow:0 18px 50px rgba(20,40,75,.12);position:relative;overflow:hidden}
.login:before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,var(--brand),#4fb0f0,var(--brand2),var(--gold))}
.login .lhead{display:flex;align-items:center;gap:12px;margin-bottom:6px}.login img{height:52px}
.login .lhead b{display:block;color:var(--brand2);font-size:17px;letter-spacing:.3px}.login .lhead span{color:var(--muted);font-size:12px}
.login h1{font-size:20px;margin:16px 0 4px}

@media print{nav.side,header.top,.noprint{display:none!important}main{margin:0;padding:0}.card,table.t{box-shadow:none}}
@media (max-width:860px){nav.side{position:static;width:auto;display:flex;flex-wrap:wrap;padding:6px}nav.side .h{display:none}main{margin-left:0;padding:16px}header.top .brandbars,header.top .who{display:none}}

/* ---- v0.5 simpler screens ---- */
.crumbs{font-size:12.5px;color:var(--muted);margin-bottom:6px}
.titlebar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.titlebar h1{margin:0}
.facts{display:flex;flex-wrap:wrap;gap:0;margin:12px 0 18px;font-size:13px;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);overflow:hidden}
.facts>span{padding:9px 16px;border-right:1px solid var(--line);flex:1 1 auto;min-width:130px}
.facts b{display:block;font-size:10.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.next{display:flex;justify-content:space-between;align-items:center;gap:16px;background:linear-gradient(90deg,#eaf3ff,#f4efff);border:1px solid #c9daf5;border-left:5px solid var(--brand);border-radius:var(--r);padding:14px 18px;margin-bottom:16px}
.next.warn{background:var(--warnbg);border-color:#f0d9a8;border-left-color:var(--gold)}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;margin-bottom:10px;box-shadow:var(--sh)}
.stephead{display:flex;gap:12px;align-items:flex-start}
.stepno{flex:none;width:28px;height:28px;border-radius:50%;background:var(--brand);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:13px}
.instr{flex:1;white-space:pre-wrap;line-height:1.9}
.stamp{flex:none;font-size:11.5px;color:var(--ok);background:var(--okbg);padding:2px 9px;border-radius:12px}
.entries{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px 16px;margin-top:12px}
.entry.wide{grid-column:1/-1}
.slots{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.slots input,.slots select{flex:1}.slots input{min-width:90px}
.rep{font-size:11px;color:var(--muted);font-weight:700}
.val{font-weight:700}
.actions{margin:10px 0}
details.more{margin-top:18px}details.more>summary{cursor:pointer;color:var(--brand);font-weight:700;margin-bottom:8px}
.tasks{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-bottom:20px}
.task{position:relative;display:flex;gap:12px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;color:var(--ink);box-shadow:var(--sh);overflow:hidden}
.task:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--brand),var(--brand2))}
.task:hover{text-decoration:none;border-color:#b9d2f3;transform:translateY(-1px)}
.task .tic{width:40px;height:40px;border-radius:10px;background:var(--brand-l);color:var(--brand);display:flex;align-items:center;justify-content:center;flex:none}
.task b{font-size:26px;display:block;color:var(--brand-d);line-height:1.1}.task span{font-size:13px;color:var(--muted)}
.task.zero{opacity:.6}.task.zero:before{background:var(--line2)}.task.zero b{color:var(--muted)}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line2);margin:18px 0 14px}
.tabs a{padding:9px 16px;border-radius:10px 10px 0 0;color:var(--muted);font-weight:700}
.tabs a.on{background:#fff;border:1px solid var(--line2);border-bottom-color:#fff;margin-bottom:-1px;color:var(--brand)}
.step.cur{border:2px solid var(--brand);box-shadow:0 4px 16px rgba(30,111,208,.16)}
.step.locked{opacity:.55}.step.locked .entries{display:none}
.stepno.ok{background:var(--ok)}
input.bad,select.bad,textarea.bad{background:#fdecea;border-color:#e8a29b}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--brand-l);border:1px solid #c9daf5;border-radius:14px;padding:2px 4px 2px 10px;font-size:12.5px}
.chip a{cursor:pointer;color:var(--bad);font-weight:700;padding:0 6px}

/* ---- v0.8: test data sheet (inline procedure text), corrections, impurity table ---- */
.inl{display:inline-flex;align-items:center;gap:3px;vertical-align:middle;margin:1px 2px}
.inl input,.inl select{width:auto;min-width:86px;max-width:170px;padding:3px 7px;border-radius:6px;border-color:#9fbde6;background:#f7fbff;font-weight:600}
.inl .u{font-size:12px;color:var(--muted)}
.filled{font-weight:700;color:var(--brand-d);border-bottom:2px solid #9fbde6;padding:0 4px;background:#f3f8ff;border-radius:4px 4px 0 0}
.hist{margin-top:6px;font-size:12px;background:#fff8e6;border:1px solid #f2dfaa;border-radius:8px;padding:6px 10px}
.hist s{color:var(--bad)}
.instblock{margin-top:10px;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.instblock table{width:100%;border-collapse:collapse}.instblock td,.instblock th{padding:5px 9px;font-size:12px;border-bottom:1px solid var(--line);text-align:left}
.instblock th{background:#f3f6fb;color:#41506b}
table.imp td input{min-width:70px}
.oktxt{color:var(--ok);font-weight:700}.badtxt{color:var(--bad);font-weight:700}
.diff-old{color:var(--bad);text-decoration:line-through}.diff-new{color:var(--bad);font-weight:700}
tr.changed td{background:#fff6f5!important}
.stack>*+*{margin-top:8px}
.empty{padding:26px;text-align:center;color:var(--muted);background:#fff;border:1px dashed var(--line2);border-radius:var(--r)}
.doccard{display:flex;gap:14px;align-items:flex-start}
.docic{width:42px;height:50px;border-radius:6px;background:linear-gradient(160deg,#e9f2fd,#d7e6fb);color:var(--brand-d);display:flex;align-items:center;justify-content:center;flex:none;font-size:10px;font-weight:800;border:1px solid #c3d7f3}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin:6px 0}

/* v0.9 calculation templates */
.gridwrap{margin-top:6px;max-width:100%;overflow-x:auto}
table.grid td{padding:4px 6px}table.grid input{width:100%;min-width:84px;padding:5px 7px;font-variant-numeric:tabular-nums}
table.grid tr.extra{display:none}
.dflt{font-weight:400;text-transform:none;letter-spacing:0;color:#7a869c}
.importbox{background:#f6f9ff;border:1px dashed #b9cbe8;border-radius:10px;padding:10px 12px}
.calccard .cardhead{display:flex;justify-content:space-between;align-items:center}

/* v0.9.12: faint page colour per area of work, so the user always sees where they are (strip on the page title in the same hue) */
body.area-inward{--bg:#eef4fe;--area:#1e6fd0}
body.area-samples{--bg:#f1f5fb;--area:#5b7bb0}
body.area-alloc{--bg:#f4f1fd;--area:#6b4fc8}
body.area-analysis{--bg:#eef8f2;--area:#1f8a4c}
body.area-check{--bg:#edf8f8;--area:#16807f}
body.area-review{--bg:#fdf7ea;--area:#b07a00}
body.area-qa{--bg:#fcf0f3;--area:#b0345a}
body.area-lab{--bg:#f7f5ef;--area:#8a6d3b}
body.area-billing{--bg:#f3f8ec;--area:#5c8a1f}
body.area-masters{--bg:#f1f3f7;--area:#4a5872}
body.area-admin{--bg:#f2f5fa;--area:#14284b}
body[class*="area-"] main .pagehead{border-left:4px solid var(--area);padding-left:12px}

/* v0.9.16 collapsible menu groups */
nav.side details.grp > summary.h{display:flex;justify-content:space-between;align-items:center;cursor:pointer;list-style:none;margin:0;border-radius:0;padding:14px 22px 4px 28px;color:#8fa0c4;font-size:10.5px}
nav.side details.grp > summary.h::-webkit-details-marker{display:none}
nav.side details.grp > summary.h::after{content:"▸";font-size:11px;transition:transform .15s}
nav.side details.grp[open] > summary.h::after{transform:rotate(90deg)}
nav.side details.grp > summary.h:hover{background:none;color:#fff}

/* v0.9.18: logo + name in the header open the home page */
.homelink{display:contents;color:inherit;text-decoration:none;cursor:pointer}
.homelink:hover .name{opacity:.85}
/* v0.9.19: in the Product Test Master grid the test name stays visible while scrolling sideways */
#grid th:nth-child(2), #grid td:nth-child(2){position:sticky;left:0;z-index:2;background:var(--card,#fff);box-shadow:2px 0 0 rgba(15,23,42,.08)}
#grid tr:first-child th:nth-child(2){background:var(--thead,#f3f5f9)}
