/*
 * Quick95 design layer
 *
 * Source: resources/css/hms-tokens.css
 * Loaded copy: public/css/hms-tokens.css (linked from layout/style.blade.php)
 *
 * This file is the contract. Pages may not introduce their own colours,
 * radii, shadows or type sizes. Brand colours arrive as --brand-* custom
 * properties from layout/brand-tokens.blade.php, resolved per tenant.
 */

/*
 * Bundled Burmese faces so the panel does not depend on the operating system.
 *
 * Every Myanmar face below declares a unicode-range, so it only claims Myanmar
 * characters. Latin copy ("Verify you're human", "Don't have an account?",
 * digits, email addresses) therefore falls through to Inter instead of being
 * drawn with a Myanmar face.
 *
 * The 700 cut is bundled too: without it browsers fake bold on Burmese
 * headings and smear the stacked vowel/tone marks.
 */
@font-face {
    font-family: 'Padauk';
    src: url('/fonts/padauk/400-myanmar.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    unicode-range: U+1000-109F, U+200C-200D, U+25CC, U+A92E, U+A9E0-A9FE, U+AA60-AA7F, U+116D0-116E3;
}

@font-face {
    font-family: 'Padauk';
    src: url('/fonts/padauk/700-myanmar.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    unicode-range: U+1000-109F, U+200C-200D, U+25CC, U+A92E, U+A9E0-A9FE, U+AA60-AA7F, U+116D0-116E3;
}

@font-face {
    font-family: 'Noto Sans Myanmar';
    src: url('/fonts/noto-sans-myanmar/400-myanmar.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    unicode-range: U+1000-109F, U+200C-200D, U+25CC, U+A92E, U+A9E0-A9FE, U+AA60-AA7F, U+116D0-116E3;
}

@font-face {
    font-family: 'Noto Sans Myanmar';
    src: url('/fonts/noto-sans-myanmar/600-myanmar.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
    unicode-range: U+1000-109F, U+200C-200D, U+25CC, U+A92E, U+A9E0-A9FE, U+AA60-AA7F, U+116D0-116E3;
}

@font-face {
    font-family: 'Noto Sans Myanmar';
    src: url('/fonts/noto-sans-myanmar/700-myanmar.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    unicode-range: U+1000-109F, U+200C-200D, U+25CC, U+A92E, U+A9E0-A9FE, U+AA60-AA7F, U+116D0-116E3;
}

@font-face {
    font-family: 'Pyidaungsu';
    src: url('/fonts/Pyidaungsu.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    unicode-range: U+1000-109F, U+200C-200D, U+25CC, U+A92E, U+A9E0-A9FE, U+AA60-AA7F;
}

:root {
    /* Fallbacks so the UI still renders if the brand hook is unavailable. */    --brand-50: #f1fbf0;
    --brand-100: #dff6dd;
    --brand-200: #c2ecc0;
    --brand-300: #97dc95;
    --brand-400: #6dc96b;
    --brand-500: #4fb848;
    --brand-600: #2c7f35;
    --brand-700: #226628;
    --brand-800: #1b5120;
    --brand-900: #143d18;
    --brand-950: #0b2410;
    --brand-ink: #ffffff;

    --accent-50: #fffbeb;
    --accent-100: #fef3c7;
    --accent-200: #fde68a;
    --accent-300: #fcd34d;
    --accent-400: #fdbf3a;
    --accent-500: #fdb716;
    --accent-600: #d99b00;
    --accent-700: #8a5d00;
    --accent-800: #6b4800;
    --accent-900: #4d3400;
    --accent-950: #2e1f00;
    --accent-ink: #15181a;

    /* Semantic. Never tenant-configurable. */
    --hms-critical: #dc2626;
    --hms-critical-soft: #fef2f2;
    --hms-critical-border: #fecaca;
    --hms-warning: #b45309;
    --hms-warning-soft: #fffbeb;
    --hms-warning-border: #fde68a;
    --hms-success: #047857;
    --hms-success-soft: #ecfdf5;
    --hms-success-border: #a7f3d0;
    --hms-info: #1d4ed8;
    --hms-info-soft: #eff6ff;
    --hms-info-border: #bfdbfe;
    --hms-neutral: #475569;
    --hms-neutral-soft: #f8fafc;
    --hms-neutral-border: #e2e8f0;

    /* Neutrals. */
    --hms-canvas: #f8fafc;
    --hms-surface: #ffffff;
    --hms-surface-2: #f1f5f9;
    --hms-border: #e2e8f0;
    --hms-ink: #0f172a;
    --hms-ink-muted: #64748b;

    /* Type. Filament ships the family as 'Inter Variable', not 'Inter'. Latin
     * stays first so Latin runs inside a Burmese paragraph are not shaped by
     * a Myanmar face; Myanmar characters fall through to the bundled faces. */
    --hms-font-sans: 'Inter Variable', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --hms-font-burmese: 'Inter Variable', 'Inter', 'Padauk', 'Noto Sans Myanmar', 'Pyidaungsu', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --hms-font-mono: 'Inter Variable', 'Inter', ui-monospace, SFMono-Regular, Menlo, monospace;

    --hms-text-xs: 0.75rem;
    --hms-text-sm: 0.8125rem;
    --hms-text-base: 0.875rem;
    --hms-text-md: 1rem;
    --hms-text-lg: 1.125rem;
    --hms-text-xl: 1.25rem;
    --hms-text-2xl: 1.5rem;
    --hms-text-3xl: 1.875rem;

    --hms-leading-latin: 1.5;
    --hms-leading-burmese: 1.8;

    /* Space, on a 4px grid. */
    --hms-space-1: 0.25rem;
    --hms-space-2: 0.5rem;
    --hms-space-3: 0.75rem;
    --hms-space-4: 1rem;
    --hms-space-5: 1.25rem;
    --hms-space-6: 1.5rem;
    --hms-space-8: 2rem;
    --hms-space-10: 2.5rem;
    --hms-space-12: 3rem;

    /* Shape + elevation. Overridden per tenant by brand-tokens. */
    --brand-radius-sm: 6px;
    --brand-radius-md: 10px;
    --brand-radius-lg: 14px;
    --hms-radius-sm: var(--brand-radius-sm);
    --hms-radius-md: var(--brand-radius-md);
    --hms-radius-lg: var(--brand-radius-lg);

    --hms-shadow-sm: 0 1px 2px rgb(15 23 42 / 0.06);
    --hms-shadow-md: 0 4px 12px -2px rgb(15 23 42 / 0.08), 0 2px 4px -2px rgb(15 23 42 / 0.05);
    --hms-shadow-lg: 0 18px 40px -24px rgb(15 23 42 / 0.35);

    --hms-touch-target: 44px;
    --brand-row-height: 44px;
    --brand-cell-padding: 12px 16px;

    --hms-focus-ring: 0 0 0 2px var(--hms-surface), 0 0 0 4px var(--brand-600);

    --hms-duration-fast: 120ms;
    --hms-duration-base: 200ms;
    --hms-ease: cubic-bezier(0.2, 0.7, 0.3, 1);
}

.dark {
    --hms-critical: #f87171;
    --hms-critical-soft: rgb(127 29 29 / 0.25);
    --hms-critical-border: rgb(248 113 113 / 0.45);
    --hms-warning: #fbbf24;
    --hms-warning-soft: rgb(120 53 15 / 0.3);
    --hms-warning-border: rgb(251 191 36 / 0.45);
    --hms-success: #34d399;
    --hms-success-soft: rgb(6 78 59 / 0.3);
    --hms-success-border: rgb(52 211 153 / 0.45);
    --hms-info: #93c5fd;
    --hms-info-soft: rgb(30 58 138 / 0.3);
    --hms-info-border: rgb(147 197 253 / 0.45);
    --hms-neutral: #cbd5e1;
    --hms-neutral-soft: rgb(30 41 59 / 0.6);
    --hms-neutral-border: rgb(51 65 85);

    --hms-canvas: #0b1220;
    --hms-surface: #111c2e;
    --hms-surface-2: #16233a;
    --hms-border: #22304a;
    --hms-ink: #e2e8f0;
    --hms-ink-muted: #94a3b8;

    --hms-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.4);
    --hms-shadow-md: 0 6px 18px -8px rgb(0 0 0 / 0.6);
    --hms-shadow-lg: 0 22px 48px -28px rgb(0 0 0 / 0.85);

    --hms-focus-ring: 0 0 0 2px var(--hms-surface), 0 0 0 4px var(--brand-400);
}

/* ------------------------------------------------------------------ *
 * Typography
 * ------------------------------------------------------------------ */

body,
.fi-body {
    font-family: var(--hms-font-sans);
    font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
    text-rendering: optimizeLegibility;
}

/* Burmese leading applies to Burmese only. Latin text keeps 1.5. */
:lang(my),
:lang(my-MM),
:lang(my_MM) {
    font-family: var(--hms-font-burmese);
    line-height: var(--hms-leading-burmese);
}

.fi-ta-header-cell,
.fi-ta-text-item,
.fi-input,
.fi-select,
.fi-ta-cell,
.fi-btn,
.fi-sidebar-item-label {
    font-family: inherit;
}

.hms-money,
.hms-numeric {
    font-variant-numeric: tabular-nums;
    font-family: var(--hms-font-mono);
}

/* ------------------------------------------------------------------ *
 * Base behaviour
 * ------------------------------------------------------------------ */

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: none;
    box-shadow: var(--hms-focus-ring);
    border-radius: var(--hms-radius-sm);
}

::selection {
    background: var(--brand-200);
    color: var(--brand-950);
}

.dark ::selection {
    background: var(--brand-800);
    color: #ffffff;
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

@media (prefers-contrast: more) {
    :root {
        --hms-critical: #991b1b;
        --hms-warning: #92400e;
        --hms-success: #065f46;
        --hms-info: #1e40af;
        --hms-border: #94a3b8;
    }
}

/* ------------------------------------------------------------------ *
 * Page frame
 * ------------------------------------------------------------------ */

.hms-page {
    display: flex;
    flex-direction: column;
    gap: var(--hms-space-6);
    max-width: 1600px;
    margin-inline: auto;
    width: 100%;
}

.hms-page-header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--hms-space-4);
}

.hms-page-header__text {
    min-width: 0;
}

.hms-page-eyebrow {
    font-size: var(--hms-text-xs);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--hms-ink-muted);
    margin-bottom: var(--hms-space-1);
}

.hms-page-title {
    font-size: var(--hms-text-2xl);
    font-weight: 700;
    letter-spacing: -0.015em;
    line-height: 1.2;
    color: var(--hms-ink);
}

.hms-page-description {
    margin-top: var(--hms-space-1);
    font-size: var(--hms-text-base);
    color: var(--hms-ink-muted);
    max-width: 70ch;
}

.hms-page-actions {
    display: flex;
    align-items: center;
    gap: var(--hms-space-2);
    flex-wrap: wrap;
}

.hms-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--hms-space-3);
    padding: var(--hms-space-3);
    background: var(--hms-surface);
    border: 1px solid var(--hms-border);
    border-radius: var(--hms-radius-md);
    box-shadow: var(--hms-shadow-sm);
    color: var(--hms-ink);
}

