:root{--nav:#122d45;--nav-hover:#1d425f;--accent:#087f8c;--bg:#f4f7fb;--ink:#19324a}
body{background:var(--bg);color:var(--ink);font-size:.94rem} .sidebar{width:270px;background:var(--nav);color:#dce8f2;min-height:100vh;position:fixed;inset:0 auto 0 0;overflow-y:auto;z-index:1050} .brand{padding:1.4rem 1.1rem;border-bottom:1px solid #ffffff24}.brand small{color:#a9c1d2}.nav-heading{font-size:.67rem;letter-spacing:.11em;text-transform:uppercase;color:#8ca9c0;padding:1.1rem 1.2rem .35rem}.side-link{display:flex;align-items:center;gap:.65rem;color:#dce8f2;text-decoration:none;padding:.57rem 1.15rem;border-left:3px solid transparent;font-size:.87rem}.side-link:hover,.side-link.active{background:var(--nav-hover);color:#fff;border-left-color:#54c6cf}.side-link i{width:18px}.side-link.sub{padding-left:2.5rem;font-size:.81rem;color:#c2d3e0}.main{margin-left:270px;min-height:100vh}.topbar{background:#fff;border-bottom:1px solid #e2eaf0;padding:1rem 1.6rem}.content{padding:1.7rem}.page-title{font-size:1.55rem;font-weight:700}.subtle{color:#718395}.stat-card,.panel{background:#fff;border:1px solid #e4eaf0;border-radius:14px;box-shadow:0 3px 16px #122d4509}.stat-card{padding:1.2rem;cursor:pointer;transition:transform .15s,box-shadow .15s}.stat-card:hover,.stat-card:focus-visible{transform:translateY(-2px);box-shadow:0 7px 20px #122d4520;outline:2px solid #087f8c;outline-offset:1px}.stat-icon{width:43px;height:43px;border-radius:12px;display:grid;place-items:center;font-size:1.3rem}.stat-number{font-size:1.8rem;font-weight:750;line-height:1.2}.panel{padding:1.3rem}.btn-brand{background:var(--accent);color:white;border-color:var(--accent)}.btn-brand:hover{background:#086b76;color:#fff;border-color:#086b76}.table thead th{font-size:.73rem;text-transform:uppercase;letter-spacing:.04em;color:#6b8091;background:#f7f9fc;white-space:nowrap}.table td{vertical-align:middle}.badge-soft{background:#e6f5f6;color:#096e79}.badge-pending{background:#fff3d8;color:#916300}.badge-temp{background:#fce8e8;color:#a63a3a}.view{display:none}.view.active{display:block}.empty-page{min-height:320px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.mobile-toggle{display:none}.quick-btn{padding:.7rem .35rem;font-size:.87rem}.metric-modal .modal-body{max-height:65vh;overflow-y:auto}.metric-modal .table{font-size:.87rem}.service-row{cursor:pointer}.service-row:hover{background:#f2f9fa}.progress{height:8px}.inventory-link{cursor:pointer}.stock-low{background:#fff3d8;color:#916300}.stock-out{background:#fce8e8;color:#a63a3a}
@media(max-width:991px){.sidebar{transform:translateX(-100%);transition:transform .2s}.sidebar.show{transform:translateX(0)}.main{margin-left:0}.mobile-toggle{display:inline-flex}.content{padding:1rem}.topbar{padding:.85rem 1rem}}

/* Patient Management */
.patient-avatar{height:60px;width:60px;border-radius:16px;background:#e6f4f5;color:#087f8c;display:grid;place-items:center}
#profileTabs .nav-link{font-size:.84rem;color:#40576c}#profileTabs .nav-link.active{font-weight:700;color:#087f8c}
.profile-detail{padding:12px 14px;border:1px solid #e8edf3;border-radius:10px;height:100%;background:#fafcfe}.profile-detail .field-label{font-size:.76rem;color:#718395;margin-bottom:4px}.profile-detail .field-value{font-weight:600;overflow-wrap:anywhere}
#patientRegistrationForm .form-label{font-size:.83rem;font-weight:600}.case-item{border:1px solid #e5eaf0;border-radius:10px;padding:12px;margin-bottom:9px}

.profile-overview-link{background:#fff;border:1px solid #e5eaf0;border-radius:10px;cursor:pointer}.profile-overview-link:hover{border-color:#087f8c;background:#f2fafb}

/* Registration requests and workflow layout */
.service-request-inline,.medicine-request-panel{border-left:3px solid var(--bs-primary,#0d6efd)}
.inline-service-item{background:var(--bs-body-bg,#fff)}

/* v2.19: consistent page-header actions across modules */
.view .page-header-action {
  display:inline-flex!important;align-items:center;justify-content:center;gap:.48rem;
  min-height:38px;height:38px;padding:0 .95rem!important;min-width:125px;
  border-radius:9px!important;border:1px solid #087f8c!important;
  background:#087f8c!important;color:#fff!important;
  font-size:.875rem!important;font-weight:600!important;line-height:1.15!important;
  white-space:nowrap;box-shadow:none!important;transition:background .16s,border-color .16s,transform .16s;
}
.view .page-header-action:hover,.view .page-header-action:focus-visible {background:#066874!important;border-color:#066874!important;color:#fff!important;}
.view .page-header-action:active {transform:translateY(1px)}
.view .page-header-action i {font-size:1rem;line-height:1;flex-shrink:0}
.view .page-header-actions {display:flex;align-items:center;justify-content:flex-end;gap:.5rem;flex-wrap:wrap}
@media(max-width:575px){.view .page-header-actions{width:100%;justify-content:flex-start}.view .page-header-action{min-width:0}}
/* Sidebar: scroll when needed, but do not show a permanent heavy scrollbar */
.sidebar {overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:none;scrollbar-color:#577a91 transparent;}
.sidebar:hover,.sidebar:focus-within {scrollbar-width:thin;}
.sidebar::-webkit-scrollbar {width:0;background:transparent;}
.sidebar:hover::-webkit-scrollbar,.sidebar:focus-within::-webkit-scrollbar {width:5px;}
.sidebar::-webkit-scrollbar-thumb {background:#6b8da3;border-radius:20px;}
.sidebar::-webkit-scrollbar-thumb:hover {background:#92b6c8;}
.sidebar::-webkit-scrollbar-track {background:transparent;}
.side-link:focus-visible {outline:2px solid #7bdce3;outline-offset:-2px;}

/* v2.20: cohesive palette and 12px default text. */
html { font-size:12px; }
body { font-size:12px; }
.btn, .form-control, .form-select, .input-group-text, .dropdown-item { font-size:12px; }
.btn-primary, .btn-info, .btn-brand, .bg-primary, .bg-info { --bs-btn-bg:#087f8c; --bs-btn-border-color:#087f8c; --bs-btn-hover-bg:#066874; --bs-btn-hover-border-color:#066874; --bs-btn-active-bg:#055c65; --bs-btn-active-border-color:#055c65; }
.btn-info, .btn-primary { background-color:#087f8c; border-color:#087f8c; color:#fff; }
.btn-info:hover, .btn-primary:hover { background-color:#066874; border-color:#066874; color:#fff; }
.btn-outline-primary, .btn-outline-info { color:#087f8c; border-color:#087f8c; }
.btn-outline-primary:hover, .btn-outline-info:hover { color:#fff; background-color:#087f8c; border-color:#087f8c; }
.service-request-inline, .medicine-request-panel { border-left-color:#087f8c; }
.view .page-header-row { align-items:center!important; row-gap:10px; }
.view .page-header-row > div { align-self:center; }
.view .page-header-action { box-sizing:border-box; height:36px!important; min-height:36px!important; padding:0 12px!important; min-width:0; font-size:12px!important; line-height:1!important; vertical-align:middle; }
.view .page-header-action i { font-size:14px; display:inline-flex; align-items:center; justify-content:center; }
.view .page-header-actions { display:flex; align-items:center!important; justify-content:flex-end; gap:8px; }
@media (max-width:575px) { .view .page-header-actions { justify-content:flex-start; } }

/* Pharmacy UI v2.21: same typography and button palette as the rest of the prototype. */
.pharmacy-kpi { cursor: pointer; transition: box-shadow .15s ease, transform .15s ease; }
.pharmacy-kpi:hover, .pharmacy-kpi:focus-visible { box-shadow: 0 6px 18px rgba(0, 64, 70, .12); transform: translateY(-1px); outline: 2px solid #a4d8d4; }
#view-medicine-dispensing .subtle, #view-pharmacy-dashboard .subtle { line-height: 1.6; }

/* Billing & Payments — prototype-only UI */
.billing-paper{background:#fff;border:1px solid #dce5e5;border-radius:10px;padding:28px;max-width:880px;margin:auto;color:#24323b}
.billing-paper .paper-heading{border-bottom:2px solid #177f83;padding-bottom:14px;margin-bottom:18px}
.billing-paper .paper-stamp{border:1px dashed #bf6c6c;color:#a24c4c;padding:5px 10px;font-size:11px;font-weight:700;display:inline-block;letter-spacing:.05em}
.billing-paper .paper-meta{display:grid;grid-template-columns:1fr 1fr;gap:8px 24px;margin:18px 0}
.billing-paper table{font-size:12px}
.billing-paper .paper-total{background:#eaf6f5;font-weight:700}
.billing-kpi{cursor:pointer}
.billing-transaction-summary{background:#f1f8f8;border-radius:8px;padding:12px}
@media(max-width:600px){.billing-paper{padding:12px}.billing-paper .paper-meta{grid-template-columns:1fr}}
@media print{body.billing-print-mode .sidebar,body.billing-print-mode .topbar,body.billing-print-mode .view,body.billing-print-mode .btn{display:none!important}body.billing-print-mode .main,body.billing-print-mode .content{margin:0!important;padding:0!important}body.billing-print-mode #billingPrintHost{display:block!important;position:absolute;left:0;top:0;width:100%;padding:0}body.billing-print-mode .billing-paper{border:0;max-width:none}body.billing-print-mode .paper-stamp{display:block}}

/* Doctor Management v2.23 */
.doctor-kpi{cursor:pointer;transition:box-shadow .15s ease,transform .15s ease}
.doctor-kpi:hover,.doctor-kpi:focus-visible{box-shadow:0 6px 18px rgba(0,64,70,.12);transform:translateY(-1px);outline:2px solid #a4d8d4}
.doctor-profile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.doctor-profile-grid .label{font-size:11px;color:#667781;margin-bottom:4px}
.doctor-request-item{background:#f1f8f8;border:1px solid #d8e9e7;border-radius:8px;padding:10px;margin-bottom:8px}
@media(max-width:600px){.doctor-profile-grid{grid-template-columns:1fr}}

/* System Administration v2.25 */
.admin-stat{cursor:pointer;min-height:112px;transition:box-shadow .15s}
.admin-stat:hover{box-shadow:0 6px 18px rgba(0,64,70,.1)}
.admin-stat h2{font-size:24px;margin:7px 0;color:#177f83}
.admin-stat span{font-size:11px;color:#65777d}
.admin-nav{min-height:42px;display:flex;align-items:center}
.admin-master-list{max-height:660px;overflow:auto}
.admin-group-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#557179;margin:12px 0 5px}
.admin-master-item{width:100%;display:flex;justify-content:space-between;align-items:center;text-align:left;border:1px solid transparent;background:transparent;border-radius:6px;padding:8px 10px;color:#344e56;font-size:12px}
.admin-master-item:hover,.admin-master-item.active{background:#e7f5f3;border-color:#b7d9d6;color:#176b6e}
#adminMasterTable tbody tr{cursor:pointer}
#adminMasterTable tbody tr.selected{background:#e7f5f3}


/* Presentation refinement over the original v2.28 palette */
:root { --ui-border:#e4eaf0; --ui-muted:#64717d; }
body { font-size:12px; line-height:1.55; }
.btn, button.btn, a.btn, .dropdown-item, .quick-btn { font-size:12px!important; line-height:1.4; }
.btn:not(.btn-close) { display:inline-flex; align-items:center; justify-content:center; gap:6px; vertical-align:middle; min-height:34px; font-weight:500; }
.btn.btn-sm:not(.btn-close) { min-height:30px; padding:5px 10px; }
.btn.btn-lg:not(.btn-close) { min-height:40px; padding:9px 15px; }
.btn > i.bi { font-size:14px; line-height:1; flex-shrink:0; }
.btn-group .btn { min-width:0; }
.view .page-header-action { min-height:36px!important; height:auto!important; padding:8px 12px!important; line-height:1.4!important; text-align:center; }
.view .page-header-row { align-items:center!important; row-gap:12px; }
.view .page-header-actions { align-items:center!important; gap:8px; }
.view .page-header-action > i.bi { font-size:14px!important; }
.panel,.stat-card,.card,.modal-content { border-color:var(--ui-border); }
.alert:not(.alert-danger):not(.alert-warning):not(.alert-success) { border-color:#e4eaf0; }
.border-info,.border-primary { border-color:#b7d9d6!important; }
.bg-info-subtle,.bg-primary-subtle { background:#e6f5f6!important; }
.view .panel p,.view .card p,.view .alert p,.view .text-muted,.view .subtle { line-height:1.6; }
.view .panel p:last-child,.view .card p:last-child { margin-bottom:0; }
.view .alert,.view .card-body,.view .panel { overflow-wrap:break-word; }
.view .badge { line-height:1.35; white-space:normal; }
.view .table td { line-height:1.5; }
.view .form-text,.view small { line-height:1.5; }
.topbar { min-height:64px; padding-top:10px; padding-bottom:10px; }
.topbar-tools { flex-shrink:0; }
.topbar-icon-btn { width:38px; height:38px; min-height:38px!important; border:1px solid transparent; border-radius:10px; color:#59616b; background:#f4f7fb; position:relative; }
.topbar-icon-btn:hover,.topbar-icon-btn:focus-visible { background:#e6f5f6; color:#086b76; border-color:#b7d9d6; }
.topbar-icon-btn > i.bi { font-size:17px; }
.notification-count { position:absolute; top:0; right:-3px; min-width:17px; height:17px; padding:0 4px; border-radius:10px; background:#087f8c; color:white; display:grid; place-items:center; font-size:10px; font-weight:700; line-height:1; border:2px solid white; }
.notification-count.d-none { display:none!important; }
.topbar-account-btn { min-height:40px!important; padding:4px 8px!important; border:1px solid transparent; border-radius:10px; color:#32383f; }
.topbar-account-btn:hover,.topbar-account-btn:focus-visible { background:#f4f7fb; border-color:#dbe7ef; }
.staff-avatar { display:inline-grid; place-items:center; width:33px; height:33px; flex-shrink:0; background:#e6f5f6; color:#096e79; border-radius:50%; font-size:16px; }
.staff-avatar-large { width:48px; height:48px; font-size:23px; }
.staff-label { line-height:1.3; gap:2px; }
.staff-label strong { font-size:12px; font-weight:650; }
.staff-label small { font-size:11px; color:#6d747c; }
.account-chevron { color:#858b93; font-size:11px!important; }
.topbar-account-menu { min-width:210px; padding:6px; border:1px solid var(--ui-border); border-radius:12px; box-shadow:0 12px 32px #28201818; }
.topbar-account-menu .dropdown-header { padding:10px; color:#65707b; font-size:11px; }
.topbar-account-menu .dropdown-item { display:flex; align-items:center; gap:10px; padding:10px; border-radius:7px; }
.topbar-account-menu .dropdown-item i { font-size:15px; color:#087f8c; }
.topbar-account-menu .dropdown-item:hover { background:#e6f5f6; color:#086b76; }
.topbar-notifications { width:min(390px,calc(100vw - 24px)); border:1px solid var(--ui-border); border-radius:12px; box-shadow:0 12px 32px #28201818; overflow:hidden; }
.notification-head { padding:14px 15px; border-bottom:1px solid #e4eaf0; }
.notification-head .btn,.notification-footer .btn { font-size:11px!important; min-height:28px!important; color:#086b76; }
.notification-list { max-height:330px; overflow-y:auto; }
.notification-item { display:flex; align-items:flex-start; gap:10px; width:100%; white-space:normal; padding:12px 14px; border-bottom:1px solid #e4eaf0; line-height:1.5; }
.notification-item:hover { background:#f4f7fb; }
.notification-item.unread { background:#f4f7fb; }
.notification-symbol { width:32px; height:32px; display:grid; place-items:center; flex-shrink:0; border-radius:9px; background:#e6f5f6; color:#096e79; font-size:15px; }
.notification-copy { display:flex; flex:1; min-width:0; flex-direction:column; gap:2px; color:#6d737b; }
.notification-copy strong { color:#30343a; font-size:12px; font-weight:650; }
.notification-copy span { font-size:11px; line-height:1.55; }
.notification-copy small { font-size:10px; color:#9299a1; }
.notification-dot { width:7px; height:7px; flex-shrink:0; border-radius:50%; background:#087f8c; margin-top:6px; }
.notification-item:not(.unread) .notification-dot { visibility:hidden; }
.notification-footer { padding:6px 10px; text-align:center; }
.staff-profile-row { display:flex; justify-content:space-between; align-items:flex-start; gap:15px; padding:10px 0; border-bottom:1px solid #e4eaf0; }
.staff-profile-row:last-child { border-bottom:0; }
.staff-profile-row > span { color:#6d747c; }
.staff-profile-row strong { text-align:right; }
@media(max-width:575px) { .topbar-notifications { position:fixed!important; top:60px!important; right:12px!important; left:auto!important; transform:none!important; } .topbar-account-btn { padding:4px!important; } }


/* Service Queue Status: row labels and progress content stay left-aligned. */
#view-dashboard .service-row {
    display: block;
    width: 100%;
    text-align: left!important;
    padding-left: 0!important;
    padding-right: 0!important;
    background: transparent;
}
#view-dashboard .service-row > div { text-align: left!important; }
#view-dashboard .service-row > .d-flex { display: flex!important; align-items: center; justify-content: space-between; }
#view-dashboard .service-row > .d-flex > span:first-child { text-align: left!important; }
#view-dashboard .service-row > .d-flex > span:last-child { text-align: right!important; margin-left: auto; }
#view-dashboard .service-row > .small.subtle { text-align: left!important; }
#view-dashboard .service-row .progress { width: 100%; }
#view-dashboard .service-row:hover { background: var(--bg); }