.medication-chart { --chart-ink:#102044; --chart-line:#e1e6ef; color:var(--chart-ink); background:#fff; border:1px solid var(--chart-line); border-radius:12px; font-size:14px; overflow:clip; }
.medication-chart [hidden] { display:none !important; }
.chart-header { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; padding:24px 24px 18px; border-bottom:1px solid var(--chart-line); }
.chart-header h1 { margin:0; font-size:28px; font-weight:700; letter-spacing:-.6px; line-height:1.25; }
.chart-participant { margin-top:6px; font-weight:600; font-size:16px; }
.chart-header nav { flex-basis:100%; }
.chart-header nav a { padding:10px 18px; border-radius:8px; }
.chart-header-status { text-align:right; }
.chart-header-status p, .chart-hint { color:#52617d; font-size:12px; margin-top:8px; line-height:1.5; }
.chart-workspace { display:grid; grid-template-columns:minmax(0,1fr); }
.chart-list { min-width:0; }
.chart-toolbar { display:flex; align-items:start; justify-content:space-between; gap:12px; padding:20px 18px 8px; }
.chart-selection-status { color:#52617d; font-size:12px; padding:0 18px 10px; }
.chart-bulk { position:relative; }
.chart-bulk > summary { cursor:pointer; font-weight:600; background:#f4f6fa; padding:10px 12px; border-radius:6px; }
.chart-bulk > form { position:absolute; top:46px; left:0; width:340px; max-width:calc(100vw - 72px); z-index:15; border:1px solid var(--chart-line); padding:16px; background:white; border-radius:8px; box-shadow:0 8px 25px #1020441a; }
.chart-bulk fieldset { margin-bottom:12px; }
.chart-bulk legend, .chart-repeat legend { font-weight:600; margin-bottom:8px; }
.chart-table-scroll { overflow-x:auto; }
.chart-table { width:100%; border-collapse:collapse; min-width:610px; font-size:12px; }
.chart-table th { text-align:left; color:#52617d; font-size:11px; padding:13px 10px; font-weight:600; border-bottom:1px solid var(--chart-line); }
.chart-table td { padding:15px 10px; vertical-align:middle; border-bottom:1px solid var(--chart-line); line-height:1.5; }
.chart-table th:first-child, .chart-table td:first-child { width:36px; padding-left:18px; padding-right:4px; }
.chart-table th:nth-child(2) { width:24%; }
.chart-table td:last-child { text-align:right; }
.chart-row-selected { background:#f0f4ff; }
.chart-medication-name { display:block; font-weight:650; color:#102044; font-size:13px; }
.chart-medication-name:hover, a.chart-text-button:hover { text-decoration:underline; }
.chart-secondary { display:block; color:#66748c; font-size:11px; margin-top:3px; }
.chart-schedule { max-width:180px; }
.chart-badge { display:inline-block; font-size:11px; padding:4px 8px; border-radius:20px; background:#f0f2f6; white-space:nowrap; }
.chart-badge-ready { background:#d9f6e9; color:#116846; }
.chart-badge-draft { background:#fff1d9; color:#85500e; }
.chart-primary, .chart-secondary-button, .chart-text-button, .chart-row-action { cursor:pointer; font-weight:600; border-radius:7px; font-size:13px; }
.chart-primary { display:inline-flex; align-items:center; justify-content:center; padding:12px 16px; background:#102044; color:white; border:1px solid #102044; white-space:normal; }
.chart-primary:hover { background:#1e3564; }
.chart-secondary-button { display:inline-flex; align-items:center; justify-content:center; padding:10px 13px; color:#263d64; background:white; border:1px solid #cdd5e4; }
.chart-text-button, .chart-row-action { color:#285cb5; padding:8px 2px; background:transparent; border:0; }
.chart-row-action { font-size:11px; text-align:right; }
.chart-stop { font-size:11px; color:#64748b; }
.chart-stop > summary { cursor:pointer; }
.chart-stop form { min-width:150px; text-align:left; }
.chart-list-footer { display:flex; justify-content:space-between; align-items:center; padding:12px 18px; color:#66748c; font-size:12px; }
.chart-add-multiple { margin:0 18px 18px; border:1px dashed #cbd5e1; border-radius:6px; padding:12px; }
.chart-add-multiple summary { cursor:pointer; font-weight:600; color:#285cb5; }
.chart-add-multiple form { padding-top:12px; }
.chart-add-multiple .chart-secondary-button { margin-top:12px; }
.chart-empty { padding:32px 24px; }
.chart-empty h2 { font-size:18px; font-weight:600; }
.chart-empty p { color:#52617d; margin-top:10px; line-height:1.6; max-width:42em; }
.chart-editor { min-width:0; border-left:1px solid var(--chart-line); background:#fcfdff; }
.chart-editor-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 20px 10px; }
.chart-editor-heading h2 { font-size:17px; font-weight:650; overflow-wrap:anywhere; }
.chart-editor-body { display:grid; gap:17px; padding:10px 20px 20px; }
.chart-active-notice { margin:0 20px 12px; background:#eef3ff; color:#344e78; padding:10px; font-size:12px; line-height:1.5; border-radius:6px; }
.medication-chart label { display:block; font-size:12px; color:#52617d; font-weight:550; }
.medication-chart input:not([type=checkbox]):not([type=submit]):not([type=hidden]), .medication-chart select, .medication-chart textarea { display:block; width:100%; min-width:0; border:1px solid #ccd5e4; background:white; border-radius:7px; padding:9px 10px; font-size:13px; line-height:1.4; color:#102044; margin-top:5px; }
.medication-chart textarea { resize:vertical; }
.medication-chart input[type=checkbox] { width:17px; height:17px; accent-color:#193a8c; cursor:pointer; }
.medication-chart :focus-visible { outline:2px solid #3971d8; outline-offset:3px; }
.chart-two-fields { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; }
.chart-day-picker { display:flex; gap:4px; flex-wrap:wrap; margin-top:8px; }
.chart-day-picker label { flex:1; min-width:26px; cursor:pointer; text-align:center; }
.chart-day-picker input[type=checkbox] { display:block; margin:0 auto 4px; }
.chart-day-picker span { display:block; font-size:10px; }
.chart-times-heading { display:flex; justify-content:space-between; align-items:baseline; gap:8px; margin:14px 0 6px; }
.chart-times-heading h3 { font-weight:600; }
.chart-times-heading span { font-size:10px; color:#66748c; }
.chart-times { display:grid; gap:7px; }
.chart-time-slot { border-bottom:1px solid #edf0f6; padding-bottom:7px; }
.chart-time-line { display:flex; align-items:start; gap:8px; flex-wrap:wrap; }
.chart-time-line > input[type=time] { flex:1; max-width:125px; margin-top:0 !important; }
.chart-dose-override { flex:1; min-width:82px; font-size:11px; }
.chart-dose-override summary { cursor:pointer; padding:10px 0; color:#52617d; }
.chart-dose-override[open] { flex-basis:calc(100% - 140px); }
.chart-dose-override .chart-two-fields { grid-template-columns:1fr; }
.chart-remove-time { font-size:10px; }
.chart-details { border-top:1px solid var(--chart-line); padding-top:13px; }
.chart-details > summary { display:flex; justify-content:space-between; gap:10px; cursor:pointer; font-size:13px; font-weight:600; }
.chart-details > summary span { font-weight:400; font-size:11px; color:#66748c; }
.chart-details .chart-field { margin-top:12px; }
.chart-prn-fields { display:grid; gap:13px; }
.chart-completeness { background:#fff6e7; border:1px solid #f2d9a8; padding:10px; border-radius:6px; color:#805012; font-size:12px; }
.chart-completeness summary { cursor:pointer; }
.chart-completeness ul { list-style:disc; padding:8px 0 8px 18px; }
.chart-ready-message { color:#116846; font-size:12px; }
.chart-editor-actions { display:flex; justify-content:space-between; gap:8px; padding:14px 20px; border-top:1px solid var(--chart-line); background:white; position:sticky; bottom:0; }
.chart-editor-actions .chart-primary { font-size:12px; }
.chart-save-state { color:#52617d; font-size:11px; padding:0 20px 8px; }
.chart-discard { font-size:11px; color:#a33d3d; padding:8px 20px 14px; cursor:pointer; }
.chart-footer { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 24px; background:#fff; border-top:1px solid var(--chart-line); }
.chart-footer strong { color:#116846; }
.chart-footer p { font-size:12px; color:#52617d; margin-top:5px; }
.chart-error { background:#fff1f2; color:#9f1239; margin:16px 20px; padding:14px; border:1px solid #fecdd3; border-radius:6px; }
.chart-feedback:not(:empty) { padding:14px 24px; color:#9f1239; background:#fff1f2; }
.chart-review-intro { padding:20px 24px 0; color:#52617d; }
.chart-review-item { margin:20px 24px; border-bottom:1px solid var(--chart-line); padding-bottom:20px; display:flex; flex-wrap:wrap; gap:10px; justify-content:space-between; }
.chart-review-item h2 { font-weight:650; font-size:18px; }
.chart-review-item > p, .chart-review-item table { width:100%; }
.chart-review-item th, .chart-review-item td { padding:8px; text-align:left; border-bottom:1px solid #edf0f6; }
@media (min-width:1200px) { .chart-workspace-editing { grid-template-columns:minmax(0,1fr) 350px; } }
@media (min-width:1500px) { .chart-workspace-editing { grid-template-columns:minmax(0,1fr) 390px; } .chart-table { font-size:13px; } .chart-table th { font-size:12px; } }
@media (max-width:1199px) { .chart-editor { border-left:0; border-top:1px solid var(--chart-line); } .chart-workspace-editing { display:flex; flex-direction:column; } .chart-workspace-editing .chart-editor { order:-1; } .chart-editor-body { grid-template-columns:1fr 1fr; } .chart-editor-body > section, .chart-editor-body > details, .chart-editor-body > p { grid-column:1 / -1; } }
@media (max-width:600px) { .chart-header { padding:18px 14px; } .chart-header h1 { font-size:24px; } .chart-header-status { text-align:left; } .chart-editor-body { grid-template-columns:1fr; padding:10px 14px 16px; } .chart-header nav { gap:6px; } .chart-header nav a { padding:9px 12px; font-size:12px; } .chart-toolbar { flex-wrap:wrap; padding:14px; } .chart-footer { padding:16px 14px; align-items:stretch; flex-direction:column; } .chart-editor-actions { padding:12px 14px; } .chart-table { min-width:640px; } }
@media (min-width:1200px) {
  #admin-main-content:has(.medication-chart:not(.chart-review)) > div { height:calc(100dvh - 64px); display:flex; flex-direction:column; gap:12px; }
  .medication-chart:not(.chart-review) { display:flex; flex:1; flex-direction:column; min-height:0; margin-top:0; }
  .chart-header, .chart-footer { flex-shrink:0; }
  .chart-header { padding:18px 22px 14px; gap:12px; }
  .chart-workspace { flex:1; min-height:0; }
  .chart-list, .chart-editor { overflow-y:auto; }
  .chart-table td { padding-top:12px; padding-bottom:12px; }
  .chart-footer { padding:14px 22px; }
}
.chart-table-scroll { position:relative; }
.chart-table { font-size:13px; }
.chart-table th { font-size:12px; }
.chart-medication-name { font-size:14px; }
.chart-secondary { font-size:12px; }