@import "tailwindcss";
@plugin "tailwindcss-animate";
@plugin "@tailwindcss/typography";

@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
@source '../../storage/framework/views/*.php';
@source '../**/*.blade.php';
@source '../**/*.{ts,tsx}';

@custom-variant dark (&:where([data-theme="dark"], [data-theme="dark"] *));

@layer base {
    *,
    ::after,
    ::before,
    ::backdrop,
    ::file-selector-button {
        border-color: var(--stroke-soft-200, currentColor);
    }

    * {
        /* Prevent grid and flex items from spilling out their container. */
        min-width: 0;

        font-feature-settings:
            "ss11" 1,
            "cv09" 1,
            "liga" 0,
            "calt" 0;

        /* Prevent dragging */
        -webkit-user-drag: none;
        user-drag: none;
        -webkit-app-region: no-drag;
        app-region: no-drag;
    }

    body {
        /* Ensure that the body fills the entire viewport. */
        @apply min-h-dvh;
    }

    input,
    textarea,
    select,
    button {
        border: 0px solid;
        border-radius: 0;
        padding: 0;
        color: inherit;
        background-color: transparent;
        color: inherit;
    }
}

@theme static {
    --color-*: initial;

    /* neutral colors */
    --color-neutral-950: oklch(18.2% 0.0198 266deg); /* #0E121B */
    --color-neutral-900: oklch(22.4% 0.0201 272deg); /* #181B25 */
    --color-neutral-800: oklch(26.7% 0.021 273deg); /* #222530 */
    --color-neutral-700: oklch(30.9% 0.021 266deg); /* #2B303B */
    --color-neutral-600: oklch(46% 0.0241 267deg); /* #525866 */
    --color-neutral-500: oklch(56.8% 0.0213 266deg); /* #717784 */
    --color-neutral-400: oklch(70.4% 0.022 264deg); /* #99A0AE */
    --color-neutral-300: oklch(85.3% 0.0136 263deg); /* #CACFD8 */
    --color-neutral-200: oklch(91.8% 0.00873 265deg); /* #E1E4EA */
    --color-neutral-100: oklch(96.9% 0.00511 248deg); /* #F2F5F8 */
    --color-neutral-50: oklch(97.6% 0.00447 258deg); /* #F5F7FA */
    --color-neutral-0: oklch(100% 0.0000000000000005 0deg); /* #FFFFFF */
    --color-neutral-alpha-24: hsl(220deg, 11.5%, 64.1%, 0.24);
    --color-neutral-alpha-16: hsl(220deg, 11.5%, 64.1%, 0.16);
    --color-neutral-alpha-10: hsl(220deg, 11.5%, 64.1%, 0.1);

    /* vibrants */
    --color-blue-950: oklch(29.4% 0.122 267deg); /* #122368 */
    --color-blue-900: oklch(35.5% 0.155 267deg); /* #182F8B */
    --color-blue-800: oklch(41.4% 0.184 267deg); /* #1F3BAD */
    --color-blue-700: oklch(47.1% 0.213 267deg); /* #2547D0 */
    --color-blue-600: oklch(53.1% 0.221 267deg); /* #3559E9 */
    --color-blue-500: oklch(55.5% 0.245 267deg); /* #335CFF */
    --color-blue-400: oklch(68.7% 0.164 265deg); /* #6895FF */
    --color-blue-300: oklch(78.9% 0.106 263deg); /* #97BAFF */
    --color-blue-200: oklch(87.1% 0.0627 264deg); /* #C0D5FF */
    --color-blue-100: oklch(91.2% 0.0421 266deg); /* #D5E2FF */
    --color-blue-50: oklch(95.8% 0.0199 267deg); /* #EBF1FF */
    --color-blue-alpha-24: oklch(59.1% 0.222 268deg / 24%);
    --color-blue-alpha-16: oklch(59.1% 0.222 268deg / 16%);
    --color-blue-alpha-10: oklch(59.1% 0.222 268deg / 10%);

    --color-orange-950: hsl(23.7 70.5% 23.9%); /* #683412 */
    --color-orange-900: hsl(24 70.6% 32%); /* #8B4618 */
    --color-orange-800: hsl(24.1 69.6% 40%); /* #AD581F */
    --color-orange-700: hsl(23.9 69.8% 48%); /* #D06925 */
    --color-orange-600: hsl(24 80.4% 56.1%); /* #E97D35 */
    --color-orange-500: hsl(24.1 100% 63.9%); /* #FF9147 */
    --color-orange-400: hsl(23.8 100% 70.4%); /* #FFA468 */
    --color-orange-300: hsl(24.2 100% 79.6%); /* #FFC197 */
    --color-orange-200: hsl(23.8 100% 87.6%); /* #FFD9C0 */
    --color-orange-100: hsl(24.3 100% 91.8%); /* #FFE6D5 */
    --color-orange-50: hsl(24 100% 96.1%); /* #FFF3EB */
    --color-orange-alpha-24: oklch(76.2% 0.159 51.7deg / 24%);
    --color-orange-alpha-16: oklch(76.2% 0.159 51.7deg / 16%);
    --color-orange-alpha-10: oklch(76.2% 0.159 51.7deg / 10%);

    --color-red-950: oklch(34% 0.119 22.4deg); /* #681219 */
    --color-red-900: oklch(41.5% 0.149 22.8deg); /* #8B1822 */
    --color-red-800: oklch(48.6% 0.176 23.1deg); /* #AD1F2B */
    --color-red-700: oklch(55.6% 0.204 23.6deg); /* #D02533 */
    --color-red-600: oklch(61.4% 0.214 22.3deg); /* #E93544 */
    --color-red-500: oklch(64.7% 0.229 22.5deg); /* #FB3748 */
    --color-red-400: oklch(71% 0.184 18deg); /* #FF6875 */
    --color-red-300: oklch(78.7% 0.125 14.8deg); /* #FF97A0 */
    --color-red-200: oklch(86.6% 0.0727 13.4deg); /* #FFC0C5 */
    --color-red-100: oklch(90.9% 0.0472 13.2deg); /* #FFD5D8 */
    --color-red-50: oklch(95.6% 0.0218 14.1deg); /* #FFEBEC */
    --color-red-alpha-24: oklch(64.7% 0.229 22.6deg / 24%);
    --color-red-alpha-16: oklch(64.7% 0.229 22.6deg / 16%);
    --color-red-alpha-10: oklch(64.7% 0.229 22.6deg / 10%);

    --color-green-950: oklch(34.9% 0.0795 155deg); /* #0B4627 */
    --color-green-900: oklch(44.6% 0.0997 155deg); /* #16643B */
    --color-green-800: oklch(49.8% 0.114 154deg); /* #1A7544 */
    --color-green-700: oklch(56.4% 0.136 154deg); /* #178C4E */
    --color-green-600: oklch(66.4% 0.163 153deg); /* #1DAF61 */
    --color-green-500: oklch(71.4% 0.176 153deg); /* #1FC16B */
    --color-green-400: oklch(80.4% 0.181 155deg); /* #3EE089 */
    --color-green-300: oklch(86.3% 0.125 159deg); /* #84EBB4 */
    --color-green-200: oklch(92.8% 0.0637 162deg); /* #C2F5DA */
    --color-green-100: oklch(95.3% 0.0503 168deg); /* #D0FBE9 */
    --color-green-50: oklch(96.2% 0.0329 162deg); /* #E0FAEC */
    --color-green-alpha-24: oklch(71.4% 0.176 153deg / 24%);
    --color-green-alpha-16: oklch(71.4% 0.176 153deg / 16%);
    --color-green-alpha-10: oklch(71.4% 0.176 153deg / 10%);

    --color-yellow-950: hsl(42.2 60.7% 23.9%); /* #624C18 */
    --color-yellow-900: hsl(41.7 64.4% 32%); /* #86661D */
    --color-yellow-800: hsl(42 63.7% 40%); /* #A78025 */
    --color-yellow-700: hsl(42 64.1% 48%); /* #C99A2C */
    --color-yellow-600: hsl(41.9 80.4% 50%); /* #E6A819 */
    --color-yellow-500: hsl(41.9 92.3% 54.1%); /* #F6B51E */
    --color-yellow-400: hsl(42.1 100% 70.4%); /* #FFD268 */
    --color-yellow-300: hsl(42.1 100% 79.6%); /* #FFE097 */
    --color-yellow-200: hsl(41.9 100% 87.6%); /* #FFECC0 */
    --color-yellow-100: hsl(41.2 100% 90%); /* #FFEFCC */
    --color-yellow-50: hsl(43.9 100% 92%); /* #FFF4D6 */
    --color-yellow-alpha-24: hsl(41.9deg, 100%, 54.1%, 0.24);
    --color-yellow-alpha-16: hsl(41.9deg, 100%, 54.1%, 0.16);
    --color-yellow-alpha-10: hsl(41.9deg, 100%, 54.1%, 0.1);

    --color-purple-950: oklch(31.9% 0.144 289deg); /* #351A75 */
    --color-purple-900: oklch(34.8% 0.161 289deg); /* #3D1D86 */
    --color-purple-800: oklch(40.6% 0.191 288deg); /* #4C25A7 */
    --color-purple-700: oklch(46.1% 0.221 288deg); /* #5B2CC9 */
    --color-purple-600: oklch(51.6% 0.229 288deg); /* #693EE0 */
    --color-purple-500: oklch(57.7% 0.229 289deg); /* #7D52F4 */
    --color-purple-400: oklch(63.9% 0.191 289deg); /* #8C71F6 */
    --color-purple-300: oklch(73.4% 0.148 290deg); /* #A897FF */
    --color-purple-200: oklch(83.8% 0.0878 292deg); /* #CAC0FF */
    --color-purple-100: oklch(89.2% 0.0576 293deg); /* #DCD5FF */
    --color-purple-50: oklch(94.9% 0.027 295deg); /* #EFEBFF */
    --color-purple-alpha-24: oklch(31.9% 0.144 289deg / 24%);
    --color-purple-alpha-16: oklch(31.9% 0.144 289deg / 16%);
    --color-purple-alpha-10: oklch(31.9% 0.144 289deg / 10%);

    --color-sky-950: oklch(39.2% 0.0748 236deg); /* #124B68 */
    --color-sky-900: oklch(48% 0.0935 236deg); /* #18658B */
    --color-sky-800: oklch(56.2% 0.111 236deg); /* #1F7EAD */
    --color-sky-700: oklch(64.2% 0.128 237deg); /* #2597D0 */
    --color-sky-600: oklch(70.9% 0.135 236deg); /* #35ADE9 */
    --color-sky-500: oklch(77.2% 0.138 234deg); /* #47C2FF */
    --color-sky-400: oklch(80.7% 0.118 232deg); /* #68CDFF */
    --color-sky-300: oklch(86.1% 0.0845 231deg); /* #97DCFF */
    --color-sky-200: oklch(91.4% 0.0522 230deg); /* #C0EAFF */
    --color-sky-100: oklch(94.2% 0.035 229deg); /* #D5F1FF */
    --color-sky-50: oklch(97.1% 0.0167 231deg); /* #EBF8FF */
    --color-sky-alpha-24: oklch(39.2% 0.0745 236deg / 24%);
    --color-sky-alpha-16: oklch(39.2% 0.0745 236deg / 16%);
    --color-sky-alpha-10: oklch(39.2% 0.0745 236deg / 10%);

    --color-pink-950: oklch(35% 0.125 356deg); /* #68123D */
    --color-pink-900: oklch(42.8% 0.156 356deg); /* #8B1852 */
    --color-pink-800: oklch(50.1% 0.184 356deg); /* #AD1F66 */
    --color-pink-700: oklch(57.3% 0.213 357deg); /* #D0257A */
    --color-pink-600: oklch(63.2% 0.225 356deg); /* #E9358F */
    --color-pink-500: oklch(68.5% 0.224 354deg); /* #FB4BA3 */
    --color-pink-400: oklch(72.7% 0.198 352deg); /* #FF68B3 */
    --color-pink-300: oklch(79.9% 0.138 349deg); /* #FF97CB */
    --color-pink-200: oklch(87.4% 0.0819 348deg); /* #FFC0DF */
    --color-pink-100: oklch(91.5% 0.054 347deg); /* #FFD5EA */
    --color-pink-50: oklch(95.9% 0.0246 349deg); /* #FFEBF4 */
    --color-pink-alpha-24: oklch(68.5% 0.224 354deg / 24%);
    --color-pink-alpha-16: oklch(68.5% 0.224 354deg / 16%);
    --color-pink-alpha-10: oklch(68.5% 0.224 354deg / 10%);

    --color-teal-950: oklch(35.6% 0.059 181deg); /* #0B463E */
    --color-teal-900: oklch(45.5% 0.0741 182deg); /* #16645A */
    --color-teal-800: oklch(50.8% 0.0836 182deg); /* #1A7569 */
    --color-teal-700: oklch(57.7% 0.0987 181deg); /* #178C7D */
    --color-teal-600: oklch(67.9% 0.117 181deg); /* #1DAF9C */
    --color-teal-500: oklch(77.9% 0.136 180deg); /* #22D3BB */
    --color-teal-400: oklch(81.5% 0.132 182deg); /* #3FDEC9 */
    --color-teal-300: oklch(87.4% 0.0989 184deg); /* #84EBDD */
    --color-teal-200: oklch(93.3% 0.0528 186deg); /* #C2F5EE */
    --color-teal-100: oklch(95.6% 0.0447 186deg); /* #D0FBF5 */
    --color-teal-50: oklch(97.1% 0.0243 187deg); /* #E4FBF8 */
    --color-teal-alpha-24: oklch(35.6% 0.059 182deg / 24%);
    --color-teal-alpha-16: oklch(35.6% 0.059 182deg / 16%);
    --color-teal-alpha-10: oklch(35.6% 0.059 182deg / 10%);

    --color-white: oklch(100% 0.0000000000000005 0deg);
    --color-white-alpha-24: oklch(100% 0.0000000000000005 0deg / 24%);
    --color-white-alpha-16: oklch(100% 0.0000000000000005 0deg / 16%);
    --color-white-alpha-10: oklch(100% 0.0000000000000005 0deg / 10%);

    --color-black: oklch(0% 0 0deg);
    --color-black-alpha-24: oklch(0% 0 0deg / 24%);
    --color-black-alpha-16: oklch(0% 0 0deg / 16%);
    --color-black-alpha-10: oklch(0% 0 0deg / 10%);

    /* brand colors */
    --color-brand-primary-50: hsl(214deg, 100%, 97%);
    --color-brand-primary-100: hsl(216deg, 94.5%, 92.9%);
    --color-brand-primary-200: hsl(214deg, 99.9%, 87%);
    --color-brand-primary-300: hsl(213deg, 97.9%, 78%);
    --color-brand-primary-400: hsl(214deg, 96.2%, 68.1%);
    --color-brand-primary-500: hsl(219deg, 92.8%, 60.4%);
    --color-brand-primary-600: hsl(228deg, 95.8%, 59.9%);
    --color-brand-primary-700: hsl(226deg, 75.9%, 49.6%);
    --color-brand-primary-800: hsl(227deg, 72.6%, 40%);
    --color-brand-primary-900: hsl(225deg, 66%, 32.8%);
    --color-brand-primary-950: hsl(227deg, 59.6%, 20.9%);
    --color-brand-primary-alpha-24: oklch(71.1% 0.148 256deg / 24%);
    --color-brand-primary-alpha-16: oklch(71.1% 0.148 256deg / 16%);
    --color-brand-primary-alpha-10: oklch(71.1% 0.148 256deg / 10%);

    /* primary colors */
    --color-primary-darker: var(--color-brand-primary-800);
    --color-primary-dark: var(--color-brand-primary-700);
    --color-primary: var(--color-brand-primary-500);
    --color-primary-light: var(--color-brand-primary-alpha-24);
    --color-primary-lighter: var(--color-brand-primary-alpha-16);
    --color-primary-lightest: var(--color-brand-primary-alpha-10);

    /* state-colors */
    --color-state-faded-dark: var(--state-faded-dark);
    --color-state-faded-base: var(--state-faded-base);
    --color-state-faded-light: var(--state-faded-light);
    --color-state-faded-lighter: var(--state-faded-lighter);

    --color-state-information-dark: var(--state-information-dark);
    --color-state-information-base: var(--state-information-base);
    --color-state-information-light: var(--state-information-light);
    --color-state-information-lighter: var(--state-information-lighter);

    --color-state-warning-dark: var(--state-warning-dark);
    --color-state-warning-base: var(--state-warning-base);
    --color-state-warning-light: var(--state-warning-light);
    --color-state-warning-lighter: var(--state-warning-lighter);

    --color-state-error-dark: var(--state-error-dark);
    --color-state-error-base: var(--state-error-base);
    --color-state-error-light: var(--state-error-light);
    --color-state-error-lighter: var(--state-error-lighter);

    --color-state-success-dark: var(--state-success-dark);
    --color-state-success-base: var(--state-success-base);
    --color-state-success-light: var(--state-success-light);
    --color-state-success-lighter: var(--state-success-lighter);

    --color-state-away-dark: var(--state-away-dark);
    --color-state-away-base: var(--state-away-base);
    --color-state-away-light: var(--state-away-light);
    --color-state-away-lighter: var(--state-away-lighter);

    --color-state-feature-dark: var(--state-feature-dark);
    --color-state-feature-base: var(--state-feature-base);
    --color-state-feature-light: var(--state-feature-light);
    --color-state-feature-lighter: var(--state-feature-lighter);

    --color-state-verified-dark: var(--state-verified-dark);
    --color-state-verified-base: var(--state-verified-base);
    --color-state-verified-light: var(--state-verified-light);
    --color-state-verified-lighter: var(--state-verified-lighter);

    --color-state-highlighted-dark: var(--state-highlighted-dark);
    --color-state-highlighted-base: var(--state-highlighted-base);
    --color-state-highlighted-light: var(--state-highlighted-light);
    --color-state-highlighted-lighter: var(--state-highlighted-lighter);

    --color-state-stable-dark: var(--state-stable-dark);
    --color-state-stable-base: var(--state-stable-base);
    --color-state-stable-light: var(--state-stable-light);
    --color-state-stable-lighter: var(--state-stable-lighter);

    --color-social-apple: var(--social-apple);
    --color-social-twitter: var(--social-twitter);
    --color-social-github: var(--social-github);
    --color-social-notion: var(--social-notion);
    --color-social-tidal: var(--social-tidal);
    --color-social-amazon: var(--social-amazon);
    --color-social-zendesk: var(--social-zendesk);

    --color-overlay: var(--overlay-gray);
}

