:root {
  --background: 0 0% 100%;
  --foreground: 221 39% 11%;

  --muted: 220 14.3% 95.9%;
  --muted-foreground: 220 8.9% 46.1%;

  --popover: 0 0% 100%;
  --popover-foreground: 224 71.4% 4.1%;

  --border: 220 13% 91%;
  --input: 220 13% 91%;

  --primary: 0 0% 13%;
  --primary-foreground: 210 20% 98%;

  --secondary: 220 9% 46%;
  --secondary-foreground: 220 39.3% 11%;

  --accent: 220 14.3% 95.9%;
  --accent-foreground: 220 39.3% 11%;

  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 210 20% 98%;

  --ring: 220 10.6% 64.9%;

  --radius: 0.5rem;

  --button-primary-background: 217 91% 60%;
  --button-primary-text: 210 20% 98%;
  --button-secondary-background: 216 12% 92%;
  --button-secondary-text: 220 39.3% 11%;

  --header: 0 0% 100%;
  --header-text-primary: 221 39% 11%;
  --header-text-icons: 221 39% 11%;
  --header-border: 220 13% 91%;
  --header-search-background: 0 0% 100%;
  --header-hover: 220 14% 96%;
  --header-selected-background: 214 100% 97%;
  --header-selected-text: 217 91% 60%;

  --footer: 0 0% 100%;
  --footer-text-primary: 221 39% 11%;
  --footer-text-secondary: 220 9% 46%;

  --card: 0 0% 100%;
  --card-foreground: 224 71.4% 4.1%;
  --card-text-primary: 221 39% 11%;
  --card-text-secondary: 220 9% 46%;
  --card-text-tertiary: 220 9% 46%;
  --card-text-url: 217 91% 60%;
  --card-selected: 214 100% 96%;
  --card-border: 220 13% 91%;
  --card-background: 0 0% 100%;
  --card-hover-background: 220 14.3% 95.9%;
  --card-hover-text: 201, 87%, 48%;
  --card-url: 240 5% 26%;
  --card-category-badge-text-color: 218 5% 33%;

  --popup-text-primary: 221 39% 11%;
  --popup-text-secondary: 220 9% 46%;

  --toggle-background: 220 13% 91%;
  --toggle-thumb: 0 0% 13%;

  --chart-column: 217 91% 60%;

  --dropdown: 0 0% 100%;
  --dropdown-background: 0 0% 100%;
  --dropdown-text-primary: 221 39% 11%;
  --dropdown-text-secondary: 220 9% 46%;

  --menu-background: 0 0% 98%;
  --menu-console-background: 0 0% 100%;
  --menu-chosen-field-color: 0 0% 100%;
  --menu-chosen-field-text-color: 221 39% 11%;
  --menu-hover-color: 204 94% 94%;
  --menu-hover-text-color: 221 39% 11%;
  --menu-text-primary: 221 39% 11%;
  --menu-text-secondary: 215 14% 34%;
  --menu-separator: 220 13% 91%;
  --menu-field: 0 0% 100%;

  --breadcrumb-background: 0 0% 98%;
  --breadcrumb-border: 220 13% 91%;
  --breadcrumb-tab: 0 0% 98%;
  --breadcrumb-hover: 220 14% 96%;
  --breadcrumb-selected: 220 14% 96%;
  --breadcrumb-selected-border: 217 91% 60%;
  --breadcrumb-text: 221 39% 11%;

  --hero-background: 0 0% 98%;
  --hero-outline: 0 0% 98%;
  --hero-text-primary: 220 39.3% 11%;
  --hero-text-secondary: 220 9% 46%;

  --metrics-background: 0 0% 98%;
  --metrics-text-primary: 220 39.3% 11%;
  --metrics-text-secondary: 220 9% 46%;
  --metrics-outline: 0 0% 98%;

  --banner-background: 219 15% 98%;
  --banner-text-primary: 219 5% 33%;

  --link-foreground: 217 91% 60%;
  --link-background: 214 100% 97%;
  --link-color: 217 91% 60%;

  --list-secondary: 217.9 10.6% 64.9%;

  --success: 142.1 76.2% 36.3%;

  --table-header-background: 240 37.5% 96.86%;

  --operation-type: 324 100% 46%;
  --graphiql-argument-color: 183 95% 35%;
}

