/* 使用 Tailwind CSS v4 的 Theme variable namespaces 功能，可以讓 Tailwind 自動產生對應的 utility class */
/* @see: https://tailwindcss.com/docs/theme#theme-variable-namespaces */
@theme {
  --color-primary-200: #69ffff;
  --color-primary-300: #3c63b9;
  --color-primary-400: #1d3f97;
  --color-primary-500: #3498db;
  --color-primary-600: #063d90;
  --color-primary-700: #0c1429;
  --color-secondary-400: #2cb986;
  --color-secondary-500: #2ecc71;
  --color-danger-400: #ff9fde;
  --color-danger-500: #e74c3c;
  --color-danger-600: #754b71;
  --color-success: #27ae60;
  --color-warning: #f39c12;
  --color-gray: #bdc3c7;
  --color-background: #d7e9ff;
  --color-border: #fff;
  --color-text: #2c3e50;
  --color-white: #ffffff;
  --color-navigation: #3b5b8c;
  --color-input: #abc2e4;
}

@layer theme {
  .dark-theme {
    --color-primary-200: #69ffff;
    --color-primary-300: #a0abd3;
    --color-primary-400: #84c5e9;
    --color-primary-500: #2980b9;
    --color-primary-600: #1f3c48;
    --color-primary-700: #0c1429;
    --color-secondary-400: #2cb986;
    --color-secondary-500: #27ae60;
    --color-danger-400: #ff9fde;
    --color-danger-500: #c0392b;
    --color-danger-600: #754b71;
    --color-warning: #f39c12;
    --color-success: #219653;
    --color-input: #181927;
    --color-navigation: #586373;
    --color-white: #ffffff;
    --color-text: #ecf0f1;
    --color-border: #24376a;
    --color-background: #0b101c;
    --color-gray: #95a5a6;
  }
}