.hms-grid {
    display: grid;
    gap: var(--hms-space-4);
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

.hms-grid--stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 640px) {
    .hms-grid--2,
    .hms-grid--3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .hms-grid--stats {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .hms-grid--2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hms-grid--3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* ------------------------------------------------------------------ *
 * Cards
 * ------------------------------------------------------------------ */

.hms-card {
    background: var(--hms-surface);
    border: 1px solid var(--hms-border);
    border-radius: var(--hms-radius-md);
    box-shadow: var(--hms-shadow-sm);
    padding: var(--hms-space-4);
    color: var(--hms-ink);
}

.hms-card--flush {
    padding: 0;
    overflow: hidden;
}

.hms-stat {
    display: flex;
    flex-direction: column;
    gap: var(--hms-space-1);
    position: relative;
    padding: var(--hms-space-4);
    background: var(--hms-surface);
    border: 1px solid var(--hms-border);
    border-radius: var(--hms-radius-md);
    box-shadow: var(--hms-shadow-sm);
    color: var(--hms-ink);
}

.hms-stat__label {
    font-size: var(--hms-text-xs);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--hms-ink-muted);
}

.hms-stat__value {
    font-size: var(--hms-text-3xl);
    font-weight: 700;
    line-height: 1.1;
    color: var(--hms-ink);
    font-variant-numeric: tabular-nums;
}

.hms-stat__meta {
    font-size: var(--hms-text-sm);
    color: var(--hms-ink-muted);
}

.hms-stat--accent {
    border-top: 3px solid var(--brand-500);
}

.hms-stat--critical {
    border-top: 3px solid var(--hms-critical);
}

.hms-stat--warning {
    border-top: 3px solid var(--hms-warning);
}

.hms-stat--success {
    border-top: 3px solid var(--hms-success);
}

/* ------------------------------------------------------------------ *
 * Status
 * ------------------------------------------------------------------ */

.hms-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    border-radius: 9999px;
    padding: 0.125rem 0.625rem;
    font-size: var(--hms-text-xs);
    font-weight: 600;
    line-height: 1.4;
    border: 1px solid transparent;
    white-space: nowrap;
}

