@import "tailwindcss";

@import "@nuxt/ui-pro";

@theme static {
  --font-display: 'Manrope', sans-serif;
  --font-sans: 'Inter', sans-serif;
  --font-mono: 'Fira Code', monospace;
  --breakpoint-3xl: 1920px;
  --ui-pattern-fg: color-mix(in oklab,var(--ui-text)5%,transparent);
  --ui-pattern-bg: repeating-linear-gradient(315deg,var(--ui-pattern-fg)0,var(--ui-pattern-fg)1px,transparent 0,transparent 50%);
  --ui-header-height: 3rem;
  /* Technical blueprint styles */
  --ui-line-gap: 5px;
  --ui-line-width: 1px;
  --ui-line-offset: 172px;
  --ui-line-color: var(--color-gray-200);

  /* Teal Palette */
  --color-teal-50: #f2fbf8;
  --color-teal-100: #d3f4ea;
  --color-teal-200: #a6e9d6;
  --color-teal-300: #82dbc5;
  --color-teal-400: #44bda2;
  --color-teal-500: #2ba189;
  --color-teal-600: #20816f;
  --color-teal-700: #1d685b;
  --color-teal-800: #1c534b;
  --color-teal-900: #1b463f;
  --color-teal-950: #0a2925;

  /* Yellow/Brown Palette */
  --color-yellow-50: #fff8eb;
  --color-yellow-100: #feeac7;
  --color-yellow-200: #fdd48a;
  --color-yellow-300: #fbb03b;
  --color-yellow-400: #fa9e25;
  --color-yellow-500: #f47a0c;
  --color-yellow-600: #b85607;
  --color-yellow-700: #b3390a;
  --color-yellow-800: #922b0e;
  --color-yellow-900: #78250f;
  --color-yellow-950: #451003;
}

.dark {
  --ui-line-color: var(--color-gray-800);
}

.pattern-bg {
  background-image: var(--ui-pattern-bg);
  background-size: 10px 10px;
  background-attachment: fixed;
}