@import './fonts.css';
@import 'tailwindcss';

@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
@source '../../storage/framework/views/*.php';
@source '../**/*.blade.php';
@source '../**/*.js';

@theme {
    --color-on-tertiary-fixed-variant: #7f2928;
    --color-on-primary-fixed-variant: #005137;
    --color-tertiary-container: #ba5551;
    --color-background: #f8f9ff;
    --color-secondary-fixed: #d5e6df;
    --color-on-tertiary-container: #fffbff;
    --color-tertiary-fixed: #ffdad7;
    --color-surface: #f8f9ff;
    --color-on-primary-container: #f5fff7;
    --color-tertiary: #9b3e3b;
    --color-surface-container-high: #dfe9fa;
    --color-on-primary-fixed: #002114;
    --color-outline-variant: #bccac0;
    --color-inverse-on-surface: #eaf1ff;
    --color-primary-fixed: #85f8c4;
    --color-on-error: #ffffff;
    --color-surface-container: #e5eeff;
    --color-on-secondary-fixed: #101e1a;
    --color-on-background: #121c28;
    --color-primary-container: #00855d;
    --color-tertiary-fixed-dim: #ffb3ae;
    --color-on-secondary-fixed-variant: #3b4a44;
    --color-on-tertiary-fixed: #410004;
    --color-on-tertiary: #ffffff;
    --color-outline: #6d7a72;
    --color-surface-container-highest: #d9e3f4;
    --color-error: #ba1a1a;
    --color-primary: #006948;
    --color-surface-tint: #006c4a;
    --color-surface-container-low: #eef4ff;
    --color-surface-container-lowest: #ffffff;
    --color-error-container: #ffdad6;
    --color-on-secondary-container: #566660;
    --color-on-primary: #ffffff;
    --color-surface-variant: #d9e3f4;
    --color-secondary: #52625c;
    --color-on-error-container: #93000a;
    --color-inverse-primary: #68dba9;
    --color-on-surface: #121c28;
    --color-secondary-container: #d3e3dc;
    --color-inverse-surface: #27313e;
    --color-on-secondary: #ffffff;
    --color-surface-bright: #f8f9ff;
    --color-primary-fixed-dim: #68dba9;
    --color-on-surface-variant: #3d4a42;
    --color-secondary-fixed-dim: #bacac3;
    --color-surface-dim: #d1dbec;

    --radius: 1rem;
    --radius-lg: 2rem;
    --radius-xl: 3rem;

    --spacing-sm: 12px;
    --spacing-xl: 32px;
    --spacing-2xl: 48px;
    --spacing-gutter: 12px;
    --spacing-container-padding: 20px;
    --spacing-md: 16px;
    --spacing-base: 8px;
    --spacing-xs: 4px;
    --spacing-lg: 24px;

    /* Restore layout widths — custom --spacing-* must not shrink max-w-* utilities */
    --max-width-sm: 24rem;
    --max-width-md: 28rem;
    --max-width-lg: 32rem;
    --max-width-xl: 36rem;
    --max-width-2xl: 42rem;

    --font-body-md: 'Inter', ui-sans-serif, system-ui, sans-serif;
    --font-headline-xl: 'Plus Jakarta Sans', ui-sans-serif, system-ui, sans-serif;
    --font-label-md: 'Inter', ui-sans-serif, system-ui, sans-serif;
    --font-headline-lg-mobile: 'Plus Jakarta Sans', ui-sans-serif, system-ui, sans-serif;
    --font-headline-lg: 'Plus Jakarta Sans', ui-sans-serif, system-ui, sans-serif;
    --font-otp-digit: 'Plus Jakarta Sans', ui-sans-serif, system-ui, sans-serif;
    --font-body-sm: 'Inter', ui-sans-serif, system-ui, sans-serif;
    --font-mono: 'JetBrains Mono', ui-monospace, monospace;

    --text-body-md: 16px;
    --text-body-md--line-height: 24px;
    --text-body-md--font-weight: 400;

    --text-headline-xl: 32px;
    --text-headline-xl--line-height: 40px;
    --text-headline-xl--letter-spacing: -0.02em;
    --text-headline-xl--font-weight: 700;

    --text-label-md: 14px;
    --text-label-md--line-height: 20px;
    --text-label-md--letter-spacing: 0.05em;
    --text-label-md--font-weight: 600;

    --text-headline-lg-mobile: 22px;
    --text-headline-lg-mobile--line-height: 28px;
    --text-headline-lg-mobile--font-weight: 600;

    --text-headline-lg: 24px;
    --text-headline-lg--line-height: 32px;
    --text-headline-lg--letter-spacing: -0.01em;
    --text-headline-lg--font-weight: 600;

    --text-otp-digit: 28px;
    --text-otp-digit--line-height: 36px;
    --text-otp-digit--font-weight: 600;

    --text-body-sm: 14px;
    --text-body-sm--line-height: 20px;
    --text-body-sm--font-weight: 400;
}

@layer base {
    body {
        min-height: max(884px, 100dvh);
        -webkit-tap-highlight-color: transparent;
    }

    input:focus,
    input:focus-visible {
        outline: none;
    }
}