.hms-pill--critical {
    background: var(--hms-critical-soft);
    color: var(--hms-critical);
    border-color: var(--hms-critical-border);
}

.hms-pill--warning {
    background: var(--hms-warning-soft);
    color: var(--hms-warning);
    border-color: var(--hms-warning-border);
}

.hms-pill--success {
    background: var(--hms-success-soft);
    color: var(--hms-success);
    border-color: var(--hms-success-border);
}

.hms-pill--info {
    background: var(--hms-info-soft);
    color: var(--hms-info);
    border-color: var(--hms-info-border);
}

.hms-pill--neutral {
    background: var(--hms-neutral-soft);
    color: var(--hms-neutral);
    border-color: var(--hms-neutral-border);
}

.hms-pill--accent {
    background: var(--accent-100);
    color: var(--accent-ink);
    border-color: var(--accent-200);
}

/* ------------------------------------------------------------------ *
 * Banners, empty, loading, error
 * ------------------------------------------------------------------ */

.hms-banner {
    display: flex;
    align-items: flex-start;
    gap: var(--hms-space-2);
    padding: var(--hms-space-3) var(--hms-space-4);
    border-radius: var(--hms-radius-sm);
    border: 1px solid var(--hms-border);
    font-size: var(--hms-text-base);
}

.hms-banner--critical {
    background: var(--hms-critical-soft);
    border-color: var(--hms-critical-border);
    color: var(--hms-critical);
}

