:root { --primary: #0b6b61; --primary-2: #0f8578; --primary-soft: #e7f5f2; --ink: #16332f; --muted: #667773; --line: #dbe6e3; --surface: #fff; --canvas: #f4f8f7; --accent: #d96b38; --danger: #c43d4b; --blue: #3076a9; --amber: #b27612; --green: #27805e; --shadow: 0 12px 35px rgba(21,70,63,.08); --radius: 18px; }
* { box-sizing: border-box; }
html { font-family: "Segoe UI", Arial, sans-serif; color: var(--ink); background: var(--canvas); }
body { margin: 0px; min-width: 320px; }
button, input, select { font: inherit; }
button { cursor: pointer; }
button:focus-visible, input:focus-visible, select:focus-visible, label.upload-box:focus-within { outline: rgba(11, 107, 97, 0.25) solid 3px; outline-offset: 2px; }
.app-shell { min-height: 100vh; }
.sidebar { position: fixed; inset: 0px auto 0px 0px; width: 250px; background: rgb(7, 63, 58); color: rgb(255, 255, 255); padding: 24px 16px; display: flex; flex-direction: column; z-index: 20; }
.brand { display: flex; align-items: center; gap: 12px; padding: 0px 8px 26px; }
.brand-mark { width: 44px; height: 44px; border-radius: 13px; background: rgb(255, 255, 255); color: var(--primary); display: grid; place-items: center; font-weight: 800; box-shadow: rgb(188, 225, 218) 0px 0px 0px 4px inset; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 17px; }
.brand small { font-size: 12px; color: rgb(183, 214, 208); margin-top: 2px; }
.sidebar nav { display: grid; gap: 5px; }
.nav-item { border: 0px; background: transparent; color: rgb(202, 224, 220); display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 11px; text-align: left; min-height: 46px; }
.nav-item:hover, .nav-item.active { background: rgba(255, 255, 255, 0.12); color: rgb(255, 255, 255); }
.nav-item svg { width: 20px; }
.nav-item b { margin-left: auto; background: rgb(255, 255, 255); color: var(--primary); font-size: 11px; min-width: 21px; height: 21px; border-radius: 11px; display: grid; place-items: center; }
.sidebar-foot { margin-top: auto; border-top: 1px solid rgba(255, 255, 255, 0.14); padding: 18px 8px 0px; display: flex; gap: 10px; align-items: center; }
.sidebar-foot strong, .sidebar-foot small { display: block; }
.sidebar-foot strong { font-size: 13px; }
.sidebar-foot small { font-size: 11px; color: rgb(183, 214, 208); }
.staff-avatar { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: rgb(217, 238, 233); color: var(--primary); font-weight: 800; }
.main { margin-left: 250px; min-height: 100vh; padding: 0px 34px 48px; }
.topbar { height: 94px; display: flex; align-items: center; justify-content: space-between; gap: 20px; position: sticky; top: 0; z-index: 80; background: color-mix(in srgb, var(--canvas) 94%, transparent); backdrop-filter: blur(12px); }
.topbar h1 { margin: 2px 0px 0px; font-size: 25px; }
.eyebrow { text-transform: uppercase; letter-spacing: 0.11em; font-size: 11px; font-weight: 800; color: var(--primary); margin: 0px; }
.top-actions { display: flex; align-items: center; gap: 14px; }
.page { display: none; }
.page.active { display: block; }
.menu-button { display: none; }
.icon-button { width: 42px; height: 42px; border: 1px solid var(--line); background: rgb(255, 255, 255); border-radius: 11px; display: grid; place-items: center; color: var(--ink); }
.icon-button svg { width: 20px; }
.primary, .secondary, .light-button, .text-button, .back-link { min-height: 44px; border-radius: 11px; border: 0px; padding: 0px 18px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.primary { background: var(--primary); color: rgb(255, 255, 255); }
.primary:hover { background: rgb(7, 86, 79); }
.primary.compact { min-height: 42px; }
.secondary { background: rgb(255, 255, 255); border: 1px solid var(--line); color: var(--ink); }
.light-button { background: rgb(255, 255, 255); color: var(--primary); }
.text-button, .back-link { background: transparent; color: var(--primary); padding: 0px; }
.primary svg, .secondary svg, .light-button svg, .text-button svg, .back-link svg { width: 18px; }
.welcome-band { background: linear-gradient(120deg, rgb(10, 98, 89), rgb(19, 132, 119)); color: rgb(255, 255, 255); border-radius: 22px; padding: 28px 30px; display: flex; justify-content: space-between; align-items: center; box-shadow: var(--shadow); position: relative; overflow: hidden; }
.welcome-band::after { content: ""; position: absolute; width: 220px; height: 220px; border: 45px solid rgba(255, 255, 255, 0.06); border-radius: 50%; right: 120px; top: -88px; }
.welcome-band h2 { font-size: 27px; margin: 5px 0px 7px; }
.welcome-band p:not(.eyebrow) { margin: 0px; color: rgb(214, 235, 231); }
.welcome-band .eyebrow { color: rgb(189, 227, 220); }
.welcome-band button { z-index: 1; }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 20px 0px; }
.stat-card { background: rgb(255, 255, 255); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; display: flex; align-items: center; gap: 14px; }
.stat-icon { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; }
.stat-icon svg { width: 22px; }
.teal { background: rgb(229, 245, 242); color: var(--primary); }
.amber { background: rgb(255, 243, 220); color: var(--amber); }
.blue { background: rgb(231, 241, 248); color: var(--blue); }
.green { background: rgb(229, 243, 236); color: var(--green); }
.rose { background: rgb(250, 232, 236); color: rgb(173, 75, 96); }
.stat-card span, .stat-card strong, .stat-card small { display: block; }
.stat-card span { font-size: 12px; color: var(--muted); }
.stat-card strong { font-size: 26px; margin: 2px 0px; }
.stat-card small { font-size: 11px; color: rgb(135, 147, 143); }
.dashboard-grid { display: grid; grid-template-columns: minmax(0px, 1.65fr) minmax(280px, 0.7fr); gap: 20px; }
.panel { background: rgb(255, 255, 255); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; box-shadow: rgba(21, 70, 63, 0.035) 0px 5px 20px; }
.panel-head, .section-intro, .wizard-top, .modal-head { display: flex; justify-content: space-between; align-items: center; gap: 18px; }
.panel-head h2, .panel-head h3, .section-intro h2, .wizard-top h2, .modal-head h2 { margin: 4px 0px 0px; }
.section-intro { margin: 6px 0px 22px; }
.section-intro p:not(.eyebrow) { color: var(--muted); margin: 7px 0px 0px; }
.queue-list { display: grid; margin-top: 14px; }
.queue-row { display: grid; grid-template-columns: 48px 1.3fr 1fr 1fr auto; gap: 13px; align-items: center; padding: 14px 4px; border-top: 1px solid rgb(237, 242, 241); }
.queue-row:first-child { border-top: 0px; }
.queue-no { width: 38px; height: 38px; border-radius: 10px; background: var(--primary-soft); display: grid; place-items: center; color: var(--primary); font-weight: 800; }
.patient-cell strong, .patient-cell small { display: block; }
.patient-cell small, .queue-meta small { font-size: 11px; color: var(--muted); }
.queue-meta { font-size: 13px; }
.status { display: inline-flex; align-items: center; gap: 6px; border-radius: 20px; padding: 6px 10px; font-size: 11px; font-weight: 800; white-space: nowrap; }
.status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentcolor; }
.status.waiting { color: rgb(147, 96, 10); background: rgb(255, 244, 221); }
.status.laboratory { color: rgb(37, 111, 158); background: rgb(232, 243, 249); }
.status.released { color: rgb(35, 116, 85); background: rgb(230, 244, 237); }
.status.registered { color: rgb(113, 84, 164); background: rgb(240, 235, 248); }
.quick-panel { padding-bottom: 12px; }
.quick-action { width: 100%; border-width: 1px 0px 0px; border-style: solid none none; border-color: rgb(237, 242, 241) currentcolor currentcolor; border-image: none; background: transparent; display: grid; grid-template-columns: 44px 1fr 20px; gap: 12px; align-items: center; text-align: left; padding: 15px 2px; }
.quick-action:hover { background: rgb(248, 251, 250); }
.quick-action strong, .quick-action small { display: block; }
.quick-action strong { font-size: 13px; }
.quick-action small { color: var(--muted); margin-top: 3px; }
.quick-action > svg { width: 17px; color: rgb(154, 171, 167); }
.quick-icon { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; }
.quick-icon svg { width: 20px; }
.type-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.type-card { border: 1px solid var(--line); background: rgb(255, 255, 255); border-radius: 20px; padding: 24px; text-align: left; color: var(--ink); min-height: 270px; position: relative; transition: transform 0.2s, box-shadow 0.2s; }
.type-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.type-card .type-icon { width: 52px; height: 52px; border-radius: 15px; display: grid; place-items: center; margin-bottom: 20px; }
.type-card .type-icon svg { width: 25px; }
.type-card.rose .type-icon { background: rgb(250, 232, 236); color: rgb(173, 75, 96); }
.type-card.blue .type-icon { background: rgb(231, 241, 248); color: var(--blue); }
.type-card.teal .type-icon { background: rgb(229, 245, 242); color: var(--primary); }
.pill, .route-badge, .count-badge { display: inline-flex; border-radius: 16px; background: rgb(240, 245, 244); color: var(--muted); padding: 5px 9px; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; }
.type-card h3 { font-size: 21px; margin: 12px 0px 8px; }
.type-card p { color: var(--muted); line-height: 1.55; margin: 0px; }
.card-link { position: absolute; bottom: 23px; color: var(--primary); font-weight: 800; font-size: 13px; display: flex; align-items: center; gap: 8px; }
.card-link svg { width: 17px; }
.hidden { display: none !important; }
.wizard { max-width: 1100px; margin: auto; }
.wizard-top { align-items: flex-end; margin-bottom: 20px; }
.steps { list-style: none; margin: 0px 0px 22px; padding: 0px; display: grid; grid-template-columns: repeat(4, 1fr); background: rgb(255, 255, 255); border: 1px solid var(--line); border-radius: 15px; }
.steps li { display: flex; align-items: center; gap: 10px; padding: 14px; color: rgb(145, 160, 156); position: relative; }
.steps li:not(:last-child)::after { content: ""; position: absolute; right: 0px; width: 1px; height: 28px; background: var(--line); }
.steps li span { width: 27px; height: 27px; border-radius: 50%; background: rgb(237, 242, 241); display: grid; place-items: center; font-size: 12px; font-weight: 800; }
.steps li b { font-size: 12px; }
.steps li.active, .steps li.done { color: var(--primary); }
.steps li.active span { background: var(--primary); color: rgb(255, 255, 255); }
.steps li.done span { background: rgb(217, 238, 233); }
.form-step { display: none; }
.form-step.active { display: block; }
.form-panel { background: rgb(255, 255, 255); border: 1px solid var(--line); border-radius: 20px; padding: 26px; }
.form-heading { display: flex; gap: 14px; margin-bottom: 25px; }
.form-heading .number { width: 38px; height: 38px; border-radius: 11px; background: var(--primary-soft); color: var(--primary); display: grid; place-items: center; font-size: 12px; font-weight: 900; }
.form-heading h3 { margin: 0px 0px 5px; }
.form-heading p { margin: 0px; color: var(--muted); font-size: 13px; }
.form-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.form-grid .wide { grid-column: span 2; }
label > span { font-size: 12px; font-weight: 800; display: block; margin-bottom: 7px; }
input, select { width: 100%; min-height: 45px; border: 1px solid rgb(207, 220, 217); border-radius: 10px; background: rgb(255, 255, 255); padding: 0px 12px; color: var(--ink); }
input[type="file"] { min-height: auto; }
.invalid { background: rgb(255, 248, 249); border-color: var(--danger) !important; }
.field-error { font-size: 11px; color: var(--danger); margin-top: 5px; }
.capture-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 22px; }
.capture-card { border: 1px solid var(--line); border-radius: 15px; padding: 18px; }
.capture-head { display: flex; gap: 11px; align-items: flex-start; margin-bottom: 15px; }
.capture-head > svg { width: 22px; color: var(--primary); }
.capture-head h4 { margin: 0px 0px 3px; }
.capture-head p { font-size: 12px; color: var(--muted); margin: 0px; }
.media-box, .upload-box { height: 240px; border: 1px dashed rgb(171, 192, 188); border-radius: 13px; background: rgb(247, 250, 249); position: relative; overflow: hidden; }
.media-box video, .media-box canvas, .upload-box img { width: 100%; height: 100%; object-fit: cover; display: none; }
.media-placeholder { height: 100%; display: grid; place-content: center; text-align: center; color: rgb(145, 160, 156); }
.media-placeholder svg { width: 40px; margin: auto; }
.media-placeholder p { font-size: 12px; }
.capture-actions { display: flex; gap: 10px; margin-top: 12px; }
.capture-actions > * { flex: 1 1 0%; }
.upload-box { display: grid; place-content: center; text-align: center; cursor: pointer; }
.upload-box input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.upload-box > svg { width: 35px; margin: auto; color: var(--primary); }
.upload-box strong, .upload-box small { display: block; margin-top: 8px; }
.upload-box small { color: var(--muted); }
.info-callout { border-radius: 14px; background: rgb(239, 247, 245); padding: 18px; display: flex; gap: 13px; }
.info-callout svg { width: 22px; flex: 0 0 auto; color: var(--primary); }
.info-callout p { margin: 4px 0px 0px; color: var(--muted); }
.service-layout { display: grid; grid-template-columns: 1.5fr 0.7fr; gap: 24px; }
.subheading { margin: 0px 0px 12px; }
.service-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.service-option { border: 1px solid var(--line); border-radius: 12px; padding: 13px; display: flex; align-items: center; gap: 11px; cursor: pointer; }
.service-option:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); }
.service-option input { width: 18px; height: 18px; min-height: 0px; }
.service-option span { margin: 0px; display: flex; justify-content: space-between; gap: 10px; flex: 1 1 0%; font-size: 12px; }
.service-option strong { font-size: 13px; }
.payment-card { background: rgb(247, 250, 249); border-radius: 15px; padding: 20px; }
.payment-item { display: flex; justify-content: space-between; font-size: 12px; padding: 7px 0px; }
.payment-total { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin: 12px 0px 16px; padding: 14px 0px; display: flex; justify-content: space-between; align-items: center; }
.payment-total strong { font-size: 20px; }
.payment-card label { display: block; margin-top: 13px; }
.review-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.review-section { border: 1px solid var(--line); border-radius: 14px; padding: 18px; }
.review-section h4 { margin: 0px 0px 12px; }
.review-line { display: flex; justify-content: space-between; gap: 20px; padding: 6px 0px; font-size: 12px; }
.review-line span { color: var(--muted); }
.consent { display: flex; gap: 10px; align-items: center; margin-top: 20px; background: rgb(247, 250, 249); padding: 14px; border-radius: 12px; }
.consent input { width: 18px; height: 18px; min-height: 0px; flex: 0 0 auto; margin: 0; align-self: center; }
.consent span { display: flex; align-items: center; min-height: 18px; font-size: 12px; line-height: 1.4; margin: 0px; font-weight: 500; }
.wizard-actions { display: flex; justify-content: space-between; align-items: center; margin-top: 18px; }
.wizard-actions > div { display: flex; align-items: center; gap: 15px; }
.save-note { font-size: 11px; color: var(--muted); display: flex; align-items: center; gap: 6px; }
.save-note svg { width: 15px; }
.error-summary { border: 1px solid rgb(231, 169, 176); background: rgb(255, 244, 245); color: rgb(156, 45, 57); border-radius: 13px; padding: 15px 18px; margin-bottom: 15px; }
.error-summary ul { margin: 8px 0px 0px; padding-left: 18px; font-size: 12px; }
.filter-row { display: flex; justify-content: space-between; margin-bottom: 15px; }
.search-box { min-height: 44px; border: 1px solid var(--line); background: rgb(255, 255, 255); border-radius: 11px; display: flex; align-items: center; gap: 8px; padding: 0px 12px; min-width: 300px; }
.search-box svg { width: 18px; color: rgb(135, 152, 148); }
.search-box input { border: 0px; padding: 0px; min-height: 40px; outline: 0px; }
.segmented { background: rgb(233, 240, 238); padding: 4px; border-radius: 11px; display: flex; }
.segmented button { border: 0px; background: transparent; border-radius: 8px; padding: 8px 13px; color: var(--muted); font-size: 12px; }
.segmented button.active { background: rgb(255, 255, 255); color: var(--primary); box-shadow: rgba(0, 0, 0, 0.05) 0px 2px 8px; }
.table-panel { padding: 0px; overflow: hidden; }
.responsive-table { overflow: auto; }
table { border-collapse: collapse; width: 100%; min-width: 850px; }
th, td { text-align: left; padding: 14px 16px; border-bottom: 1px solid rgb(237, 242, 241); font-size: 12px; }
th { background: rgb(247, 250, 249); color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; font-size: 10px; }
.table-actions { display: flex; gap: 6px; }
.mini-button { border: 1px solid var(--line); background: rgb(255, 255, 255); border-radius: 8px; padding: 7px 9px; color: var(--primary); font-weight: 700; }
.results-layout { display: grid; grid-template-columns: 320px 1fr; gap: 18px; }
.worklist { padding: 0px; overflow: hidden; }
.worklist .panel-head { padding: 20px; border-bottom: 1px solid var(--line); }
.count-badge { background: var(--primary-soft); color: var(--primary); }
.work-item { width: 100%; border-width: 0px 0px 1px; border-style: none none solid; border-color: currentcolor currentcolor rgb(237, 242, 241); border-image: none; background: rgb(255, 255, 255); padding: 15px 18px; text-align: left; }
.work-item:hover, .work-item.active { background: rgb(240, 247, 245); }
.work-item strong, .work-item small { display: block; }
.work-item small { color: var(--muted); margin-top: 4px; }
.work-item .work-meta { display: flex; justify-content: space-between; margin-top: 9px; }
.result-editor { min-height: 540px; }
.empty-state { height: 460px; display: grid; place-content: center; text-align: center; color: var(--muted); }
.empty-state svg { width: 48px; margin: auto; color: rgb(166, 187, 182); }
.empty-state h3 { color: var(--ink); margin-bottom: 3px; }
.result-head { display: flex; justify-content: space-between; gap: 15px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.result-head h2 { margin: 4px 0px; }
.patient-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 18px 0px; }
.summary-chip { background: rgb(246, 250, 249); border-radius: 10px; padding: 10px; }
.summary-chip span, .summary-chip strong { display: block; }
.summary-chip span { font-size: 10px; color: var(--muted); text-transform: uppercase; }
.summary-chip strong { font-size: 12px; margin-top: 3px; }
.template-tabs { display: flex; gap: 7px; flex-wrap: wrap; margin-bottom: 15px; }
.template-tab { border: 1px solid var(--line); background: rgb(255, 255, 255); border-radius: 9px; padding: 8px 11px; font-size: 11px; font-weight: 800; }
.template-tab.active { background: var(--primary); color: rgb(255, 255, 255); border-color: var(--primary); }
.lab-table { width: 100%; min-width: 0px; }
.lab-table td, .lab-table th { padding: 9px; }
.lab-table input, .lab-table select { min-height: 36px; }
.result-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }
.records-search { margin-bottom: 20px; }
.records-grid, .agency-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.record-card, .agency-card { border: 1px solid var(--line); background: rgb(255, 255, 255); border-radius: 15px; padding: 18px; }
.record-card h3, .agency-card h3 { margin: 0px 0px 5px; }
.record-card p, .agency-card p { margin: 0px; color: var(--muted); font-size: 12px; }
.record-meta { display: flex; justify-content: space-between; margin-top: 15px; padding-top: 12px; border-top: 1px solid rgb(237, 242, 241); font-size: 11px; }
.agency-card { display: flex; align-items: center; gap: 13px; }
.agency-logo { width: 42px; height: 42px; border-radius: 12px; background: var(--primary-soft); color: var(--primary); display: grid; place-items: center; font-weight: 800; flex: 0 0 auto; }
.modal-backdrop { position: fixed; inset: 0px; background: rgba(7, 35, 31, 0.55); z-index: 50; display: grid; place-items: center; padding: 20px; }
.modal { background: rgb(255, 255, 255); border-radius: 20px; width: min(760px, 100%); max-height: 92vh; overflow: auto; padding: 24px; box-shadow: rgba(0, 0, 0, 0.25) 0px 28px 80px; }
.small-modal { width: min(460px, 100%); }
.modal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }
.appointment-slip { border: 1px solid rgb(169, 187, 183); padding: 24px; color: rgb(16, 44, 40); }
.slip-brand { text-align: center; border-bottom: 2px solid var(--primary); padding-bottom: 13px; }
.slip-brand h2 { margin: 0px; color: var(--primary); }
.slip-brand p { margin: 4px 0px; font-size: 11px; }
.slip-title { text-align: center; margin: 18px 0px; text-transform: uppercase; letter-spacing: 0.12em; }
.slip-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px 22px; font-size: 12px; }
.slip-row { display: flex; justify-content: space-between; border-bottom: 1px dotted rgb(169, 187, 183); padding: 5px 0px; }
.slip-services { margin: 18px 0px; padding: 14px; background: rgb(242, 248, 246); }
.slip-footer { text-align: center; font-size: 11px; }
.toast { position: fixed; right: 24px; bottom: 24px; background: rgb(23, 61, 55); color: rgb(255, 255, 255); padding: 13px 18px; border-radius: 11px; box-shadow: var(--shadow); transform: translateY(100px); opacity: 0; transition: 0.25s; z-index: 80; }
.toast.show { transform: none; opacity: 1; }
@media (max-width: 1050px) {
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .dashboard-grid { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: repeat(2, 1fr); }
  .service-layout { grid-template-columns: 1fr; }
  .results-layout { grid-template-columns: 280px 1fr; }
  .records-grid, .agency-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 820px) {
  .sidebar { transform: translateX(-100%); transition: 0.2s; }
  .sidebar.open { transform: none; }
  .main { margin-left: 0px; padding: 0px 18px 38px; }
  .menu-button { display: grid; }
  .topbar { height: 82px; }
  .type-cards { grid-template-columns: 1fr; }
  .type-card { min-height: 235px; }
  .capture-grid, .review-grid { grid-template-columns: 1fr; }
  .steps li b { display: none; }
  .results-layout { grid-template-columns: 1fr; }
  .worklist { max-height: 300px; }
  .patient-summary { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .main { padding: 0px 12px 30px; }
  .top-actions .primary { display: none; }
  .welcome-band { padding: 23px; display: block; }
  .welcome-band button { margin-top: 18px; }
  .welcome-band h2 { font-size: 23px; }
  .stats-grid { grid-template-columns: 1fr 1fr; gap: 9px; }
  .stat-card { padding: 13px; display: block; }
  .stat-icon { width: 36px; height: 36px; margin-bottom: 10px; }
  .stat-card strong { font-size: 22px; }
  .stat-card small { display: none; }
  .queue-row { grid-template-columns: 40px 1fr auto; }
  .queue-row .queue-meta { display: none; }
  .panel { padding: 17px; }
  .form-panel { padding: 18px; }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid .wide { grid-column: auto; }
  .capture-grid { grid-template-columns: 1fr; }
  .service-list { grid-template-columns: 1fr; }
  .wizard-actions, .wizard-actions > div { align-items: stretch; }
  .wizard-actions > div { display: grid; }
  .save-note { display: none; }
  .filter-row { display: grid; gap: 10px; }
  .search-box { min-width: 0px; }
  .segmented { overflow: auto; }
  .records-grid, .agency-grid { grid-template-columns: 1fr; }
  .slip-grid { grid-template-columns: 1fr; }
  .steps li { justify-content: center; }
  .steps li b { display: none; }
}
@media print {
  body > * { display: none !important; }
  body .modal-backdrop:not(.hidden) { position: static; background: rgb(255, 255, 255); padding: 0px; display: block !important; }
  body .modal { box-shadow: none; width: 100%; max-height: none; padding: 0px; }
  .modal-head, .modal-actions { display: none !important; }
  .appointment-slip { border: 0px; }
  .app-shell { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; transition: none !important; }
}
.primary { text-decoration: none; }
.brand-mark { overflow: visible; background: transparent; box-shadow: none; }
.brand-mark img { width: 100%; height: 100%; object-fit: contain; border-radius: 50%; }
.document-logo { display: block; width: 92px; height: 92px; object-fit: cover; border-radius: 50%; margin: 0px auto 9px; }
.paper-size-note { text-align: right; font-size: 11px; color: var(--muted); margin-bottom: 8px; }
.paper-size-note strong { color: var(--primary); }
.laboratory-result.paper-a5 { max-width: 560px; margin: auto; }
.laboratory-result.paper-a5 .document-logo { width: 72px; height: 72px; }
.laboratory-result.paper-a5 .result-brand h2 { font-size: 16px; }
.laboratory-result.paper-a5 .result-brand p, .laboratory-result.paper-a5 .print-result-table th, .laboratory-result.paper-a5 .print-result-table td { font-size: 8px; }
.laboratory-result.paper-a5 .print-result-table th, .laboratory-result.paper-a5 .print-result-table td { padding: 4px; }
.laboratory-result.paper-a5 .signature-grid { margin-top: 24px; font-size: 7px; }
.laboratory-result.paper-a4 { max-width: 794px; margin: auto; }
.appointment-slip .document-logo { width: 56px !important; height: 56px !important; }
.appointment-slip { max-width: 760px; margin: auto; }
.appointment-slip.landscape { max-width: 1000px; }
.service-list { display: block; }
.service-group { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 20px; }
.service-group h5 { grid-column: 1 / -1; margin: 0px 0px 2px; color: var(--primary); font-size: 12px; text-transform: uppercase; letter-spacing: 0.07em; }
.service-group h5 small { font-weight: 500; text-transform: none; letter-spacing: 0px; color: var(--muted); margin-left: 6px; }
.sendout-group { padding: 14px; background: rgb(247, 243, 255); border: 1px solid rgb(226, 217, 244); border-radius: 14px; }
.sendout-group h5 { color: rgb(113, 84, 164); }
.sendout-uploader { border: 1px dashed rgb(156, 183, 177); border-radius: 14px; background: rgb(247, 250, 249); padding: 24px; text-align: center; }
.sendout-uploader input { margin: 14px auto 8px; max-width: 420px; }
.sendout-files { display: grid; gap: 8px; margin-top: 16px; text-align: left; }
.sendout-file { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: rgb(255, 255, 255); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; font-size: 12px; }
.sendout-file a { color: var(--primary); font-weight: 700; }
.sendout-note { color: var(--muted); font-size: 12px; }
.sendout-badge { display: inline-flex; background: rgb(238, 232, 250); color: rgb(113, 84, 164); border-radius: 20px; padding: 5px 9px; font-size: 10px; font-weight: 800; text-transform: uppercase; }
@media (max-width: 560px) {
  .service-group { grid-template-columns: 1fr; }
}
.icon-button.menu-button { display: none; }
.laboratory-result { border: 1px solid rgb(150, 170, 165); padding: 24px; color: rgb(16, 44, 40); }
.result-brand { text-align: center; border-bottom: 3px solid rgb(78, 143, 32); padding-bottom: 13px; }
.result-brand h2 { color: rgb(48, 125, 52); margin: 0px; font-size: 21px; }
.result-brand p { margin: 4px 0px; font-size: 11px; }
.result-patient-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 30px; margin: 18px 0px; font-size: 12px; }
.result-patient-line { display: flex; gap: 8px; border-bottom: 1px solid rgb(203, 214, 211); padding: 5px 0px; }
.result-patient-line span { min-width: 95px; font-weight: 800; }
.result-section-title { background: rgb(91, 158, 36); color: rgb(255, 255, 255); text-align: center; padding: 8px; text-transform: uppercase; font-weight: 900; letter-spacing: 0.05em; }
.print-result-table { width: 100%; min-width: 0px; }
.print-result-table th, .print-result-table td { border: 1px solid rgb(135, 155, 150); padding: 8px; font-size: 11px; }
.print-result-table th { background: rgb(237, 244, 235); color: rgb(23, 61, 55); }
.result-remarks { padding: 12px 0px; font-size: 12px; }
.signature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 45px; text-align: center; font-size: 10px; }
.signature-grid strong { display: block; border-bottom: 1px solid rgb(113, 132, 127); padding-bottom: 4px; font-size: 11px; }
.signature-grid span { display: block; margin-top: 4px; font-weight: 800; }
.result-validity { text-align: center; font-size: 10px; margin-top: 20px; color: rgb(88, 107, 103); }
@media (max-width: 820px) {
  .icon-button.menu-button { display: grid; }
}
@media (max-width: 560px) {
  .result-patient-grid, .signature-grid { grid-template-columns: 1fr; }
}
@media print {
  .appointment-slip, .laboratory-result { border: 0px; }
}
.inventory-table { min-width: 940px; }
.inventory-table th:not(:first-child), .inventory-table td:not(:first-child) { text-align: center; }
.inventory-table tbody tr:hover { background: rgb(248, 251, 250); }
.inventory-table tfoot th { background: rgb(234, 244, 241); color: var(--ink); font-size: 11px; }
.inventory-stats { margin-top: 0px; }
.service-stats { grid-template-columns: repeat(3, 1fr); margin-top: 0px; }
#page-services, #servicesForm, #servicesForm .table-panel, #servicesForm .responsive-table { min-width: 0px; max-width: 100%; }
.service-filter { align-items: center; }
.service-save-note { margin: 0px; color: var(--muted); font-size: 12px; }
.service-config-table { min-width: 760px; }
.service-config-table th:first-child { width: 180px; }
.service-config-table th:nth-child(3) { width: 190px; }
.service-config-table th:last-child { width: 150px; }
.service-config-table td { vertical-align: middle; }
.service-field-label { display: block; }
.service-field-label > span { position: absolute; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border: 0px; }
.service-field-label input { min-height: 40px; }
.price-input { position: relative; }
.price-input b { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--muted); font-size: 13px; z-index: 1; }
.price-input input { padding-left: 28px; }
.availability-toggle { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; cursor: pointer; }
.availability-toggle input { width: 18px; height: 18px; min-height: 0px; accent-color: var(--primary); }
.availability-toggle span { margin: 0px; font-size: 12px; }
.service-config-table tbody tr:has([data-service-active]:not(:checked)) { background: rgb(250, 251, 251); }
.service-config-table tbody tr:has([data-service-active]:not(:checked)) input[data-service-label] { color: var(--muted); }
@media (max-width: 820px) {
  .service-stats { grid-template-columns: repeat(3, 1fr); }
  .service-filter { display: grid; gap: 10px; }
  .service-save-note { padding: 0px 2px; }
}
@media (max-width: 560px) {
  .service-stats { grid-template-columns: 1fr 1fr; }
  .service-stats .stat-card:first-child { grid-column: 1 / -1; }
  #page-services > .section-intro { display: grid; grid-template-columns: 1fr; align-items: start; }
  #page-services > .section-intro .primary { width: 100%; min-height: 44px; padding: 0px 12px; }
  .service-config-table { display: block; min-width: 0px; width: 100%; }
  .service-config-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); }
  .service-config-table tbody { display: grid; gap: 12px; padding: 12px; }
  .service-config-table tr { display: grid; grid-template-columns: minmax(0px, 1fr) minmax(120px, 0.7fr); gap: 6px; border: 1px solid var(--line); border-radius: 10px; padding: 10px; background: rgb(255, 255, 255); }
  .service-config-table td { display: block; border: 0px; padding: 5px; }
  .service-config-table td:first-child, .service-config-table td:nth-child(2) { grid-column: 1 / -1; }
  .service-config-table .route-badge { margin-bottom: 2px; }
}
#page-services { overflow-x: hidden; }
.service-choice-search { width: 100%; min-width: 0px; margin-bottom: 14px; }
.tup-operations-note { margin-top: 14px; }
.tup-package-card { border: 1px solid rgb(184, 217, 210); background: rgb(247, 250, 249); border-radius: 14px; padding: 20px; }
.tup-package-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin: 12px 0px; }
.tup-package-head h4 { margin: 0px 0px 4px; }
.tup-package-head p { margin: 0px; color: var(--muted); font-size: 12px; }
.tup-package-head > strong { font-size: 22px; color: var(--primary); white-space: nowrap; }
.tup-package-card ul { margin: 0px; padding-left: 20px; color: var(--ink); font-size: 13px; line-height: 1.7; }
.tup-result-note { margin: 14px 0px 0px; border-top: 1px solid var(--line); padding-top: 12px; color: var(--muted); font-size: 12px; }
.section-actions { display: flex; gap: 10px; align-items: center; }
.service-config-table th:last-child { width: 100px; }
.delete-service-button { color: var(--danger); border-color: rgb(239, 197, 202); }
.delete-service-button:hover { background: rgb(255, 244, 245); }
.danger-button { min-height: 44px; border: 0px; border-radius: 11px; padding: 0px 18px; background: var(--danger); color: rgb(255, 255, 255); font-weight: 700; }
.danger-button:hover { background: rgb(169, 47, 60); }
.service-result-note { margin-top: 16px; }
.delete-service-message { color: var(--muted); line-height: 1.55; }
.delete-service-message strong { color: var(--ink); }
#addServiceForm > label { display: block; margin-top: 14px; }
.agency-card-body { min-width: 0px; flex: 1 1 0%; }
.agency-actions { display: flex; gap: 8px; margin-top: 13px; }
.agency-actions .mini-button { min-height: 38px; min-width: 70px; }
.agency-email-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 18px 0px 10px; padding-top: 16px; border-top: 1px solid var(--line); }
.agency-email-heading strong, .agency-email-heading small { display: block; }
.agency-email-heading small { margin-top: 4px; color: var(--muted); font-size: 11px; line-height: 1.4; }
.agency-email-row { display: grid; grid-template-columns: minmax(0px, 1fr) 44px; gap: 8px; align-items: end; margin-top: 10px; }
.agency-email-row label { min-width: 0px; }
.agency-email-remove { width: 44px; height: 44px; color: var(--danger); }
.agency-email-remove:hover { background: rgb(255, 244, 245); border-color: rgb(239, 197, 202); }
.compact { min-height: 38px; padding: 0px 11px; white-space: nowrap; }
.agency-email-heading [data-icon] svg { width: 15px; vertical-align: -3px; margin-right: 4px; }
@media (max-width: 560px) {
  .agency-email-heading { align-items: stretch; flex-direction: column; }
  .agency-email-heading .compact { width: 100%; min-height: 44px; }
  .agency-email-row { grid-template-columns: minmax(0px, 1fr) 44px; }
}
@media (max-width: 560px) {
  #page-services > .section-intro .section-actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  #page-services > .section-intro .section-actions .primary, #page-services > .section-intro .section-actions .secondary { width: 100%; padding: 0px 8px; }
  .service-config-table td:last-child { display: flex; align-items: center; justify-content: flex-end; }
  .service-config-table .delete-service-button { min-height: 44px; }
}
.xray-editor-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 18px; }
.xray-editor-grid.xray-editor-grid--no-patient-photo { grid-template-columns: 1fr; }
.xray-photo-box img { width: 100%; height: 100%; object-fit: cover; display: block; }
.xray-file-upload { display: block; border: 1px dashed rgb(171, 192, 188); border-radius: 12px; background: rgb(247, 250, 249); padding: 16px; }
.xray-file-upload input { margin-top: 10px; }
.xray-remarks { display: block; margin-top: 18px; }
.xray-remarks textarea { width: 100%; border: 1px solid rgb(207, 220, 217); border-radius: 10px; background: rgb(255, 255, 255); padding: 12px; resize: vertical; color: var(--ink); font: inherit; }
.xray-file-actions { display: flex; align-items: center; gap: 12px; }
.xray-remove-file { min-height: 32px; font-size: 11px; color: var(--danger); }
.xray-work-status { font-size: 10px; font-weight: 800; text-transform: uppercase; }
.xray-work-status.pending { color: rgb(147, 96, 10); }
.xray-work-status.complete { color: var(--green); }
@media (max-width: 820px) {
  .xray-editor-grid { grid-template-columns: 1fr; }
}
.drugtest-uploader { text-align: left; }
.drugtest-uploader > h3, .drugtest-uploader > .sendout-badge, .drugtest-uploader > .sendout-note { display: block; }
.drugtest-uploader .xray-file-upload { margin-top: 18px; }
.drugtest-notice { margin: 18px 0px; }
.drugtest-preview .sendout-file span { overflow-wrap: anywhere; }
.drugtest-uploader .xray-file-actions, .drugtest-preview .xray-file-actions { flex-wrap: wrap; justify-content: flex-end; }
@media (max-width: 560px) {
  .drugtest-uploader { padding: 18px; }
  .drugtest-uploader .sendout-file, .drugtest-preview .sendout-file { align-items: flex-start; flex-direction: column; }
  .drugtest-uploader .xray-file-actions, .drugtest-preview .xray-file-actions { justify-content: flex-start; }
}
.xray-report { color: rgb(16, 44, 40); background: rgb(255, 255, 255); padding: 28px; }
.xray-report-header { display: grid; grid-template-columns: 96px minmax(0px, 1fr) 96px; gap: 16px; align-items: start; border-bottom: 2px solid rgb(11, 107, 97); padding-bottom: 18px; }
.xray-report-photo { width: 92px; height: 116px; border: 1px solid rgb(135, 155, 150); background: rgb(243, 247, 246); display: grid; place-items: center; text-align: center; color: rgb(101, 120, 116); font-size: 10px; overflow: hidden; }
.xray-report-photo img { width: 100%; height: 100%; object-fit: cover; }
.xray-report-brand { text-align: center; }
.xray-report-brand .document-logo { width: 58px; height: 58px; margin: 0px auto 7px; }
.xray-report-brand h2 { margin: 0px; color: rgb(11, 107, 97); font-size: 19px; line-height: 1.25; }
.xray-report-brand p { margin: 3px 0px; font-size: 10px; }
.xray-report-mark { border: 1px solid rgb(146, 170, 165); padding: 14px 7px; text-align: center; color: rgb(11, 107, 97); }
.xray-report-mark strong { display: block; font-size: 10px; line-height: 1.25; }
.xray-report-mark span { display: block; margin-top: 8px; font-size: 9px; text-transform: uppercase; }
.xray-patient-details { display: grid; grid-template-columns: 1fr 1fr; gap: 0px 30px; margin: 22px 0px; }
.xray-patient-details > div { display: grid; grid-template-columns: 92px 1fr; border-bottom: 1px solid rgb(174, 189, 185); padding: 8px 0px; font-size: 12px; }
.xray-patient-details span { font-weight: 700; }
.xray-detail-wide { grid-column: 1 / -1; }
.xray-examination-title { background: rgb(11, 107, 97); color: rgb(255, 255, 255); text-align: center; font-size: 16px; font-weight: 800; text-transform: uppercase; padding: 10px; letter-spacing: 0.04em; }
.xray-report-section { margin-top: 26px; }
.xray-report-section h3 { margin: 0px 0px 9px; text-transform: uppercase; font-size: 13px; color: rgb(11, 107, 97); }
.xray-report-section p { margin: 0px; min-height: 120px; border-left: 3px solid rgb(199, 222, 216); padding: 12px 15px; font-size: 14px; line-height: 1.8; white-space: normal; }
.xray-impression p { min-height: 84px; font-weight: 800; text-transform: uppercase; }
.xray-signature { width: 260px; margin: 88px 0px 0px auto; text-align: center; font-size: 11px; }
.xray-signature strong { display: block; border-bottom: 1px solid rgb(89, 109, 104); padding-bottom: 7px; }
.xray-signature-dual strong { white-space: nowrap; font-weight: 600; }
.xray-signature-dual em { font-style: normal; font-weight: 400; }
.xray-signature span { display: block; margin-top: 7px; font-weight: 800; }
.xray-report-footer { text-align: center; border-top: 1px solid rgb(184, 199, 195); margin-top: 48px; padding-top: 10px; font-size: 10px; color: rgb(102, 120, 116); }
.xray-report-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 18px; padding: 18px; border: 1px solid rgb(212, 225, 222); border-radius: 12px; background: rgb(251, 253, 252); }
.xray-report-fields .capture-head { grid-column: 1 / -1; }
.xray-report-fields label { display: block; }
.xray-report-fields label:nth-of-type(2) { grid-column: 1 / -1; }
.xray-report-fields label:nth-of-type(3) { grid-column: 1 / -1; }
.xray-report-fields input, .xray-report-fields textarea { width: 100%; margin-top: 7px; border: 1px solid rgb(207, 220, 217); border-radius: 10px; background: rgb(255, 255, 255); padding: 11px; color: var(--ink); font: inherit; }
.xray-report-fields textarea { resize: vertical; line-height: 1.5; }
@media (max-width: 820px) {
  .xray-report-header { grid-template-columns: 76px minmax(0px, 1fr); }
  .xray-report-mark { grid-column: 2; justify-self: end; margin-top: -8px; }
  .xray-report-brand h2 { font-size: 16px; }
  .xray-report-brand p { font-size: 9px; }
  .xray-report { padding: 18px; }
}
@media (max-width: 560px) {
  .xray-report-header { grid-template-columns: 72px minmax(0px, 1fr); gap: 10px; }
  .xray-report-photo { width: 70px; height: 88px; }
  .xray-report-brand .document-logo { width: 44px; height: 44px; }
  .xray-report-brand h2 { font-size: 13px; }
  .xray-report-brand p { font-size: 8px; }
  .xray-report-mark { grid-column: 1 / -1; justify-self: stretch; padding: 8px; }
  .xray-patient-details { grid-template-columns: 1fr; gap: 0px; }
  .xray-detail-wide { grid-column: auto; }
  .xray-patient-details > div { grid-template-columns: 86px 1fr; font-size: 11px; }
  .xray-report-section p { font-size: 12px; }
  .xray-report-fields { grid-template-columns: 1fr; }
  .xray-report-fields .capture-head, .xray-report-fields label:nth-of-type(2), .xray-report-fields label:nth-of-type(3) { grid-column: auto; }
}
.drugtest-workflow-grid { display: grid; grid-template-columns: minmax(220px, 0.72fr) minmax(0px, 1.28fr); gap: 16px; }
.drugtest-workflow-grid .capture-card { min-width: 0px; }
.drugtest-specimen-state { display: grid; gap: 4px; border: 1px solid var(--line); border-radius: 11px; padding: 14px; margin-bottom: 14px; }
.drugtest-specimen-state strong { font-size: 13px; }
.drugtest-specimen-state span { font-size: 11px; color: var(--muted); }
.drugtest-specimen-state.pending { background: rgb(255, 248, 233); border-color: rgb(239, 215, 168); }
.drugtest-specimen-state.collected { background: rgb(234, 246, 239); border-color: rgb(185, 223, 202); }
.drugtest-mode-options { display: grid; gap: 10px; margin-bottom: 16px; }
.drugtest-mode-option { display: flex; align-items: flex-start; gap: 12px; border: 1px solid var(--line); border-radius: 11px; padding: 13px; cursor: pointer; min-height: 70px; }
.drugtest-mode-option:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); }
.drugtest-mode-option input { width: 18px; height: 18px; min-height: 0px; margin: 2px 0px 0px; flex: 0 0 auto; }
.drugtest-mode-option span, .drugtest-mode-option strong, .drugtest-mode-option small { display: block; }
.drugtest-mode-option span { margin: 0px; min-width: 0px; }
.drugtest-mode-option strong { font-size: 13px; }
.drugtest-mode-option small { color: var(--muted); font-size: 11px; line-height: 1.45; margin-top: 3px; }
.drugtest-work-status { font-size: 10px; font-weight: 800; text-align: right; }
.drugtest-work-status.pending { color: var(--amber); }
.drugtest-work-status.collected { color: var(--blue); }
.drugtest-work-status.complete { color: var(--green); }
.drugtest-release-card textarea { width: 100%; min-height: 88px; border: 1px solid rgb(207, 220, 217); border-radius: 10px; padding: 10px 12px; color: var(--ink); font: inherit; resize: vertical; }
.drugtest-release-card textarea:focus-visible { outline: rgba(11, 107, 97, 0.25) solid 3px; outline-offset: 2px; }
.doctor-layout { grid-template-columns: 300px 1fr; }
.doctor-work-status { font-size: 10px; font-weight: 800; text-transform: uppercase; }
.doctor-work-status.pending { color: var(--amber); }
.doctor-work-status.complete { color: var(--green); }
.doctor-form { display: grid; gap: 18px; margin-top: 18px; }
.doctor-form-section { border: 1px solid var(--line); border-radius: 13px; padding: 18px; background: rgb(255, 255, 255); }
.doctor-section-head { display: flex; gap: 11px; align-items: flex-start; padding-bottom: 14px; border-bottom: 1px solid var(--line); margin-bottom: 15px; }
.doctor-section-head > span { width: 30px; height: 30px; border-radius: 9px; background: var(--primary-soft); color: var(--primary); display: grid; place-items: center; font-weight: 900; font-size: 12px; }
.doctor-section-head h3 { margin: 0px 0px 4px; font-size: 16px; }
.doctor-section-head p { margin: 0px; color: var(--muted); font-size: 11px; line-height: 1.45; }
.doctor-history-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.doctor-history-item { display: grid; grid-template-columns: minmax(0px, 1fr) 92px; gap: 7px; align-items: center; border: 1px solid rgb(225, 234, 232); border-radius: 9px; padding: 8px 9px; min-height: 48px; }
.doctor-history-item > span { font-size: 11px; line-height: 1.35; }
.doctor-history-item select, .doctor-system-item select { min-height: 36px; font-size: 11px; padding: 0px 7px; }
.doctor-wide-field { display: block; margin-top: 14px; }
.doctor-wide-field textarea { width: 100%; border: 1px solid rgb(207, 220, 217); border-radius: 9px; padding: 10px 12px; color: var(--ink); font: inherit; resize: vertical; }
.doctor-vitals-grid, .doctor-signoff-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.doctor-vitals-grid label, .doctor-signoff-grid label, .doctor-ancillary-grid label { display: block; }
.doctor-system-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 16px; }
.doctor-system-item { display: grid; grid-template-columns: minmax(0px, 1fr) 98px 1fr; gap: 7px; align-items: center; border: 1px solid rgb(225, 234, 232); border-radius: 9px; padding: 8px; }
.doctor-system-item strong { font-size: 11px; line-height: 1.35; }
.doctor-system-item input, .doctor-ancillary-grid input { min-height: 36px; border: 1px solid rgb(207, 220, 217); border-radius: 9px; padding: 0px 9px; font-size: 11px; }
.doctor-ancillary-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.doctor-ancillary-grid input { width: 100%; margin-top: 6px; }
.physical-exam-report .document-logo { width: 58px; height: 58px; margin: 0px auto 5px; }
.physical-exam-report { max-width: 794px; margin: auto; }
@media (max-width: 1050px) {
  .doctor-vitals-grid, .doctor-signoff-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 820px) {
  .doctor-layout { grid-template-columns: 1fr; }
  .doctor-layout > * { min-width: 0px; }
  .doctor-history-grid { grid-template-columns: 1fr 1fr; }
  .doctor-system-grid { grid-template-columns: 1fr; }
  .doctor-system-item { grid-template-columns: minmax(0px, 1fr) 98px minmax(0px, 1fr); }
}
@media (max-width: 560px) {
  .doctor-vitals-grid, .doctor-signoff-grid, .doctor-ancillary-grid, .doctor-history-grid { grid-template-columns: 1fr; }
  .doctor-system-item { grid-template-columns: minmax(0px, 1fr) 92px; }
  .doctor-system-item input { grid-column: 1 / -1; }
  .doctor-form-section { padding: 14px; }
  .doctor-history-item { grid-template-columns: minmax(0px, 1fr) 88px; }
  .doctor-layout .result-actions { display: grid; grid-template-columns: 1fr; }
  .doctor-layout .result-actions button { width: 100%; }
}
@media (max-width: 1050px) {
  .drugtest-workflow-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .drugtest-layout .result-editor { padding: 15px; }
  .drugtest-workflow-grid { gap: 12px; }
  .drugtest-mode-option { min-height: 76px; }
  .drugtest-work-status { white-space: normal; max-width: 110px; }
  .drugtest-layout .result-actions { display: grid; grid-template-columns: 1fr; }
  .drugtest-layout .result-actions button { width: 100%; }
}
.agency-grid { align-items: start; }
.agency-card { position: relative; display: block; padding: 0px; min-height: 108px; overflow: visible; }
.agency-card-open { width: 100%; min-height: 108px; border: 0px; background: transparent; border-radius: 15px; padding: 22px 66px 22px 18px; display: flex; align-items: center; gap: 14px; text-align: left; color: var(--ink); }
.agency-card-open:hover { background: rgb(248, 251, 250); }
.agency-card-open h3 { margin: 0px; font-size: 18px; line-height: 1.25; overflow-wrap: anywhere; }
.agency-card-menu { position: absolute; right: 12px; top: 12px; z-index: 4; }
.agency-menu-button { width: 44px; height: 44px; border: 1px solid transparent; border-radius: 11px; background: transparent; color: var(--muted); font-size: 28px; line-height: 1; display: grid; place-items: center; }
.agency-menu-button:hover, .agency-menu-button[aria-expanded="true"] { background: rgb(237, 245, 243); color: var(--primary); border-color: var(--line); }
.agency-menu-dropdown { position: absolute; top: 48px; right: 0px; width: 158px; padding: 6px; background: rgb(255, 255, 255); border: 1px solid var(--line); border-radius: 11px; box-shadow: rgba(7, 63, 58, 0.18) 0px 14px 38px; display: grid; z-index: 8; }
.agency-menu-dropdown button { min-height: 42px; border: 0px; border-radius: 8px; background: transparent; padding: 0px 11px; text-align: left; font-weight: 700; color: var(--ink); }
.agency-menu-dropdown button:hover { background: rgb(242, 247, 246); }
.agency-menu-dropdown .danger-menu-item { color: var(--danger); }
.agency-records-modal { width: min(940px, 100%); }
.modal-subtitle { margin: 5px 0px 0px; color: var(--muted); font-size: 12px; }
.agency-month { border: 1px solid var(--line); border-radius: 13px; background: rgb(255, 255, 255); margin-top: 13px; overflow: hidden; }
.agency-month summary { min-height: 52px; padding: 0px 16px; display: flex; align-items: center; justify-content: space-between; gap: 16px; cursor: pointer; background: rgb(247, 250, 249); font-weight: 800; list-style: none; }
.agency-month summary::-webkit-details-marker { display: none; }
.agency-month summary::after { content: "+"; font-size: 20px; color: var(--primary); order: 3; }
.agency-month[open] summary::after { content: "−"; }
.agency-month summary b { margin-left: auto; color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; }
.agency-month-list { display: grid; }
.agency-result-row { display: grid; grid-template-columns: minmax(0px, 1fr) auto minmax(130px, auto); gap: 14px; align-items: center; padding: 14px 16px; border-top: 1px solid rgb(237, 242, 241); }
.agency-result-row:first-child { border-top: 0px; }
.agency-result-row strong, .agency-result-row small { display: block; }
.agency-result-row small { margin-top: 4px; color: var(--muted); font-size: 11px; }
.agency-result-unavailable { font-size: 11px; color: var(--muted); text-align: right; }
.agency-records-empty { height: 280px; }
@media (max-width: 680px) {
  .agency-card-open { padding: 18px 62px 18px 15px; }
  .agency-result-row { grid-template-columns: 1fr; gap: 9px; }
  .agency-result-row .status { width: max-content; }
  .agency-result-unavailable { text-align: left; }
  .agency-result-row .mini-button { width: 100%; min-height: 44px; }
  .agency-month summary { align-items: flex-start; flex-wrap: wrap; padding: 14px; }
  .agency-month summary b { margin-left: 0px; }
  .agency-month summary::after { margin-left: auto; }
}
.records-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.records-toolbar .records-search { margin: 0px; flex: 1 1 0%; max-width: 520px; }
.records-tabs button { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.records-tabs b { min-width: 22px; height: 22px; padding: 0px 6px; border-radius: 12px; background: rgba(7, 63, 58, 0.08); display: grid; place-items: center; font-size: 10px; }
.records-tabs button.active b { background: var(--primary-soft); color: var(--primary); }
.patient-record-card { display: flex; flex-direction: column; min-height: 230px; }
.patient-record-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.patient-record-card h3 { margin-top: 16px; }
.patient-record-services { margin-top: 14px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.patient-record-actions { display: flex; gap: 8px; margin-top: auto; padding-top: 18px; }
.patient-record-actions > * { flex: 1 1 0%; }
.records-empty { grid-column: 1 / -1; height: 320px; }
.patient-results-modal { width: min(880px, 100%); }
.patient-released-results { display: grid; gap: 12px; margin-top: 18px; }
.patient-result-document { border: 1px solid var(--line); border-radius: 14px; padding: 17px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.patient-result-document h3 { margin: 8px 0px 3px; }
.patient-result-document p { margin: 0px; color: var(--muted); font-size: 12px; }
.patient-result-file-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; max-width: 55%; }
.patient-result-file-actions a { text-decoration: none; }
.patient-results-empty { height: 280px; }
@media (max-width: 760px) {
  .records-toolbar { align-items: stretch; display: grid; }
  .records-toolbar .records-search { max-width: none; }
  .records-tabs { overflow: auto; }
  .records-tabs button { flex: 1 1 0%; justify-content: center; }
  .patient-result-document { align-items: stretch; flex-direction: column; }
  .patient-result-document > .primary { width: 100%; }
  .patient-result-file-actions { justify-content: flex-start; max-width: none; }
  .patient-result-file-actions a { width: 100%; white-space: normal; text-align: center; }
  .patient-record-actions { flex-direction: column; }
}
.topbar { height: 76px; justify-content: flex-end; }
.topbar:has(.top-actions.hidden) { height: 28px; }
@media (max-width: 820px) {
  .topbar, .topbar:has(.top-actions.hidden) { height: 68px; justify-content: space-between; }
}
.record-folders { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 12px; margin-bottom: 18px; }
.record-folder { min-height: 78px; border: 1px solid var(--line); border-radius: 8px; background: rgb(255, 255, 255); color: var(--ink); padding: 12px 14px; display: grid; grid-template-columns: 40px minmax(0px, 1fr) auto; align-items: center; gap: 11px; text-align: left; }
.record-folder:hover { border-color: rgb(168, 200, 193); background: rgb(248, 251, 250); }
.record-folder.active { border-color: var(--primary); background: var(--primary-soft); box-shadow: inset 0 0 0 1px var(--primary); }
.record-folder-icon { width: 40px; height: 40px; border-radius: 8px; background: rgb(237, 244, 242); color: var(--primary); display: grid; place-items: center; }
.record-folder.active .record-folder-icon { background: rgb(255, 255, 255); }
.record-folder-icon svg { width: 20px; }
.record-folder span, .record-folder strong, .record-folder small { display: block; min-width: 0px; }
.record-folder strong { font-size: 13px; }
.record-folder small { font-size: 11px; color: var(--muted); margin-top: 3px; }
.record-folder b { min-width: 27px; height: 27px; border-radius: 14px; background: rgb(237, 244, 242); color: var(--primary); display: grid; place-items: center; padding: 0px 7px; font-size: 11px; }
.record-folder.active b { background: rgb(255, 255, 255); }
.patient-record-card:not(:has(.patient-record-actions)) { min-height: 205px; }
@media (max-width: 760px) {
  .record-folders { display: flex; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
  .record-folder { min-width: 210px; }
  .patient-record-actions { flex-direction: column; }
}
.id-method-options { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-bottom: 14px; }
.id-method-option { min-height: 66px; border: 1px solid var(--line); border-radius: 9px; padding: 11px; display: flex; align-items: flex-start; gap: 9px; cursor: pointer; }
.id-method-option:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); }
.id-method-option input { width: 18px; height: 18px; min-height: 0px; flex: 0 0 auto; margin: 2px 0px 0px; }
.id-method-option span, .id-method-option strong, .id-method-option small { display: block; margin: 0px; }
.id-method-option strong { font-size: 12px; }
.id-method-option small { font-size: 10px; color: var(--muted); line-height: 1.4; margin-top: 3px; }
.id-camera-box { height: 240px; }
.id-camera-box canvas { object-fit: contain; background: rgb(21, 32, 30); }
#idCaptureCard.invalid { border-color: var(--danger); background: rgb(255, 248, 249); }
@media (max-width: 560px) {
  .id-method-options { grid-template-columns: 1fr; }
  .id-method-option { min-height: 60px; }
}
.queue-payment-cell { display: grid; gap: 7px; min-width: 132px; }
.cashier-confirm { min-height: 40px; border: 1px solid rgb(231, 199, 133); background: rgb(255, 248, 232); border-radius: 8px; padding: 7px 9px; display: flex; align-items: center; gap: 8px; color: rgb(128, 85, 11); cursor: pointer; font-size: 11px; font-weight: 800; }
.cashier-confirm:hover { background: rgb(255, 241, 207); }
.cashier-confirm input { width: 17px; height: 17px; min-height: 0px; flex: 0 0 auto; margin: 0px; }
.cashier-confirm span { margin: 0px; font-size: 11px; }
.cashier-confirm:has(input:focus-visible) { outline: rgba(11, 107, 97, 0.25) solid 3px; outline-offset: 2px; }
#cashierPaymentForm { display: grid; gap: 14px; margin-top: 20px; }
#cashierPaymentForm .modal-actions { margin-top: 4px; }
.inventory-report-controls { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 18px; padding: 16px 18px; border: 1px solid var(--line); border-radius: 8px; background: rgb(255, 255, 255); }
.inventory-report-controls > div { display: grid; gap: 7px; }
.inventory-report-controls > div > span { font-size: 11px; font-weight: 800; color: var(--muted); text-transform: uppercase; }
.inventory-filter-tabs button { min-height: 40px; }
.inventory-sales-stats { margin-top: 0px; }
.inventory-sales-stats .stat-card strong { font-size: 20px; }
.inventory-sales-panel { margin-bottom: 18px; }
.inventory-sales-panel .panel-head { margin-bottom: 14px; }
.inventory-sales-table td { vertical-align: top; }
.inventory-sales-table td small { display: block; margin-top: 3px; color: var(--muted); font-size: 10px; }
.inventory-section-heading { margin: 26px 0px 12px; }
.inventory-section-heading h3 { margin: 4px 0px 0px; }
@media (max-width: 820px) {
  .inventory-report-controls { align-items: stretch; display: grid; }
  .inventory-report-controls .segmented { overflow: auto; }
  .inventory-filter-tabs button { flex: 1 1 0%; white-space: nowrap; }
  .inventory-sales-stats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .inventory-report-controls { padding: 12px; }
  .inventory-sales-stats { grid-template-columns: 1fr 1fr; }
  .inventory-sales-stats .stat-card:first-child { grid-column: 1 / -1; }
  .inventory-sales-stats .stat-card strong { font-size: 18px; }
}
.portal-mode { background: rgb(243, 248, 246); overflow-x: hidden; }
.portal-mode .sidebar, .portal-mode .topbar, .portal-mode #typeChooser, .portal-mode .wizard-top { display: none !important; }
.portal-mode .main { width: 100%; max-width: 1120px; margin: 0px auto; padding: 28px 28px 56px; }
.portal-mode #page-register { display: block; }
.portal-mode .portal-intro { display: grid; grid-template-columns: 72px minmax(0px, 1fr); align-items: center; justify-content: start; gap: 18px; margin: 0px auto 24px; padding: 18px 20px; border-bottom: 1px solid var(--line); }
.portal-mode .portal-intro img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; }
.portal-mode .portal-intro h1 { margin: 3px 0px 5px; font-size: 26px; letter-spacing: 0px; }
.portal-mode .portal-intro p:not(.eyebrow) { margin: 0px; max-width: 720px; color: var(--muted); line-height: 1.5; }
.portal-mode .wizard, .portal-mode .form-panel, .portal-mode .form-grid, .portal-mode .service-layout { max-width: 100%; min-width: 0px; }
.portal-mode .wizard { max-width: 1040px; }
.portal-mode .form-grid > *, .portal-mode .service-layout > *, .portal-mode input, .portal-mode select { min-width: 0px; }
.portal-mode .steps { position: sticky; top: 0px; z-index: 8; min-width: 0px; box-shadow: rgba(21, 70, 63, 0.06) 0px 8px 22px; }
.portal-mode .steps li { min-width: 0px; }
.portal-mode .steps li b { min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-mode .form-panel { box-shadow: rgba(21, 70, 63, 0.05) 0px 8px 30px; }
@media (max-width: 820px) {
  .portal-mode .main { padding: 18px 16px 40px; }
  .portal-mode .portal-intro { grid-template-columns: 58px minmax(0px, 1fr); padding: 12px 4px 16px; }
  .portal-mode .portal-intro img { width: 58px; height: 58px; }
  .portal-mode .portal-intro h1 { font-size: 22px; }
  .portal-mode .steps { top: 0px; }
}
@media (max-width: 560px) {
  .portal-mode .main { padding: 12px 10px 34px; }
  .portal-mode .portal-intro { grid-template-columns: 48px minmax(0px, 1fr); gap: 11px; }
  .portal-mode .portal-intro img { width: 48px; height: 48px; }
  .portal-mode .portal-intro h1 { font-size: 19px; }
  .portal-mode .portal-intro p:not(.eyebrow) { font-size: 12px; }
  .portal-mode .steps { border-radius: 8px; }
  .portal-mode .form-panel { border-radius: 8px; }
  .portal-mode .wizard-actions { gap: 10px; }
  .portal-mode .wizard-actions .primary, .portal-mode .wizard-actions .secondary { min-height: 48px; }
}
.discount-fields { display: grid; grid-template-columns: minmax(220px, 0.55fr) minmax(0px, 1fr); gap: 18px; align-items: start; margin-top: 18px; }
.discount-id-card { border: 1px solid var(--line); border-radius: 14px; padding: 16px; background: rgb(255, 255, 255); }
.discount-id-card .capture-head { margin-bottom: 12px; }
.compact-upload { height: 154px; }
.compact-upload img { object-fit: contain; background: rgb(255, 255, 255); }
.discount-line { margin-top: 5px; padding-top: 10px; border-top: 1px dashed rgb(182, 204, 199); color: var(--green); font-weight: 800; }
.priority-badge { display: inline-flex; width: max-content; margin-top: 6px; border-radius: 12px; background: rgb(255, 240, 199); color: rgb(122, 82, 0); padding: 4px 7px; font-size: 9px; font-weight: 900; text-transform: uppercase; }
.priority-row { background: rgb(255, 253, 246); }
.priority-row .queue-no { background: rgb(255, 240, 199); color: rgb(122, 82, 0); }
@media (max-width: 700px) {
  .discount-fields { grid-template-columns: 1fr; }
}
.patient-discount-record { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin-top: 12px; padding-top: 10px; border-top: 1px solid rgb(237, 242, 241); font-size: 11px; }
.patient-discount-record .priority-badge { margin-top: 0px; }
.patient-discount-record a { margin-left: auto; color: var(--primary); font-weight: 800; }
.date-choice-field { display: grid; gap: 10px; align-content: start; }
.date-choice-field label { display: block; }
.date-choice-field select, .date-choice-field input { width: 100%; }
.pregnancy-history-group { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: #f8fbfa; }
.pregnancy-history-group > label:first-child { grid-column: 1 / -1; }
.pregnancy-history-group label > small { display: block; margin-top: 6px; color: var(--muted); line-height: 1.45; }
input[type="date"] { min-height: 48px; font: inherit; color: var(--ink); color-scheme: light; }
input[type="date"]::-webkit-date-and-time-value { min-height: 1.4em; text-align: left; }
@media (max-width: 640px) { .pregnancy-history-group { grid-template-columns: 1fr; padding: 12px; } .pregnancy-history-group > label:first-child { grid-column: auto; } }
.type-card { display: flex; flex-direction: column; align-items: stretch; }
.card-link { position: static; margin-top: auto; padding-top: 20px; line-height: 1.35; }
.card-link svg { flex: 0 0 auto; }
.vitals-layout { grid-template-columns: 300px minmax(0px, 1fr); }
.vitals-work-status { font-size: 10px; font-weight: 800; text-transform: uppercase; text-align: right; }
.vitals-work-status.pending { color: var(--amber); }
.vitals-work-status.complete { color: var(--green); }
.vital-signs-form { margin-top: 18px; }
.vital-signs-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 14px; }
.vital-signs-grid label { display: block; min-width: 0px; }
.vital-signs-updated { margin: 14px 0px 0px; color: var(--muted); font-size: 11px; text-align: right; }
.doctor-section-head > span svg { width: 16px; }
.nurse-vitals-summary { grid-template-columns: repeat(4, minmax(0px, 1fr)); }
.nurse-vital-card { min-width: 0px; border: 1px solid rgb(216, 229, 226); border-radius: 10px; background: rgb(246, 250, 249); padding: 12px; }
.nurse-vital-card span, .nurse-vital-card strong, .nurse-vital-card small { display: block; }
.nurse-vital-card span { font-size: 10px; color: var(--muted); text-transform: uppercase; font-weight: 800; }
.nurse-vital-card strong { margin-top: 5px; font-size: 15px; overflow-wrap: anywhere; }
.nurse-vital-card small { margin-top: 2px; color: var(--muted); font-size: 10px; }
.vital-signs-required-note { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 12px; border: 1px solid rgb(239, 215, 168); border-radius: 10px; background: rgb(255, 248, 233); padding: 12px; color: rgb(128, 85, 11); }
.vital-signs-required-note strong, .vital-signs-required-note span { font-size: 11px; }
.vital-signs-required-note span { text-align: right; }
@media (max-width: 1050px) {
  .vital-signs-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
  .nurse-vitals-summary { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
}
@media (max-width: 820px) {
  .vitals-layout { grid-template-columns: 1fr; }
  .vitals-layout > * { min-width: 0px; }
}
@media (max-width: 560px) {
  .vital-signs-grid, .nurse-vitals-summary { grid-template-columns: 1fr; }
  .vitals-layout .result-actions { display: grid; grid-template-columns: 1fr; }
  .vitals-layout .result-actions button { width: 100%; }
  .vital-signs-required-note { display: grid; }
  .vital-signs-required-note span { text-align: left; }
}

/* Current clinic interface refinements */
:root { --primary: #0b6b61; --primary-2: #0f8578; --primary-soft: #e7f5f2; --ink: #16332f; --muted: #667773; --line: #dbe6e3; --surface: #fff; --canvas: #f4f8f7; --accent: #d96b38; --danger: #c43d4b; --blue: #3076a9; --amber: #b27612; --green: #27805e; --shadow: 0 12px 35px rgba(21,70,63,.08); --radius: 18px; }
@media (max-width: 1050px) {
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .dashboard-grid { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: repeat(2, 1fr); }
  .service-layout { grid-template-columns: 1fr; }
  .results-layout { grid-template-columns: 280px 1fr; }
  .records-grid, .agency-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 820px) {
  .sidebar { transform: translateX(-100%); transition: 0.2s; }
  .sidebar.open { transform: none; }
  .main { margin-left: 0px; padding: 0px 18px 38px; }
  .menu-button { display: grid; }
  .topbar { height: 82px; }
  .type-cards { grid-template-columns: 1fr; }
  .type-card { min-height: 235px; }
  .capture-grid, .review-grid { grid-template-columns: 1fr; }
  .steps li b { display: none; }
  .results-layout { grid-template-columns: 1fr; }
  .worklist { max-height: 300px; }
  .patient-summary { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .main { padding: 0px 12px 30px; }
  .top-actions .primary { display: none; }
  .welcome-band { padding: 23px; display: block; }
  .welcome-band button { margin-top: 18px; }
  .welcome-band h2 { font-size: 23px; }
  .stats-grid { grid-template-columns: 1fr 1fr; gap: 9px; }
  .stat-card { padding: 13px; display: block; }
  .stat-icon { width: 36px; height: 36px; margin-bottom: 10px; }
  .stat-card strong { font-size: 22px; }
  .stat-card small { display: none; }
  .queue-row { grid-template-columns: 40px 1fr auto; }
  .queue-row .queue-meta { display: none; }
  .panel { padding: 17px; }
  .form-panel { padding: 18px; }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid .wide { grid-column: auto; }
  .capture-grid { grid-template-columns: 1fr; }
  .service-list { grid-template-columns: 1fr; }
  .wizard-actions, .wizard-actions > div { align-items: stretch; }
  .wizard-actions > div { display: grid; }
  .save-note { display: none; }
  .filter-row { display: grid; gap: 10px; }
  .search-box { min-width: 0px; }
  .segmented { overflow: auto; }
  .records-grid, .agency-grid { grid-template-columns: 1fr; }
  .slip-grid { grid-template-columns: 1fr; }
  .steps li { justify-content: center; }
  .steps li b { display: none; }
}
@media print {
  body > * { display: none !important; }
  body .modal-backdrop:not(.hidden) { position: static; background: rgb(255, 255, 255); padding: 0px; display: block !important; }
  body .modal { box-shadow: none; width: 100%; max-height: none; padding: 0px; }
  .modal-head, .modal-actions { display: none !important; }
  .appointment-slip { border: 0px; }
  .app-shell { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; transition: none !important; }
}
.primary { text-decoration: none; }
.brand-mark { overflow: visible; background: transparent; box-shadow: none; }
.brand-mark img { width: 100%; height: 100%; object-fit: contain; border-radius: 50%; }
.document-logo { display: block; width: 92px; height: 92px; object-fit: cover; border-radius: 50%; margin: 0px auto 9px; }
.paper-size-note { text-align: right; font-size: 11px; color: var(--muted); margin-bottom: 8px; }
.paper-size-note strong { color: var(--primary); }
.laboratory-result.paper-a5 { max-width: 560px; margin: auto; }
.laboratory-result.paper-a5 .document-logo { width: 72px; height: 72px; }
.laboratory-result.paper-a5 .result-brand h2 { font-size: 16px; }
.laboratory-result.paper-a5 .result-brand p, .laboratory-result.paper-a5 .print-result-table th, .laboratory-result.paper-a5 .print-result-table td { font-size: 8px; }
.laboratory-result.paper-a5 .print-result-table th, .laboratory-result.paper-a5 .print-result-table td { padding: 4px; }
.laboratory-result.paper-a5 .signature-grid { margin-top: 24px; font-size: 7px; }
.laboratory-result.paper-a4 { max-width: 794px; margin: auto; }
.appointment-slip .document-logo { width: 56px !important; height: 56px !important; }
.appointment-slip { max-width: 760px; margin: auto; }
.appointment-slip.landscape { max-width: 1000px; }
.service-list { display: block; }
.service-group { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 20px; }
.service-group h5 { grid-column: 1 / -1; margin: 0px 0px 2px; color: var(--primary); font-size: 12px; text-transform: uppercase; letter-spacing: 0.07em; }
.service-group h5 small { font-weight: 500; text-transform: none; letter-spacing: 0px; color: var(--muted); margin-left: 6px; }
.sendout-group { padding: 14px; background: rgb(247, 243, 255); border: 1px solid rgb(226, 217, 244); border-radius: 14px; }
.sendout-group h5 { color: rgb(113, 84, 164); }
.sendout-uploader { border: 1px dashed rgb(156, 183, 177); border-radius: 14px; background: rgb(247, 250, 249); padding: 24px; text-align: center; }
.sendout-uploader input { margin: 14px auto 8px; max-width: 420px; }
.sendout-files { display: grid; gap: 8px; margin-top: 16px; text-align: left; }
.sendout-file { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: rgb(255, 255, 255); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; font-size: 12px; }
.sendout-file a { color: var(--primary); font-weight: 700; }
.sendout-note { color: var(--muted); font-size: 12px; }
.sendout-badge { display: inline-flex; background: rgb(238, 232, 250); color: rgb(113, 84, 164); border-radius: 20px; padding: 5px 9px; font-size: 10px; font-weight: 800; text-transform: uppercase; }
@media (max-width: 560px) {
  .service-group { grid-template-columns: 1fr; }
}
.icon-button.menu-button { display: none; }
.laboratory-result { border: 1px solid rgb(150, 170, 165); padding: 24px; color: rgb(16, 44, 40); }
.result-brand { text-align: center; border-bottom: 3px solid rgb(78, 143, 32); padding-bottom: 13px; }
.result-brand h2 { color: rgb(48, 125, 52); margin: 0px; font-size: 21px; }
.result-brand p { margin: 4px 0px; font-size: 11px; }
.result-patient-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 30px; margin: 18px 0px; font-size: 12px; }
.result-patient-line { display: flex; gap: 8px; border-bottom: 1px solid rgb(203, 214, 211); padding: 5px 0px; }
.result-patient-line span { min-width: 95px; font-weight: 800; }
.result-section-title { background: rgb(91, 158, 36); color: rgb(255, 255, 255); text-align: center; padding: 8px; text-transform: uppercase; font-weight: 900; letter-spacing: 0.05em; }
.print-result-table { width: 100%; min-width: 0px; }
.print-result-table th, .print-result-table td { border: 1px solid rgb(135, 155, 150); padding: 8px; font-size: 11px; }
.print-result-table th { background: rgb(237, 244, 235); color: rgb(23, 61, 55); }
.result-remarks { padding: 12px 0px; font-size: 12px; }
.signature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 45px; text-align: center; font-size: 10px; }
.signature-grid strong { display: block; border-bottom: 1px solid rgb(113, 132, 127); padding-bottom: 4px; font-size: 11px; }
.signature-grid span { display: block; margin-top: 4px; font-weight: 800; }
.signature-grid small { display: block; margin-top: 3px; font-size: 0.9em; }
.result-validity { text-align: center; font-size: 10px; margin-top: 20px; color: rgb(88, 107, 103); }
.laboratory-signatories { margin-top: 18px; border: 1px solid var(--line); border-radius: 12px; background: rgb(251, 253, 252); padding: 18px; }
.laboratory-signatory-grid { display: grid; grid-template-columns: minmax(0px, 1.5fr) minmax(160px, 0.7fr); gap: 12px; margin-top: 14px; }
.laboratory-signatory-grid label { display: block; }
.laboratory-signatory-grid input, .laboratory-signatory-grid select { width: 100%; margin-top: 6px; }
.laboratory-signatory-grid input[readonly] { background: rgb(241, 245, 244); color: rgb(64, 83, 79); cursor: default; }
.signatory-fixed-note { margin: 12px 0px 0px; color: var(--muted); font-size: 12px; }
@media (max-width: 820px) {
  .icon-button.menu-button { display: grid; }
}
@media (max-width: 560px) {
  .result-patient-grid, .signature-grid, .laboratory-signatory-grid { grid-template-columns: 1fr; }
  .laboratory-signatories { padding: 15px; }
}
@media print {
  .appointment-slip, .laboratory-result { border: 0px; }
}
.inventory-table { min-width: 940px; }
.inventory-table th:not(:first-child), .inventory-table td:not(:first-child) { text-align: center; }
.inventory-table tbody tr:hover { background: rgb(248, 251, 250); }
.inventory-table tfoot th { background: rgb(234, 244, 241); color: var(--ink); font-size: 11px; }
.inventory-stats { margin-top: 0px; }
.service-stats { grid-template-columns: repeat(3, 1fr); margin-top: 0px; }
#page-services, #servicesForm, #servicesForm .table-panel, #servicesForm .responsive-table { min-width: 0px; max-width: 100%; }
.service-filter { align-items: center; }
.service-save-note { margin: 0px; color: var(--muted); font-size: 12px; }
.service-config-table { min-width: 760px; }
.service-config-table th:first-child { width: 180px; }
.service-config-table th:nth-child(3) { width: 190px; }
.service-config-table th:last-child { width: 150px; }
.service-config-table td { vertical-align: middle; }
.service-field-label { display: block; }
.service-field-label > span { position: absolute; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border: 0px; }
.service-field-label input { min-height: 40px; }
.price-input { position: relative; }
.price-input b { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--muted); font-size: 13px; z-index: 1; }
.price-input input { padding-left: 28px; }
.availability-toggle { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; cursor: pointer; }
.availability-toggle input { width: 18px; height: 18px; min-height: 0px; accent-color: var(--primary); }
.availability-toggle span { margin: 0px; font-size: 12px; }
.service-config-table tbody tr:has([data-service-active]:not(:checked)) { background: rgb(250, 251, 251); }
.service-config-table tbody tr:has([data-service-active]:not(:checked)) input[data-service-label] { color: var(--muted); }
@media (max-width: 820px) {
  .service-stats { grid-template-columns: repeat(3, 1fr); }
  .service-filter { display: grid; gap: 10px; }
  .service-save-note { padding: 0px 2px; }
}
@media (max-width: 560px) {
  .service-stats { grid-template-columns: 1fr 1fr; }
  .service-stats .stat-card:first-child { grid-column: 1 / -1; }
  #page-services > .section-intro { display: grid; grid-template-columns: 1fr; align-items: start; }
  #page-services > .section-intro .primary { width: 100%; min-height: 44px; padding: 0px 12px; }
  .service-config-table { display: block; min-width: 0px; width: 100%; }
  .service-config-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); }
  .service-config-table tbody { display: grid; gap: 12px; padding: 12px; }
  .service-config-table tr { display: grid; grid-template-columns: minmax(0px, 1fr) minmax(120px, 0.7fr); gap: 6px; border: 1px solid var(--line); border-radius: 10px; padding: 10px; background: rgb(255, 255, 255); }
  .service-config-table td { display: block; border: 0px; padding: 5px; }
  .service-config-table td:first-child, .service-config-table td:nth-child(2) { grid-column: 1 / -1; }
  .service-config-table .route-badge { margin-bottom: 2px; }
}
#page-services { overflow-x: hidden; }
.service-choice-search { width: 100%; min-width: 0px; margin-bottom: 14px; }
.tup-operations-note { margin-top: 14px; }
.tup-package-card { border: 1px solid rgb(184, 217, 210); background: rgb(247, 250, 249); border-radius: 14px; padding: 20px; }
.tup-package-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin: 12px 0px; }
.tup-package-head h4 { margin: 0px 0px 4px; }
.tup-package-head p { margin: 0px; color: var(--muted); font-size: 12px; }
.tup-package-head > strong { font-size: 22px; color: var(--primary); white-space: nowrap; }
.tup-package-card ul { margin: 0px; padding-left: 20px; color: var(--ink); font-size: 13px; line-height: 1.7; }
.tup-result-note { margin: 14px 0px 0px; border-top: 1px solid var(--line); padding-top: 12px; color: var(--muted); font-size: 12px; }
.section-actions { display: flex; gap: 10px; align-items: center; }
.service-config-table th:last-child { width: 100px; }
.delete-service-button { color: var(--danger); border-color: rgb(239, 197, 202); }
.delete-service-button:hover { background: rgb(255, 244, 245); }
.danger-button { min-height: 44px; border: 0px; border-radius: 11px; padding: 0px 18px; background: var(--danger); color: rgb(255, 255, 255); font-weight: 700; }
.danger-button:hover { background: rgb(169, 47, 60); }
.service-result-note { margin-top: 16px; }
.delete-service-message { color: var(--muted); line-height: 1.55; }
.delete-service-message strong { color: var(--ink); }
#addServiceForm > label { display: block; margin-top: 14px; }
.agency-card-body { min-width: 0px; flex: 1 1 0%; }
.agency-actions { display: flex; gap: 8px; margin-top: 13px; }
.agency-actions .mini-button { min-height: 38px; min-width: 70px; }
.agency-email-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 18px 0px 10px; padding-top: 16px; border-top: 1px solid var(--line); }
.agency-email-heading strong, .agency-email-heading small { display: block; }
.agency-email-heading small { margin-top: 4px; color: var(--muted); font-size: 11px; line-height: 1.4; }
.agency-email-row { display: grid; grid-template-columns: minmax(0px, 1fr) 44px; gap: 8px; align-items: end; margin-top: 10px; }
.agency-email-row label { min-width: 0px; }
.agency-email-remove { width: 44px; height: 44px; color: var(--danger); }
.agency-email-remove:hover { background: rgb(255, 244, 245); border-color: rgb(239, 197, 202); }
.compact { min-height: 38px; padding: 0px 11px; white-space: nowrap; }
.agency-email-heading [data-icon] svg { width: 15px; vertical-align: -3px; margin-right: 4px; }
@media (max-width: 560px) {
  .agency-email-heading { align-items: stretch; flex-direction: column; }
  .agency-email-heading .compact { width: 100%; min-height: 44px; }
  .agency-email-row { grid-template-columns: minmax(0px, 1fr) 44px; }
}
.package-manager-panel { margin-bottom: 18px; }
.package-manager-panel .panel-head { align-items: flex-start; }
.package-manager-panel .panel-head h3 { margin: 3px 0px; }
.package-manager-panel .panel-head p:last-child { margin: 4px 0px 0px; color: var(--muted); font-size: 12px; }
.package-config-list { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 12px; }
.package-config-card { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; border: 1px solid var(--line); border-radius: 8px; padding: 16px; background: rgb(255, 255, 255); }
.package-config-main { min-width: 0px; }
.package-config-title { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.package-config-title h4 { margin: 0px; font-size: 15px; }
.package-config-main > strong { display: block; margin-top: 9px; color: var(--primary); font-size: 20px; }
.package-config-main > p { margin: 8px 0px 0px; color: var(--muted); font-size: 11px; line-height: 1.55; overflow-wrap: anywhere; }
.package-config-actions { display: flex; gap: 8px; flex: 0 0 auto; }
.package-modal { width: min(760px, 94vw); }
.package-form-grid { display: grid; grid-template-columns: 1fr 220px; gap: 12px; }
.package-availability { margin: 14px 0px; }
.package-service-fieldset { border: 1px solid var(--line); border-radius: 8px; padding: 14px; margin: 0px; }
.package-service-fieldset legend { padding: 0px 6px; font-size: 12px; font-weight: 800; }
.package-service-search { margin-bottom: 12px; }
.package-service-choices { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 8px; max-height: 330px; overflow: auto; }
.package-service-choice { display: flex; align-items: flex-start; gap: 10px; border: 1px solid var(--line); border-radius: 8px; padding: 10px; cursor: pointer; }
.package-service-choice:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); }
.package-service-choice input { width: 18px; height: 18px; min-height: 0px; margin: 2px 0px 0px; flex: 0 0 auto; }
.package-service-choice span, .package-service-choice strong, .package-service-choice small { display: block; }
.package-service-choice span { margin: 0px; min-width: 0px; }
.package-service-choice strong { font-size: 12px; }
.package-service-choice small { margin-top: 3px; color: var(--muted); font-size: 10px; line-height: 1.4; }
.registration-package-picker { grid-column: 1 / -1; margin-bottom: 10px; border: 1px solid rgb(184, 217, 210); background: rgb(248, 251, 250); border-radius: 8px; padding: 16px; }
.package-picker-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 12px; }
.package-picker-head h4 { margin: 7px 0px 0px; }
.package-picker-head p { max-width: 430px; margin: 0px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.registration-package-options { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 9px; }
.registration-package-option { display: grid; grid-template-columns: 18px minmax(0px, 1fr) auto; gap: 10px; align-items: flex-start; border: 1px solid var(--line); border-radius: 8px; padding: 12px; background: rgb(255, 255, 255); cursor: pointer; }
.registration-package-option.selected, .registration-package-option:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); }
.registration-package-option input { width: 18px; height: 18px; min-height: 0px; margin: 2px 0px 0px; }
.registration-package-option span, .registration-package-option strong, .registration-package-option small { display: block; }
.registration-package-option span { margin: 0px; min-width: 0px; }
.registration-package-option strong { font-size: 13px; }
.registration-package-option small { margin-top: 4px; color: var(--muted); font-size: 10px; line-height: 1.45; overflow-wrap: anywhere; }
.registration-package-option > b { color: var(--primary); font-size: 13px; white-space: nowrap; }
.service-option.package-included { border-color: rgb(159, 202, 193); background: rgb(237, 247, 244); }
.service-option.package-included span::after { content: "Included in package"; display: block; margin-top: 3px; color: var(--primary); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.package-payment-item span small { display: block; margin-top: 3px; color: var(--muted); font-size: 9px; }
.package-empty { grid-column: 1 / -1; }
@media (max-width: 820px) {
  .package-config-list { grid-template-columns: 1fr; }
  .package-service-choices { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .package-manager-panel .panel-head, .package-picker-head { display: grid; gap: 10px; }
  .package-manager-panel .panel-head button { width: 100%; }
  .package-config-card { display: grid; }
  .package-config-actions { width: 100%; }
  .package-config-actions button { flex: 1 1 0%; min-height: 44px; }
  .package-form-grid, .registration-package-options { grid-template-columns: 1fr; }
  .registration-package-option { min-height: 62px; }
  .package-service-fieldset { padding: 10px; }
}
@media (max-width: 560px) {
  #page-services > .section-intro .section-actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  #page-services > .section-intro .section-actions .primary, #page-services > .section-intro .section-actions .secondary { width: 100%; padding: 0px 8px; }
  .service-config-table td:last-child { display: flex; align-items: center; justify-content: flex-end; }
  .service-config-table .delete-service-button { min-height: 44px; }
}
.xray-editor-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 18px; }
.xray-photo-box img { width: 100%; height: 100%; object-fit: cover; display: block; }
.xray-file-upload { display: block; border: 1px dashed rgb(171, 192, 188); border-radius: 12px; background: rgb(247, 250, 249); padding: 16px; }
.xray-file-upload input { margin-top: 10px; }
.xray-remarks { display: block; margin-top: 18px; }
.xray-remarks textarea { width: 100%; border: 1px solid rgb(207, 220, 217); border-radius: 10px; background: rgb(255, 255, 255); padding: 12px; resize: vertical; color: var(--ink); font: inherit; }
.xray-file-actions { display: flex; align-items: center; gap: 12px; }
.xray-remove-file { min-height: 32px; font-size: 11px; color: var(--danger); }
.xray-work-status { font-size: 10px; font-weight: 800; text-transform: uppercase; }
.xray-work-status.pending { color: rgb(147, 96, 10); }
.xray-work-status.complete { color: var(--green); }
@media (max-width: 820px) {
  .xray-editor-grid { grid-template-columns: 1fr; }
}
.drugtest-uploader { text-align: left; }
.drugtest-uploader > h3, .drugtest-uploader > .sendout-badge, .drugtest-uploader > .sendout-note { display: block; }
.drugtest-uploader .xray-file-upload { margin-top: 18px; }
.drugtest-notice { margin: 18px 0px; }
.drugtest-preview .sendout-file span { overflow-wrap: anywhere; }
.drugtest-uploader .xray-file-actions, .drugtest-preview .xray-file-actions { flex-wrap: wrap; justify-content: flex-end; }
@media (max-width: 560px) {
  .drugtest-uploader { padding: 18px; }
  .drugtest-uploader .sendout-file, .drugtest-preview .sendout-file { align-items: flex-start; flex-direction: column; }
  .drugtest-uploader .xray-file-actions, .drugtest-preview .xray-file-actions { justify-content: flex-start; }
}
.xray-report { color: rgb(16, 44, 40); background: rgb(255, 255, 255); padding: 28px; }
.xray-report-header { display: grid; grid-template-columns: 96px minmax(0px, 1fr) 96px; gap: 16px; align-items: start; border-bottom: 2px solid rgb(11, 107, 97); padding-bottom: 18px; }
.xray-report-photo { width: 92px; height: 116px; border: 1px solid rgb(135, 155, 150); background: rgb(243, 247, 246); display: grid; place-items: center; text-align: center; color: rgb(101, 120, 116); font-size: 10px; overflow: hidden; }
.xray-report-photo img { width: 100%; height: 100%; object-fit: cover; }
.xray-report-brand { text-align: center; }
.xray-report-brand .document-logo { width: 58px; height: 58px; margin: 0px auto 7px; }
.xray-report-brand h2 { margin: 0px; color: rgb(11, 107, 97); font-size: 19px; line-height: 1.25; }
.xray-report-brand p { margin: 3px 0px; font-size: 10px; }
.xray-report-mark { border: 1px solid rgb(146, 170, 165); padding: 14px 7px; text-align: center; color: rgb(11, 107, 97); }
.xray-report-mark strong { display: block; font-size: 10px; line-height: 1.25; }
.xray-report-mark span { display: block; margin-top: 8px; font-size: 9px; text-transform: uppercase; }
.xray-patient-details { display: grid; grid-template-columns: 1fr 1fr; gap: 0px 30px; margin: 22px 0px; }
.xray-patient-details > div { display: grid; grid-template-columns: 92px 1fr; border-bottom: 1px solid rgb(174, 189, 185); padding: 8px 0px; font-size: 12px; }
.xray-patient-details span { font-weight: 700; }
.xray-detail-wide { grid-column: 1 / -1; }
.xray-examination-title { background: rgb(11, 107, 97); color: rgb(255, 255, 255); text-align: center; font-size: 16px; font-weight: 800; text-transform: uppercase; padding: 10px; letter-spacing: 0.04em; }
.xray-report-section { margin-top: 26px; }
.xray-report-section h3 { margin: 0px 0px 9px; text-transform: uppercase; font-size: 13px; color: rgb(11, 107, 97); }
.xray-report-section p { margin: 0px; min-height: 120px; border-left: 3px solid rgb(199, 222, 216); padding: 12px 15px; font-size: 14px; line-height: 1.8; white-space: normal; }
.xray-impression p { min-height: 84px; font-weight: 800; text-transform: uppercase; }
.xray-signature { width: 260px; margin: 88px 0px 0px auto; text-align: center; font-size: 11px; }
.xray-signature strong { display: block; border-bottom: 1px solid rgb(89, 109, 104); padding-bottom: 7px; }
.xray-signature span { display: block; margin-top: 7px; font-weight: 800; }
.xray-report-footer { text-align: center; border-top: 1px solid rgb(184, 199, 195); margin-top: 48px; padding-top: 10px; font-size: 10px; color: rgb(102, 120, 116); }
.xray-report-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 18px; padding: 18px; border: 1px solid rgb(212, 225, 222); border-radius: 12px; background: rgb(251, 253, 252); }
.xray-report-fields .capture-head { grid-column: 1 / -1; }
.xray-report-fields label { display: block; }
.xray-report-fields label:nth-of-type(2) { grid-column: 1 / -1; }
.xray-report-fields label:nth-of-type(3) { grid-column: 1 / -1; }
.xray-report-fields input, .xray-report-fields textarea { width: 100%; margin-top: 7px; border: 1px solid rgb(207, 220, 217); border-radius: 10px; background: rgb(255, 255, 255); padding: 11px; color: var(--ink); font: inherit; }
.xray-report-fields textarea { resize: vertical; line-height: 1.5; }
@media (max-width: 820px) {
  .xray-report-header { grid-template-columns: 76px minmax(0px, 1fr); }
  .xray-report-mark { grid-column: 2; justify-self: end; margin-top: -8px; }
  .xray-report-brand h2 { font-size: 16px; }
  .xray-report-brand p { font-size: 9px; }
  .xray-report { padding: 18px; }
}
@media (max-width: 560px) {
  .xray-report-header { grid-template-columns: 72px minmax(0px, 1fr); gap: 10px; }
  .xray-report-photo { width: 70px; height: 88px; }
  .xray-report-brand .document-logo { width: 44px; height: 44px; }
  .xray-report-brand h2 { font-size: 13px; }
  .xray-report-brand p { font-size: 8px; }
  .xray-report-mark { grid-column: 1 / -1; justify-self: stretch; padding: 8px; }
  .xray-patient-details { grid-template-columns: 1fr; gap: 0px; }
  .xray-detail-wide { grid-column: auto; }
  .xray-patient-details > div { grid-template-columns: 86px 1fr; font-size: 11px; }
  .xray-report-section p { font-size: 12px; }
  .xray-report-fields { grid-template-columns: 1fr; }
  .xray-report-fields .capture-head, .xray-report-fields label:nth-of-type(2), .xray-report-fields label:nth-of-type(3) { grid-column: auto; }
}
.drugtest-workflow-grid { display: grid; grid-template-columns: minmax(220px, 0.72fr) minmax(0px, 1.28fr); gap: 16px; }
.drugtest-workflow-grid .capture-card { min-width: 0px; }
.drugtest-specimen-state { display: grid; gap: 4px; border: 1px solid var(--line); border-radius: 11px; padding: 14px; margin-bottom: 14px; }
.drugtest-specimen-state strong { font-size: 13px; }
.drugtest-specimen-state span { font-size: 11px; color: var(--muted); }
.drugtest-specimen-state.pending { background: rgb(255, 248, 233); border-color: rgb(239, 215, 168); }
.drugtest-specimen-state.collected { background: rgb(234, 246, 239); border-color: rgb(185, 223, 202); }
.drugtest-mode-options { display: grid; gap: 10px; margin-bottom: 16px; }
.drugtest-mode-option { display: flex; align-items: flex-start; gap: 12px; border: 1px solid var(--line); border-radius: 11px; padding: 13px; cursor: pointer; min-height: 70px; }
.drugtest-mode-option:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); }
.drugtest-mode-option input { width: 18px; height: 18px; min-height: 0px; margin: 2px 0px 0px; flex: 0 0 auto; }
.drugtest-mode-option span, .drugtest-mode-option strong, .drugtest-mode-option small { display: block; }
.drugtest-mode-option span { margin: 0px; min-width: 0px; }
.drugtest-mode-option strong { font-size: 13px; }
.drugtest-mode-option small { color: var(--muted); font-size: 11px; line-height: 1.45; margin-top: 3px; }
.drugtest-work-status { font-size: 10px; font-weight: 800; text-align: right; }
.drugtest-work-status.pending { color: var(--amber); }
.drugtest-work-status.collected { color: var(--blue); }
.drugtest-work-status.complete { color: var(--green); }
.drugtest-release-card textarea { width: 100%; min-height: 88px; border: 1px solid rgb(207, 220, 217); border-radius: 10px; padding: 10px 12px; color: var(--ink); font: inherit; resize: vertical; }
.drugtest-release-card textarea:focus-visible { outline: rgba(11, 107, 97, 0.25) solid 3px; outline-offset: 2px; }
.doctor-layout { grid-template-columns: 300px 1fr; }
.doctor-work-status { font-size: 10px; font-weight: 800; text-transform: uppercase; }
.doctor-work-status.pending { color: var(--amber); }
.doctor-work-status.complete { color: var(--green); }
.doctor-form { display: grid; gap: 18px; margin-top: 18px; }
.doctor-form-section { border: 1px solid var(--line); border-radius: 13px; padding: 18px; background: rgb(255, 255, 255); }
.doctor-section-head { display: flex; gap: 11px; align-items: flex-start; padding-bottom: 14px; border-bottom: 1px solid var(--line); margin-bottom: 15px; }
.doctor-section-head > span { width: 30px; height: 30px; border-radius: 9px; background: var(--primary-soft); color: var(--primary); display: grid; place-items: center; font-weight: 900; font-size: 12px; }
.doctor-section-head h3 { margin: 0px 0px 4px; font-size: 16px; }
.doctor-section-head p { margin: 0px; color: var(--muted); font-size: 11px; line-height: 1.45; }
.doctor-history-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.doctor-history-item { display: grid; grid-template-columns: minmax(0px, 1fr) 92px; gap: 7px; align-items: center; border: 1px solid rgb(225, 234, 232); border-radius: 9px; padding: 8px 9px; min-height: 48px; }
.doctor-history-item > span { font-size: 11px; line-height: 1.35; }
.doctor-history-item select, .doctor-system-item select { min-height: 36px; font-size: 11px; padding: 0px 7px; }
.doctor-wide-field { display: block; margin-top: 14px; }
.doctor-wide-field textarea { width: 100%; border: 1px solid rgb(207, 220, 217); border-radius: 9px; padding: 10px 12px; color: var(--ink); font: inherit; resize: vertical; }
.doctor-vitals-grid, .doctor-signoff-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.doctor-vitals-grid label, .doctor-signoff-grid label, .doctor-ancillary-grid label { display: block; }
.doctor-system-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 16px; }
.doctor-system-item { display: grid; grid-template-columns: minmax(0px, 1fr) 98px 1fr; gap: 7px; align-items: center; border: 1px solid rgb(225, 234, 232); border-radius: 9px; padding: 8px; }
.doctor-system-item strong { font-size: 11px; line-height: 1.35; }
.doctor-system-item input, .doctor-ancillary-grid input { min-height: 36px; border: 1px solid rgb(207, 220, 217); border-radius: 9px; padding: 0px 9px; font-size: 11px; }
.doctor-ancillary-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.doctor-ancillary-grid input { width: 100%; margin-top: 6px; }
.physical-exam-report .document-logo { width: 58px; height: 58px; margin: 0px auto 5px; }
.physical-exam-report { max-width: 794px; margin: auto; }
@media (max-width: 1050px) {
  .doctor-vitals-grid, .doctor-signoff-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 820px) {
  .doctor-layout { grid-template-columns: 1fr; }
  .doctor-layout > * { min-width: 0px; }
  .doctor-history-grid { grid-template-columns: 1fr 1fr; }
  .doctor-system-grid { grid-template-columns: 1fr; }
  .doctor-system-item { grid-template-columns: minmax(0px, 1fr) 98px minmax(0px, 1fr); }
}
@media (max-width: 560px) {
  .doctor-vitals-grid, .doctor-signoff-grid, .doctor-ancillary-grid, .doctor-history-grid { grid-template-columns: 1fr; }
  .doctor-system-item { grid-template-columns: minmax(0px, 1fr) 92px; }
  .doctor-system-item input { grid-column: 1 / -1; }
  .doctor-form-section { padding: 14px; }
  .doctor-history-item { grid-template-columns: minmax(0px, 1fr) 88px; }
  .doctor-layout .result-actions { display: grid; grid-template-columns: 1fr; }
  .doctor-layout .result-actions button { width: 100%; }
}
@media (max-width: 1050px) {
  .drugtest-workflow-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .drugtest-layout .result-editor { padding: 15px; }
  .drugtest-workflow-grid { gap: 12px; }
  .drugtest-mode-option { min-height: 76px; }
  .drugtest-work-status { white-space: normal; max-width: 110px; }
  .drugtest-layout .result-actions { display: grid; grid-template-columns: 1fr; }
  .drugtest-layout .result-actions button { width: 100%; }
}
.agency-grid { align-items: start; }
.agency-card { position: relative; display: block; padding: 0px; min-height: 108px; overflow: visible; }
.agency-card-open { width: 100%; min-height: 108px; border: 0px; background: transparent; border-radius: 15px; padding: 22px 66px 22px 18px; display: flex; align-items: center; gap: 14px; text-align: left; color: var(--ink); }
.agency-card-open:hover { background: rgb(248, 251, 250); }
.agency-card-open h3 { margin: 0px; font-size: 18px; line-height: 1.25; overflow-wrap: anywhere; }
.agency-card-menu { position: absolute; right: 12px; top: 12px; z-index: 4; }
.agency-menu-button { width: 44px; height: 44px; border: 1px solid transparent; border-radius: 11px; background: transparent; color: var(--muted); font-size: 28px; line-height: 1; display: grid; place-items: center; }
.agency-menu-button:hover, .agency-menu-button[aria-expanded="true"] { background: rgb(237, 245, 243); color: var(--primary); border-color: var(--line); }
.agency-menu-dropdown { position: absolute; top: 48px; right: 0px; width: 158px; padding: 6px; background: rgb(255, 255, 255); border: 1px solid var(--line); border-radius: 11px; box-shadow: rgba(7, 63, 58, 0.18) 0px 14px 38px; display: grid; z-index: 8; }
.agency-menu-dropdown button { min-height: 42px; border: 0px; border-radius: 8px; background: transparent; padding: 0px 11px; text-align: left; font-weight: 700; color: var(--ink); }
.agency-menu-dropdown button:hover { background: rgb(242, 247, 246); }
.agency-menu-dropdown .danger-menu-item { color: var(--danger); }
.agency-records-modal { width: min(940px, 100%); }
.modal-subtitle { margin: 5px 0px 0px; color: var(--muted); font-size: 12px; }
.agency-month { border: 1px solid var(--line); border-radius: 13px; background: rgb(255, 255, 255); margin-top: 13px; overflow: hidden; }
.agency-month summary { min-height: 52px; padding: 0px 16px; display: flex; align-items: center; justify-content: space-between; gap: 16px; cursor: pointer; background: rgb(247, 250, 249); font-weight: 800; list-style: none; }
.agency-month summary::-webkit-details-marker { display: none; }
.agency-month summary::after { content: "+"; font-size: 20px; color: var(--primary); order: 3; }
.agency-month[open] summary::after { content: "−"; }
.agency-month summary b { margin-left: auto; color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; }
.agency-month-list { display: grid; }
.agency-result-row { display: grid; grid-template-columns: minmax(0px, 1fr) auto minmax(130px, auto); gap: 14px; align-items: center; padding: 14px 16px; border-top: 1px solid rgb(237, 242, 241); }
.agency-result-row:first-child { border-top: 0px; }
.agency-result-row strong, .agency-result-row small { display: block; }
.agency-result-row small { margin-top: 4px; color: var(--muted); font-size: 11px; }
.agency-result-unavailable { font-size: 11px; color: var(--muted); text-align: right; }
.agency-records-empty { height: 280px; }
@media (max-width: 680px) {
  .agency-card-open { padding: 18px 62px 18px 15px; }
  .agency-result-row { grid-template-columns: 1fr; gap: 9px; }
  .agency-result-row .status { width: max-content; }
  .agency-result-unavailable { text-align: left; }
  .agency-result-row .mini-button { width: 100%; min-height: 44px; }
  .agency-month summary { align-items: flex-start; flex-wrap: wrap; padding: 14px; }
  .agency-month summary b { margin-left: 0px; }
  .agency-month summary::after { margin-left: auto; }
}
.records-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.records-toolbar .records-search { margin: 0px; flex: 1 1 0%; max-width: 520px; }
.records-tabs button { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.records-tabs b { min-width: 22px; height: 22px; padding: 0px 6px; border-radius: 12px; background: rgba(7, 63, 58, 0.08); display: grid; place-items: center; font-size: 10px; }
.records-tabs button.active b { background: var(--primary-soft); color: var(--primary); }
.patient-record-card { display: flex; flex-direction: column; min-height: 230px; }
.patient-record-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.patient-record-card h3 { margin-top: 16px; }
.patient-record-services { margin-top: 14px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.patient-record-actions { display: flex; gap: 8px; margin-top: auto; padding-top: 18px; }
.patient-record-actions > * { flex: 1 1 0%; }
.records-empty { grid-column: 1 / -1; height: 320px; }
.patient-results-modal { width: min(880px, 100%); }
.patient-released-results { display: grid; gap: 12px; margin-top: 18px; }
.patient-result-document { border: 1px solid var(--line); border-radius: 14px; padding: 17px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.patient-result-document h3 { margin: 8px 0px 3px; }
.patient-result-document p { margin: 0px; color: var(--muted); font-size: 12px; }
.patient-result-file-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; max-width: 55%; }
.patient-result-file-actions a { text-decoration: none; }
.patient-results-empty { height: 280px; }
@media (max-width: 760px) {
  .records-toolbar { align-items: stretch; display: grid; }
  .records-toolbar .records-search { max-width: none; }
  .records-tabs { overflow: auto; }
  .records-tabs button { flex: 1 1 0%; justify-content: center; }
  .patient-result-document { align-items: stretch; flex-direction: column; }
  .patient-result-document > .primary { width: 100%; }
  .patient-result-file-actions { justify-content: flex-start; max-width: none; }
  .patient-result-file-actions a { width: 100%; white-space: normal; text-align: center; }
  .patient-record-actions { flex-direction: column; }
}
.topbar { height: 76px; justify-content: flex-end; }
.topbar:has(.top-actions.hidden) { height: 28px; }
@media (max-width: 820px) {
  .topbar, .topbar:has(.top-actions.hidden) { height: 68px; justify-content: space-between; }
}
.record-folders { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 12px; margin-bottom: 18px; }
.record-folder { min-height: 78px; border: 1px solid var(--line); border-radius: 8px; background: rgb(255, 255, 255); color: var(--ink); padding: 12px 14px; display: grid; grid-template-columns: 40px minmax(0px, 1fr) auto; align-items: center; gap: 11px; text-align: left; }
.record-folder:hover { border-color: rgb(168, 200, 193); background: rgb(248, 251, 250); }
.record-folder.active { border-color: var(--primary); background: var(--primary-soft); box-shadow: inset 0 0 0 1px var(--primary); }
.record-folder-icon { width: 40px; height: 40px; border-radius: 8px; background: rgb(237, 244, 242); color: var(--primary); display: grid; place-items: center; }
.record-folder.active .record-folder-icon { background: rgb(255, 255, 255); }
.record-folder-icon svg { width: 20px; }
.record-folder span, .record-folder strong, .record-folder small { display: block; min-width: 0px; }
.record-folder strong { font-size: 13px; }
.record-folder small { font-size: 11px; color: var(--muted); margin-top: 3px; }
.record-folder b { min-width: 27px; height: 27px; border-radius: 14px; background: rgb(237, 244, 242); color: var(--primary); display: grid; place-items: center; padding: 0px 7px; font-size: 11px; }
.record-folder.active b { background: rgb(255, 255, 255); }
.patient-record-card:not(:has(.patient-record-actions)) { min-height: 205px; }
@media (max-width: 760px) {
  .record-folders { display: flex; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
  .record-folder { min-width: 210px; }
  .patient-record-actions { flex-direction: column; }
}
.id-method-options { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-bottom: 14px; }
.id-method-option { min-height: 66px; border: 1px solid var(--line); border-radius: 9px; padding: 11px; display: flex; align-items: flex-start; gap: 9px; cursor: pointer; }
.id-method-option:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); }
.id-method-option input { width: 18px; height: 18px; min-height: 0px; flex: 0 0 auto; margin: 2px 0px 0px; }
.id-method-option span, .id-method-option strong, .id-method-option small { display: block; margin: 0px; }
.id-method-option strong { font-size: 12px; }
.id-method-option small { font-size: 10px; color: var(--muted); line-height: 1.4; margin-top: 3px; }
.id-camera-box { height: 240px; }
.id-camera-box canvas { object-fit: contain; background: rgb(21, 32, 30); }
#idCaptureCard.invalid { border-color: var(--danger); background: rgb(255, 248, 249); }
@media (max-width: 560px) {
  .id-method-options { grid-template-columns: 1fr; }
  .id-method-option { min-height: 60px; }
}
.queue-payment-cell { display: grid; gap: 7px; min-width: 132px; }
.cashier-confirm { min-height: 40px; border: 1px solid rgb(231, 199, 133); background: rgb(255, 248, 232); border-radius: 8px; padding: 7px 9px; display: flex; align-items: center; gap: 8px; color: rgb(128, 85, 11); cursor: pointer; font-size: 11px; font-weight: 800; }
.cashier-confirm:hover { background: rgb(255, 241, 207); }
.cashier-confirm input { width: 17px; height: 17px; min-height: 0px; flex: 0 0 auto; margin: 0px; }
.cashier-confirm span { margin: 0px; font-size: 11px; }
.cashier-confirm:has(input:focus-visible) { outline: rgba(11, 107, 97, 0.25) solid 3px; outline-offset: 2px; }
#cashierPaymentForm { display: grid; gap: 14px; margin-top: 20px; }
#cashierPaymentForm .modal-actions { margin-top: 4px; }
.inventory-report-controls { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 18px; padding: 16px 18px; border: 1px solid var(--line); border-radius: 8px; background: rgb(255, 255, 255); }
.inventory-report-controls > div { display: grid; gap: 7px; }
.inventory-report-controls > div > span { font-size: 11px; font-weight: 800; color: var(--muted); text-transform: uppercase; }
.inventory-filter-tabs button { min-height: 40px; }
.inventory-sales-stats { margin-top: 0px; }
.inventory-sales-stats .stat-card strong { font-size: 20px; }
.inventory-sales-panel { margin-bottom: 18px; }
.inventory-sales-panel .panel-head { margin-bottom: 14px; }
.inventory-sales-table td { vertical-align: top; }
.inventory-sales-table td small { display: block; margin-top: 3px; color: var(--muted); font-size: 10px; }
.inventory-section-heading { margin: 26px 0px 12px; }
.inventory-section-heading h3 { margin: 4px 0px 0px; }
@media (max-width: 820px) {
  .inventory-report-controls { align-items: stretch; display: grid; }
  .inventory-report-controls .segmented { overflow: auto; }
  .inventory-filter-tabs button { flex: 1 1 0%; white-space: nowrap; }
  .inventory-sales-stats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .inventory-report-controls { padding: 12px; }
  .inventory-sales-stats { grid-template-columns: 1fr 1fr; }
  .inventory-sales-stats .stat-card:first-child { grid-column: 1 / -1; }
  .inventory-sales-stats .stat-card strong { font-size: 18px; }
}
.portal-mode { background: rgb(243, 248, 246); overflow-x: hidden; }
.portal-mode .sidebar, .portal-mode .topbar, .portal-mode #typeChooser, .portal-mode .wizard-top { display: none !important; }
.portal-mode .main { width: 100%; max-width: 1120px; margin: 0px auto; padding: 28px 28px 56px; }
.portal-mode #page-register { display: block; }
.portal-mode .portal-intro { display: grid; grid-template-columns: 72px minmax(0px, 1fr); align-items: center; justify-content: start; gap: 18px; margin: 0px auto 24px; padding: 18px 20px; border-bottom: 1px solid var(--line); }
.portal-mode .portal-intro img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; }
.portal-mode .portal-intro h1 { margin: 3px 0px 5px; font-size: 26px; letter-spacing: 0px; }
.portal-mode .portal-intro p:not(.eyebrow) { margin: 0px; max-width: 720px; color: var(--muted); line-height: 1.5; }
.portal-mode .wizard, .portal-mode .form-panel, .portal-mode .form-grid, .portal-mode .service-layout { max-width: 100%; min-width: 0px; }
.portal-mode .wizard { max-width: 1040px; }
.portal-mode .form-grid > *, .portal-mode .service-layout > *, .portal-mode input, .portal-mode select { min-width: 0px; }
.portal-mode .steps { position: sticky; top: 0px; z-index: 8; min-width: 0px; box-shadow: rgba(21, 70, 63, 0.06) 0px 8px 22px; }
.portal-mode .steps li { min-width: 0px; }
.portal-mode .steps li b { min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-mode .form-panel { box-shadow: rgba(21, 70, 63, 0.05) 0px 8px 30px; }
@media (max-width: 820px) {
  .portal-mode .main { padding: 18px 16px 40px; }
  .portal-mode .portal-intro { grid-template-columns: 58px minmax(0px, 1fr); padding: 12px 4px 16px; }
  .portal-mode .portal-intro img { width: 58px; height: 58px; }
  .portal-mode .portal-intro h1 { font-size: 22px; }
  .portal-mode .steps { top: 0px; }
}
@media (max-width: 560px) {
  .portal-mode .main { padding: 12px 10px 34px; }
  .portal-mode .portal-intro { grid-template-columns: 48px minmax(0px, 1fr); gap: 11px; }
  .portal-mode .portal-intro img { width: 48px; height: 48px; }
  .portal-mode .portal-intro h1 { font-size: 19px; }
  .portal-mode .portal-intro p:not(.eyebrow) { font-size: 12px; }
  .portal-mode .steps { border-radius: 8px; }
  .portal-mode .form-panel { border-radius: 8px; }
  .portal-mode .wizard-actions { gap: 10px; }
  .portal-mode .wizard-actions .primary, .portal-mode .wizard-actions .secondary { min-height: 48px; }
}
.sidebar { height: 100dvh; overflow: hidden; }
.sidebar nav { flex: 1 1 0%; min-height: 0px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: rgba(202, 224, 220, 0.45) transparent; padding-right: 4px; margin-right: -4px; }
.sidebar nav::-webkit-scrollbar { width: 6px; }
.sidebar nav::-webkit-scrollbar-thumb { background: rgba(202, 224, 220, 0.45); border-radius: 999px; }
.sidebar-foot { flex: 0 0 auto; padding-bottom: max(0px,env(safe-area-inset-bottom)); }
.discount-fields { display: grid; grid-template-columns: minmax(220px, 0.55fr) minmax(0px, 1fr); gap: 18px; align-items: start; margin-top: 18px; }
.discount-id-card { border: 1px solid var(--line); border-radius: 14px; padding: 16px; background: rgb(255, 255, 255); }
.discount-id-card .capture-head { margin-bottom: 12px; }
.compact-upload { height: 154px; }
.compact-upload img { object-fit: contain; background: rgb(255, 255, 255); }
.discount-line { margin-top: 5px; padding-top: 10px; border-top: 1px dashed rgb(182, 204, 199); color: var(--green); font-weight: 800; }
.priority-badge { display: inline-flex; width: max-content; margin-top: 6px; border-radius: 12px; background: rgb(255, 240, 199); color: rgb(122, 82, 0); padding: 4px 7px; font-size: 9px; font-weight: 900; text-transform: uppercase; }
.priority-row { background: rgb(255, 253, 246); }
.priority-row .queue-no { background: rgb(255, 240, 199); color: rgb(122, 82, 0); }
@media (max-width: 700px) {
  .discount-fields { grid-template-columns: 1fr; }
}
.patient-discount-record { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin-top: 12px; padding-top: 10px; border-top: 1px solid rgb(237, 242, 241); font-size: 11px; }
.patient-discount-record .priority-badge { margin-top: 0px; }
.patient-discount-record a { margin-left: auto; color: var(--primary); font-weight: 800; }
.date-choice-field { display: grid; gap: 10px; align-content: start; }
.date-choice-field label { display: block; }
.date-choice-field select, .date-choice-field input { width: 100%; }
.type-card { display: flex; flex-direction: column; align-items: stretch; }
.card-link { position: static; margin-top: auto; padding-top: 20px; line-height: 1.35; }
.card-link svg { flex: 0 0 auto; }
.vitals-layout { grid-template-columns: 300px minmax(0px, 1fr); }
.vitals-work-status { font-size: 10px; font-weight: 800; text-transform: uppercase; text-align: right; }
.vitals-work-status.pending { color: var(--amber); }
.vitals-work-status.complete { color: var(--green); }
.vital-signs-form { margin-top: 18px; }
.vital-signs-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 14px; }
.vital-signs-grid label { display: block; min-width: 0px; }
.vital-signs-updated { margin: 14px 0px 0px; color: var(--muted); font-size: 11px; text-align: right; }
.doctor-section-head > span svg { width: 16px; }
.nurse-vitals-summary { grid-template-columns: repeat(4, minmax(0px, 1fr)); }
.nurse-vital-card { min-width: 0px; border: 1px solid rgb(216, 229, 226); border-radius: 10px; background: rgb(246, 250, 249); padding: 12px; }
.nurse-vital-card span, .nurse-vital-card strong, .nurse-vital-card small { display: block; }
.nurse-vital-card span { font-size: 10px; color: var(--muted); text-transform: uppercase; font-weight: 800; }
.nurse-vital-card strong { margin-top: 5px; font-size: 15px; overflow-wrap: anywhere; }
.nurse-vital-card small { margin-top: 2px; color: var(--muted); font-size: 10px; }
.vital-signs-required-note { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 12px; border: 1px solid rgb(239, 215, 168); border-radius: 10px; background: rgb(255, 248, 233); padding: 12px; color: rgb(128, 85, 11); }
.vital-signs-required-note strong, .vital-signs-required-note span { font-size: 11px; }
.vital-signs-required-note span { text-align: right; }
@media (max-width: 1050px) {
  .vital-signs-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
  .nurse-vitals-summary { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
}
@media (max-width: 820px) {
  .vitals-layout { grid-template-columns: 1fr; }
  .vitals-layout > * { min-width: 0px; }
}
@media (max-width: 560px) {
  .vital-signs-grid, .nurse-vitals-summary { grid-template-columns: 1fr; }
  .vitals-layout .result-actions { display: grid; grid-template-columns: 1fr; }
  .vitals-layout .result-actions button { width: 100%; }
  .vital-signs-required-note { display: grid; }
  .vital-signs-required-note span { text-align: left; }
}

/* Keep the complete navigation reachable on short screens. */
.sidebar{height:100vh;height:100dvh;overflow:hidden}
.sidebar nav{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(202,224,220,.45) transparent;padding-right:4px;margin-right:-4px}
.sidebar nav::-webkit-scrollbar{width:6px}
.sidebar nav::-webkit-scrollbar-thumb{background:rgba(202,224,220,.45);border-radius:999px}
.sidebar-foot{flex:none;padding-bottom:max(0px,env(safe-area-inset-bottom))}

/* Secure authentication and role administration */
.auth-pending .app-shell{visibility:hidden}
.auth-locked .app-shell{display:none}
.auth-screen{min-height:100vh;display:grid;place-items:center;padding:24px;background:#edf5f2}
.auth-screen.hidden{display:none}
.auth-panel{width:min(500px,100%);background:#fff;border:1px solid var(--line);border-radius:8px;padding:32px;box-shadow:0 18px 50px rgba(11,64,57,.14)}
.auth-brand{display:flex;align-items:center;gap:13px;padding-bottom:22px;margin-bottom:26px;border-bottom:1px solid var(--line)}
.auth-brand img{width:58px;height:58px;object-fit:contain}
.auth-brand strong,.auth-brand small{display:block}.auth-brand strong{font-size:18px;color:#143e38}.auth-brand small{margin-top:3px;color:var(--muted)}
.auth-panel h1{font-size:27px;margin:5px 0 8px;letter-spacing:0}.auth-copy{color:var(--muted);line-height:1.55;margin:0 0 22px}
.auth-panel form{display:grid;gap:16px}.auth-panel label>span{display:block;font-weight:700;font-size:13px;margin-bottom:7px}.auth-panel label>small{display:block;color:var(--muted);margin-top:6px}
.auth-submit{width:100%;min-height:48px;justify-content:center;margin-top:2px}.auth-error{padding:11px 13px;border:1px solid #e2a39d;background:#fff2f0;color:#8b2821;border-radius:7px;font-size:13px;line-height:1.45}
.password-control{display:grid;grid-template-columns:minmax(0,1fr) 48px;align-items:stretch}.password-control input{border-radius:7px 0 0 7px}.password-hold{min-width:48px;min-height:46px;border:1px solid var(--line);border-left:0;border-radius:0 7px 7px 0;background:#f7fbfa;color:#255b53;display:grid;place-items:center;cursor:pointer;touch-action:manipulation}.password-hold:active,.password-hold.is-revealing{background:#dcefea;color:#0b6b61}.password-hold svg{width:19px;height:19px}.auth-link{justify-self:center;min-height:44px}.auth-divider{display:flex;align-items:center;gap:12px;margin:20px 0 14px;color:var(--muted);font-size:12px}.auth-divider:before,.auth-divider:after{content:"";height:1px;background:var(--line);flex:1}.oauth-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.oauth-button{min-height:46px;border:1px solid var(--line);border-radius:7px;color:#173f39;background:#fff;display:flex;align-items:center;justify-content:center;gap:9px;font-weight:700;text-decoration:none;transition:background .18s ease,border-color .18s ease}.oauth-button:hover,.oauth-button:focus-visible{background:#f3faf8;border-color:#75afa5}.oauth-mark{font-size:16px;font-weight:800}.oauth-mark.facebook{color:#1877f2}.mfa-options{display:grid;gap:10px}.mfa-options>button:not(#skipMfaButton){width:100%;min-height:66px;border:1px solid var(--line);background:#fff;border-radius:7px;padding:12px;display:grid;grid-template-columns:36px 1fr;gap:10px;text-align:left;align-items:center;color:#173f39;cursor:pointer}.mfa-options>button:not(#skipMfaButton):hover,.mfa-options>button:not(#skipMfaButton):focus-visible{background:#f3faf8;border-color:#75afa5}.mfa-options svg{width:22px;height:22px}.mfa-options strong,.mfa-options small{display:block}.mfa-options small{margin-top:3px;color:var(--muted);line-height:1.4}.auth-code-box{padding:14px;border:1px solid var(--line);background:#f5faf8;border-radius:7px;margin-bottom:14px}.auth-code-box span,.auth-code-box small{display:block;color:var(--muted)}.auth-code-box strong{display:block;margin:8px 0;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:16px;overflow-wrap:anywhere;letter-spacing:0}.auth-countdown{display:block;text-align:center;color:var(--muted)}
.staff-identity{min-width:0;flex:1}.staff-identity strong,.staff-identity small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sidebar-logout{width:40px;height:40px;flex:0 0 40px;border:0;border-radius:7px;display:grid;place-items:center;background:rgba(255,255,255,.1);color:#fff;cursor:pointer}.sidebar-logout:hover{background:rgba(255,255,255,.18)}.sidebar-logout svg{width:18px;height:18px}
.top-settings-button{margin-left:auto;width:44px;height:44px;flex:0 0 44px;border:1px solid rgba(11,107,97,.16);background:#fff;color:#0b6b61;box-shadow:0 6px 16px rgba(7,63,58,.08)}.top-settings-button:hover{background:#edf7f4;color:#07574f;transform:translateY(-1px)}.top-settings-button svg{width:20px;height:20px}
.settings-section{border:1px solid #d9e8e4;border-radius:12px;background:#fbfefd;padding:16px;margin:14px 0}.settings-section h3{margin:0 0 12px;color:#11443c;font-size:15px}.settings-section form{display:grid;gap:12px}.settings-section label{display:grid;gap:6px}.settings-section label>span{font-size:12px;font-weight:700;color:#41645e}.settings-section input,.settings-section select{min-height:42px}.settings-section+.settings-section{margin-top:12px}.settings-actions{display:flex;flex-wrap:wrap;gap:8px}.settings-actions .secondary,.settings-actions .danger-button,.settings-actions .text-button{min-height:40px}.user-settings-modal{max-width:700px}.modal.small-modal:has(.settings-section){max-width:680px}.modal.small-modal:has(.settings-section) .modal-actions{border-top:1px solid #d9e8e4;padding-top:16px;margin-top:18px}.modal.small-modal:has(.settings-section) .danger-button{background:#a63f42}.xray-duty-signatory{margin-bottom:18px}
.xray-report-mark img{display:block;width:100%;height:100%;object-fit:contain}
.xray-report-mark{border:0!important}
.modal.small-modal:has(.settings-section){width:min(760px,100%);max-width:760px;padding:0;overflow:auto;background:#f5f8f7;border:1px solid #d7e4e1;border-radius:16px}.modal.small-modal:has(.settings-section) .modal-head{position:sticky;top:0;z-index:5;margin:0;padding:22px 24px 18px;background:rgba(255,255,255,.98);border-bottom:1px solid #dbe7e4;box-shadow:0 5px 16px rgba(9,57,51,.06);backdrop-filter:blur(10px)}.modal.small-modal:has(.settings-section) .modal-head .icon-button{width:44px;height:44px;flex:0 0 44px;background:#f6faf9;border:1px solid #d2e2de;color:#174d45}.modal.small-modal:has(.settings-section) .settings-section{margin:16px 24px 0;padding:20px;background:#fff;border-color:#d7e5e1;border-radius:8px;box-shadow:0 3px 12px rgba(9,57,51,.04)}.modal.small-modal:has(.settings-section) .settings-section h3{font-size:16px;margin-bottom:14px}.modal.small-modal:has(.settings-section) .settings-section input,.modal.small-modal:has(.settings-section) .settings-section select{min-height:46px;border-radius:7px}.modal.small-modal:has(.settings-section) .settings-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.modal.small-modal:has(.settings-section) .settings-security-option{display:flex;align-items:center;justify-content:flex-start;gap:9px;text-align:left;padding:10px 12px}.settings-security-option svg{width:18px;height:18px;flex:0 0 18px}.settings-security-option span{display:grid;gap:2px}.settings-security-option strong{font-size:13px}.settings-security-option small{font-size:10px;line-height:1.35;color:var(--muted)}.modal.small-modal:has(.settings-section) .modal-actions{position:sticky;bottom:0;z-index:4;margin:16px 0 0;padding:16px 24px 20px;background:rgba(255,255,255,.98);border-top:1px solid #dbe7e4;box-shadow:0 -5px 16px rgba(9,57,51,.05)}
@media(max-width:640px){.modal.small-modal:has(.settings-section){max-height:calc(100dvh - 12px);border-radius:12px}.modal.small-modal:has(.settings-section) .modal-head{padding:16px}.modal.small-modal:has(.settings-section) .settings-section{margin:12px 14px 0;padding:16px}.modal.small-modal:has(.settings-section) .settings-actions{grid-template-columns:1fr}.modal.small-modal:has(.settings-section) .modal-actions{padding:14px}}
.modal.small-modal:has(.settings-section) #linkGoogleAccount,.modal.small-modal:has(.settings-section) #linkFacebookAccount,.modal.small-modal:has(.settings-section) #unlinkGoogleAccount,.modal.small-modal:has(.settings-section) #unlinkFacebookAccount{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;text-decoration:none}.modal.small-modal:has(.settings-section) .oauth-mark{display:inline-grid;place-items:center;width:22px;height:22px;font-size:16px;line-height:1;font-weight:800;border-radius:50%;font-family:Arial,sans-serif}.modal.small-modal:has(.settings-section) .oauth-mark.google{color:#4285f4;background:#eef4ff}.modal.small-modal:has(.settings-section) .oauth-mark.facebook{color:#1877f2;background:#eaf2ff}.modal.small-modal:has(.settings-section) #settingsLogoutButton{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px}.modal.small-modal:has(.settings-section) #settingsLogoutButton svg{width:18px;height:18px;flex:0 0 18px}.modal.small-modal:has(.settings-section) .settings-actions>.danger-button{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.user-access-table td:last-child{text-align:right}.user-role-badge,.user-status-badge{display:inline-flex;align-items:center;min-height:26px;padding:4px 9px;border-radius:999px;font-size:11px;font-weight:800}.user-role-badge{background:#e7f3f0;color:#0b6b61}.user-status-badge.active{background:#e9f5e8;color:#286c31}.user-status-badge.inactive{background:#f1f2f2;color:#66706e}.user-action-group{display:flex;justify-content:flex-end;gap:7px}.user-action-group button{min-height:36px}
.access-denied{min-height:55vh;display:grid;place-items:center;text-align:center;padding:30px}.access-denied>div{max-width:460px}.access-denied h2{margin:13px 0 7px}.access-denied p{color:var(--muted);line-height:1.55}.access-denied svg{width:42px;height:42px;color:#0b6b61}
@media(max-width:640px){.auth-screen{padding:14px}.auth-panel{padding:24px 20px}.auth-panel h1{font-size:24px}.oauth-actions{grid-template-columns:1fr}.mfa-options>button:not(#skipMfaButton){min-height:72px}}

#queueFilters{flex-wrap:wrap}
#queueFilters [data-filter="registered"]{gap:7px}
#registeredQueueCount{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:rgba(104,74,170,.12);color:#684aaa;font-size:11px}
#queueFilters [data-filter="registered"].active #registeredQueueCount{background:rgba(255,255,255,.22);color:inherit}

.patient-edit-modal{width:min(780px,100%)}.patient-edit-notice{margin:18px 0}.patient-edit-grid{margin-top:16px}.patient-edit-route-section{border-top:1px solid var(--line);margin-top:22px;padding-top:22px}.patient-edit-route-section .form-heading{margin-bottom:4px}.patient-edit-route-section .form-heading .number{width:auto;min-width:38px;padding:0 8px;font-size:10px}.edit-error-summary{border:1px solid #e7a9b0;background:#fff4f5;color:#9c2d39;border-radius:12px;padding:13px 15px;margin:14px 0}.edit-error-summary ul{margin:7px 0 0;padding-left:18px;font-size:12px}.patient-record-actions .secondary svg{width:16px}
@media(max-width:560px){.patient-edit-modal{width:100%}.patient-edit-route-section{margin-top:18px;padding-top:18px}.patient-edit-notice{padding:14px}.patient-edit-grid{margin-top:12px}}

/* Laboratory result signatories: two MedTechs above one full-width pathologist. */
.signature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px}
.signature-grid>div{min-width:0}
.signature-grid small{display:block;margin-top:3px;font-size:.9em}
.signature-grid span{display:block;margin-top:3px;font-weight:800}
.signature-pathologist{grid-column:1/-1;justify-self:center;width:min(100%,390px);margin-top:16px}
.signature-pathologist strong{white-space:nowrap}
.laboratory-result.paper-a5 .signature-pathologist{width:min(100%,340px);margin-top:10px}
@media(max-width:560px){.signature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.signature-pathologist{grid-column:1/-1;width:min(100%,340px)}}

/* Realtime notification center, transition curtain, and responsive sizing. */
.global-loader{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;overflow:hidden;background:#fff;opacity:1;visibility:visible;isolation:isolate;transition:opacity .42s cubic-bezier(.4,0,.2,1),visibility .42s ease}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.global-loader.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
.is-loading{overflow:hidden}
.opening-ecg{position:absolute;left:0;top:50%;z-index:-1;width:100%;height:clamp(130px,20vw,220px);transform:translateY(-50%);overflow:visible}
.opening-ecg-track,.opening-ecg-line{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.opening-ecg-track{stroke:#dcefeb;stroke-width:2}
.opening-ecg-line{stroke:#0b7b70;stroke-width:3;stroke-dasharray:1700;stroke-dashoffset:1700;filter:drop-shadow(0 0 5px rgba(11,123,112,.24));animation:opening-ecg-draw 2.15s cubic-bezier(.3,.7,.3,1) .12s forwards}
.opening-mark{position:relative;width:clamp(190px,24vw,250px);aspect-ratio:1.1;display:grid;place-items:center;opacity:0;transform:scale(.82);animation:opening-mark-in .65s cubic-bezier(.18,.82,.24,1.18) .38s forwards}
.opening-heart{position:absolute;inset:0;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 12px 24px rgba(180,37,53,.14));animation:opening-heartbeat 1.15s ease-in-out 1.05s infinite}
.opening-heart path{fill:rgba(255,255,255,.94);stroke:#c3283b;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:620;stroke-dashoffset:620;animation:opening-heart-draw .9s ease-out .45s forwards}
.opening-logo{position:relative;width:clamp(88px,11vw,112px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;padding:8px;background:#fff;border:1px solid rgba(9,90,83,.14);box-shadow:0 12px 32px rgba(10,77,71,.16);opacity:0;transform:scale(.7) rotate(-5deg);animation:opening-logo-in .62s cubic-bezier(.18,.82,.24,1.18) .82s forwards}
.opening-logo img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.opening-copy{position:absolute;top:calc(50% + clamp(128px,15vw,154px));left:50%;width:min(92vw,520px);display:grid;justify-items:center;text-align:center;transform:translate(-50%,16px);opacity:0;animation:opening-copy-in .55s ease-out 1.18s forwards}
.opening-copy strong{color:#073f3a;font-size:clamp(24px,3.4vw,38px);line-height:1.1;font-weight:800}
.opening-copy span{margin-top:6px;color:#0b7b70;font-size:clamp(11px,1.3vw,14px);font-weight:800;text-transform:uppercase;letter-spacing:.16em}
.opening-copy small{margin-top:11px;color:#65807c;font-size:13px}
.opening-pulse{position:absolute;left:50%;top:50%;z-index:-2;width:220px;aspect-ratio:1;border:1px solid rgba(11,123,112,.2);border-radius:50%;opacity:0;transform:translate(-50%,-50%) scale(.5);animation:opening-pulse-ring 1.9s ease-out .85s infinite}
.opening-pulse-two{animation-delay:1.45s}
@keyframes opening-ecg-draw{0%{stroke-dashoffset:1700;opacity:.2}16%{opacity:1}100%{stroke-dashoffset:0;opacity:1}}
@keyframes opening-mark-in{to{opacity:1;transform:scale(1)}}
@keyframes opening-heart-draw{to{stroke-dashoffset:0}}
@keyframes opening-logo-in{to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes opening-heartbeat{0%,32%,100%{transform:scale(1)}12%{transform:scale(1.035)}20%{transform:scale(.995)}}
@keyframes opening-copy-in{to{opacity:1;transform:translate(-50%,0)}}
@keyframes opening-pulse-ring{0%{opacity:.36;transform:translate(-50%,-50%) scale(.55)}75%,100%{opacity:0;transform:translate(-50%,-50%) scale(1.9)}}
@media(max-width:600px){.opening-ecg{width:170%;left:-35%;height:138px}.opening-mark{width:190px}.opening-copy{top:calc(50% + 116px)}.opening-copy small{font-size:12px}}
@media(prefers-reduced-motion:reduce){.global-loader{transition:opacity .15s ease,visibility .15s ease}.opening-ecg-line,.opening-mark,.opening-heart,.opening-heart path,.opening-logo,.opening-copy,.opening-pulse{animation:none}.opening-ecg-line{stroke-dashoffset:0}.opening-mark,.opening-logo,.opening-copy{opacity:1;transform:none}.opening-copy{transform:translate(-50%,0)}}

.notification-center{position:relative;margin-left:auto;flex:0 0 auto}
.notification-button{position:relative}
.notification-badge{position:absolute;top:-5px;right:-5px;display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border:2px solid var(--canvas);border-radius:999px;background:var(--danger);color:#fff;font-size:10px;line-height:1}
.notification-panel{position:absolute;z-index:90;top:calc(100% + 10px);right:0;width:min(390px,calc(100vw - 28px));max-height:min(560px,calc(100dvh - 100px));overflow:hidden;border:1px solid var(--line);border-radius:8px;background:#fff;box-shadow:0 18px 50px rgba(15,54,49,.18)}
.notification-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:17px 17px 12px}
.notification-head h2{margin:3px 0 0;font-size:18px;letter-spacing:0}
.notification-toolbar{display:flex;justify-content:flex-end;gap:16px;padding:0 17px 11px;border-bottom:1px solid var(--line)}
.notification-toolbar .text-button{min-height:32px;font-size:11px}
.notification-list{max-height:420px;overflow-y:auto;overscroll-behavior:contain}
.notification-item{display:grid;grid-template-columns:minmax(0,1fr) 38px;align-items:start;border-bottom:1px solid #edf2f1;background:#fff}
.notification-item.unread{background:#f1f8f6}
.notification-main{min-width:0;border:0;background:transparent;display:grid;grid-template-columns:8px minmax(0,1fr);gap:10px;padding:14px 8px 14px 16px;text-align:left;color:var(--ink)}
.notification-main strong,.notification-main small{display:block;overflow-wrap:anywhere}
.notification-main strong{font-size:12px;line-height:1.45}
.notification-main small{margin-top:4px;color:var(--muted);font-size:10px}
.notification-dot{width:7px;height:7px;margin-top:5px;border-radius:50%;background:transparent}
.notification-item.unread .notification-dot{background:var(--primary)}
.notification-dismiss{width:34px;height:34px;margin:9px 4px 0 0;border:0;background:transparent}
.notification-dismiss svg{width:15px;height:15px}
.notification-empty{padding:34px 18px;text-align:center;color:var(--muted);font-size:12px}

/* Keep icons bounded inside every interactive surface. */
[data-icon]{display:inline-grid;place-items:center;flex:0 0 auto;line-height:0}
[data-icon]>svg,.icon-button svg,.nav-item svg,.primary svg,.secondary svg,.light-button svg,.text-button svg,.back-link svg{display:block;width:18px;height:18px;max-width:22px;max-height:22px;flex:0 0 auto}
.nav-item [data-icon],.nav-item [data-icon]>svg{width:19px;height:19px}
.stat-icon{width:46px;height:46px;flex:0 0 46px;border-radius:12px}
.stat-icon [data-icon]>svg{width:21px;height:21px}
.quick-icon,.quick-icon [data-icon]>svg{flex:0 0 auto}
.quick-icon [data-icon]>svg,.quick-icon>svg{width:19px;height:19px}
.type-card .type-icon{width:50px;height:50px;flex:0 0 50px}
.type-card .type-icon>svg{width:24px;height:24px}
.upload-box>svg,.capture-head>svg,.media-placeholder>svg,.empty-state>svg,.empty-state>[data-icon]>svg{width:32px!important;height:32px!important;max-width:32px!important;max-height:32px!important}
.capture-head>svg{width:22px!important;height:22px!important;max-width:22px!important;max-height:22px!important}

/* Specialized workspaces follow the Admin dashboard's natural proportions. */
.page.active{align-content:start}
.stats-grid,.dashboard-grid,.results-layout,.type-cards{align-items:start;align-content:start}
.stat-card{min-height:84px;align-self:start;padding:16px;border-radius:8px}
.stat-card>div:last-child{min-width:0}
.stat-card strong{font-size:24px;line-height:1.1}
.panel,.type-card,.quick-action,.work-item{align-self:start}
.results-layout{align-items:start}
.results-layout>.panel{height:auto;min-height:0}
.result-editor{min-height:0}
.empty-state{height:auto;min-height:220px;padding:28px 16px}
.worklist .empty-state{min-height:180px}
.records-empty,.agency-records-empty,.package-empty,.patient-results-empty{height:auto;min-height:190px}
.quick-panel{height:auto}
.quick-action{min-height:70px;padding:14px 2px}
.type-card{min-height:260px;border-radius:8px}

.service-view-toggle{display:flex;width:max-content;max-width:100%;margin:0 0 12px}
.service-view-toggle button{min-height:40px;padding:0 13px}
.service-view-toggle b{display:inline-grid;place-items:center;min-width:20px;height:20px;margin-left:5px;padding:0 5px;border-radius:999px;background:rgba(11,107,97,.12);font-size:10px}
.service-view-toggle .active b{background:rgba(255,255,255,.22)}
.wizard-actions{position:sticky;bottom:0;z-index:12;margin:20px -8px 0;padding:12px 8px max(12px,env(safe-area-inset-bottom));border-top:1px solid var(--line);background:rgba(244,248,247,.96);backdrop-filter:blur(8px)}
.portal-mode .wizard-actions{background:rgba(243,248,246,.97)}

@media(max-width:900px){
  .main{padding-left:22px;padding-right:22px}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dashboard-grid{grid-template-columns:1fr}
  .results-layout,.xray-layout,.drugtest-layout,.doctor-layout,.vitals-layout{grid-template-columns:1fr}
  .worklist{width:100%}
}
@media(max-width:640px){
  .main{padding-left:14px;padding-right:14px;padding-bottom:28px}
  .topbar{height:72px;gap:10px}
  .notification-center{margin-left:auto}
  .notification-panel{position:fixed;top:68px;right:10px;left:10px;width:auto;max-height:calc(100dvh - 82px)}
  .notification-list{max-height:calc(100dvh - 190px)}
  .stats-grid{grid-template-columns:1fr 1fr;gap:10px}
  .stat-card{display:flex;min-height:78px;padding:12px;gap:10px}
  .stat-icon{width:38px;height:38px;flex-basis:38px}
  .stat-icon [data-icon]>svg{width:18px;height:18px}
  .stat-card strong{font-size:20px}
  .stat-card small{display:none}
  .panel{padding:16px;border-radius:8px}
  .type-cards{grid-template-columns:1fr;gap:12px}
  .type-card{min-height:0;padding:18px}
  .type-card .type-icon{width:44px;height:44px;flex-basis:44px;margin-bottom:14px}
  .card-link{padding-top:14px}
  .empty-state{min-height:170px}
  .wizard-actions{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;margin-left:-4px;margin-right:-4px;padding-left:4px;padding-right:4px}
  .wizard-actions>div{display:flex;justify-content:flex-end;gap:8px;min-width:0}
  .wizard-actions .save-note{display:none}
  .wizard-actions button{min-height:46px;white-space:nowrap}
  #nextStep,#submitRegistration{flex:1;max-width:240px}
  .service-view-toggle{width:100%;display:grid;grid-template-columns:1fr 1fr}
  .service-view-toggle button{min-width:0;padding:0 8px}
}
@media(max-width:390px){
  .stats-grid{grid-template-columns:1fr}
  .stat-card{min-height:72px}
  .wizard-actions{grid-template-columns:86px minmax(0,1fr)}
  .wizard-actions .secondary,.wizard-actions .primary{padding-left:10px;padding-right:10px;font-size:12px}
}

/* Laboratory result paper formats: A4 portrait for every result, with general
   laboratory reports occupying the upper half and leaving a cut gap below. */
.laboratory-result.paper-a4-half{width:100%;max-width:794px;min-height:124mm;margin:0 auto 14mm;}
.laboratory-result.paper-a4-half .document-logo{width:58px;height:58px;margin-bottom:4px}
.laboratory-result.paper-a4-half .result-brand{padding-bottom:6px}
.laboratory-result.paper-a4-half .result-brand h2{font-size:15px;line-height:1.15}
.laboratory-result.paper-a4-half .result-brand p{font-size:7px;margin:2px 0}
.laboratory-result.paper-a4-half .result-patient-grid{gap:3px 14px;margin:9px 0;font-size:8px}
.laboratory-result.paper-a4-half .result-patient-line{padding:3px 0}
.laboratory-result.paper-a4-half .result-patient-line span{min-width:70px}
.laboratory-result.paper-a4-half .result-section-title{padding:5px;font-size:11px;letter-spacing:.04em}
.laboratory-result.paper-a4-half .print-result-table th,
.laboratory-result.paper-a4-half .print-result-table td{padding:3px 4px;font-size:8px;line-height:1.2}
.laboratory-result.paper-a4-half .print-result-table th{padding:3px 4px;font-size:7.5px;line-height:1.2}
.laboratory-result.paper-a4-half .print-result-table tbody td:first-child{font-size:9.5px;font-weight:700}
.laboratory-result.paper-a4-half .print-result-table tbody td:nth-child(2){font-size:10.5px;font-weight:800;color:#073f39;background:#f0f8f6}
.laboratory-result.paper-a4-half .result-remarks{padding:5px 0;font-size:7px}
.laboratory-result.paper-a4-half .signature-grid{gap:5px 10px;margin-top:10px;font-size:6.5px}
.laboratory-result.paper-a4-half .signature-grid strong{font-size:7px;padding-bottom:2px}
.laboratory-result.paper-a4-half .signature-pathologist{margin-top:6px;width:min(100%,340px)}
.laboratory-result.paper-a4-half .result-validity{font-size:6px;margin-top:5px}
.laboratory-result.lab-chemistry-result{padding:5mm}
.laboratory-result.lab-chemistry-result .document-logo{width:48px;height:48px;margin-bottom:3px}
.laboratory-result.lab-chemistry-result .result-brand{padding-bottom:5px}
.laboratory-result.lab-chemistry-result .result-brand h2{font-size:15px;line-height:1.1}
.laboratory-result.lab-chemistry-result .result-brand p{font-size:7px;margin:1px 0}
.laboratory-result.lab-chemistry-result .result-patient-grid{gap:2px 14px;margin:7px 0;font-size:8px}
.laboratory-result.lab-chemistry-result .result-patient-line{padding:2px 0}
.laboratory-result.lab-chemistry-result .result-section-title{padding:4px;font-size:9px}
.laboratory-result.lab-chemistry-result .print-result-table th,
.laboratory-result.lab-chemistry-result .print-result-table td{padding:1.5px 2px;font-size:6.5px;line-height:1.05}
.laboratory-result.lab-chemistry-result .result-remarks{padding:4px 0;font-size:7px}
.laboratory-result.lab-chemistry-result .signature-grid{gap:5px 10px;margin-top:9px;font-size:6.5px}
.laboratory-result.lab-chemistry-result .signature-grid strong{font-size:7px;padding-bottom:2px}
.laboratory-result.lab-chemistry-result .signature-pathologist{margin-top:5px;width:min(100%,340px)}
.laboratory-result.lab-chemistry-result .result-validity{font-size:6px;margin-top:4px}
@media print{
  .paper-size-note{display:none!important}
  #resultPreview .laboratory-result.paper-a4-half{min-height:124mm;height:124mm;break-inside:avoid;page-break-inside:avoid;margin:0 0 14mm;}
  #resultPreview .laboratory-result.paper-a4{min-height:273mm;break-inside:avoid;page-break-inside:avoid;margin:0;}
}

#resultPreview .paper-size-note{display:none!important}
#resultPreview .physical-exam-report,
#resultPreview .pe-print{width:100%;max-width:100%;min-width:0;box-sizing:border-box;overflow:hidden}
#resultPreview .pe-print table{width:100%;max-width:100%;min-width:0;table-layout:fixed}
#resultPreview .pe-print th,
#resultPreview .pe-print td{min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere;word-break:break-word}
#resultPreview .result-brand h2{white-space:nowrap;font-size:17px;line-height:1.1}
#resultPreview .pregnancy-result-header .result-brand h2{font-size:16px}
@media (max-width:700px){
  #resultPreview .result-brand h2{font-size:clamp(11px,3.1vw,16px)}
  #resultPreview .pregnancy-result-header .result-brand h2{font-size:clamp(10px,2.9vw,15px)}
}

/* Final interaction and theme pass: compact role navigation, stable actions,
   and token-driven dark mode without layout changes. */
:root[data-theme="dark"]{
  color-scheme:dark;--primary:#4fc5b5;--primary-2:#68d6c6;--primary-soft:#173f3a;--ink:#e8f4f1;--muted:#a8c0bb;--line:#2c4d48;--surface:#142b29;--canvas:#0b1d1c;--accent:#ee9a67;--danger:#f07c88;--blue:#7bbbe2;--amber:#e9bd63;--green:#7ed3a5;--shadow:0 12px 35px rgba(0,0,0,.24)
}
:root[data-theme="dark"] body{background:var(--canvas);color:var(--ink)}
:root[data-theme="dark"] .main,:root[data-theme="dark"] .auth-screen{background:var(--canvas)}
:root[data-theme="dark"] .panel,:root[data-theme="dark"] .stat-card,:root[data-theme="dark"] .secondary,:root[data-theme="dark"] .light-button,:root[data-theme="dark"] .icon-button,:root[data-theme="dark"] .notification-panel,:root[data-theme="dark"] .notification-item,:root[data-theme="dark"] .modal,:root[data-theme="dark"] .auth-panel,:root[data-theme="dark"] .oauth-button,:root[data-theme="dark"] .mfa-options>button:not(#skipMfaButton){background:var(--surface);color:var(--ink);border-color:var(--line)}
:root[data-theme="dark"] input,:root[data-theme="dark"] select,:root[data-theme="dark"] textarea{background:#102522;color:var(--ink);border-color:var(--line)}
:root[data-theme="dark"] .notification-item.unread,:root[data-theme="dark"] .quick-action:hover,:root[data-theme="dark"] .oauth-button:hover,:root[data-theme="dark"] .oauth-button:focus-visible{background:#1b403b}
:root[data-theme="dark"] .notification-main{color:var(--ink)}
:root[data-theme="dark"] .notification-main small,:root[data-theme="dark"] .notification-empty,:root[data-theme="dark"] .audit-details{color:var(--muted)}
:root[data-theme="dark"] .auth-brand strong,:root[data-theme="dark"] .auth-panel h1{color:var(--ink)}
:root[data-theme="dark"] .table-panel table th{background:#173b37;color:var(--ink)}
:root[data-theme="dark"] .table-panel table td{border-color:var(--line)}
:root[data-theme="dark"] .global-loader{background:#0b1d1c}
.theme-toggle{flex:0 0 42px;align-self:center}
.theme-toggle svg{width:18px;height:18px}
.topbar{position:relative;align-items:center}
.topbar #registrationTopActions{order:1;margin-right:auto}.topbar #notificationCenter{order:2;margin-left:0;margin-right:-12px}.topbar #topSettingsButton{order:3;margin-left:8px}.topbar #registrationTopActions.hidden{display:none}
.notification-center,.theme-toggle,.top-actions{align-self:center}
.notification-panel{top:calc(100% + 8px)}
/* Keep the shared action row aligned on workspaces without a New patient action. */
.topbar:has(.top-actions.hidden){height:76px;justify-content:flex-end}
@media(max-width:820px){
  .topbar:has(.top-actions.hidden){height:68px;justify-content:space-between}
}
.sidebar nav{flex:0 1 auto;max-height:calc(100dvh - 190px);align-content:start;overflow-y:auto}
.sidebar nav,.main{scrollbar-width:none;-ms-overflow-style:none}
.sidebar nav::-webkit-scrollbar,.main::-webkit-scrollbar{display:none;width:0;height:0}
html{scrollbar-width:none;-ms-overflow-style:none}
html::-webkit-scrollbar{display:none;width:0;height:0}
.nav-item{min-height:46px}
.audit-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 16px;flex-wrap:wrap}
.audit-toolbar .segmented{display:flex;gap:4px;flex-wrap:wrap}
.audit-toolbar .segmented button{min-height:40px;padding:0 12px}
.audit-table td{vertical-align:top;font-size:12px}
.audit-table td strong,.audit-table td small{display:block}
.audit-table td small{margin-top:4px;color:var(--muted);font-size:10px;overflow-wrap:anywhere}
.audit-details{max-width:360px;white-space:normal;overflow-wrap:anywhere;color:var(--muted);font-size:11px}
.audit-category{display:inline-flex;align-items:center;min-height:24px;padding:3px 8px;border-radius:999px;background:var(--primary-soft);color:var(--primary);font-size:10px;font-weight:800;white-space:nowrap}
.audit-category.authentication{background:rgba(48,118,169,.14);color:var(--blue)}
.audit-category.patients-results{background:rgba(39,128,94,.14);color:var(--green)}
.audit-category.administration{background:rgba(217,107,56,.14);color:var(--accent)}
.audit-category.security{background:rgba(196,61,75,.14);color:var(--danger)}
@media(max-width:640px){.topbar{height:68px}.notification-panel{top:60px}.theme-toggle{width:40px;height:40px}.audit-toolbar{align-items:stretch}.audit-toolbar .segmented{width:100%;overflow-x:auto;flex-wrap:nowrap}.audit-toolbar .segmented button{white-space:nowrap}.audit-toolbar>#refreshAuditLogs{width:100%}}
.xray-signature-dual strong{white-space:nowrap;font-weight:600}.xray-signature-dual em{font-style:normal;font-weight:400}

/* Keep MFA setup QR compact inside the scrollable Settings modal. */
.modal.small-modal:has(.settings-section) #settingsTotpQr{display:grid;justify-items:start;gap:8px}
.modal.small-modal:has(.settings-section) #settingsTotpQrImage{width:180px;height:180px;max-width:100%;object-fit:contain;background:#fff;border:1px solid #d9e8e4;border-radius:8px}

/* SuperAdmin recovery and browser continuity controls. */
.recovery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
.recovery-panel{display:flex;flex-direction:column;gap:16px;min-height:248px}
.recovery-panel>.panel-head,.offline-control-panel>.panel-head{margin-bottom:0}
.recovery-panel>p,.offline-control-panel>div:first-child>p{margin:0;color:var(--muted);line-height:1.6}
.recovery-panel>.primary{align-self:flex-start;margin-top:auto}
.recovery-status{display:inline-flex;align-items:center;min-height:28px;padding:4px 9px;border-radius:999px;background:var(--primary-soft);color:var(--primary);font-size:10px;font-weight:800;white-space:nowrap}
.danger-zone{border-color:rgba(196,61,75,.3)}
.danger-zone form{display:grid;gap:13px;margin-top:auto}
.danger-zone .danger-button{justify-self:start}
.offline-control-panel{display:grid;gap:18px}
.offline-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.offline-queue-list{display:grid;gap:8px;min-height:120px;padding-top:4px;border-top:1px solid var(--line)}
.offline-queue-item{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1px solid var(--line)}
.offline-queue-item:last-child{border-bottom:0}
.offline-queue-item>div{min-width:0}
.offline-queue-item strong,.offline-queue-item small{display:block;overflow-wrap:anywhere}
.offline-queue-item strong{font-size:13px;color:var(--ink)}
.offline-queue-item small{margin-top:4px;color:var(--muted);font-size:10px}
.offline-queue-item p{margin:7px 0 0;color:var(--danger);font-size:11px;line-height:1.45;overflow-wrap:anywhere}
.compact-empty{min-height:116px}
.offline-warning{color:var(--danger)!important}
:root[data-theme="dark"] .recovery-status{background:#1b403b;color:var(--primary)}
:root[data-theme="dark"] .danger-zone{border-color:rgba(240,124,136,.38)}

@media(max-width:800px){.recovery-grid{grid-template-columns:1fr}.recovery-panel{min-height:0}}
@media(max-width:640px){
  #page-backup .section-intro,#page-offline-sync .section-intro{align-items:stretch}
  #refreshBackupStatus,#refreshOfflineStatus{width:100%}
  .offline-actions{display:grid;grid-template-columns:1fr 1fr}
  .offline-actions button{width:100%;min-width:0}
  .offline-actions .danger-button{grid-column:1/-1}
  .offline-queue-item{gap:8px}
}

/* Keep authentication anchored while mobile browser chrome or the keyboard
   changes the visual viewport. The form may scroll, but the card itself does
   not jump between centered positions. */
.auth-screen{min-height:100svh;height:100svh;box-sizing:border-box;overflow-y:auto;overscroll-behavior:contain}
@media(max-width:640px){
  .auth-screen{display:block;padding: max(18px, env(safe-area-inset-top)) 14px max(18px, env(safe-area-inset-bottom));}
  .auth-panel{margin:0 auto;width:min(500px,100%);}
}

/* Minimal medical login: quiet clinical surfaces with one restrained pulse. */
.auth-screen{position:relative;isolation:isolate;display:flex;align-items:flex-start;justify-content:center;background:#eef7f5;overflow-x:hidden;overflow-y:auto}
.auth-panel{margin:clamp(24px,7vh,72px) 0 32px}
.auth-screen::before,.auth-screen::after{content:"";position:absolute;z-index:-1;left:50%;top:50%;width:min(76vw,720px);aspect-ratio:1;border:1px solid rgba(11,107,97,.11);border-radius:50%;transform:translate(-50%,-50%) scale(.78);animation:auth-vital-pulse 7s ease-out infinite;pointer-events:none}
.auth-screen::after{width:min(50vw,470px);border-color:rgba(76,166,153,.13);animation-delay:2.5s}
.auth-medical-rain{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;color:#0b6b61}
.medical-fall{--fall-left:50%;--fall-duration:19s;--fall-delay:0s;--fall-drift:24px;position:absolute;top:-64px;left:var(--fall-left);width:30px;height:30px;opacity:.12;animation:auth-medical-fall var(--fall-duration) linear var(--fall-delay) infinite;will-change:transform}
.medical-fall svg{display:block;width:100%;height:100%}
.medical-fall-1{--fall-left:4%;--fall-duration:22s;--fall-delay:-15s;--fall-drift:34px;width:27px;height:27px}.medical-fall-2{--fall-left:13%;--fall-duration:18s;--fall-delay:-6s;--fall-drift:-26px;width:34px;height:34px}.medical-fall-3{--fall-left:23%;--fall-duration:24s;--fall-delay:-18s;--fall-drift:18px;width:25px;height:25px}.medical-fall-4{--fall-left:34%;--fall-duration:20s;--fall-delay:-11s;--fall-drift:-32px;width:31px;height:31px}.medical-fall-5{--fall-left:44%;--fall-duration:26s;--fall-delay:-4s;--fall-drift:28px;width:37px;height:37px}.medical-fall-6{--fall-left:55%;--fall-duration:21s;--fall-delay:-16s;--fall-drift:-20px;width:26px;height:26px}.medical-fall-7{--fall-left:65%;--fall-duration:23s;--fall-delay:-9s;--fall-drift:36px;width:32px;height:32px}.medical-fall-8{--fall-left:74%;--fall-duration:19s;--fall-delay:-2s;--fall-drift:-24px;width:25px;height:25px}.medical-fall-9{--fall-left:83%;--fall-duration:25s;--fall-delay:-20s;--fall-drift:22px;width:30px;height:30px}.medical-fall-10{--fall-left:92%;--fall-duration:20s;--fall-delay:-13s;--fall-drift:-30px;width:36px;height:36px}.medical-fall-11{--fall-left:29%;--fall-duration:27s;--fall-delay:-25s;--fall-drift:16px;width:23px;height:23px}.medical-fall-12{--fall-left:70%;--fall-duration:28s;--fall-delay:-23s;--fall-drift:-18px;width:28px;height:28px}
.auth-panel{position:relative;z-index:1;border:1px solid rgba(15,93,85,.16);border-radius:16px;padding:34px;box-shadow:0 24px 70px rgba(17,79,72,.12)}
.auth-panel::before{content:"";position:absolute;top:0;left:34px;right:34px;height:3px;border-radius:0 0 4px 4px;background:#0b6b61;opacity:.9}
.auth-brand{gap:14px;padding-bottom:20px;margin-bottom:28px;border-bottom:1px solid rgba(15,93,85,.12)}
.auth-brand img{width:56px;height:56px;padding:8px;border:1px solid rgba(11,107,97,.16);border-radius:14px;background:#f1fbf8;box-shadow:0 8px 18px rgba(11,107,97,.09);animation:auth-logo-breathe 4.5s ease-in-out infinite}
.auth-brand strong{font-size:19px;letter-spacing:-.01em}.auth-brand small{font-size:11px}
.auth-panel h1{font-size:28px;line-height:1.16;margin:6px 0 9px}.auth-copy{font-size:13px;line-height:1.6}
.auth-panel form{gap:17px}.auth-panel label>span{font-size:12px;letter-spacing:.01em;color:#285850}.auth-panel input{min-height:48px;background:#fbfefd;border-color:#cfe2de;transition:border-color .18s ease,box-shadow .18s ease}
.auth-panel input:focus{border-color:#0b6b61;box-shadow:0 0 0 3px rgba(11,107,97,.12)}
.auth-submit{min-height:50px;border-radius:8px;box-shadow:0 8px 18px rgba(11,107,97,.16);transition:box-shadow .18s ease,background .18s ease}.auth-submit:hover{transform:none;box-shadow:0 8px 18px rgba(11,107,97,.2)}
.auth-divider{margin:22px 0 14px}.oauth-button{border-radius:8px;min-height:46px}
@keyframes auth-vital-pulse{0%{opacity:0;transform:translate(-50%,-50%) scale(.78)}22%{opacity:1}70%,100%{opacity:0;transform:translate(-50%,-50%) scale(1.12)}}
@keyframes auth-panel-enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes auth-logo-breathe{0%,100%{transform:scale(1);box-shadow:0 8px 18px rgba(11,107,97,.09)}50%{transform:scale(1.035);box-shadow:0 10px 23px rgba(11,107,97,.16)}}
@keyframes auth-medical-fall{0%{transform:translate3d(0,-80px,0) rotate(0deg);opacity:0}8%{opacity:.12}88%{opacity:.12}100%{transform:translate3d(var(--fall-drift),calc(100vh + 150px),0) rotate(160deg);opacity:0}}
:root[data-theme="dark"] .auth-screen{background:#0b1d1c}
:root[data-theme="dark"] .auth-screen::before{border-color:rgba(104,214,198,.12)}
:root[data-theme="dark"] .auth-screen::after{border-color:rgba(104,214,198,.16)}
:root[data-theme="dark"] .auth-panel{border-color:rgba(104,214,198,.18);box-shadow:0 24px 70px rgba(0,0,0,.28)}
:root[data-theme="dark"] .auth-panel::before{background:#4fc5b5}
:root[data-theme="dark"] .auth-brand{border-bottom-color:rgba(104,214,198,.14)}
:root[data-theme="dark"] .auth-brand img{background:#102522;border-color:rgba(104,214,198,.2)}
:root[data-theme="dark"] .auth-panel label>span{color:#b7d5cf}
:root[data-theme="dark"] .auth-panel input{background:#102522;border-color:#2c4d48}
@media(prefers-reduced-motion:reduce){.auth-screen::before,.auth-screen::after,.auth-panel,.auth-brand img,.auth-submit,.medical-fall{animation:none;transition:none}.auth-panel{opacity:1;transform:none}.auth-medical-rain{display:none}}
@media(max-width:640px){
  .auth-screen{
    display:block;
    min-height:100dvh;
    height:100dvh;
    padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom));
    overflow-x:hidden;
    overflow-y:auto;
  }
  .auth-panel{margin:0 auto;padding:22px 18px 20px;width:min(500px,100%)}
  .auth-panel::before{left:18px;right:18px}
  .auth-brand{gap:11px;padding-bottom:14px;margin-bottom:16px}
  .auth-brand img{width:48px;height:48px;padding:6px;border-radius:11px}
  .auth-brand strong{font-size:17px}
  .auth-panel h1{font-size:23px;margin-top:4px}
  .auth-copy{margin-bottom:14px;line-height:1.5}
  .auth-panel form{gap:12px}
  .auth-divider{margin:14px 0 10px}
  .oauth-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .oauth-button{min-width:0;min-height:48px;padding:0 10px;touch-action:manipulation}
}

/* Dashboard keeps wheel, keyboard, and touch scrolling without a visible rail. */
html.dashboard-scrollbar-hidden{scrollbar-width:none;-ms-overflow-style:none}
html.dashboard-scrollbar-hidden::-webkit-scrollbar{width:0;height:0;display:none}

/* Authenticator enrollment uses a scan-first QR flow with a manual fallback. */
.totp-qr-card{display:grid;justify-items:center;gap:10px;padding:16px;border:1px solid var(--line);background:#f5faf8;border-radius:7px;margin-bottom:12px;text-align:center}
.totp-qr-label{font-size:13px;font-weight:800;color:var(--ink)}
.totp-qr-frame{width:min(220px,100%);aspect-ratio:1;padding:10px;border:1px solid var(--line);border-radius:7px;background:#fff}
.totp-qr-frame img{display:block;width:100%;height:100%;object-fit:contain}
.totp-qr-card small{color:var(--muted);line-height:1.45}
.totp-manual{margin-bottom:14px}
.totp-manual summary{min-height:44px;display:flex;align-items:center;color:var(--primary);font-size:12px;font-weight:800;cursor:pointer}
.totp-manual .auth-code-box{margin:4px 0 0}
.totp-manual summary::-webkit-details-marker{display:none}
.totp-manual summary:after{content:"+";margin-left:auto;font-size:18px}
.totp-manual[open] summary:after{content:"-"}
:root[data-theme="dark"] .totp-qr-card,:root[data-theme="dark"] .totp-manual .auth-code-box{background:var(--surface-2);border-color:var(--line)}

/* Compact live context for the dashboard welcome banner. */
.welcome-copy{position:relative;z-index:1;min-width:0;max-width:none;width:100%}
.welcome-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.welcome-meta .eyebrow{margin:0}
.welcome-weather{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:4px 9px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(255,255,255,.1);color:#e5f5f2;font-size:11px;font-weight:700;line-height:1.2}
.welcome-weather svg{width:15px;height:15px;flex:0 0 auto}
.welcome-band #dashboardMotivation{max-width:none;white-space:nowrap}
.welcome-weather.upcoming-weather{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16)}
@media(max-width:640px){.welcome-meta{align-items:flex-start;gap:8px}.welcome-weather{width:fit-content;max-width:100%}.welcome-band #dashboardMotivation{font-size:22px;line-height:1.25}.welcome-band button{width:100%}}
@media(max-width:900px){.welcome-band #dashboardMotivation{white-space:normal}}

/* Responsive layout guardrails. Keep every workspace inside the viewport while
   allowing dense clinic data to wrap or scroll at the correct ownership level. */
:root {
  --layout-gutter: clamp(14px, 3vw, 34px);
  --layout-max: 1680px;
}

html, body { overflow-x: hidden; }
.app-shell { width: 100%; }
.main {
  width: min(calc(100% - 250px), var(--layout-max));
  margin-left: 250px;
  margin-right: auto;
  padding-left: var(--layout-gutter);
  padding-right: var(--layout-gutter);
}
.main > *, .page > *, .panel, .form-panel, .section-intro,
.welcome-band, .dashboard-grid, .results-layout, .service-layout,
.recovery-grid, .recovery-stats { min-width: 0; }
.topbar { flex-wrap: wrap; min-height: 82px; height: auto; padding: 18px 0; }
.topbar > *, .top-actions, .panel-head > *, .section-intro > *,
.wizard-top > *, .modal-head > *, .result-head > * { min-width: 0; }
.topbar h1, .section-intro h2, .panel-head h2, .panel-head h3,
.modal-head h2, .result-head h2 { overflow-wrap: anywhere; }
.top-actions, .panel-head, .section-intro, .wizard-top, .result-head {
  flex-wrap: wrap;
}
.top-actions { justify-content: flex-end; }
.welcome-band { gap: 24px; }
.welcome-band > * { min-width: 0; }
.welcome-band h2, .welcome-band p { overflow-wrap: anywhere; }
.stats-grid, .type-cards, .records-grid, .agency-grid,
.form-grid, .review-grid, .capture-grid, .patient-summary {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
}
.form-grid .wide { grid-column: span 2; }
.form-grid label, .review-section, .capture-card, .payment-card,
.service-layout > *, .results-layout > * { min-width: 0; }
.service-list { grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
.service-option span, .queue-row > *, .review-line > *, .payment-item > * {
  min-width: 0;
  overflow-wrap: anywhere;
}
.filter-row, .result-actions, .modal-actions, .capture-actions,
.offline-actions { flex-wrap: wrap; }
.filter-row > *, .result-actions > *, .modal-actions > * { min-width: 0; }
.search-box { width: min(100%, 420px); min-width: min(0, 300px); }
.responsive-table { width: 100%; max-width: 100%; overscroll-behavior-x: contain; }
.table-panel { min-width: 0; }
.modal-backdrop { overflow-y: auto; }
.modal { width: min(760px, 100%); min-width: 0; }
.modal form, .modal form > *, .modal-actions { min-width: 0; }
input, select, textarea, button { max-width: 100%; }

/* Keep the login card anchored when validation text appears. */
.auth-error { min-height: 0; }
#loginError {
  min-height: 64px;
  max-height: 88px;
  margin-bottom: -2px;
  overflow-y: auto;
  display: flex;
  align-items: center;
}
#loginError.hidden { visibility: hidden; display: flex !important; }

@media (max-width: 1100px) {
  .main { width: calc(100% - 250px); }
  .dashboard-grid, .service-layout, .results-layout, .recovery-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form-grid .wide { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
  .main { width: 100%; margin-left: 0; }
  .topbar { min-height: 72px; }
  .top-actions { margin-left: auto; }
  .capture-grid, .review-grid { grid-template-columns: minmax(0, 1fr); }
  .queue-row { grid-template-columns: 42px minmax(0, 1fr) auto; }
  .queue-row .queue-meta { display: none; }
}

@media (max-width: 640px) {
  .main { padding-left: 14px; padding-right: 14px; padding-bottom: 28px; }
  .topbar { align-items: center; padding-top: 12px; padding-bottom: 12px; }
  .topbar h1 { font-size: 21px; }
  .top-actions { gap: 8px; }
  .welcome-band { padding: 20px; }
  .panel, .form-panel { padding: 16px; }
  .form-grid, .service-list, .records-grid, .agency-grid,
  .patient-summary { grid-template-columns: minmax(0, 1fr); }
  .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form-grid .wide { grid-column: auto; }
  .section-intro, .panel-head, .wizard-top, .result-head { align-items: flex-start; }
  .section-intro > button, .panel-head > button { width: 100%; }
  .filter-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .search-box { width: 100%; }
  .result-actions, .modal-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
  .result-actions > *, .modal-actions > * { width: 100%; }
  .capture-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .offline-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
  .offline-actions > * { width: 100%; }
  .modal-backdrop { padding: 10px; place-items: end center; }
  .modal { max-height: calc(100dvh - 20px); border-radius: 14px; padding: 18px; }
  #loginError { min-height: 48px; }
}

@media (max-width: 390px) {
  .main { padding-left: 10px; padding-right: 10px; }
  .panel, .form-panel { padding: 13px; }
  .topbar h1 { font-size: 19px; }
  .welcome-band { padding: 16px; }
  .stats-grid { grid-template-columns: minmax(0, 1fr); }
  .capture-actions { grid-template-columns: minmax(0, 1fr); }
}
.result-actions > button {
  min-width: 168px;
  min-height: 44px;
  justify-content: center;
}

.result-actions > button:disabled {
  cursor: wait;
  opacity: 0.72;
}

.doctor-profile-modal .modal-actions .primary {
  width: 100%;
  min-height: 44px;
  justify-content: center;
}

@media (max-width: 640px) {
  .result-actions > button {
    width: 100%;
    min-width: 0;
  }
}

/* UI polish: stable authentication feedback and compact, touch-safe header. */
.auth-error {
  min-height: 48px;
  max-height: 96px;
  overflow-y: auto;
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
  transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
}
.auth-error.hidden {
  display: block !important;
  visibility: hidden;
  opacity: 0;
  transform: translateY(-5px);
  pointer-events: none;
}
#loginError { display: flex; }

/* Keep the login card anchored; only the message itself may fade/slide. */
.auth-panel, .auth-panel form, .auth-panel h1, .auth-panel .auth-copy {
  transform: none;
}

.topbar #notificationCenter { margin-right: 0; }
.topbar #topSettingsButton { margin-left: 0; }
.topbar #notificationButton, .topbar #topSettingsButton {
  flex: 0 0 44px;
  min-width: 44px;
  min-height: 44px;
  touch-action: manipulation;
}

.modal.small-modal:has(.settings-section) {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.modal.small-modal:has(.settings-section) .settings-section {
  min-width: 0;
}
.modal.small-modal:has(.settings-section) .settings-actions > * {
  min-width: 0;
  min-height: 44px;
}

@media (max-width: 900px) {
  .modal.small-modal:has(.settings-section) .settings-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .topbar {
    flex-wrap: nowrap;
    gap: 8px;
  }
  .topbar #registrationTopActions {
    min-width: 0;
    margin-right: auto;
  }
  .topbar #registrationTopActions .compact {
    white-space: nowrap;
    padding-inline: 12px;
  }
  .modal.small-modal:has(.settings-section) {
    width: min(680px, calc(100vw - 24px));
    max-height: calc(100dvh - 24px);
  }
}

@media (max-width: 640px) {
  .topbar #notificationCenter,
  .topbar #topSettingsButton {
    margin-left: 0;
    margin-right: 0;
  }
  .topbar #registrationTopActions .compact {
    min-height: 44px;
    padding-inline: 10px;
    font-size: 12px;
  }
  .modal.small-modal:has(.settings-section) {
    width: calc(100vw - 20px);
    max-height: calc(100dvh - 16px);
  }
  .modal.small-modal:has(.settings-section) .modal-head {
    padding: 14px 16px;
  }
  .modal.small-modal:has(.settings-section) .modal-head h2 {
    font-size: 20px;
  }
  .modal.small-modal:has(.settings-section) .settings-section {
    margin: 10px 12px 0;
    padding: 14px;
  }
  .modal.small-modal:has(.settings-section) .settings-actions {
    grid-template-columns: 1fr;
    gap: 9px;
  }
  .modal.small-modal:has(.settings-section) .settings-actions > *,
  .modal.small-modal:has(.settings-section) #changeOwnPasswordForm button,
  .modal.small-modal:has(.settings-section) #settingsLogoutButton {
    width: 100%;
  }
  .modal.small-modal:has(.settings-section) .modal-actions {
    padding: 12px 14px max(14px, env(safe-area-inset-bottom));
  }
}

@media (prefers-reduced-motion: reduce) {
  .auth-error { transition: none; }
}

/* Account identity is shown in the Settings header, not the sidebar footer. */
.sidebar-foot { display: none; }
.modal.small-modal:has(.settings-section) .modal-head .modal-subtitle#settingsUserSummary {
  display: flex;
  align-items: center;
  min-height: 38px;
  margin-top: 12px;
  padding: 9px 12px;
  border: 1px solid #dbe7e4;
  border-radius: 9px;
  background: #e7f3f0;
  color: #16483f;
  font-size: 14px;
  font-weight: 800;
  position: relative;
  overflow-wrap: anywhere;
}
@media (max-width: 640px) {
  .modal.small-modal:has(.settings-section) .modal-head .modal-subtitle#settingsUserSummary {
    margin-top: 10px;
    font-size: 13px;
  }
}

/* The sidebar footer is removed; let navigation use the full remaining height. */
.sidebar nav {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  padding-bottom: max(18px, env(safe-area-inset-bottom));
}

/* Keep each linked-account action directly beneath its matching provider. */
.modal.small-modal:has(#settingsLinkedStatus) .settings-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.modal.small-modal:has(#settingsLinkedStatus) #linkGoogleAccount { grid-column: 1; grid-row: 1; }
.modal.small-modal:has(#settingsLinkedStatus) #unlinkGoogleAccount { grid-column: 1; grid-row: 2; }
.modal.small-modal:has(#settingsLinkedStatus) #linkFacebookAccount { grid-column: 2; grid-row: 1; }
.modal.small-modal:has(#settingsLinkedStatus) #unlinkFacebookAccount { grid-column: 2; grid-row: 2; }
@media (max-width: 640px) {
  .modal.small-modal:has(#settingsLinkedStatus) .settings-actions { grid-template-columns: 1fr; }
  .modal.small-modal:has(#settingsLinkedStatus) #linkGoogleAccount,
  .modal.small-modal:has(#settingsLinkedStatus) #unlinkGoogleAccount,
  .modal.small-modal:has(#settingsLinkedStatus) #linkFacebookAccount,
  .modal.small-modal:has(#settingsLinkedStatus) #unlinkFacebookAccount { grid-column: 1; grid-row: auto; }
  .modal.small-modal:has(#settingsLinkedStatus) #linkGoogleAccount { order: 1; }
  .modal.small-modal:has(#settingsLinkedStatus) #unlinkGoogleAccount { order: 2; }
  .modal.small-modal:has(#settingsLinkedStatus) #linkFacebookAccount { order: 3; }
.modal.small-modal:has(#settingsLinkedStatus) #unlinkFacebookAccount { order: 4; }
}

.modal.small-modal:has(.settings-section) .modal-head > .settings-header-copy > .eyebrow,
.modal.small-modal:has(.settings-section) .modal-head > div > .eyebrow {
  display: none;
}

/* Selfies use a stable portrait frame and a mirrored live preview. */
#selfieBox {
  width: min(100%, 320px);
  height: min(360px, 86vw);
  aspect-ratio: 3 / 4;
  margin-inline: auto;
  background: #15201e;
}
#selfieBox video {
  object-fit: cover;
  transform: scaleX(-1);
}
#selfieBox canvas {
  object-fit: cover;
}

/* Patient verification frames shown above selected-patient workspaces. */
.patient-verification-frame {
  margin: 0 0 18px;
  padding: 14px;
  border: 1px solid #d8e5e1;
  border-radius: 10px;
  background: #f7fbfa;
}
.patient-verification-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  min-width: 0;
}
.patient-verification-heading .eyebrow { margin: 0; }
.patient-verification-reference {
  color: #48645f;
  font-size: 12px;
  font-weight: 700;
  overflow-wrap: anywhere;
  text-align: right;
}
.patient-verification-grid {
  display: grid;
  grid-template-columns: minmax(150px, .78fr) minmax(240px, 1.22fr);
  gap: 12px;
  align-items: stretch;
}
.patient-verification-card {
  min-width: 0;
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 7px;
}
.patient-verification-label {
  color: #1b443d;
  font-size: 12px;
  font-weight: 800;
}
.patient-verification-media {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: clamp(190px, 26vw, 280px);
  min-height: 0;
  overflow: hidden;
  border: 1px solid #c9dad5;
  border-radius: 8px;
  background: #edf4f2;
  color: #607872;
  text-align: center;
  padding: 8px;
}
.patient-verification-selfie .patient-verification-media { width: 100%; }
.patient-verification-id .patient-verification-media { width: 100%; }
.patient-verification-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 5px;
}
.patient-verification-selfie .patient-verification-media img { object-fit: cover; }
.patient-verification-empty {
  max-width: 22ch;
  font-size: 12px;
  line-height: 1.4;
}
.patient-record-card .patient-verification-frame {
  margin-top: 12px;
  padding: 11px;
}
.patient-record-card .patient-verification-heading { display: none; }
.patient-record-card .patient-verification-grid { grid-template-columns: minmax(92px, .78fr) minmax(150px, 1.22fr); gap: 8px; }
.patient-record-card .patient-verification-media { height: 150px; }
.patient-record-verification { margin: 0 0 18px; }
.patient-record-verification .patient-verification-frame { margin: 0; }
.patient-record-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  height: 54px;
  min-height: 54px;
  padding: 6px 10px;
  box-sizing: border-box;
  text-align: left;
  cursor: pointer;
}
.patient-record-card:not(:has(.patient-record-actions)) { height: 54px; min-height: 54px; }
.patient-record-card h3 { margin: 0; font-size: 14px; line-height: 1.25; text-align: left; }
.patient-record-card.selected { border-color: #0b6b61; box-shadow: 0 0 0 2px rgba(11, 107, 97, .12); }
.patient-record-card h3 { order: 1; min-width: 0; overflow-wrap: anywhere; }
.patient-record-card .patient-record-actions { order: 2; display: flex; flex-direction: row; width: auto; flex: 0 0 auto; justify-content: flex-end; margin: 0 0 0 auto; padding: 0; }
.patient-record-card .patient-record-actions > * { flex: 0 0 auto; width: auto; min-height: 34px; padding: 7px 12px; }
.patient-record-card .patient-record-actions button[data-edit-patient] { order: -1; }
#recordsGrid.records-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.patient-record-verification .patient-verification-layout.with-details {
  display: grid;
  grid-template-columns: minmax(320px, .95fr) minmax(220px, 1.05fr);
  gap: 18px;
  align-items: stretch;
}
.patient-record-verification .patient-verification-grid {
  width: 100%;
  grid-template-columns: minmax(105px, .78fr) minmax(168px, 1.22fr);
}
.patient-record-verification .patient-verification-media {
  height: clamp(118px, 14vw, 164px);
}
.patient-record-verification .patient-verification-details {
  display: grid;
  align-content: start;
  gap: 0;
  min-width: 0;
  border: 1px solid #d8e5e1;
  border-radius: 8px;
  background: #fff;
}
.patient-record-verification .patient-verification-details > div {
  display: grid;
  gap: 4px;
  padding: 13px 14px;
  border-bottom: 1px solid #e4ecea;
}
.patient-record-verification .patient-verification-details > div:last-child { border-bottom: 0; }
.patient-record-verification .patient-verification-details span {
  color: #647b76;
  font-size: 11px;
  font-weight: 700;
}
.patient-record-verification .patient-verification-details strong {
  color: #173f38;
  font-size: 13px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.patient-record-verification .patient-verification-reference {
  max-width: 50%;
  font-size: 13px;
  line-height: 1.25;
}
@media (max-width: 720px) {
  .patient-record-verification .patient-verification-layout.with-details { grid-template-columns: 1fr; }
  .patient-record-verification .patient-verification-grid { width: 100%; grid-template-columns: 1fr; }
  .patient-record-verification .patient-verification-media { height: 148px; }
  .patient-record-verification .patient-verification-reference { max-width: 100%; }
  .patient-record-card { height: 54px; min-height: 54px; }
  #recordsGrid.records-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .patient-verification-heading { align-items: flex-start; flex-direction: column; gap: 4px; }
  .patient-verification-reference { text-align: left; }
  .patient-verification-grid { grid-template-columns: 1fr; }
  .patient-verification-media { height: 220px; }
  .patient-verification-selfie .patient-verification-media { width: min(100%, 220px); justify-self: center; }
}
@media (min-width: 721px) and (max-width: 1100px) {
  .patient-verification-grid { grid-template-columns: minmax(132px, .85fr) minmax(210px, 1.15fr); }
}