@import "tailwindcss";

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

/* Theme tokens */
@theme {
    --color-background: hsl(36 33% 96%);
    --color-foreground: hsl(24 20% 14%);
    --color-card: hsl(36 33% 98%);
    --color-card-foreground: hsl(24 20% 14%);
    --color-muted: hsl(33 18% 92%);
    --color-muted-foreground: hsl(25 10% 42%);
    --color-border: hsl(30 18% 86%);
    --color-ring: hsl(142 28% 39%);

    --color-primary: hsl(142 28% 39%);
    --color-primary-foreground: hsl(0 0% 100%);

    --color-secondary: hsl(33 18% 92%);
    --color-secondary-foreground: hsl(24 20% 14%);

    --color-destructive: hsl(0 72% 51%);
    --color-destructive-foreground: hsl(0 0% 100%);

    --color-accent: hsl(38 65% 55%);
    --color-accent-foreground: hsl(0 0% 100%);

}

/* Small reusable components (no chained @apply) */
@layer components {
    .app-shell {
        @apply mx-auto min-h-dvh max-w-[430px] bg-background text-foreground;
    }

    .card {
        @apply rounded-2xl bg-card text-card-foreground ring-1 ring-border;
    }

    .btn-primary {
        @apply inline-flex min-h-[44px] items-center justify-center rounded-xl px-4 text-sm font-semibold
        bg-primary text-primary-foreground transition
        active:opacity-90
        focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/30
        disabled:pointer-events-none disabled:opacity-50;
    }

    .btn-outline {
        @apply inline-flex min-h-[44px] items-center justify-center rounded-xl px-4 text-sm font-semibold
        bg-card text-foreground ring-1 ring-border transition
        active:bg-muted
        focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/30
        disabled:pointer-events-none disabled:opacity-50;
    }
}