@theme {
    --text-*: initial;

    --text-h1: 3.5rem;
    --text-h1--font-weight: 500;
    --text-h1--line-height: 4rem;
    --text-h1--letter-spacing: -0.01em;

    --text-h2: 3rem;
    --text-h2--font-weight: 500;
    --text-h2--line-height: 3.5rem;
    --text-h2--letter-spacing: -0.01em;

    --text-h3: 2.5rem;
    --text-h3--font-weight: 500;
    --text-h3--line-height: 3rem;
    --text-h3--letter-spacing: -0.01em;

    --text-h4: 2rem;
    --text-h4--font-weight: 500;
    --text-h4--line-height: 2.5rem;
    --text-h4--letter-spacing: -0.005em;

    --text-h5: 1.5rem;
    --text-h5--font-weight: 500;
    --text-h5--line-height: 2rem;

    --text-h6: 1.25rem;
    --text-h6--font-weight: 500;
    --text-h6--line-height: 1.75rem;

    --text-label-xl: 1.5rem;
    --text-label-xl--font-weight: 500;
    --text-label-xl--line-height: 2rem;
    --text-label-xl--letter-spacing: -0.015em;

    --text-label-lg: 1.125rem;
    --text-label-lg--font-weight: 500;
    --text-label-lg--line-height: 1.5rem;
    --text-label-lg--letter-spacing: -0.015em;

    --text-label-md: 1rem;
    --text-label-md--font-weight: 500;
    --text-label-md--line-height: 1.5rem;
    --text-label-md--letter-spacing: -0.011em;

    --text-label-sm: 0.875rem;
    --text-label-sm--font-weight: 500;
    --text-label-sm--line-height: 1.25rem;
    --text-label-sm--letter-spacing: -0.006em;

    --text-label-xs: 0.75rem;
    --text-label-xs--font-weight: 500;
    --text-label-xs--line-height: 1rem;

    --text-paragraph-xl: 1.5rem;
    --text-paragraph-xl--line-height: 2rem;
    --text-paragraph-xl--letter-spacing: -0.015em;

    --text-paragraph-lg: 1.125rem;
    --text-paragraph-lg--line-height: 1.5rem;
    --text-paragraph-lg--letter-spacing: -0.015em;

    --text-paragraph-md: 1rem;
    --text-paragraph-md--line-height: 1.5rem;
    --text-paragraph-md--letter-spacing: -0.011em;

    --text-paragraph-sm: 0.875rem;
    --text-paragraph-sm--line-height: 1.25rem;
    --text-paragraph-sm--letter-spacing: -0.006em;

    --text-paragraph-xs: 0.75rem;
    --text-paragraph-xs--line-height: 1rem;

    --text-subheading-md: 1rem;
    --text-subheading-md--font-weight: 500;
    --text-subheading-md--line-height: 1.5rem;
    --text-subheading-md--letter-spacing: 0.06em;

    --text-subheading-sm: 0.875rem;
    --text-subheading-sm--font-weight: 500;
    --text-subheading-sm--line-height: 1.25rem;
    --text-subheading-sm--letter-spacing: 0.06em;

    --text-subheading-xs: 0.75rem;
    --text-subheading-xs--font-weight: 500;
    --text-subheading-xs--line-height: 1rem;
    --text-subheading-xs--letter-spacing: 0.04em;

    --text-subheading-2xs: 0.6875rem;
    --text-subheading-2xs--font-weight: 500;
    --text-subheading-2xs--line-height: 0.75rem;
    --text-subheading-2xs--letter-spacing: 0.02em;

    --radius-*: initial;
    --radius-0: 0;
    --radius-4: 0.25rem;
    --radius-6: 0.375rem;
    --radius-8: 0.5rem;
    --radius-10: 0.625rem;
    --radius-12: 0.75rem;
    --radius-16: 1rem;
    --radius-20: 1.25rem;
    --radius-24: 1.5rem;
    --radius-full: 9999px;

    --default-font-family: "Geist", var(--font-sans);

    --shadow-xs: 0 1px 2px 0 oklch(15.9% 0.0157 267deg / 3.14%);
    --shadow-sm: 0 2px 4px oklch(22.6% 0.00247 248deg / 3.92%);
    --shadow-md: 0 16px 32px -12px oklch(18.3% 0.0196 266deg / 10.2%);
    --shadow-button-primary-focus: 0 0 0 2px var(--bg-white-0), 0 0 0 4px var(--color-brand-primary-alpha-10);
    --shadow-button-important-focus: 0 0 0 2px var(--bg-white-0), 0 0 0 4px var(--color-neutral-alpha-16);
    --shadow-button-error-focus: 0 0 0 2px var(--bg-white-0), 0 0 0 4px var(--color-red-alpha-10);
    --shadow-fancy-buttons-neutral:
        0 1px 2px 0 oklch(22.6% 0.00247 248deg / 47.8%), 0 0 0 1px oklch(26.7% 0.00473 248deg);
    --shadow-fancy-buttons-primary: 0 1px 2px 0 oklch(18.3% 0.0196 266deg / 23.9%), 0 0 0 1px var(--color-primary);
    --shadow-fancy-buttons-error:
        0 1px 2px 0 oklch(18.3% 0.0196 266deg / 23.9%), 0 0 0 1px var(--color-state-error-base);
    --shadow-fancy-buttons-stroke: 0 1px 3px 0 oklch(18.3% 0.0196 266deg / 12.2%), 0 0 0 1px var(--stroke-soft-200);
    --shadow-toggle-switch:
        0 6px 10px 0 oklch(18.3% 0.0196 266deg / 5.88%), 0 2px 4px 0 oklch(18.3% 0.0196 266deg / 3.14%);
    --shadow-switch-thumb:
        0 4px 8px 0 oklch(22.6% 0.00247 248deg / 5.88%), 0 2px 4px 0 oklch(18.3% 0.0196 266deg / 7.84%);

    --transition-timing-function-drawer: cubic-bezier(0.32, 0.72, 0, 1);

    --animate-caret-blink: caret-blink 1.25s ease-out infinite;
}

@utility container {
    margin-inline: auto;
    padding-inline: 1rem;
}

@keyframes caret-blink {
    0%,
    70%,
    100% {
        opacity: 1;
    }
    20%,
    50% {
        opacity: 0;
    }
}