.hms-banner--warning {
    background: var(--hms-warning-soft);
    border-color: var(--hms-warning-border);
    color: var(--hms-warning);
}

.hms-banner--info {
    background: var(--hms-info-soft);
    border-color: var(--hms-info-border);
    color: var(--hms-info);
}

.hms-banner--success {
    background: var(--hms-success-soft);
    border-color: var(--hms-success-border);
    color: var(--hms-success);
}

.hms-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--hms-space-2);
    padding: var(--hms-space-10) var(--hms-space-6);
    text-align: center;
    border: 1px dashed var(--hms-border);
    border-radius: var(--hms-radius-md);
    color: var(--hms-ink-muted);
}

.hms-empty__icon {
    color: var(--hms-ink-muted);
    opacity: 0.7;
}

.hms-empty__title {
    font-size: var(--hms-text-md);
    font-weight: 600;
    color: var(--hms-ink);
}

.hms-empty__description {
    max-width: 46ch;
    font-size: var(--hms-text-base);
}

.hms-skeleton {
    position: relative;
    overflow: hidden;
    background: var(--hms-surface-2);
    border-radius: var(--hms-radius-sm);
    min-height: 0.75rem;
}

.hms-skeleton::after {
    content: '';
    position: absolute;
    inset: 0;
    transform: translateX(-100%);
    background: linear-gradient(90deg, transparent, rgb(255 255 255 / 0.35), transparent);
    animation: hms-shimmer 1.4s infinite;
}

.dark .hms-skeleton::after {
    background: linear-gradient(90deg, transparent, rgb(255 255 255 / 0.08), transparent);
}

@keyframes hms-shimmer {
    100% {
        transform: translateX(100%);
    }
}

.hms-error {
    display: flex;
    gap: var(--hms-space-3);
    padding: var(--hms-space-4);
    border: 1px solid var(--hms-critical-border);
    background: var(--hms-critical-soft);
    border-radius: var(--hms-radius-md);
    color: var(--hms-critical);
}

/* ------------------------------------------------------------------ *
 * Authentication
 * ------------------------------------------------------------------ */

.hms-captcha-field .fi-input-wrp {
    min-height: 3.5rem;
    border-radius: var(--hms-radius-lg);
}

