/* NCD Screening v2.21.0 */
.screening-page { overflow: hidden; }
.screening-page-head {
  display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:14px;
}
.screening-page-head h2 { margin:0; }
.screening-page-head p { margin:4px 0 0; color:var(--muted); font-size:14px; }
.screening-filter-bar {
  display:grid;
  grid-template-columns: repeat(5,minmax(145px,1fr));
  gap:10px;
  margin-bottom:14px;
}
.screening-filter-bar label { display:grid; gap:5px; min-width:0; }
.screening-filter-bar label > span { color:var(--muted); font-size:12px; font-weight:700; }
.screening-filter-bar select {
  width:100%; min-width:0; min-height:40px;
  border:1px solid var(--line); border-radius:9px; background:var(--surface); color:var(--text);
  padding:0 10px; font:inherit;
}
.screening-tabs {
  display:flex; gap:6px; overflow-x:auto; padding:5px;
  border:1px solid var(--line); border-radius:11px; background:var(--surface-soft); margin-bottom:14px;
}
.screening-tabs button {
  flex:0 0 auto; min-height:38px; padding:0 14px;
  border:1px solid transparent; border-radius:8px; background:transparent; color:var(--muted);
  font-weight:800; cursor:pointer; white-space:nowrap;
}
.screening-tabs button.active,
.screening-tabs button[aria-selected="true"] { background:#0f766e; border-color:#0f766e; color:#fff; }

.screening-summary-card { cursor:pointer; }
.screening-summary-card:hover,
.screening-summary-card:focus-visible { border-color:#0f766e; box-shadow:0 7px 18px rgba(15,118,110,.12); outline:none; }

.screening-chart-card,
.screening-action-table-card,
.screening-drilldown {
  margin-top:14px; padding:14px; border:1px solid var(--line); border-radius:12px; background:var(--surface);
}
.screening-chart-head {
  display:flex; justify-content:space-between; align-items:flex-start; gap:14px; margin-bottom:12px;
}
.screening-chart-head h3 { margin:0; }
.screening-chart-head span { display:block; margin-top:3px; color:var(--muted); font-size:12px; }
.screening-chart-tools { display:flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.screening-status-buttons { display:flex; gap:5px; flex-wrap:wrap; }
.screening-status-buttons button,
#screeningCompareToggle {
  min-height:34px; padding:0 10px; border:1px solid var(--line); border-radius:8px;
  background:var(--surface-soft); color:var(--muted); font-weight:700; cursor:pointer;
}
.screening-status-buttons button.active,
#screeningCompareToggle.active { background:#0f766e; border-color:#0f766e; color:#fff; }

.screening-chart-scroll {
  max-width:100%; overflow-x:auto; overflow-y:hidden; padding:6px 2px 0;
  scrollbar-width:thin;
}
.screening-vertical-chart {
  min-width:720px; height:340px; display:flex; align-items:flex-end; gap:12px;
  border-bottom:1px solid var(--line); padding:56px 10px 0;
}
.screening-village-column {
  flex:1 0 72px; min-width:72px; height:100%;
  display:grid; grid-template-rows:1fr 58px; align-items:end;
}
.screening-bars { height:100%; display:flex; align-items:flex-end; justify-content:center; gap:4px; }
.screening-vbar {
  position:relative; width:24px; min-height:0; padding:0; border:0; border-radius:6px 6px 0 0;
  background:#0f766e; cursor:pointer; transition:filter .15s ease, transform .15s ease;
}
.screening-vbar.series-1 { background:#b45309; }
.screening-vbar.series-2 { background:#be123c; }
.screening-vbar:hover,
.screening-vbar:focus-visible { filter:brightness(.92); transform:translateY(-2px); outline:2px solid rgba(15,118,110,.2); }
.screening-vbar span {
  position:absolute; top:-20px; left:50%; transform:translateX(-50%);
  color:var(--text); font-size:11px; font-weight:800; white-space:nowrap;
}
.screening-village-label { align-self:start; padding-top:8px; text-align:center; line-height:1.15; }
.screening-village-label strong { display:block; font-size:12px; }
.screening-village-label span {
  display:block; max-width:90px; margin:3px auto 0; color:var(--muted); font-size:10px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.screening-empty-chart {
  min-width:100%; min-height:210px; display:grid; place-items:center; color:var(--muted);
}

.screening-number-link {
  border:0; background:transparent; color:#0f766e; font:inherit; font-weight:800; text-decoration:underline;
  text-underline-offset:3px; cursor:pointer; padding:4px 6px; border-radius:6px;
}
.screening-number-link:hover,
.screening-number-link:focus-visible { background:#ecfdf5; outline:none; }

.screening-status-badge {
  display:inline-flex; align-items:center; min-height:25px; padding:0 8px; border-radius:999px;
  font-size:11px; font-weight:800; white-space:nowrap; background:#e2e8f0; color:#475569;
}
.screening-status-badge.normal { background:#dcfce7; color:#15803d; }
.screening-status-badge.at_risk,
.screening-status-badge.follow_up { background:#fef3c7; color:#a16207; }
.screening-status-badge.abnormal,
.screening-status-badge.referred { background:#fee2e2; color:#b91c1c; }
.screening-status-badge.not_screened { background:#e2e8f0; color:#475569; }

.screening-drilldown-head {
  display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:10px;
}
.screening-drilldown-head h3 { margin:0; }
.screening-drilldown-head span { color:var(--muted); font-size:12px; }
.screening-drilldown-tools { display:flex; gap:8px; align-items:center; }
.screening-drilldown-tools input { min-width:300px; }
.screening-drilldown-tools button {
  min-height:38px; border:1px solid var(--line); border-radius:8px; background:var(--surface-soft); cursor:pointer;
}

@media (max-width: 1100px) {
  .screening-filter-bar { grid-template-columns:repeat(3,minmax(150px,1fr)); }
  .screening-chart-head { flex-direction:column; }
  .screening-chart-tools { justify-content:flex-start; }
}
@media (max-width: 760px) {
  .screening-page-head { align-items:stretch; flex-direction:column; }
  .screening-filter-bar { grid-template-columns:1fr 1fr; }
  .screening-drilldown-head { flex-direction:column; }
  .screening-drilldown-tools { width:100%; }
  .screening-drilldown-tools input { min-width:0; flex:1; }
  .screening-vertical-chart { min-width:650px; height:340px; padding-top:56px; }
}
@media (max-width: 520px) {
  .screening-filter-bar { grid-template-columns:1fr; }
  .screening-status-buttons { flex-wrap:nowrap; overflow-x:auto; max-width:100%; }
  .screening-drilldown-tools { flex-direction:column; align-items:stretch; }
}

.screening-export-tools { display:flex; align-items:center; gap:8px; }
.screening-export-tools select { min-height:38px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--text); padding:0 10px; }
@media (max-width:760px){ .screening-export-tools { width:100%; } .screening-export-tools select,.screening-export-tools button { flex:1 1 0; } }


/* Screening grouped vertical chart v2.21.0.2 */
.screening-chart-mode {
  display:flex;
  align-items:center;
  gap:5px;
  flex-wrap:wrap;
}
.screening-chart-mode button {
  min-height:34px;
  padding:0 12px;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--surface-soft);
  color:var(--muted);
  font-weight:800;
  cursor:pointer;
}
.screening-chart-mode button.active {
  background:#0f766e;
  border-color:#0f766e;
  color:#fff;
}
.screening-chart-legend {
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:12px;
  font-weight:700;
}
.screening-chart-legend span {
  display:inline-flex;
  align-items:center;
  gap:5px;
}
.screening-chart-legend i {
  width:10px;
  height:10px;
  border-radius:3px;
  display:inline-block;
}
.screening-chart-legend i.normal { background:#0f766e; }
.screening-chart-legend i.risk { background:#b45309; }
.screening-chart-legend i.suspected-case { background:#ea580c; }
.screening-chart-legend i.new-case { background:#be123c; }

.screening-village-column {
  flex:1 0 116px;
  min-width:116px;
}
.screening-vbar.normal { background:#0f766e; }
.screening-vbar.risk { background:#b45309; }
.screening-vbar.suspected-case { background:#ea580c; }
.screening-vbar.new-case { background:#be123c; }

.screening-vertical-chart.overall {
  min-width:100%;
  justify-content:center;
}
.screening-vertical-chart.overall .overall-column {
  flex:0 1 320px;
  min-width:240px;
  max-width:360px;
}
.screening-vertical-chart.overall .screening-bars {
  gap:14px;
}
.screening-vertical-chart.overall .screening-vbar {
  width:44px;
}
.screening-status-badge.new_case {
  background:#ffe4e6;
  color:#be123c;
}

@media (max-width:760px) {
  .screening-chart-tools {
    width:100%;
    justify-content:flex-start;
  }
  .screening-chart-legend {
    width:100%;
  }
  .screening-vertical-chart.overall {
    min-width:100%;
  }
  .screening-vertical-chart.overall .overall-column {
    min-width:220px;
  }
}

/* Screening chart-only refinement: filters + touch tooltip */
.screening-filter-bar {
  grid-template-columns: repeat(4,minmax(145px,1fr));
}
.screening-vbar {
  overflow: visible;
}
.screening-vbar::after {
  content: attr(data-tooltip);
  position: absolute;
  left: 50%;
  bottom: calc(100% + 34px);
  transform: translateX(-50%) translateY(4px);
  z-index: 12;
  min-width: max-content;
  max-width: 180px;
  padding: 6px 8px;
  border-radius: 7px;
  background: rgba(15,23,42,.94);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .14s ease, transform .14s ease;
}
.screening-vbar:hover::after,
.screening-vbar:focus::after {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
@media (max-width: 1100px) {
  .screening-filter-bar { grid-template-columns:repeat(2,minmax(150px,1fr)); }
}
@media (max-width: 520px) {
  .screening-filter-bar { grid-template-columns:1fr; }
}


/* Reliable screening bar tooltip element */
.screening-vbar::after { display:none !important; }
.screening-bar-tooltip {
  position:absolute;
  left:50%;
  bottom:calc(100% + 34px);
  transform:translateX(-50%) translateY(4px);
  z-index:12;
  min-width:max-content;
  max-width:180px;
  padding:6px 8px;
  border-radius:7px;
  background:rgba(15,23,42,.94);
  color:#fff;
  font-size:11px;
  font-style:normal;
  font-weight:700;
  line-height:1.25;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  transition:opacity .14s ease, transform .14s ease;
}
.screening-vbar:hover .screening-bar-tooltip,
.screening-vbar:focus .screening-bar-tooltip {
  opacity:1;
  transform:translateX(-50%) translateY(0);
}


.screening-vbar.tooltip-open .screening-bar-tooltip {
  opacity:1;
  transform:translateX(-50%) translateY(0);
}


/* Screening workflow v2.22.0 */
.screening-chart-card,.screening-action-section{border-radius:16px;box-shadow:0 8px 24px rgba(15,23,42,.05)}
.screening-vertical-chart{position:relative;background-image:repeating-linear-gradient(to top,transparent 0,transparent calc(25% - 1px),rgba(148,163,184,.18) 25%)}
.screening-coverage-card{margin-top:14px}
.screening-coverage-chart .screening-vbar.coverage{width:42px;background:#0f766e}
.screening-action-section{margin-top:14px;padding:14px;border:1px solid var(--line);background:var(--surface)}
.screening-action-grid{margin-top:10px}
.screening-status-badge.pending_confirmation,.screening-status-badge.not_entered_care{background:#fee2e2;color:#b91c1c}
.screening-status-badge.entered_care{background:#dcfce7;color:#15803d}
.screening-status-badge.target,.screening-status-badge.screened{background:#ccfbf1;color:#0f766e}

/* Theme-aware controls v2.23.2 — clinical status colors intentionally unchanged */
.screening-tabs button[aria-selected="true"],#screeningCompareToggle.active{background:var(--blue);border-color:var(--blue)}
.screening-summary-card:focus-visible{border-color:var(--blue);box-shadow:0 7px 18px rgba(22,131,243,.14)}
.screening-action-link{color:var(--blue)}

/* UI blue accent v2.24.1; normal/risk/suspected/new-case bars remain semantic */
body:not(.dark) .screening-tabs button[aria-selected="true"],body:not(.dark) #screeningCompareToggle.active{background:#1565d8!important;border-color:#1565d8!important}
body:not(.dark) .screening-summary-card:focus-visible{border-color:#1565d8!important;box-shadow:0 7px 18px rgba(21,101,216,.14)!important}
body:not(.dark) .screening-action-link{color:#0d55bb!important}
body:not(.dark) .screening-coverage-chart .screening-vbar.coverage{background:#1565d8!important}


/* HDC DM suspected-case confirmation v2.41.0 */
.dm-confirmation-panel { min-width:0; }
.dm-confirmation-toolbar {
  display:grid;
  grid-template-columns:minmax(220px,1fr) minmax(160px,.7fr) minmax(260px,1.4fr);
  gap:10px;
  align-items:end;
  margin-bottom:14px;
}
.dm-confirmation-toolbar label { display:grid; gap:5px; min-width:0; }
.dm-confirmation-toolbar label > span { color:var(--muted); font-size:12px; font-weight:700; }
.dm-confirmation-toolbar select {
  width:100%; min-height:40px; border:1px solid var(--line); border-radius:9px;
  background:var(--surface); color:var(--text); padding:0 10px; font:inherit;
}
.dm-confirmation-source {
  min-height:40px; display:flex; flex-direction:column; justify-content:center;
  padding:7px 12px; border:1px solid var(--line); border-radius:9px; background:var(--surface-soft);
}
.dm-confirmation-source strong { font-size:12px; }
.dm-confirmation-source span { color:var(--muted); font-size:11px; margin-top:2px; }

.dm-confirmation-summary-grid { grid-template-columns:repeat(6,minmax(135px,1fr)); }
.dm-confirmation-card strong { font-size:26px; }
.dm-confirmation-card small { line-height:1.25; }

.dm-confirmation-progress-card {
  margin-top:14px; padding:14px 16px; border:1px solid var(--line); border-radius:12px;
  background:var(--surface);
}
.dm-confirmation-progress-head {
  display:flex; justify-content:space-between; align-items:flex-end; gap:14px; margin-bottom:10px;
}
.dm-confirmation-progress-head > div:first-child { display:grid; gap:3px; }
.dm-confirmation-progress-head span { color:var(--muted); font-size:12px; font-weight:700; }
.dm-confirmation-progress-head strong { font-size:28px; line-height:1; }
.dm-confirmation-progress-target { text-align:right; display:grid; gap:3px; }
.dm-confirmation-progress-target b {
  display:inline-flex; justify-self:end; padding:4px 9px; border-radius:999px; font-size:12px;
  background:#fef3c7; color:#92400e;
}
.dm-confirmation-progress-target b.pass { background:#dcfce7; color:#166534; }
.dm-confirmation-progress-track {
  height:10px; overflow:hidden; border-radius:999px; background:var(--surface-soft);
  border:1px solid var(--line);
}
.dm-confirmation-progress-track i {
  display:block; height:100%; width:0; border-radius:999px; background:#d97706;
  transition:width .25s ease;
}
.dm-confirmation-progress-track i.pass { background:#0f766e; }
.dm-confirmation-progress-card > small { display:block; margin-top:8px; color:var(--muted); font-size:11px; }

.dm-confirmation-chart { min-width:720px; }
.dm-confirmation-chart.overall { min-width:100%; justify-content:center; }
.dm-confirmation-chart.overall .overall-column { flex:0 1 390px; min-width:300px; max-width:440px; }
.dm-confirmation-chart.overall .screening-bars { gap:12px; }
.dm-confirmation-chart.overall .dm-confirmation-vbar { width:48px; }
.dm-confirmation-vbar.dm-suspected,
.dm-confirmation-legend i.dm-suspected { background:#475569; }
.dm-confirmation-vbar.dm-confirmed,
.dm-confirmation-legend i.dm-confirmed { background:#0f766e; }
.dm-confirmation-vbar.dm-pending,
.dm-confirmation-legend i.dm-pending { background:#d97706; }
.dm-confirmation-vbar.dm-late,
.dm-confirmation-legend i.dm-late { background:#be123c; }

.dm-confirmation-list-panel {
  margin-top:14px; padding:14px; border:1px solid var(--line); border-radius:12px; background:var(--surface);
}
.dm-confirmation-list-panel .screening-list-head { margin-bottom:10px; }
.dm-confirmation-table-wrap { max-width:100%; overflow:auto; }
.dm-confirmation-table { min-width:1650px; }
.dm-confirmation-table th,
.dm-confirmation-table td { vertical-align:top; }
.dm-confirmation-table .table-subtext { display:block; margin-top:3px; color:var(--muted); font-size:11px; }

.screening-status-badge.confirmed_within_180 { background:#dcfce7; color:#166534; }
.screening-status-badge.pending_confirmation { background:#fef3c7; color:#92400e; }
.screening-status-badge.not_confirmed,
.screening-status-badge.confirmed_after_180 { background:#fee2e2; color:#b91c1c; }

@media (max-width:1200px) {
  .dm-confirmation-summary-grid { grid-template-columns:repeat(3,minmax(145px,1fr)); }
}
@media (max-width:900px) {
  .dm-confirmation-toolbar { grid-template-columns:1fr 1fr; }
  .dm-confirmation-source { grid-column:1 / -1; }
}
@media (max-width:760px) {
  .dm-confirmation-summary-grid { grid-template-columns:1fr 1fr; }
  .dm-confirmation-progress-head { align-items:flex-start; flex-direction:column; }
  .dm-confirmation-progress-target { text-align:left; }
  .dm-confirmation-progress-target b { justify-self:start; }
  .dm-confirmation-chart { min-width:650px; }
}
@media (max-width:520px) {
  .dm-confirmation-toolbar,
  .dm-confirmation-summary-grid { grid-template-columns:1fr; }
}
