/*
 * dentoAligns operations workspace
 * Visual language: clinical clarity with a quiet marine/teal identity.
 * Deliberately screen-only and scoped to the signed-in application shell.
 */

@media screen {
  body.has-app-sidebar {
    --ops-canvas: #f2f6f8;
    --ops-surface: #ffffff;
    --ops-surface-soft: #f7fafb;
    --ops-ink: #193447;
    --ops-muted: #6d8290;
    --ops-line: #dce6eb;
    --ops-line-soft: #eaf0f3;
    --ops-teal: #16877f;
    --ops-teal-deep: #116b68;
    --ops-teal-wash: #e9f6f3;
    --ops-shadow: 0 5px 18px rgba(25, 52, 71, .045);
    background-color: var(--ops-canvas) !important;
    color: var(--ops-ink);
  }

  body.has-app-sidebar.dark,
  html.dark body.has-app-sidebar {
    --ops-canvas: #101c29;
    --ops-surface: #172838;
    --ops-surface-soft: #1c3041;
    --ops-ink: #e5eef3;
    --ops-muted: #a3b4c0;
    --ops-line: #354b5d;
    --ops-line-soft: #293e50;
    --ops-teal: #4bc0b2;
    --ops-teal-deep: #31a89e;
    --ops-teal-wash: #1c3a40;
    --ops-shadow: 0 10px 25px rgba(0, 0, 0, .18);
  }

  body.has-app-sidebar.dark #appMainNav,
  html.dark body.has-app-sidebar #appMainNav {
    background: linear-gradient(180deg, #172c3b 0%, #142735 100%) !important;
    border-color: #304654;
    box-shadow: 8px 0 26px rgba(0, 0, 0, .16);
  }

  body.has-app-sidebar.dark #desktopAppBrand,
  html.dark body.has-app-sidebar #desktopAppBrand {
    border-color: #304654;
  }

  body.has-app-sidebar.dark .app-brand-copy > span,
  html.dark body.has-app-sidebar .app-brand-copy > span {
    color: #edf6f7;
  }

  body.has-app-sidebar.dark .app-brand-copy > small,
  html.dark body.has-app-sidebar .app-brand-copy > small {
    color: #9bb1bb;
  }

  body.has-app-sidebar.dark #desktopAppLinkList > a.nav-link,
  body.has-app-sidebar.dark #desktopAppLinkList > button.theme-toggle-button,
  body.has-app-sidebar.dark #desktopAppLinkList .notification-container > button,
  html.dark body.has-app-sidebar #desktopAppLinkList > a.nav-link,
  html.dark body.has-app-sidebar #desktopAppLinkList > button.theme-toggle-button,
  html.dark body.has-app-sidebar #desktopAppLinkList .notification-container > button {
    color: #bfd0d9 !important;
  }

  body.has-app-sidebar.dark #desktopAppLinkList > a.nav-link:not(.active):hover,
  body.has-app-sidebar.dark #desktopAppLinkList > button.theme-toggle-button:hover,
  body.has-app-sidebar.dark #desktopAppLinkList .notification-container > button:hover,
  html.dark body.has-app-sidebar #desktopAppLinkList > a.nav-link:not(.active):hover,
  html.dark body.has-app-sidebar #desktopAppLinkList > button.theme-toggle-button:hover,
  html.dark body.has-app-sidebar #desktopAppLinkList .notification-container > button:hover {
    color: #f6fcfd !important;
    border-color: rgba(214, 239, 239, .12);
    background: rgba(234, 248, 249, .08);
  }

  body.has-app-sidebar.dark #desktopAppLinkList .nav-link.active,
  html.dark body.has-app-sidebar #desktopAppLinkList .nav-link.active {
    color: #e7fbf6 !important;
    border-color: #315d5e;
    background: #1c3a40;
    box-shadow: inset 3px 0 0 #55c6b1;
  }

  body.has-app-sidebar.dark #desktopAppLinkList > .nav-section-label,
  html.dark body.has-app-sidebar #desktopAppLinkList > .nav-section-label {
    color: #90a6af;
  }

  body.has-app-sidebar.dark #desktopAppLinkList > .nav-section-divider,
  html.dark body.has-app-sidebar #desktopAppLinkList > .nav-section-divider {
    background: #304654;
  }

  body.has-app-sidebar.dark #mobileMenuToggle,
  body.has-app-sidebar.dark #appMainNav .theme-toggle-mobile,
  html.dark body.has-app-sidebar #mobileMenuToggle,
  html.dark body.has-app-sidebar #appMainNav .theme-toggle-mobile {
    border-color: #304654;
    color: #d8e5e8;
    background: #203744;
  }

  body.has-app-sidebar.dark #mobileMenuPanel .relative.bg-slate-800,
  html.dark body.has-app-sidebar #mobileMenuPanel .relative.bg-slate-800 {
    border-color: #304654;
    background: linear-gradient(180deg, #172c3b 0%, #142735 100%);
  }

  body.has-app-sidebar.dark #mobileMenuPanel .mobile-nav-link,
  html.dark body.has-app-sidebar #mobileMenuPanel .mobile-nav-link {
    color: #bfd0d9;
  }

  body.has-app-sidebar.dark #mobileMenuPanel .mobile-nav-link.active,
  html.dark body.has-app-sidebar #mobileMenuPanel .mobile-nav-link.active {
    color: #e7fbf6;
    border-color: #315d5e;
    background: #1c3a40;
  }

  /* App navigation: a calm, role-aware rail with a clear active state. */
  body.has-app-sidebar #appMainNav {
    background: linear-gradient(180deg, #ffffff 0%, #fbfcfc 100%) !important;
    border-right: 1px solid #e3ebed;
    box-shadow: 8px 0 26px rgba(15, 36, 52, .055);
  }

  body.has-app-sidebar #desktopAppBrand {
    min-height: 82px;
    padding: 18px 18px;
    border-color: #e8eef0;
  }

  body.has-app-sidebar .app-brand-lockup {
    gap: 11px;
    text-decoration: none;
  }

  body.has-app-sidebar .app-brand-logo {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
    padding: 5px;
    border: 1px solid #dbece7;
    border-radius: 12px;
    background: #eaf4f1;
  }

  body.has-app-sidebar .app-brand-copy {
    display: grid;
    min-width: 0;
    gap: 3px;
    overflow: hidden;
    line-height: 1.15;
  }

  body.has-app-sidebar .app-brand-copy > span {
    overflow: hidden;
    color: #1c3d4b;
    font-size: 1.08rem;
    font-weight: 780;
    letter-spacing: -.04em;
    text-overflow: ellipsis;
  }

  body.has-app-sidebar .app-brand-copy > small {
    color: #83969d;
    font-size: .56rem;
    font-weight: 750;
    letter-spacing: .14em;
    white-space: nowrap;
  }

  body.has-app-sidebar #desktopAppLinks {
    padding: 14px 11px 16px;
  }

  body.has-app-sidebar #desktopAppLinkList {
    gap: 5px;
  }

  body.has-app-sidebar #desktopAppLinkList > a.nav-link,
  body.has-app-sidebar #desktopAppLinkList > button.theme-toggle-button,
  body.has-app-sidebar #desktopAppLinkList .notification-container > button {
    min-height: 44px;
    padding: 10px 12px;
    border: 1px solid transparent;
    border-radius: 11px;
    color: #617783 !important;
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.25;
    text-decoration: none;
    transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease, transform 150ms ease;
  }

  body.has-app-sidebar #desktopAppLinkList > a.nav-link:not(.active):hover,
  body.has-app-sidebar #desktopAppLinkList > button.theme-toggle-button:hover,
  body.has-app-sidebar #desktopAppLinkList .notification-container > button:hover {
    color: #1c5e60 !important;
    border-color: #e1ece9;
    background: #f0f6f4;
  }

  body.has-app-sidebar #desktopAppLinkList .nav-link i {
    width: 20px;
    margin-right: 10px;
    color: #8b9ba2;
    font-size: .9rem;
    text-align: center;
  }

  body.has-app-sidebar #desktopAppLinkList > button.theme-toggle-button {
    width: 100%;
    cursor: pointer;
    background: transparent;
    text-align: left;
  }

  body.has-app-sidebar .theme-toggle-button [data-theme-icon] {
    flex: 0 0 20px;
  }

  body.has-app-sidebar #appMainNav .theme-toggle-mobile {
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    place-items: center;
    border: 1px solid #e2eaec;
    border-radius: 12px;
    color: #48616c;
    background: #f4f8f7;
    cursor: pointer;
  }

  body.has-app-sidebar #appMainNav .theme-toggle-mobile:hover {
    background: #eaf3f0;
    color: #126c69;
  }

  body.has-app-sidebar #desktopAppLinkList .nav-link.active {
    color: #126c69 !important;
    border-color: #d8e9e5;
    background: #e7f3f0;
    box-shadow: inset 3px 0 0 #16827b;
  }

  body.has-app-sidebar #desktopAppLinkList .nav-link.active i {
    color: #167b75;
  }

  body.has-app-sidebar #desktopAppLinkList > .nav-section-divider {
    width: auto;
    height: 1px;
    flex: 0 0 auto;
    margin: auto 5px 8px;
    background: #e4ecee;
  }

  body.has-app-sidebar #desktopAppLinkList > .nav-section-label {
    width: 100%;
    padding: 12px 11px 5px;
    color: #99a7ac;
    font-size: .58rem;
    font-weight: 750;
    letter-spacing: .13em;
    line-height: 1.2;
    text-transform: uppercase;
  }

  body.has-app-sidebar #desktopAppLinkList #pendingDoctorBadgeDesktop,
  body.has-app-sidebar #desktopAppLinkList #intakeBadgeDesktop,
  body.has-app-sidebar #desktopAppLinkList #notificationBadge {
    border: 1px solid rgba(255, 255, 255, .16);
    box-shadow: 0 2px 7px rgba(0, 0, 0, .18);
  }

  body.has-app-sidebar #desktopAppLinkList > a.nav-link[href="/auth/logout"] {
    color: #a75a5f !important;
  }

  body.has-app-sidebar #desktopAppLinkList > a.nav-link[href="/auth/logout"]:hover {
    color: #fff !important;
    border-color: #f0d8d9;
    background: #a8585d;
  }

  body.has-app-sidebar #mobileMenuToggle {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    border: 1px solid #e2eaec;
    border-radius: 12px;
    color: #48616c;
    background: #f4f8f7;
  }

  body.has-app-sidebar #mobileMenuToggle svg {
    stroke: currentColor;
  }

  body.has-app-sidebar #mobileMenuPanel .mobile-nav-link i,
  body.has-app-sidebar #mobileMenuPanel a.flex.items-center i {
    width: 22px;
    color: #8b9ba2;
    text-align: center;
  }

  body.has-app-sidebar #mobileMenuPanel a.flex.items-center:not(.mobile-nav-link) {
    min-height: 46px;
    border-radius: 11px;
    color: #617783;
    font-size: .9rem;
    font-weight: 600;
  }

  body.has-app-sidebar #mobileMenuPanel a[href="/auth/logout"] {
    color: #a75a5f !important;
  }

  body.has-app-sidebar #mobileMenuPanel .border-t {
    border-color: #e4ecee;
  }

  body.has-app-sidebar #mobileMenuPanel .relative.bg-slate-800 {
    width: min(84vw, 340px);
    border-color: #e2eaec;
    background: linear-gradient(180deg, #ffffff 0%, #f9fbfa 100%);
    box-shadow: 18px 0 45px rgba(8, 24, 36, .15);
  }

  body.has-app-sidebar #mobileMenuPanel .mobile-nav-link {
    min-height: 46px;
    border: 1px solid transparent;
    border-radius: 11px;
    color: #617783;
    font-size: .9rem;
    font-weight: 600;
    transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease;
  }

  body.has-app-sidebar #mobileMenuPanel .mobile-nav-link:hover {
    color: #1c5e60;
    background: #f0f6f4;
  }

  body.has-app-sidebar #mobileMenuPanel .mobile-nav-link.active {
    color: #126c69;
    border-color: #d8e9e5;
    background: #e7f3f0;
    box-shadow: inset 3px 0 0 #16827b;
  }

  body.has-app-sidebar .page-content,
  body.has-app-sidebar .min-h-screen.bg-gray-100 {
    color: var(--ops-ink);
    background: var(--ops-canvas) !important;
  }

  /* Workspace page rhythm and title hierarchy */
  body.has-app-sidebar .page-content > .max-w-7xl,
  body.has-app-sidebar .min-h-screen.bg-gray-100 > .max-w-7xl {
    padding-top: clamp(1.15rem, 2.5vw, 2rem);
    padding-bottom: clamp(2rem, 4vw, 3.5rem);
  }

  body.has-app-sidebar .page-content :is(h1, h2, h3, h4),
  body.has-app-sidebar .max-w-7xl :is(h1, h2, h3, h4) {
    color: var(--ops-ink);
    letter-spacing: -.025em;
  }

  body.has-app-sidebar .page-content > .max-w-7xl > :is(.flex, header):first-child,
  body.has-app-sidebar .max-w-7xl > :is(.flex, header):first-child {
    row-gap: .8rem;
  }

  body.has-app-sidebar .page-content :is(p, label, small),
  body.has-app-sidebar .max-w-7xl :is(p, label, small) {
    color: inherit;
  }

  body.has-app-sidebar .page-content .text-gray-500,
  body.has-app-sidebar .page-content .text-gray-600,
  body.has-app-sidebar .max-w-7xl .text-gray-500,
  body.has-app-sidebar .max-w-7xl .text-gray-600 {
    color: var(--ops-muted) !important;
  }

  /* Shared surfaces: directory panels, settings sections, filters and cards */
  body.has-app-sidebar .page-content .bg-white,
  body.has-app-sidebar .max-w-7xl .bg-white {
    background-color: var(--ops-surface);
  }

  body.has-app-sidebar .page-content .border,
  body.has-app-sidebar .page-content .border-t,
  body.has-app-sidebar .page-content .border-b,
  body.has-app-sidebar .max-w-7xl .border,
  body.has-app-sidebar .max-w-7xl .border-t,
  body.has-app-sidebar .max-w-7xl .border-b {
    border-color: var(--ops-line);
  }

  body.has-app-sidebar .page-content :is(.rounded-xl, .rounded-2xl).bg-white,
  body.has-app-sidebar .page-content .bg-white.rounded-xl,
  body.has-app-sidebar .page-content .bg-white.rounded-2xl,
  body.has-app-sidebar .max-w-7xl .rounded-xl.bg-white,
  body.has-app-sidebar .max-w-7xl .rounded-2xl.bg-white,
  body.has-app-sidebar .max-w-7xl .bg-white.rounded-xl,
  body.has-app-sidebar .max-w-7xl .bg-white.rounded-2xl {
    border-color: var(--ops-line);
    box-shadow: var(--ops-shadow);
  }

  body.has-app-sidebar .max-w-7xl .doctor-directory {
    border-color: var(--ops-line);
    background: var(--ops-surface);
    box-shadow: var(--ops-shadow);
  }

  body.has-app-sidebar .page-content :is(.bg-gray-50, .bg-gray-100),
  body.has-app-sidebar .max-w-7xl :is(.bg-gray-50, .bg-gray-100) {
    background-color: var(--ops-surface-soft);
  }

  /* Tables stay information-dense, but gain clear headers and row rhythm. */
  body.has-app-sidebar .page-content table,
  body.has-app-sidebar .max-w-7xl table {
    border-color: var(--ops-line);
    color: var(--ops-ink);
  }

  body.has-app-sidebar .page-content table thead,
  body.has-app-sidebar .max-w-7xl table thead {
    background: var(--ops-surface-soft);
  }

  body.has-app-sidebar .page-content table thead th,
  body.has-app-sidebar .max-w-7xl table thead th {
    border-color: var(--ops-line);
    color: #708491;
    font-size: .69rem;
    font-weight: 700;
    letter-spacing: .065em;
    text-transform: uppercase;
  }

  body.has-app-sidebar .page-content table tbody tr,
  body.has-app-sidebar .max-w-7xl table tbody tr {
    border-color: var(--ops-line-soft);
    transition: background-color 140ms ease;
  }

  body.has-app-sidebar .page-content table tbody tr:hover,
  body.has-app-sidebar .max-w-7xl table tbody tr:hover {
    background-color: color-mix(in srgb, var(--ops-teal) 4%, var(--ops-surface));
  }

  body.has-app-sidebar .page-content table td,
  body.has-app-sidebar .max-w-7xl table td {
    border-color: var(--ops-line-soft);
    color: var(--ops-ink);
    vertical-align: middle;
  }

  body.has-app-sidebar .page-content .overflow-x-auto,
  body.has-app-sidebar .max-w-7xl .overflow-x-auto {
    -webkit-overflow-scrolling: touch;
  }

  /* Forms: accessible focus, legible controls and consistent sizing. */
  body.has-app-sidebar .page-content :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]):not([type="hidden"]),
    select,
    textarea
  ),
  body.has-app-sidebar .max-w-7xl :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]):not([type="hidden"]),
    select,
    textarea
  ) {
    border-color: var(--ops-line);
    border-radius: 9px;
    background-color: var(--ops-surface);
    color: var(--ops-ink);
    transition: border-color 150ms ease, box-shadow 150ms ease, background-color 150ms ease;
  }

  body.has-app-sidebar .page-content :is(input, select, textarea)::placeholder,
  body.has-app-sidebar .max-w-7xl :is(input, select, textarea)::placeholder {
    color: #91a1ab;
  }

  body.has-app-sidebar .page-content :is(input, select, textarea):focus,
  body.has-app-sidebar .max-w-7xl :is(input, select, textarea):focus {
    border-color: var(--ops-teal) !important;
    outline: 0;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--ops-teal) 17%, transparent);
  }

  body.has-app-sidebar .page-content :is(input[type="checkbox"], input[type="radio"]),
  body.has-app-sidebar .max-w-7xl :is(input[type="checkbox"], input[type="radio"]) {
    accent-color: var(--ops-teal);
  }

  body.has-app-sidebar .page-content :is(a, button, input, select, textarea):focus-visible,
  body.has-app-sidebar .max-w-7xl :is(a, button, input, select, textarea):focus-visible {
    outline: 3px solid color-mix(in srgb, var(--ops-teal) 52%, transparent);
    outline-offset: 2px;
  }

  /* Primary and neutral actions; status/semantic colors remain page-owned. */
  body.has-app-sidebar .page-content :is(
    button[class*="bg-blue-"],
    button[class*="bg-purple-"],
    button[class*="bg-indigo-"],
    button[class*="bg-teal-"],
    button[class*="bg-slate-"],
    a[class*="bg-blue-"],
    a[class*="bg-purple-"],
    a[class*="bg-indigo-"],
    a[class*="bg-teal-"],
    a[class*="bg-slate-"]
  ),
  body.has-app-sidebar .max-w-7xl :is(
    button[class*="bg-blue-"],
    button[class*="bg-purple-"],
    button[class*="bg-indigo-"],
    button[class*="bg-teal-"],
    button[class*="bg-slate-"],
    a[class*="bg-blue-"],
    a[class*="bg-purple-"],
    a[class*="bg-indigo-"],
    a[class*="bg-teal-"],
    a[class*="bg-slate-"]
  ) {
    border-radius: 9px;
    font-weight: 650;
    transition: background-color 150ms ease, border-color 150ms ease, transform 150ms ease, box-shadow 150ms ease;
  }

  body.has-app-sidebar .page-content :is(
    button[class*="bg-blue-600"],
    button[class*="bg-purple-600"],
    button[class*="bg-indigo-600"],
    button[class*="bg-teal-600"],
    a[class*="bg-blue-600"],
    a[class*="bg-purple-600"],
    a[class*="bg-indigo-600"],
    a[class*="bg-teal-600"]
  ),
  body.has-app-sidebar .max-w-7xl :is(
    button[class*="bg-blue-600"],
    button[class*="bg-purple-600"],
    button[class*="bg-indigo-600"],
    button[class*="bg-teal-600"],
    a[class*="bg-blue-600"],
    a[class*="bg-purple-600"],
    a[class*="bg-indigo-600"],
    a[class*="bg-teal-600"]
  ) {
    border-color: var(--ops-teal-deep);
    background-color: var(--ops-teal) !important;
    color: #fff !important;
    box-shadow: 0 3px 9px color-mix(in srgb, var(--ops-teal) 18%, transparent);
  }

  body.has-app-sidebar .page-content :is(
    button[class*="bg-blue-600"],
    button[class*="bg-purple-600"],
    button[class*="bg-indigo-600"],
    button[class*="bg-teal-600"],
    a[class*="bg-blue-600"],
    a[class*="bg-purple-600"],
    a[class*="bg-indigo-600"],
    a[class*="bg-teal-600"]
  ):hover,
  body.has-app-sidebar .max-w-7xl :is(
    button[class*="bg-blue-600"],
    button[class*="bg-purple-600"],
    button[class*="bg-indigo-600"],
    button[class*="bg-teal-600"],
    a[class*="bg-blue-600"],
    a[class*="bg-purple-600"],
    a[class*="bg-indigo-600"],
    a[class*="bg-teal-600"]
  ):hover {
    background-color: var(--ops-teal-deep) !important;
    transform: translateY(-1px);
  }

  /* Alerts retain their established amber/red/green semantics. */
  body.has-app-sidebar .page-content :is(
    [role="alert"], [role="status"],
    [class*="bg-amber-"], [class*="bg-yellow-"], [class*="bg-red-"],
    [class*="bg-green-"], [class*="bg-emerald-"], [class*="bg-blue-"]
  ),
  body.has-app-sidebar .max-w-7xl :is(
    [role="alert"], [role="status"],
    [class*="bg-amber-"], [class*="bg-yellow-"], [class*="bg-red-"],
    [class*="bg-green-"], [class*="bg-emerald-"], [class*="bg-blue-"]
  ) {
    border-radius: 11px;
  }

  /* Size dashboard metric cards to the usable content width, not the viewport. */
  body.has-app-sidebar .running-cases-page .running-case-metrics {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
    gap: 12px;
  }

  body.has-app-sidebar .running-cases-page .running-case-metrics > div {
    min-width: 0;
    min-height: 112px;
    padding: 14px;
  }

  body.has-app-sidebar .running-cases-page .running-case-metrics > div > div:first-child > div:first-child {
    min-width: 0;
    flex: 1 1 auto;
  }

  body.has-app-sidebar .running-cases-page .running-case-metrics > div > div:first-child > div:last-child {
    flex: 0 0 auto;
  }

  body.has-app-sidebar .running-cases-page .running-case-metrics p:first-child {
    line-height: 1.25;
    overflow-wrap: anywhere;
  }

  /* Keep semantic KPI gradients legible when the workspace is in dark mode. */
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="bg-gradient-to-br"][class*="from-blue-50"],
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="bg-gradient-to-br"][class*="from-blue-50"] {
    border-color: #2e4e68 !important;
    background-color: #1b344b !important;
    background-image: none !important;
  }

  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="bg-gradient-to-br"][class*="from-yellow-50"],
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="bg-gradient-to-br"][class*="from-yellow-50"] {
    border-color: #5b4b28 !important;
    background-color: #3a321d !important;
    background-image: none !important;
  }

  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="bg-gradient-to-br"][class*="from-green-50"],
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="bg-gradient-to-br"][class*="from-green-50"] {
    border-color: #315742 !important;
    background-color: #1d392e !important;
    background-image: none !important;
  }

  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="bg-gradient-to-br"][class*="from-purple-50"],
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="bg-gradient-to-br"][class*="from-purple-50"] {
    border-color: #493f6d !important;
    background-color: #2c2742 !important;
    background-image: none !important;
  }

  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="bg-gradient-to-br"][class*="from-orange-50"],
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="bg-gradient-to-br"][class*="from-orange-50"] {
    border-color: #60452d !important;
    background-color: #3b2c20 !important;
    background-image: none !important;
  }

  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="bg-gradient-to-br"][class*="from-teal-50"],
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="bg-gradient-to-br"][class*="from-teal-50"] {
    border-color: #2e5d58 !important;
    background-color: #1c3e3b !important;
    background-image: none !important;
  }

  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="text-blue-600"] { color: #93c5fd !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="text-blue-900"] { color: #dbeafe !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="bg-blue-200"] { background-color: #2a4965 !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="text-yellow-600"] { color: #fcd34d !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="text-yellow-900"] { color: #fef3c7 !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="bg-yellow-200"] { background-color: #59471f !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="text-green-600"] { color: #86efac !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="text-green-900"] { color: #dcfce7 !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="bg-green-200"] { background-color: #234c35 !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="text-purple-600"] { color: #c4b5fd !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="text-purple-900"] { color: #ede9fe !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="bg-purple-200"] { background-color: #463775 !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="text-orange-600"] { color: #fdba74 !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="text-orange-900"] { color: #ffedd5 !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="bg-orange-200"] { background-color: #57391e !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="text-teal-600"] { color: #5eead4 !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="text-teal-900"] { color: #ccfbf1 !important; }
  body.has-app-sidebar.dark .min-h-screen.bg-gray-100 [class*="bg-teal-200"] { background-color: #245b57 !important; }

  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="text-blue-600"] { color: #93c5fd !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="text-blue-900"] { color: #dbeafe !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="bg-blue-200"] { background-color: #2a4965 !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="text-yellow-600"] { color: #fcd34d !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="text-yellow-900"] { color: #fef3c7 !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="bg-yellow-200"] { background-color: #59471f !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="text-green-600"] { color: #86efac !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="text-green-900"] { color: #dcfce7 !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="bg-green-200"] { background-color: #234c35 !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="text-purple-600"] { color: #c4b5fd !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="text-purple-900"] { color: #ede9fe !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="bg-purple-200"] { background-color: #463775 !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="text-orange-600"] { color: #fdba74 !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="text-orange-900"] { color: #ffedd5 !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="bg-orange-200"] { background-color: #57391e !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="text-teal-600"] { color: #5eead4 !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="text-teal-900"] { color: #ccfbf1 !important; }
  html.dark body.has-app-sidebar .min-h-screen.bg-gray-100 [class*="bg-teal-200"] { background-color: #245b57 !important; }

  /* Doctor directory's purpose-built presentation, kept within its own view. */
  body.has-app-sidebar #doctors .doctor-directory thead tr {
    background: var(--ops-surface-soft);
    border-color: var(--ops-line);
  }

  body.has-app-sidebar #doctors .doctor-directory tbody tr:hover {
    background: color-mix(in srgb, var(--ops-teal) 4%, var(--ops-surface));
  }

  body.has-app-sidebar #doctors .doctor-directory tbody td {
    border-color: var(--ops-line-soft);
    color: var(--ops-muted);
  }

  body.has-app-sidebar #doctors .doctor-directory tbody td:first-child div:first-child {
    color: var(--ops-ink);
  }

  @media (max-width: 767px) {
    body.has-app-sidebar #appMainNav .app-brand-lockup {
      max-width: calc(100vw - 124px);
    }

    body.has-app-sidebar #appMainNav .theme-toggle-mobile {
      width: 38px;
      height: 38px;
      flex-basis: 38px;
    }

    body.has-app-sidebar #appMainNav .app-brand-copy > span {
      font-size: 1rem;
    }

    body.has-app-sidebar #appMainNav .app-brand-copy > small {
      font-size: .52rem;
    }

    body.has-app-sidebar .page-content > .max-w-7xl,
    body.has-app-sidebar .min-h-screen.bg-gray-100 > .max-w-7xl {
      padding-top: 1rem;
      padding-bottom: 2rem;
    }

    body.has-app-sidebar .page-content table,
    body.has-app-sidebar .max-w-7xl table {
      font-size: .82rem;
    }

    body.has-app-sidebar .page-content table :is(th, td),
    body.has-app-sidebar .max-w-7xl table :is(th, td) {
      padding-right: .65rem;
      padding-left: .65rem;
    }

    body.has-app-sidebar .page-content :is(input, select, textarea),
    body.has-app-sidebar .max-w-7xl :is(input, select, textarea) {
      font-size: 16px;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    body.has-app-sidebar .page-content *,
    body.has-app-sidebar .max-w-7xl * {
      scroll-behavior: auto !important;
      transition-duration: .01ms !important;
      animation-duration: .01ms !important;
    }
  }
}
