@tailwind base;
@layer base {
  :root {
    /* Dark base theme with blue accent to match shirt */
    --color-text-base: 255, 255, 255;
    --color-text-muted: 150, 150, 150;
    --color-text-inverted: 255, 255, 255;
    --color-fill: 18, 18, 18;
    --muted: 36, 36, 36;
    --color: 59, 130, 246;  /* Light blue base - matches shirt */
    --color-button-accent: 59, 130, 246;
    --color-button-accent-hover: 96, 165, 250;
    --color-button-muted: 26, 26, 26;

    [data-theme="teal"] {
      /* Professional teal accent */
      --color: 20, 184, 166;
      --color-button-accent: 20, 184, 166;
      --color-button-accent-hover: 13, 148, 136;
    }

    [data-theme="indigo"] {
      /* Deep indigo accent */
      --color: 99, 102, 241;
      --color-button-accent: 99, 102, 241;
      --color-button-accent-hover: 129, 140, 248;
    }

    [data-theme="sky"] {
      /* Bright sky blue accent */
      --color: 14, 165, 233;
      --color-button-accent: 14, 165, 233;
      --color-button-accent-hover: 56, 189, 248;
    }
  }
}