@import "tailwindcss/base";
@import "tailwindcss/components";
@import "tailwindcss/utilities";

/* @import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&display=swap'); */

/* html {
  overflow-y: hidden;
} */

@layer base {
  :root {
    --gold: 38 62% 54%;
    --gray-lining: 0% 0% 31%;

    --background: 0 0% 100%;
    --foreground: 222.2 84% 4.9%;

    --card: 0 0% 100%;
    --card-foreground: 222.2 84% 4.9%;
 
    --popover: 0 0% 100%;
    --popover-foreground: 222.2 84% 4.9%;
 
    --primary: 222.2 47.4% 11.2%;
    --primary-foreground: 210 40% 98%;
 
    --secondary: 210 40% 96.1%;
    --secondary-foreground: 222.2 47.4% 11.2%;
 
    --muted: 210 40% 96.1%;
    --muted-foreground: 215.4 16.3% 46.9%;
 
    --accent: 210 40% 96.1%;
    --accent-foreground: 222.2 47.4% 11.2%;
 
    --destructive: 0 84.2% 60.2%;
    --destructive-foreground: 210 40% 98%;

    --border: 214.3 31.8% 91.4%;
    --input: 214.3 31.8% 91.4%;
    --ring: 222.2 84% 4.9%;
 
    --radius: 0.5rem;
  }
 
  .dark {
    --gold: 38 62% 54%;
    --gray-lining: 0% 0% 31%;



    --background: 222.2 84% 4.9%;
    --foreground: 210 40% 98%;
 
    --card: 222.2 84% 4.9%;
    --card-foreground: 210 40% 98%;
 
    --popover: 222.2 84% 4.9%;
    --popover-foreground: 210 40% 98%;
 
    --primary: 210 40% 98%;
    --primary-foreground: 222.2 47.4% 11.2%;
 
    --secondary: 217.2 32.6% 17.5%;
    --secondary-foreground: 210 40% 98%;
 
    --muted: 217.2 32.6% 17.5%;
    --muted-foreground: 215 20.2% 65.1%;
 
    --accent: 217.2 32.6% 17.5%;
    --accent-foreground: 210 40% 98%;
 
    --destructive: 0 62.8% 30.6%;
    --destructive-foreground: 210 40% 98%;
 
    --border: 217.2 32.6% 17.5%;
    --input: 217.2 32.6% 17.5%;
    --ring: 212.7 26.8% 83.9%;
  }
}
 
@layer base {
  * {
    @apply border-border;
  }
  body {
    @apply bg-background text-foreground;
  }
}


/* background: linear-gradient(90deg, #B16C18 0%, #D29C42 100%); */




@layer base {
  :root {
    --gold: 38 62% 54%;
    --gray-lining: 0% 0% 31%;
    --background: 0 0% 17%;

    --foreground: 0 0% 12.55%;
    --muted: 0 0% 93.73%;
    --muted-foreground: 0 0% 39.22%;
    --popover: 0 0% 98.82%;
    --popover-foreground: 0 0% 12.55%;
    --card: 0 0% 98.82%;
    
    --card-foreground: 0 0% 12.55%;
    --border: 0 0% 84.71%;
    --input: 33 76% 39%;
    --primary: 22.93 92.59% 52.35%;
    --primary-foreground: 44 0% 100%;
    --secondary: 34.05 100% 85.49%;
    --secondary-foreground: 16.27 50.43% 22.94%;
    --accent: 0 0% 90.98%;
    --accent-foreground: 0 0% 12.55%;
    --destructive: 10.16 77.87% 53.92%;
    --destructive-foreground: 0 0% 100%;
    --ring: 24.8 79.79% 63.14%;
  }

  .dark {
    --gold: 38 62% 54%;
    --gray-lining: 0% 0% 31%;


    --background: 0 0% 17%;
    --foreground: 0 0% 93.33%;
    --muted: 0 0% 13.33%;
    --muted-foreground: 205 10% 54%;
    --popover: 0 0% 9.8%;
    --popover-foreground: 0 0% 93.33%;
    --card: 0 0% 9.8%;

    --card-foreground: 0 0% 93.33%;
    --border: 44 14% 11%;
    --input: 33 76% 39%;
    --primary: 38 62% 54%;
    --primary-foreground: 29.51 0% 100%;
    --secondary: 28.5 64.52% 12.16%;
    --secondary-foreground: 29.51 100% 88.04%;
    --accent: 0 0% 16.47%;
    --accent-foreground: 0 0% 93.33%;
    --destructive: 10.16 77.87% 53.92%;
    --destructive-foreground: 0 0% 100%;
    --ring: 23.11 59.8% 40%;
    --radius: 12px;

  }
}