body {
    @apply overscroll-none bg-transparent;
}

@theme static {
    --font-sans: var(--font-sans);
    --font-serif: var(--font-serif);

    --color-client-red: #c1041f;
    --color-client-light-red: #e6a9ad;
    --color-client-dark-red: #b2797c;
    --color-client-green: #00a99d;
    --color-client-light-green: #69c4bb;
    --color-client-blue: #0071bc;
    --color-client-light-blue: #2887bc;
    --color-client-rose: #cd5257;
    --color-client-pink: #f5dddd;
    --color-client-light-gray: #f4f2ed;
    --color-client-sky: #75afe5;
    --color-client-dark-sky: #29abe2;
    --color-client-light-sky: #61c3e5;
    --color-client-sand: #fdf9f5;
    --color-client-yellow: #efd671;
    --color-client-dark: #303030;
    --color-client-orange: #f15a24;

    /* custom colors from client theme */
    --color-dark-gray: #707070;
    --color-neutral-100: #f6f6f6;
    --border: #cbcbcb;

    /* custom extrasmall breakpoint */
    --breakpoint-xs: 30rem;
}

:root {
    --font-sans: var(--font-sans);
    --header-height: calc(var(--spacing) * 12 + 1px);
}

.theme-scaled {
    @media (min-width: 1024px) {
        --radius: 0.6rem;
        --text-lg: 1.05rem;
        --text-base: 0.85rem;
        --text-sm: 0.8rem;
        --spacing: 0.222222rem;
    }

    [data-slot="card"] {
        --spacing: 0.16rem;
    }

    [data-slot="select-trigger"],
    [data-slot="toggle-group-item"] {
        --spacing: 0.222222rem;
    }
}

.theme-default,
.theme-default-scaled {
    --primary: var(--color-neutral-600);
    --primary-foreground: var(--color-neutral-50);

    @variant dark {
        --primary: var(--color-neutral-500);
        --primary-foreground: var(--color-neutral-50);
    }
}

.theme-blue,
.theme-blue-scaled {
    --primary: var(--color-blue-600);
    --primary-foreground: var(--color-blue-50);

    @variant dark {
        --primary: var(--color-blue-500);
        --primary-foreground: var(--color-blue-50);
    }
}

.theme-green,
.theme-green-scaled {
    --primary: var(--color-lime-600);
    --primary-foreground: var(--color-lime-50);

    @variant dark {
        --primary: var(--color-lime-600);
        --primary-foreground: var(--color-lime-50);
    }
}

.theme-amber,
.theme-amber-scaled {
    --primary: var(--color-amber-600);
    --primary-foreground: var(--color-amber-50);

    @variant dark {
        --primary: var(--color-amber-500);
        --primary-foreground: var(--color-amber-50);
    }
}

.theme-mono,
.theme-mono-scaled {
    --font-sans: var(--font-sans);
    --primary: var(--color-neutral-600);
    --primary-foreground: var(--color-neutral-50);

    @variant dark {
        --primary: var(--color-neutral-500);
        --primary-foreground: var(--color-neutral-50);
    }

    .rounded-xs,
    .rounded-sm,
    .rounded-md,
    .rounded-lg,
    .rounded-xl {
        @apply !rounded-none;
        border-radius: 0;
    }

    .shadow-xs,
    .shadow-sm,
    .shadow-md,
    .shadow-lg,
    .shadow-xl {
        @apply !shadow-none;
    }

    [data-slot="toggle-group"],
    [data-slot="toggle-group-item"] {
        @apply !rounded-none !shadow-none;
    }
}