/* Clinic presentation on the existing Nexora components. Loaded after appearance.css
   so package updates do not silently restore the default warm palette. */
:root[data-appearance="nexora"] {
    --app-nexora-accent: light-dark(#0b708b, #78cadd);
    --app-nexora-on-accent: light-dark(#ffffff, #102c35);
    --app-nexora-accent-soft: light-dark(#e2f1f5, #193d49);
    --app-nexora-accent-border: light-dark(#7cb4c4, #397f92);
    --app-background: light-dark(#f4f6f8, #111c25);
    --app-surface: light-dark(#ffffff, #1a2935);
    --app-surface-muted: light-dark(#edf1f5, #223543);
    --app-surface-raised: var(--app-surface);
    --app-surface-hover: light-dark(#e8eff3, #2a404f);
    --app-foreground: light-dark(#1d2935, #eef4f7);
    --app-foreground-muted: light-dark(#596b7e, #b5c5d1);
    --app-border: light-dark(#d3dde6, #415767);
    --nexora-input-border: light-dark(#879cad, #7e97a8);
    --nexora-surface-border: var(--app-border);
    --nexora-primary-background-image: none;
    --nexora-primary-shadow: none;
    --nexora-primary-hover-shadow: none;
    --app-shadow-color: light-dark(rgb(26 48 65 / .07), rgb(0 0 0 / .25));
    --app-shadow-sm: none;
    --app-radius-sm: .5rem;
    --app-radius-md: .625rem;
    --app-radius-lg: .8rem;
    --app-radius-xl: 1rem;
}

:root[data-appearance="nexora"] .clinic-shell {
    --app-shell-header-height: 4.4rem;
    --app-shell-navigation-width: 14.5rem;
    font-size: .9375rem;
    line-height: 1.6;
}

:root[data-appearance="nexora"] .clinic-shell .app-shell__header {
    background: var(--app-surface);
    gap: .75rem;
    padding-inline: 1.25rem;
}

:root[data-appearance="nexora"] .clinic-shell .app-shell__navigation {
    background: var(--app-background);
    border-inline-end: 0;
}

.clinic-shell .clinic-brand { font-size: 1rem; line-height: 1.4; }
.clinic-shell .clinic-brand > svg { padding: .45rem; box-sizing: content-box; border-radius: .65rem; color: var(--app-on-brand); background: var(--app-accent); }
.clinic-shell .clinic-brand small { font-size: .75rem; margin-top: 0; }
.clinic-shell .app-shell__navigation-scroll { padding: 1rem .75rem; }
.clinic-shell .app-shell__navigation-footer { border: 0; padding: .75rem 1rem 1rem; }
.clinic-shell .clinic-footer { display: block; padding: .75rem; border-radius: var(--app-radius-md); background: var(--app-surface-muted); font-size: .75rem; }

:root[data-appearance="nexora"] .clinic-shell .app-shell__page-heading { padding: 1.25rem 1.5rem .85rem; }
:root[data-appearance="nexora"] .clinic-shell .app-shell__content { padding-inline: 1.5rem; }
.clinic-shell .workspace { max-width: none; padding-top: 0; }

/* The page title carries the context already. Keep action slots and navigation
   operable; only the redundant section title/icon band leaves the visual and
   accessibility trees. A future section action still retains its own row. */
.clinic-shell .page-heading__section:not(:has(.page-heading__section-actions)),
.clinic-shell .page-heading__section-copy,
.clinic-shell .page-heading__section-icon { display: none; }

:root[data-appearance="nexora"] .clinic-shell .page-heading__body {
    align-items: center;
    padding: .25rem 0 .85rem;
    gap: .75rem 1rem;
}
:root[data-appearance="nexora"] .clinic-shell .page-heading__copy h1 {
    font-size: clamp(1.375rem, 2.2vw, 1.8rem);
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: normal;
    text-wrap: auto;
}
:root[data-appearance="nexora"] .clinic-shell .page-heading__copy p { margin-top: .25rem; line-height: 1.65; font-size: .9375rem; }
:root[data-appearance="nexora"] .clinic-shell .page-heading__icon { width: 1.6rem; height: 2.5rem; }
:root[data-appearance="nexora"] .clinic-shell .application-page-heading__breadcrumbs { padding: 0 0 .35rem; font-size: .8125rem; }
.clinic-shell .page-heading__page-actions { gap: .5rem; }
.clinic-shell .page-heading__navigation { border-top: 0; }

:root[data-appearance="nexora"] .clinic-shell :is(.section-navigation__items a, .section-navigation__overflow > summary) {
    min-height: 44px;
    font-size: .875rem;
    font-weight: 500;
    padding: .5rem .85rem;
}
.clinic-shell .section-navigation__items { padding: 0; gap: .35rem; }
.clinic-shell :is(.section-navigation__primary-items, .section-navigation__optional-items) { gap: .35rem; }
.clinic-shell :is(.section-navigation__mobile-panel, .section-navigation__overflow-panel) a { min-height: 44px; box-sizing: border-box; font-size: .875rem; }

/* Headings, forms and actions use the same Thai-friendly rhythm. */
.clinic-shell :is(.app-button, .app-shell__menu-button, .preferences-selector__trigger, .profile-menu > summary, .theme-selector button) {
    min-height: 44px;
    box-sizing: border-box;
}
.clinic-shell :is(.app-shell__menu-button, .theme-selector button) { min-width: 44px; }
.clinic-shell .app-button { font-size: .875rem; line-height: 1.5; }
.clinic-shell .app-button__label { white-space: normal; }
.clinic-shell .app-form-control__label { font-size: .875rem; line-height: 1.5; }
.clinic-shell .app-form-control__input { font-size: .9375rem; }
.clinic-shell .app-form-control__input-wrap { min-height: 44px; }
/* 100vw includes a desktop scrollbar; a narrow native drawer must fit the
   actual available viewport, including its border. */
.clinic-shell .app-drawer { max-width: 100%; box-sizing: border-box; }
/* Printed documents keep the same authored typography inside the shell and in
   standalone printer/measurement copies. :where keeps UI selector weight unchanged. */
.clinic-shell .workspace :is(h2, h3):not(:where(.medical-certificate *, .printed-receipt *, .medication-label *, .basket-label-sheet *)) { line-height: 1.6; letter-spacing: normal; }
.clinic-shell .workspace h2:not(:where(.medical-certificate *, .printed-receipt *, .medication-label *, .basket-label-sheet *)) { font-size: 1.0625rem; font-weight: 700; }
.clinic-shell .workspace .panel { padding: 1.125rem; margin-bottom: 1.125rem; }
.clinic-shell .workspace .two-columns { gap: 1.125rem; }
.clinic-shell .workspace table:not(:where(.medical-certificate *, .printed-receipt *, .medication-label *, .basket-label-sheet *)) { font-variant-numeric: tabular-nums; }
.clinic-shell .workspace table:not(.quickgrid):not(:where(.medical-certificate *, .printed-receipt *, .medication-label *, .basket-label-sheet *)) th { background: transparent; border-bottom: 1px solid var(--app-border); font-size: .8125rem; }
.clinic-shell .workspace table:not(.quickgrid):not(:where(.medical-certificate *, .printed-receipt *, .medication-label *, .basket-label-sheet *)) td { border-bottom-color: color-mix(in srgb, var(--app-border) 65%, transparent); }

/* Summary data stays scannable without changing any page's calculations. */
.clinic-shell .clinic-status-cards { gap: .75rem; }
.clinic-shell .workspace button.clinic-status-card { padding: .85rem; }
.clinic-shell .clinic-status-card strong { font-size: 1.5rem; }
.clinic-shell .queue-summary > span { flex: 1 1 10rem; min-width: 0; padding: .85rem 1rem; }
.clinic-shell .report-totals { gap: 1rem; }
.clinic-shell .report-totals dd { font-size: 1.65rem; font-weight: 700; }

@container app-shell (max-width: 48rem) {
    :root[data-appearance="nexora"] .clinic-shell .app-shell__header { padding-inline: .75rem; gap: .5rem; }
    :root[data-appearance="nexora"] .clinic-shell .app-shell__navigation { background: var(--app-surface); border-inline-end: 1px solid var(--app-border); }
    :root[data-appearance="nexora"] .clinic-shell .app-shell__page-heading { padding: 1rem .75rem .75rem; }
    :root[data-appearance="nexora"] .clinic-shell .app-shell__content { padding-inline: .75rem; }
    .clinic-shell .clinic-brand { font-size: .9375rem; }
    .clinic-shell .clinic-brand > svg { width: 1.25rem; height: 1.25rem; padding: .4rem; }
    .clinic-shell .app-shell__navigation-scroll { padding: .75rem; }
}

@container page-heading (max-width: 40rem) {
    :root[data-appearance="nexora"] .clinic-shell .page-heading__body { flex-wrap: wrap; align-items: flex-start; }
    .clinic-shell .page-heading__page-actions { width: 100%; justify-content: flex-start; }
    .clinic-shell .page-heading__page-actions > * { flex: 1 1 10rem; }
}

@media (max-width: 560px) {
    .clinic-shell .workspace .panel { padding: .875rem; }
    .clinic-shell .queue-summary > span { padding: .65rem .75rem; }
}

@media (forced-colors: active) {
    .clinic-shell .clinic-brand > svg { color: ButtonText; background: ButtonFace; border: 1px solid ButtonText; }
}