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

/* https://ui.jln.dev/ Shivering Harpy Brown */
@layer base {
  :root {
    --background: 30 65% 100%;
    --foreground: 30 75% 0%;
    --muted: 30 17% 95%;
    --muted-foreground: 30 15% 26%;
    --popover: 0 0% 99%;
    --popover-foreground: 0 0% 0%;
    --card: 0 0% 99%;
    --card-foreground: 0 0% 0%;
    --border: 30 4% 91%;
    --input: 30 4% 91%;
    --primary: 30 26% 23%;
    --primary-foreground: 30 26% 83%;
    --secondary: 30 12% 82%;
    --secondary-foreground: 30 12% 22%;
    --accent: 30 22% 76%;
    --accent-foreground: 30 22% 16%;
    --destructive: 18 91% 33%;
    --destructive-foreground: 0 0% 100%;
    --ring: 30 26% 23%;
    --radius: 0.5rem;
  }

  .dark {
    --background: 30 53% 1%;
    --foreground: 30 11% 98%;
    --muted: 30 17% 5%;
    --muted-foreground: 30 15% 74%;
    --popover: 30 53% 2%;
    --popover-foreground: 30 11% 99%;
    --card: 30 53% 2%;
    --card-foreground: 30 11% 99%;
    --border: 30 4% 14%;
    --input: 30 4% 14%;
    --primary: 30 26% 23%;
    --primary-foreground: 30 26% 83%;
    --secondary: 30 7% 15%;
    --secondary-foreground: 30 7% 75%;
    --accent: 30 16% 24%;
    --accent-foreground: 30 16% 84%;
    --destructive: 18 91% 59%;
    --destructive-foreground: 0 0% 0%;
    --ring: 30 26% 23%;
  }
}

@layer base {
  body {
    tab-size: 4;
    font-feature-settings: normal;
    font-variation-settings: normal;
    @apply h-full text-foreground bg-background;
  }

  #uecko {
    @apply flex min-h-screen min-w-[320px] flex-col;
  }
}