/* ============================================ */
/* Tailswatch: Google Cloud Theme */
/* Inspired by Google Cloud Platform brand colors */
/* ============================================ */

:root {
/* Primary - Google Blue (#4285F4) */
  --color-primary-50: #e8f0fe;
  --color-primary-100: #d2e3fc;
  --color-primary-200: #a5c8f9;
  --color-primary-300: #78acf6;
  --color-primary-400: #4b91f3;
  --color-primary-500: #4285f4;
  --color-primary-600: #1a73e8;
  --color-primary-700: #1967d2;
  --color-primary-800: #185abc;
  --color-primary-900: #174ea6;
  --color-primary-950: #0d3c78;
/* Secondary - Google Grey (#5F6368) */
  --color-secondary-50: #f8f9fa;
  --color-secondary-100: #f1f3f4;
  --color-secondary-200: #e8eaed;
  --color-secondary-300: #dadce0;
  --color-secondary-400: #bdc1c6;
  --color-secondary-500: #9aa0a6;
  --color-secondary-600: #80868b;
  --color-secondary-700: #5f6368;
  --color-secondary-800: #3c4043;
  --color-secondary-900: #202124;
  --color-secondary-950: #17181a;
/* Accent - Google Red (#EA4335) */
  --color-accent-50: #fce8e6;
  --color-accent-100: #fad2cf;
  --color-accent-200: #f5a5a0;
  --color-accent-300: #f07870;
  --color-accent-400: #eb4b41;
  --color-accent-500: #ea4335;
  --color-accent-600: #d93025;
  --color-accent-700: #c5221f;
  --color-accent-800: #a31c19;
  --color-accent-900: #821714;
  --color-accent-950: #5c110e;
/* Semantic Colors - Using Google's palette */
  --color-success-50: #e6f4ea;
  --color-success-100: #ceead6;
  --color-success-200: #9dd5ac;
  --color-success-300: #6dc083;
  --color-success-400: #3cab5a;
  --color-success-500: #34a853;
  --color-success-600: #1e8e3e;
  --color-success-700: #188038;
  --color-success-800: #137332;
  --color-success-900: #0d652c;
  --color-success-950: #084920;

  --color-warning-50: #fef7e0;
  --color-warning-100: #feefc3;
  --color-warning-200: #fedf88;
  --color-warning-300: #fdd04c;
  --color-warning-400: #fcc011;
  --color-warning-500: #fbbc04;
  --color-warning-600: #f9ab00;
  --color-warning-700: #e69500;
  --color-warning-800: #bf7f00;
  --color-warning-900: #996800;
  --color-warning-950: #664600;

  --color-error-50: #fce8e6;
  --color-error-100: #fad2cf;
  --color-error-200: #f5a5a0;
  --color-error-300: #f07870;
  --color-error-400: #eb4b41;
  --color-error-500: #ea4335;
  --color-error-600: #d93025;
  --color-error-700: #c5221f;
  --color-error-800: #a31c19;
  --color-error-900: #821714;
  --color-error-950: #5c110e;

  --color-info-50: #e8f0fe;
  --color-info-100: #d2e3fc;
  --color-info-200: #a5c8f9;
  --color-info-300: #78acf6;
  --color-info-400: #4b91f3;
  --color-info-500: #4285f4;
  --color-info-600: #1a73e8;
  --color-info-700: #1967d2;
  --color-info-800: #185abc;
  --color-info-900: #174ea6;
  --color-info-950: #0d3c78;
/* Surface Colors - Google's clean white style */
  --color-background: #e8f0fe;
  --color-surface: #f8f9fa;
  --color-surface-muted: #f1f3f4;
  --color-border: #dadce0;
/* Text Colors */
  --color-text: #202124;
  --color-text-muted: #5f6368;
  --color-text-inverted: #ffffff;
}

