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

[data-theme='normal'] {
    --html-body-bg-color: #373737;
    --html-default-text-color: #0b0b0b;
}

body {
    @apply flex justify-center items-center h-screen;
    background-color: var(--html-body-bg-color);
    color: var(--html-default-text-color);
}

.container {
    @apply flex flex-col justify-center items-center
    p-6 rounded-lg shadow-2xl;
    background: #eeeeee;
}

h1 {
    @apply text-3xl font-bold;
}

.button {
    @apply px-4 py-2 rounded-lg bg-blue-500 text-white m-1;
}

.button:hover {
    @apply bg-blue-700;
}