.hms-captcha-field .fi-input-wrp-prefix {
    align-self: center;
    margin-inline-start: 0.5rem;
    padding: 0.375rem 0.75rem;
    background-color: var(--hms-surface-2);
    border-right: 0;
    border-radius: var(--hms-radius-sm);
}

.hms-captcha-field .fi-input-wrp-prefix .fi-input-wrp-label {
    color: var(--hms-ink);
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.25rem;
    white-space: nowrap;
}

.hms-captcha-field .fi-input-wrp-suffix {
    padding: 0;
}

/* Make the whole refresh area clickable instead of a 28px icon button. */
.hms-captcha-field .fi-input-wrp-suffix button {
    align-self: stretch;
    width: 2.5rem;
    height: 3.5rem;
    border-radius: 0 var(--hms-radius-lg) var(--hms-radius-lg) 0;
}

.hms-captcha-field .fi-input-wrp-content-ctn {
    display: flex;
    align-items: center;
    align-self: stretch;
}

.hms-captcha-field .fi-input {
    height: 100%;
    padding-block: 0;
    font-size: 1rem;
}

.hms-auth-actions {
    margin-top: 1.5rem;
}

.hms-auth-actions .fi-ac,
.hms-auth-actions .fi-btn {
    width: 100%;
}

/* Tooltip used by the bed board and other icon grids. */.hms-tooltip {
    position: absolute;
    bottom: 2.5rem;
    display: none;
    z-index: 50;
    max-width: 200px;
    padding: 0.25rem 0.5rem;
    border-radius: var(--hms-radius-sm);
    background: var(--hms-ink);
    color: var(--hms-surface);
    font-size: 0.75rem;
    line-height: 1.4;
    text-align: center;
    overflow-wrap: break-word;
    box-shadow: var(--hms-shadow-md);
}

.group:hover .hms-tooltip {
    display: block;
}

/* Compact patient tabs (Patient 360). Scoped to the page wrapper. */
.compact-patient-tabs .fi-tabs {
    flex-wrap: wrap;
    gap: 0.25rem;
    overflow: visible;
}

.compact-patient-tabs .fi-tabs button {
    padding: 0.375rem 0.625rem;
    font-size: 0.8125rem;
    border-radius: 0.5rem;
    white-space: nowrap;
    min-height: unset;
    margin: 0;
}

.compact-patient-tabs .fi-tabs button svg {
    width: 1rem;
    height: 1rem;
}

.compact-patient-tabs .fi-tabs button .fi-badge {
    font-size: 0.7rem;
    padding: 0.05rem 0.375rem;
    min-height: unset;
}

@media (max-width: 640px) {
    .compact-patient-tabs .fi-tabs button {
        font-size: 0.75rem;
        padding: 0.25rem 0.5rem;
    }
}

/* ------------------------------------------------------------------ *
 * Data display
 * ------------------------------------------------------------------ */

.hms-data-pair {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--hms-space-3);
    padding-block: var(--hms-space-2);
    border-bottom: 1px solid var(--hms-border);
}

.hms-data-pair:last-child {
    border-bottom: 0;
}

.hms-data-pair__label {
    font-size: var(--hms-text-sm);
    color: var(--hms-ink-muted);
}

.hms-data-pair__value {
    font-size: var(--hms-text-base);
    font-weight: 600;
    color: var(--hms-ink);
    text-align: end;
}

/* ------------------------------------------------------------------ *
 * Filament shell, aligned to tokens
 * ------------------------------------------------------------------ */

body[class*='fi-panel-'] {
    background: var(--hms-canvas);
}

.fi-sidebar {
    border-inline-end: 1px solid var(--hms-border);
}

.fi-sidebar-item-button {
    border-radius: var(--hms-radius-sm);
    min-height: 2.25rem;
    transition: background-color var(--hms-duration-fast) var(--hms-ease),
        color var(--hms-duration-fast) var(--hms-ease);
}

.fi-sidebar-item.fi-active > .fi-sidebar-item-button {
    background: var(--brand-50);
    color: var(--brand-800);
    box-shadow: inset 3px 0 0 var(--brand-500);
    font-weight: 600;
}

.dark .fi-sidebar-item.fi-active > .fi-sidebar-item-button {
    background: color-mix(in srgb, var(--brand-500) 16%, transparent);
    color: var(--brand-300);
    box-shadow: inset 3px 0 0 var(--brand-400);
}

