@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
    html {
        color-scheme: light;
    }

    html.dark {
        color-scheme: dark;
    }

    [x-cloak] {
        display: none !important;
    }
}

@layer components {
    .lm-focus {
        @apply focus:border-[#0F4C81] focus:ring-[#0F4C81];
    }

    .lm-card {
        @apply rounded-2xl border border-slate-200/80 bg-white p-6 shadow-sm shadow-slate-200/70 dark:border-white/10 dark:bg-white/5 dark:shadow-none;
    }

    .lm-field {
        @apply w-full rounded-xl border-slate-300 bg-white px-3 py-2.5 text-sm text-[#1A1A1A] shadow-sm transition focus:border-[#0F4C81] focus:ring-[#0F4C81] dark:border-white/10 dark:bg-white/10 dark:text-white dark:placeholder:text-slate-400;
    }

    .lm-btn-primary {
        @apply inline-flex items-center justify-center rounded-xl bg-[#0F4C81] px-6 py-3 text-sm font-bold text-white shadow-lg shadow-blue-900/20 transition hover:bg-[#1E3A5F] focus:outline-none focus:ring-2 focus:ring-[#0F4C81] focus:ring-offset-2 dark:focus:ring-offset-[#1E3A5F];
    }

    .lm-btn-accent {
        @apply inline-flex items-center justify-center rounded-xl bg-[#2FBF71] px-6 py-3 text-sm font-bold text-white shadow-lg shadow-emerald-700/20 transition hover:brightness-95 focus:outline-none focus:ring-2 focus:ring-[#2FBF71] focus:ring-offset-2 dark:focus:ring-offset-[#1E3A5F];
    }

    .lm-section-kicker {
        @apply text-sm font-extrabold uppercase tracking-wide text-[#2FBF71];
    }

    .lm-section-title {
        @apply mt-3 text-3xl font-extrabold tracking-normal text-[#0F4C81] dark:text-white sm:text-4xl;
    }
}