/* ============================================================
   LABORATORY - REVIEW  (3rd dashboard tab: Financial / Patient / Laboratory)
   Loaded last. Only adds new rules - nothing existing is changed.
   ============================================================ */

/* ---------- tab button (same look as Financial / Patient tabs) ---------- */
#reviewTabLab{background:linear-gradient(135deg,#e11d48,#9f1239);border-color:transparent;color:#fff;opacity:.75}
#reviewTabLab.active{opacity:1}
#reviewTabLab{height:38px !important;min-height:38px !important;max-height:38px !important;box-sizing:border-box !important;padding:0 6px !important;display:flex !important;align-items:center !important;justify-content:center !important;white-space:nowrap !important}
#reviewTabLab.active{box-shadow:inset 0 0 0 2px #fff,0 4px 10px rgba(16,42,80,.35) !important}
#reviewTabLab.active::after{content:'' !important;display:block !important;position:absolute !important;top:auto !important;right:auto !important;bottom:-9px !important;left:50% !important;width:0 !important;height:0 !important;transform:translateX(-50%) !important;background:transparent !important;border:0 !important;border-left:9px solid transparent !important;border-right:9px solid transparent !important;border-top:9px solid var(--fx-accent-dk,#9f1239) !important;border-radius:0 !important;box-shadow:none !important;font-size:0 !important}
#reviewTabLab[hidden]{display:none !important}

/* three tabs need a little more room on desktop */
@media (min-width:768px){
#reviewToggle{grid-column:1 / 8 !important}
#patientSearchBanner{grid-column:8 / -1 !important}
}
@media (max-width:767px){
#reviewTabLab,#reviewTabFin,#reviewTabPat{font-size:10.5px !important;gap:3px !important}
}

/* ---------- Laboratory mode: hide the Financial blocks, show the lab block ---------- */
body.lab-review-mode .fin-block,
body.lab-review-mode #dashSepLine{display:none !important}
#labReviewBlock{display:none}
body.lab-review-mode #labReviewBlock{display:block;grid-column:1 / -1;grid-row:3;order:2;min-width:0}