.dark {
  --background: 0 0% 13%;
  --foreground: 0 0% 100%;
  --muted: 240 5% 26%;
  --muted-foreground: 220 10.6% 64.9%;
  --popover: 0 0% 13%;
  --popover-foreground: 210 20% 98%;
  --border: 240 5% 26%;
  --input: 0 0% 30.08%;
  --primary: 0 0% 100%;
  --primary-foreground: 220 39.3% 11%;
  --secondary: 218 11% 65%;
  --secondary-foreground: 210 20% 98%;
  --accent: 0 0% 25%;
  --accent-foreground: 210 20% 98%;
  --destructive: 0 62.8% 30.6%;
  --destructive-foreground: 0 85.7% 97.3%;
  --ring: 0 0% 29.95%;

  --header: 0 0% 13%;
  --header-text-primary: 210 20% 98%;
  --header-text-icons: 210 20% 98%;
  --header-border: 240 5% 26%;
  --header-search-background: 0 0% 15%;
  --header-hover: 240 5% 26%;
  --header-selected-background: 214 100% 97%;
  --header-selected-text: 212 96% 78%;

  --button-primary-background: 210 20% 98%;
  --button-primary-text: 220.9 39.3% 11%;
  --button-secondary-background: 218 11% 65%;
  --button-secondary-text: 210 20% 98%;

  --footer: 0 0% 13%;
  --footer-text-primary: 210 20% 98%;
  --footer-text-secondary: 218 11% 65%;

  --card: 0 0% 13%;
  --card-background: 0 0% 13%;
  --card-foreground: 210 20% 98%;
  --card-text-primary: 210 20% 98%;
  --card-text-secondary: 218 11% 65%;
  --card-text-tertiary: 218 11% 65%;
  --card-text-url: 218 11% 65%;
  --card-selected: 0 0% 25%;
  --card-border: 215 14% 34%;
  --card-hover-background: 240 5% 26%;
  --card-hover-text: 201, 87%, 48%;
  --card-url: 214 100% 96%;
  --card-category-badge-text-color: 353 100% 98%;

  --popup-text-primary: 210 20% 98%;
  --popup-text-secondary: 220 9% 46%;

  --toggle-background: 143 64% 23%;
  --toggle-thumb: 142 71% 45%;

  --chart-column: 217 91% 60%;

  --dropdown: 0 0% 13%;
  --dropdown-background: 0 0% 13%;
  --dropdown-text-primary: 210 20% 98%;
  --dropdown-text-secondary: 218 11% 65%;

  --menu-background: 0 0% 13%;
  --menu-console-background: 240 4% 16%;
  --menu-chosen-field-color: 0 0% 13%;
  --menu-chosen-field-text-color: 210 20% 98%;
  --menu-hover-color: 202 80% 24%;
  --menu-hover-text-color: 210 20% 98%;
  --menu-text-primary: 210 20% 98%;
  --menu-text-secondary: 215 14% 34%;
  --menu-field: 0 0% 13%;

  --breadcrumb-background: 0 0% 13%;
  --breadcrumb-border: 240 5% 26%;
  --breadcrumb-tab: 0 0% 13%;
  --breadcrumb-hover: 218 11% 65%;
  --breadcrumb-selected: 0 0% 25%;
  --breadcrumb-selected-border: 217 91% 60%;
  --breadcrumb-text: 210 20% 98%;

  --hero-background: 0 0% 15%;
  --hero-outline: 0 0% 15%;
  --hero-text-primary: 0 0% 92%;
  --hero-text-secondary: 218 11% 65%;

  --metrics-background: 0 0% 15%;
  --metrics-text-primary: 0 0% 92%;
  --metrics-text-secondary: 218 11% 65%;
  --metrics-outline: 0 0% 15%;

  --banner-background: 0 0% 15%;
  --banner-text-primary: 0 0% 92%;

  --link-foreground: 224 64% 33%;
  --link-background: 212 96% 78%;
  --link-color: 224 64% 33%;

  --table-header-background: 60 37.5% 3.14%;

  --operation-type: 324 100% 46%;

  --graphiql-argument-color: 183 95% 35%;
}