@theme {
  --color-primary-50: var(--color-primary-50);
  --color-primary-100: var(--color-primary-100);
  --color-primary-200: var(--color-primary-200);
  --color-primary-300: var(--color-primary-300);
  --color-primary-400: var(--color-primary-400);
  --color-primary-500: var(--color-primary-500);
  --color-primary-600: var(--color-primary-600);
  --color-primary-700: var(--color-primary-700);
  --color-primary-800: var(--color-primary-800);
  --color-primary-900: var(--color-primary-900);
  --color-primary-950: var(--color-primary-950);

  --color-secondary-50: var(--color-secondary-50);
  --color-secondary-100: var(--color-secondary-100);
  --color-secondary-200: var(--color-secondary-200);
  --color-secondary-300: var(--color-secondary-300);
  --color-secondary-400: var(--color-secondary-400);
  --color-secondary-500: var(--color-secondary-500);
  --color-secondary-600: var(--color-secondary-600);
  --color-secondary-700: var(--color-secondary-700);
  --color-secondary-800: var(--color-secondary-800);
  --color-secondary-900: var(--color-secondary-900);
  --color-secondary-950: var(--color-secondary-950);

  --color-accent-50: var(--color-accent-50);
  --color-accent-100: var(--color-accent-100);
  --color-accent-200: var(--color-accent-200);
  --color-accent-300: var(--color-accent-300);
  --color-accent-400: var(--color-accent-400);
  --color-accent-500: var(--color-accent-500);
  --color-accent-600: var(--color-accent-600);
  --color-accent-700: var(--color-accent-700);
  --color-accent-800: var(--color-accent-800);
  --color-accent-900: var(--color-accent-900);
  --color-accent-950: var(--color-accent-950);

  --color-success-50: var(--color-success-50);
  --color-success-100: var(--color-success-100);
  --color-success-200: var(--color-success-200);
  --color-success-300: var(--color-success-300);
  --color-success-400: var(--color-success-400);
  --color-success-500: var(--color-success-500);
  --color-success-600: var(--color-success-600);
  --color-success-700: var(--color-success-700);
  --color-success-800: var(--color-success-800);
  --color-success-900: var(--color-success-900);
  --color-success-950: var(--color-success-950);

  --color-warning-50: var(--color-warning-50);
  --color-warning-100: var(--color-warning-100);
  --color-warning-200: var(--color-warning-200);
  --color-warning-300: var(--color-warning-300);
  --color-warning-400: var(--color-warning-400);
  --color-warning-500: var(--color-warning-500);
  --color-warning-600: var(--color-warning-600);
  --color-warning-700: var(--color-warning-700);
  --color-warning-800: var(--color-warning-800);
  --color-warning-900: var(--color-warning-900);
  --color-warning-950: var(--color-warning-950);

  --color-error-50: var(--color-error-50);
  --color-error-100: var(--color-error-100);
  --color-error-200: var(--color-error-200);
  --color-error-300: var(--color-error-300);
  --color-error-400: var(--color-error-400);
  --color-error-500: var(--color-error-500);
  --color-error-600: var(--color-error-600);
  --color-error-700: var(--color-error-700);
  --color-error-800: var(--color-error-800);
  --color-error-900: var(--color-error-900);
  --color-error-950: var(--color-error-950);

  --color-info-50: var(--color-info-50);
  --color-info-100: var(--color-info-100);
  --color-info-200: var(--color-info-200);
  --color-info-300: var(--color-info-300);
  --color-info-400: var(--color-info-400);
  --color-info-500: var(--color-info-500);
  --color-info-600: var(--color-info-600);
  --color-info-700: var(--color-info-700);
  --color-info-800: var(--color-info-800);
  --color-info-900: var(--color-info-900);
  --color-info-950: var(--color-info-950);

  --color-background: var(--color-background);
  --color-surface: var(--color-surface);
  --color-surface-muted: var(--color-surface-muted);
  --color-border: var(--color-border);

  --color-text: var(--color-text);
  --color-text-muted: var(--color-text-muted);
  --color-text-inverted: var(--color-text-inverted);
}
