/* Option 1 — Clean Clinical UI. Visual overrides only; application behavior is untouched. */
:root {
  --clinical-950:#0a2544;
  --clinical-900:#10385f;
  --clinical-700:#275b92;
  --clinical-600:#2968ba;
  --clinical-cyan:#078aa5;
  --clinical-teal:#0b8a73;
  --clinical-bg:#f3f7fb;
  --clinical-card:#ffffff;
  --clinical-line:#d9e4ef;
  --clinical-muted:#64758b;
  --clinical-danger:#c3273b;
  --clinical-shadow:0 8px 28px rgba(15,47,79,.08);
  --clinical-shadow-raised:0 14px 38px rgba(15,47,79,.12);
}

html { background:var(--clinical-bg); }
body { min-height:100vh; background:var(--clinical-bg)!important; color:#1b304a; }
body>main, #entryView main, #patientForm, #patientForm>div, .ts-wrapper { min-width:0; }
#mriEntryBackground { background:linear-gradient(145deg,#f7faff 0%,#eef5fb 52%,#f8fbfd 100%)!important; opacity:1!important; }
#mriEntryBackground>div:first-child { opacity:.28!important; background-size:52px 52px!important; }
#mriEntryBackground>div:nth-child(2) { opacity:.12!important; max-width:920px; }

body>header {
  min-height:66px;
  border-bottom:1px solid var(--clinical-line)!important;
  background:rgba(255,255,255,.97)!important;
  box-shadow:0 5px 22px rgba(11,45,79,.07)!important;
  backdrop-filter:blur(14px);
}
body>header>div { min-height:66px; padding-block:10px!important; }
body>header h1 { color:var(--clinical-950)!important; letter-spacing:-.018em!important; }
body>header h1+p { color:#7b8da4!important; letter-spacing:.14em!important; }
body>header>div>div:first-child>div:first-child { background:linear-gradient(140deg,#2856c7,#0796b3)!important; border-radius:11px!important; box-shadow:0 7px 16px rgba(41,104,186,.2)!important; }

.app-nav-btn {
  min-height:40px!important;
  padding:9px 17px!important;
  border-radius:11px!important;
  border:1px solid #d5e0ec!important;
  box-shadow:none!important;
  font-size:12px!important;
  letter-spacing:.035em!important;
}
.app-nav-btn.active-3d { color:#fff!important; border-color:#285fc1!important; background:linear-gradient(105deg,#3156c8,#285fbd)!important; box-shadow:0 7px 18px rgba(49,86,200,.22)!important; transform:none!important; }
.app-nav-btn.inactive-3d { color:#52647a!important; background:#f8fafc!important; transform:none!important; }
.app-nav-btn.inactive-3d:hover { color:var(--clinical-700)!important; border-color:#b9cce2!important; background:#fff!important; transform:none!important; }

#entryView { padding-top:18px!important; }
#entrySidebar,
#entryRightSidebar>div,
#entryRightSidebar>.outer-wa-box,
#entryRightSidebar>div:last-child {
  border-color:var(--clinical-line)!important;
  background:rgba(255,255,255,.98)!important;
  box-shadow:var(--clinical-shadow-raised)!important;
}
#entrySidebar { border-radius:15px!important; overflow:hidden; }
#entrySidebar>div:first-child,
#rightSidebarContent>div>div:first-child { background:var(--clinical-950)!important; }
#entrySidebar #sidebarList { background:#f7f9fc!important; }
#entrySidebar #sidebarList>div { border-color:#e1e8f1!important; border-radius:9px!important; box-shadow:none!important; }
#entrySidebar #sidebarList>div:hover { border-color:#bfd2e7!important; background:#fff!important; }

#entryRightSidebar { gap:12px!important; }
#entryRightSidebar>div { border-radius:15px!important; }
#entryRightSidebar #rightSidebarContent { padding:11px!important; }
#floatingLockBtn { min-height:46px; border-radius:12px!important; border:0!important; background:var(--clinical-950)!important; box-shadow:0 7px 18px rgba(10,37,68,.15)!important; }
#quickWaBtn { min-height:42px; border-radius:10px!important; box-shadow:none!important; }

#patientForm { gap:16px!important; }
#patientForm>div {
  border:1px solid var(--clinical-line)!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.98)!important;
  box-shadow:var(--clinical-shadow)!important;
}
#patientForm>div:hover { transform:none!important; box-shadow:var(--clinical-shadow-raised)!important; }
#patientForm>div:not(:nth-last-child(-n+2)) { padding:21px!important; }
#patientForm h2 { color:var(--clinical-950)!important; font-size:13px!important; letter-spacing:.075em!important; }
#patientForm h2+p { color:var(--clinical-muted)!important; line-height:1.45!important; }
#patientForm label { color:#435870!important; letter-spacing:.055em!important; }
#patientForm input:not([type="radio"]),
#patientForm select,
#patientForm .ts-control {
  min-height:45px!important;
  border:1px solid #cbd9e8!important;
  border-radius:10px!important;
  background:#fff!important;
  color:#17304d!important;
  box-shadow:0 1px 2px rgba(18,55,91,.025)!important;
}
#patientForm input:not([type="radio"]):hover,
#patientForm select:hover,
#patientForm .ts-control:hover { border-color:#aebfd3!important; }
#patientForm input:not([type="radio"]):focus,
#patientForm select:focus,
#patientForm .ts-wrapper.focus .ts-control { border-color:var(--clinical-600)!important; box-shadow:0 0 0 4px rgba(41,104,186,.11)!important; }
#patientForm input:disabled { background:#f1f5f9!important; color:#8998aa!important; }
#patientForm #discountGroup label,
#patientForm #contrastGroup label,
#patientForm #emergencyGroup label { min-height:43px; border-radius:10px!important; }
#editingPatientNotice { border-left:4px solid #d69e19!important; box-shadow:0 5px 14px rgba(117,79,0,.07); }

#patientForm>div:nth-last-child(2),
#patientForm>div:last-child { min-height:76px; padding:12px!important; box-shadow:var(--clinical-shadow)!important; }
#patientForm>.clear-action,#patientForm>.submit-action { grid-column:span 1!important; display:flex!important; align-items:stretch!important; margin:0!important; }
#clearResetBtn,#submitBtn { min-height:50px!important; border-radius:11px!important; letter-spacing:.06em!important; box-shadow:none!important; }
#clearResetBtn { background:#fff!important; color:var(--clinical-danger)!important; border:1px solid #e8b8c0!important; }
#clearResetBtn:hover { background:#fff5f6!important; border-color:#dd8d9a!important; }
#submitBtn { background:linear-gradient(105deg,#3158c8,#078fae)!important; box-shadow:0 8px 19px rgba(31,110,169,.2)!important; }

#dashboardView>div:nth-child(2) { background:rgba(255,255,255,.98)!important; border-color:var(--clinical-line)!important; box-shadow:0 5px 18px rgba(15,47,79,.06)!important; }
#dashboardView .control-btn,
#dashboardView .primary-btn,
#dashboardView .whatsapp-btn { min-height:36px; border-radius:9px!important; box-shadow:none!important; }
#dashboardView .primary-btn { background:var(--clinical-900)!important; }
#dashboardView .stat-card { min-height:78px; padding:11px 14px!important; border:1px solid var(--clinical-line)!important; border-left:4px solid var(--clinical-600)!important; background:#fff!important; box-shadow:var(--clinical-shadow)!important; }
#dashboardView .stat-card span { font-size:10px!important; line-height:1.2!important; }
#dashboardView .stat-card strong { margin-top:5px!important; font-size:23px!important; line-height:1.05!important; }
#dashboardView .stat-card:nth-child(3) { border-left-color:var(--clinical-teal)!important; }
#dashboardView .stat-card:nth-child(4) { border-left-color:var(--clinical-cyan)!important; }
#reportArea { border:1px solid var(--clinical-line)!important; border-radius:15px!important; box-shadow:var(--clinical-shadow)!important; }
#reportArea thead tr { background:#edf3f9!important; }
#reportArea tbody tr { transition:background .12s ease; }
#reportArea tbody tr:hover { background:#f2f7fd!important; }
#reportArea tfoot tr { background:var(--clinical-950)!important; }
#reportArea>.overflow-x-auto { max-height:62vh; overflow:auto!important; scrollbar-color:#9db4ca #edf3f8; }
.patient-actions button { border-radius:7px!important; box-shadow:none!important; }

#syncFooter {
  width:calc(100% - 32px)!important;
  max-width:1280px;
  margin:16px auto 20px!important;
  min-height:48px!important;
  border:1px solid #d2e0ed!important;
  background:#fff!important;
  color:#33506e!important;
  box-shadow:var(--clinical-shadow)!important;
}
#syncFooter #databaseSyncNotice { min-width:0; overflow-wrap:anywhere; }
#syncFooter #databaseSyncNotice::before { background:var(--clinical-teal)!important; box-shadow:0 0 0 4px rgba(11,138,115,.12)!important; }
#syncFooter #retryDatabaseSync { border:1px solid #c9d8e7!important; color:var(--clinical-700)!important; background:#f5f8fc!important; }
#syncFooter #retryDatabaseSync:hover { background:#eaf2fa!important; }

.management-layer { background:rgba(8,29,51,.7)!important; }
.management-card,.settings-card { border:1px solid var(--clinical-line)!important; border-radius:18px!important; box-shadow:0 28px 70px rgba(7,25,45,.3)!important; max-height:calc(100dvh - 36px)!important; }
.settings-card { display:flex; flex-direction:column; overflow:hidden!important; }
.settings-head { position:sticky; top:-22px; z-index:3; margin:-22px -22px 18px!important; padding:18px 22px; background:#fff; border-bottom:1px solid var(--clinical-line); }
.settings-columns { min-height:0; overflow:auto; }
.settings-columns section { min-width:0; border-color:var(--clinical-line)!important; background:#fafcff; }
.settings-section-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }
.settings-section-head h3 { margin:0!important; }
.settings-section-head [data-master-add] { min-height:34px; padding:7px 11px!important; border:1px solid #b9ded7; background:#e8f7f4!important; color:#087661!important; white-space:nowrap; }
.settings-section-head [data-master-add]:hover { border-color:#7cc9bb; background:#d8f2ec!important; }
.manage-table th { background:#eaf2f9!important; color:#40566f!important; }
.manage-table tbody tr:hover { background:#f2f7fc; }

@media(min-width:1280px) {
  #entrySidebar { left:max(22px,calc((100vw - 1900px)/2))!important; top:86px!important; width:260px!important; height:calc(100vh - 104px)!important; }
  #entryRightSidebar { right:max(22px,calc((100vw - 1900px)/2))!important; top:86px!important; width:270px!important; }
  #entryView main { width:calc(100vw - 610px)!important; max-width:900px!important; margin-left:auto!important; margin-right:auto!important; }
  #syncFooter { width:calc(100vw - 610px)!important; max-width:900px; margin-inline:auto!important; }
  .dashboard-mode #syncFooter { width:auto!important; max-width:1280px; }
  /* One compact desktop toolbar: date controls and all four exports stay together. */
  #dashboardView>div:nth-child(2)>div {
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex-wrap:nowrap!important;
    gap:7px!important;
    width:calc(100% - 24px)!important;
    max-width:1900px!important;
    margin-inline:auto!important;
    padding:8px 0!important;
    overflow-x:auto;
    scrollbar-width:thin;
  }
  #dashboardView>div:nth-child(2)>div>div {
    display:contents!important;
  }
  #dashboardView .control-btn,
  #dashboardView .primary-btn,
  #dashboardView .whatsapp-btn {
    flex:0 0 auto!important;
    min-height:34px!important;
    padding:7px 10px!important;
    font-size:11px!important;
    white-space:nowrap!important;
  }
  #dashboardView .date-input {
    flex:0 0 145px!important;
    width:145px!important;
    min-height:34px!important;
    padding:6px 9px!important;
    font-size:11px!important;
  }
  #dashboardView>div:nth-child(2) label { flex:0 0 auto; margin:0 1px!important; font-size:10px!important; }
  #dashboardView>div:nth-child(2) .h-4.w-px { margin-inline:3px!important; }
}
@media(min-width:1600px) {
  #entrySidebar { width:280px!important; }
  #entryRightSidebar { width:285px!important; }
  #entryView main,#syncFooter { width:calc(100vw - 690px)!important; max-width:980px!important; }
}
@media(min-width:1024px) and (max-width:1279px) {
  #entrySidebar { top:86px!important; height:calc(100vh - 104px)!important; }
  #entryView main { max-width:780px!important; }
  #syncFooter { width:auto!important; max-width:780px; margin-left:270px!important; margin-right:18px!important; }
}
@media(min-width:768px) and (max-width:1023px) {
  body>header>div>div:last-child { display:none!important; }
  #syncFooter { width:calc(100% - 32px)!important; max-width:none; margin:14px 16px 18px!important; }
  #dashboardView>div:nth-child(2) { top:66px!important; }
  .settings-columns { grid-template-columns:1fr; }
  .manage-table { max-height:36vh!important; }
}
@media(max-width:767px) {
  #mriEntryBackground>div:nth-child(2) { display:none!important; }
  body>header { min-height:auto; }
  body>header>div { min-height:auto; gap:9px!important; }
  body>header>div>div:last-child { display:none!important; }
  body>header>div>div:nth-child(2) { gap:6px!important; }
  .app-nav-btn { min-height:39px!important; padding:8px 6px!important; font-size:10px!important; }
  #entryView { padding-top:8px!important; }
  #patientForm { gap:11px!important; }
  #patientForm>div:not(:nth-last-child(-n+2)) { padding:15px!important; }
  #patientForm h2+p { font-size:10px!important; }
  #patientForm>div:nth-last-child(2),#patientForm>div:last-child { min-height:65px; padding:7px!important; }
  #clearResetBtn,#submitBtn { min-height:48px!important; font-size:10px!important; }
  #dashboardView .stat-card { min-height:72px; padding:10px 11px!important; }
  #dashboardView .stat-card strong { font-size:20px!important; }
  #reportArea>.overflow-x-auto { max-height:58vh; }
  #syncFooter { display:grid!important; grid-template-columns:minmax(0,1fr) auto; gap:8px!important; }
  .settings-card { padding:16px!important; }
  .settings-head { top:-16px; margin:-16px -16px 14px!important; padding:14px 16px; }
}
@media(max-width:390px) {
  body>header h1 { font-size:13px!important; }
  .app-nav-btn span { font-size:9px!important; }
  #syncFooter { grid-template-columns:1fr; }
  #syncFooter #retryDatabaseSync { width:100%; }
}
@media(prefers-reduced-motion:reduce) {
  #mriEntryBackground svg { animation:none!important; }
}