/* ---------- hero ---------- */
.lrv-hero{background:linear-gradient(135deg,#7c2d12,#b45309 55%,#d97706);color:#fff;border-radius:12px;padding:8px 16px;display:flex;align-items:center;flex-wrap:wrap;gap:8px 18px;box-shadow:0 4px 14px rgba(180,83,9,.35)}
.lrv-hero .lrv-ttl{font-size:14px;font-weight:700}
.lrv-hero .lrv-ttl small{display:block;font-size:10.5px;font-weight:600;opacity:.85;letter-spacing:0}
.lrv-range{margin-left:auto;display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.lrv-chip{border:1px solid rgba(255,255,255,.55);background:rgba(255,255,255,.12);color:#fff;border-radius:99px;padding:3px 10px;font-size:11px;font-weight:600;cursor:pointer;font-family:inherit}
.lrv-chip.on{background:#fff;color:#92400e;border-color:#fff}
.lrv-date{height:20px;line-height:1;padding:0 4px;font-size:11px;font-family:inherit;border:1px solid rgba(255,255,255,.55);border-radius:5px;background:rgba(255,255,255,.95);color:#7c2d12;width:126px;min-width:0;margin:0;box-sizing:border-box}
.lrv-to{font-size:11px;font-weight:700;opacity:.9}

/* ---------- look & feel = Financial / Patient Review (same classes, same fonts) ---------- */
#labReviewBlock .lrv-card{margin-top:12px}
#labReviewBlock .lrv-statcard{margin-top:10px}
#labReviewBlock .cash-pos-title small{font-size:11px !important;font-weight:600 !important;color:#005fb8;cursor:pointer;white-space:nowrap}
.lrv-empty{text-align:center;padding:12px 6px;color:#6b7c93;font-size:11.5px}

/* quick buttons: same blue button as "New OPD / New Laboratory Test" */
.lrv-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.lrv-act{padding:9px 16px;background:#0a3f8f;color:#fff;border:1px solid #072f6e;border-radius:6px;font-size:13px;font-weight:600;font-family:inherit;letter-spacing:.2px;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.28);transition:background-color .18s ease,transform .18s ease}
.lrv-act:hover{background:#0d4fb3}
.lrv-act:active{transform:translateY(1px)}

/* two-column grid of cards */
.lrv-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0 12px;align-items:start}
.lrv-grid .lrv-card.w7{grid-column:span 7}.lrv-grid .lrv-card.w5{grid-column:span 5}

/* patient rows: same as Consultants / Admitted Patients rows */
.lrv-row{display:flex;align-items:center;gap:9px;background:#f7fafd;border:1px solid #e0eaf5;border-radius:9px;padding:6px 9px;margin-bottom:6px}
.lrv-row:last-child{margin-bottom:0}
.lrv-av{width:30px;height:30px;border-radius:50%;background:#dcebfb;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}
.lrv-info{flex:1;min-width:0}
.lrv-nm{font-size:12px;font-weight:600;color:#14233a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lrv-sub{font-size:10.5px;color:#6b7c93;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lrv-tests{display:flex;flex-wrap:wrap;gap:3px;margin-top:3px}
.lrv-tests em{font-style:normal;font-size:10px;font-weight:700;padding:1px 8px;border-radius:20px;background:#dcebfb;color:#005fb8}
.lrv-badge{font-size:10px;font-weight:700;padding:2px 8px;border-radius:20px;white-space:nowrap}
.lrv-badge.pen{background:#ffe4e6;color:#be123c}.lrv-badge.par{background:#fef3c7;color:#b45309}.lrv-badge.fin{background:#d1fae5;color:#047857}
.lrv-btn{border:1px solid #072f6e;border-radius:6px;padding:5px 11px;font-size:11px;font-weight:600;cursor:pointer;white-space:nowrap;font-family:inherit;box-shadow:0 1px 2px rgba(0,0,0,.28)}
.lrv-btn.main,.lrv-btn.ok{background:#0a3f8f;color:#fff}
.lrv-btn.alt{background:#fff;color:#0a3f8f;border-color:#8aa5c4;margin-left:4px}
.lrv-side{display:flex;flex-direction:column;align-items:flex-end;gap:5px}

/* test-wise table */
.lrv-trow{display:grid;grid-template-columns:minmax(0,1fr) 38px 38px 38px;gap:6px;align-items:center;padding:5px 0;font-size:11.5px;border-bottom:1px dashed #e2e8f0}
.lrv-trow.h{font-size:9.5px;font-weight:800;color:#94a3b8;text-transform:uppercase;border-bottom:1px solid #e2e8f0}
.lrv-trow .n{font-weight:700;color:#0a5c74;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lrv-trow .c{text-align:center;font-weight:800}
.lrv-trow .c1{color:#b45309}.lrv-trow .c2{color:#059669}.lrv-trow .c3{color:#be123c}

/* 7-day trend */
.lrv-trend{display:flex;align-items:flex-end;gap:8px;height:120px;padding-top:6px}
.lrv-bar{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;min-width:0}
.lrv-bar .stk{width:100%;max-width:34px;display:flex;flex-direction:column;justify-content:flex-end;border-radius:6px 6px 0 0;overflow:hidden;background:#f1f5f9}
.lrv-bar .stk u{display:block;width:100%;text-decoration:none}
.lrv-bar .stk .f{background:#34d399}.lrv-bar .stk .p{background:#fb7185}
.lrv-bar .v{font-size:10px;font-weight:800;color:#475569;margin-bottom:2px}
.lrv-bar .d{font-size:9.5px;color:#94a3b8;margin-top:3px;font-weight:600}
.lrv-legend{display:flex;gap:12px;font-size:10px;font-weight:700;color:#64748b;margin-top:6px}
.lrv-legend i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:4px;vertical-align:-1px}

/* old pending warning */
.lrv-warn{margin-top:10px;background:#fff1f2;border:1.5px solid #fecdd3;color:#9f1239;border-radius:10px;padding:8px 12px;font-size:11.5px;font-weight:700;cursor:pointer}

/* ---------- tablet / phone ---------- */
@media (max-width:1100px){
.lrv-grid .lrv-card.w7,.lrv-grid .lrv-card.w5{grid-column:1 / -1}
#labReviewBlock .lrv-statcard .cash-pos-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important}
}
@media (max-width:767px){
.lrv-hero{padding:9px 12px}
.lrv-range{margin-left:0;width:100%}

#labReviewBlock{margin-top:6px}
}

/* ============================================================
   SAME PLACE + SAME SIZE: Patient Review (green bar) = Laboratory Review (orange bar)
   Both bars: same row, same top gap, full width, same height (desktop / laptop).
   Only these two bars are touched - nothing else.
   ============================================================ */
@media (min-width:768px){
body.lab-review-mode .dash-cols{row-gap:12px !important}
body.patient-review-mode #dashIncomeBlock,
body.lab-review-mode #labReviewBlock{margin-top:0 !important;margin-bottom:0 !important;align-self:start}
body.patient-review-mode #dashRightStack .dr-hero,
body.lab-review-mode #labReviewBlock .lrv-hero{box-sizing:border-box;width:100%;margin:0;padding:0 16px;min-height:58px;align-items:center;border-radius:12px}
}
@media (min-width:1100px){
body.patient-review-mode #dashRightStack .dr-hero,
body.lab-review-mode #labReviewBlock .lrv-hero{height:58px;flex-wrap:nowrap}
}

/* Laboratory Review: tab row (Financial / Patient / Laboratory / Patient Search) gets the SAME top spacing as Patient Review,
   so the gap above the orange bar = the gap above the green bar. */
@media (min-width:768px){
html body.lab-review-mode #reviewToggle{margin-top:-8px !important}
html body.lab-review-mode #patientSearchBanner{margin-top:-2px !important}
}

/* ---------- Lab Report - Status card: own period options + dates, and "Total (all dates)" strip ---------- */
.lrv-sbar{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:2px 0 10px}
.lrv-schip{border:1px solid #8aa5c4;background:#fff;color:#0a3f8f;border-radius:99px;padding:3px 11px;font-size:11px;font-weight:600;cursor:pointer;font-family:inherit}
.lrv-schip.on{background:#0a3f8f;color:#fff;border-color:#0a3f8f}
.lrv-sdate{height:22px;line-height:1;padding:0 4px;font-size:11px;font-family:inherit;border:1px solid #8aa5c4;border-radius:5px;background:#fff;color:#14233a;width:128px;min-width:0;margin:0;box-sizing:border-box}
.lrv-sto{font-size:11px;font-weight:700;color:#6b7c93}
.lrv-tot{display:flex;align-items:center;flex-wrap:wrap;gap:6px 18px;margin-top:10px;padding:8px 12px;background:#f7fafd;border:1px solid #e0eaf5;border-radius:9px;font-size:12px;color:#475569}
.lrv-tot-h{font-weight:800;color:#14233a}
.lrv-tot-i{cursor:pointer;font-weight:600}
.lrv-tot-i b{font-size:14px;font-weight:800;margin-left:3px;color:#14233a}
.lrv-tot-i b.c1{color:#b45309}.lrv-tot-i b.c2{color:#059669}.lrv-tot-i b.c3{color:#be123c}

/* LIVE (today) strip inside Lab Report - Status */
.lrv-live{display:flex;align-items:center;flex-wrap:wrap;gap:6px 18px;margin:2px 0 10px;padding:8px 12px;background:#ecfdf5;border:1px solid #a7f3d0;border-radius:9px;font-size:12px;color:#065f46}
.lrv-live-h{font-weight:800;display:inline-flex;align-items:center;gap:6px}
.lrv-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#10b981;box-shadow:0 0 0 0 rgba(16,185,129,.7);animation:lrvPulse 1.6s infinite}
@keyframes lrvPulse{0%{box-shadow:0 0 0 0 rgba(16,185,129,.6)}70%{box-shadow:0 0 0 8px rgba(16,185,129,0)}100%{box-shadow:0 0 0 0 rgba(16,185,129,0)}}
.lrv-live-i{cursor:pointer;font-weight:600}
.lrv-live-i b{font-size:15px;font-weight:800;margin-left:3px;color:#14233a}
.lrv-live-i b.c1{color:#b45309}.lrv-live-i b.c2{color:#059669}.lrv-live-i b.c3{color:#be123c}
.lrv-live-t{margin-left:auto;font-size:10.5px;color:#4b7a6a;font-weight:600}

/* Laboratory Review: the orange bar now holds the quick buttons (Lab Reports ... Attendance) */
.lrv-hero .lrv-actions{margin:0;flex:1;gap:8px;align-items:center;justify-content:flex-start}
.lrv-hero .lrv-act{padding:6px 14px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.65);color:#fff;box-shadow:none;border-radius:8px;font-size:13px}
.lrv-hero .lrv-act:hover{background:#fff;color:#7c2d12}
@media (max-width:767px){.lrv-hero{padding:8px 10px}.lrv-hero .lrv-act{padding:6px 10px;font-size:12px}}

/* ============================================================
   Patient Review green bar: DATE RANGE on the left side, all INCOME figures together on the right side
   left : Date Range [from] to [to]
   right: Range total + receipts | MTD  YTD | Income Today
   (laptop / desktop only - mobile layout is not changed)
   ============================================================ */
@media (min-width:768px){
body.patient-review-mode #dashRightStack .dr-hero{gap:8px 10px}
body.patient-review-mode #dashRightStack .dr-hero .dr-range{display:contents}
body.patient-review-mode #dashRightStack .dr-hero .dr-range-l{order:1;margin-right:2px}
body.patient-review-mode #dashRightStack .dr-hero #drRangeFrom{order:2}
body.patient-review-mode #dashRightStack .dr-hero .dr-range-to{order:3}
body.patient-review-mode #dashRightStack .dr-hero #drRangeTo{order:4}
body.patient-review-mode #dashRightStack .dr-hero #drRangeVal{order:5;margin-left:auto;font-size:15px;font-weight:800;white-space:nowrap}
body.patient-review-mode #dashRightStack .dr-hero #drRangeVal::before{content:'Range ';font-size:11px;font-weight:600;opacity:.8}
body.patient-review-mode #dashRightStack .dr-hero #drRangeN{order:6;font-size:10.5px;white-space:nowrap;margin-right:6px}
body.patient-review-mode #dashRightStack .dr-hero .dr-hero-row{order:7;gap:14px;padding-left:18px;border-left:1px solid rgba(255,255,255,.35);white-space:nowrap}
body.patient-review-mode #dashRightStack .dr-hero .dr-hero-main{order:8;margin-left:0;padding-left:18px;border-left:1px solid rgba(255,255,255,.35)}
}

/* Green bar: every income indicator uses the same sizes (label 12px / figure 15px bold / receipts 11px) */
@media (min-width:768px){
body.patient-review-mode #dashRightStack .dr-hero #drRangeVal::before{font-size:12px;font-weight:400;opacity:.85}
body.patient-review-mode #dashRightStack .dr-hero #drRangeVal{font-size:15px;font-weight:800}
body.patient-review-mode #dashRightStack .dr-hero #drRangeN{font-size:11px}
body.patient-review-mode #dashRightStack .dr-hero .dr-hero-row{font-size:12px}
body.patient-review-mode #dashRightStack .dr-hero .dr-hero-row b{font-size:15px;font-weight:800}
body.patient-review-mode #dashRightStack .dr-hero .dr-hero-l{font-size:12px}
body.patient-review-mode #dashRightStack .dr-hero .dr-hero-v{font-size:15px;font-weight:800}
body.patient-review-mode #dashRightStack .dr-hero .dr-hero-s{font-size:11px}
}
/* Range figure = link */
#dashRightStack .dr-hero .dr-link{cursor:pointer;text-decoration:underline;text-underline-offset:3px}
#dashRightStack .dr-hero .dr-link:hover{opacity:.8}

/* Green bar: Range figure sits right next to the Date Range (left side); right side keeps MTD / YTD / Income Today */
@media (min-width:768px){
body.patient-review-mode #dashRightStack .dr-hero #drRangeVal{margin-left:8px}
body.patient-review-mode #dashRightStack .dr-hero #drRangeVal::before{content:'= ';font-weight:400;opacity:.85}
body.patient-review-mode #dashRightStack .dr-hero #drRangeN{margin-right:0}
body.patient-review-mode #dashRightStack .dr-hero .dr-hero-row{margin-left:auto}
}