.fi-sidebar-group-label {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--hms-ink-muted);
}

.fi-topbar {
    border-bottom: 1px solid var(--hms-border);
    background: color-mix(in srgb, var(--hms-surface) 92%, transparent);
    backdrop-filter: saturate(1.2) blur(8px);
}

.fi-btn,
.fi-input-wrp,
.fi-select,
.fi-dropdown-panel,
.fi-modal-window,
.fi-ta-ctn,
.fi-section {
    border-radius: var(--hms-radius-md);
}

.fi-btn {
    font-weight: 600;
    letter-spacing: 0.01em;
}

.fi-ta-header-cell {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--hms-ink-muted);
}

.fi-ta-row {
    height: var(--brand-row-height);
}

.fi-ta-cell {
    padding-block: 0.625rem;
}

.hms-density-compact .fi-ta-row,
[data-density='compact'] .fi-ta-row {
    height: 36px;
}

.hms-density-comfortable .fi-ta-row,
[data-density='comfortable'] .fi-ta-row {
    height: 44px;
}

/* Primary filled buttons use brand-600 with white ink (approved decision).
   Filament v4 defaults to a lighter 400 fill; the stronger fill is easier to
   scan on a busy ward screen and keeps one visual "primary action" language. */
.fi-btn.fi-color-primary:not(.fi-outlined) {
    background-color: var(--brand-600);
    color: var(--brand-ink);
}

.fi-btn.fi-color-primary:not(.fi-outlined):hover {
    background-color: var(--brand-700);
}

.dark .fi-btn.fi-color-primary:not(.fi-outlined) {
    background-color: var(--brand-500);
    color: var(--brand-950);
}

.dark .fi-btn.fi-color-primary:not(.fi-outlined):hover {
    background-color: var(--brand-400);
}

/* Focus visibility inside Filament's own components. */
.fi-btn:focus-visible,
.fi-icon-btn:focus-visible,
.fi-input:focus-visible,
.fi-select:focus-visible,
.fi-ta-row:focus-visible {
    outline: none;
    box-shadow: var(--hms-focus-ring);
}

/* Touch targets for ward tablets. */
@media (pointer: coarse) {
    .fi-btn,
    .fi-icon-btn,
    .fi-sidebar-item-button,
    .fi-ta-actions .fi-icon-btn {
        min-height: var(--hms-touch-target);
        min-width: var(--hms-touch-target);
    }
}

/* Money and identifiers must line up in tables. */
.fi-ta-text-item .hms-money,
.fi-ta-text-item .hms-numeric {
    font-variant-numeric: tabular-nums;
}

@media print {
    .fi-sidebar,
    .fi-topbar,
    .hms-no-print {
        display: none !important;
    }
}

/* --------------------------------------------------------------------------
   Super Admin palette
   Moved out of layout/super-admin-style.blade.php so colour values live in
   the design layer, not in a page-level style block. Scoped to the panel.
   -------------------------------------------------------------------------- */
body.fi-panel-superAdmin {
    --sa-bg: #f4f7fb;
    --sa-bg-soft: #eef3f9;
    --sa-surface: #ffffff;
    --sa-surface-2: #f8fafc;
    --sa-ink: #0f172a;
    --sa-muted: #64748b;
    --sa-line: rgba(15, 23, 42, 0.09);
    --sa-primary: var(--brand-600);
    --sa-primary-2: var(--brand-500);
    --sa-primary-soft: color-mix(in srgb, var(--brand-500) 12%, transparent);
    --sa-shadow: 0 18px 45px -30px rgba(15, 23, 42, 0.35);
}

html.dark body.fi-panel-superAdmin {
    --sa-bg: #070c14;
    --sa-bg-soft: #0b1220;
    --sa-surface: #0f172a;
    --sa-surface-2: #111c31;
    --sa-ink: #e2e8f0;
    --sa-muted: #94a3b8;
    --sa-line: rgba(148, 163, 184, 0.14);
    --sa-primary: var(--brand-400);
    --sa-primary-2: var(--brand-300);
    --sa-primary-soft: color-mix(in srgb, var(--brand-400) 14%, transparent);
    --sa-shadow: 0 18px 45px -30px rgba(0, 0, 0, 0.8);
}