/* Generated theme CSS for TopCoach Default */
:root {
  /* Custom theme variables */
  --color-brand: #0ea5e9;
  --color-accent: #0284c7;
  --color-text-primary: #0f172a;
  --color-text-secondary: #64748b;
  --color-surface-1: #ffffff;
  --color-surface-2: #f8fafc;
  --color-border: #e2e8f0;
  --color-fill: #f1f5f9;
  --color-success: #22c55e;
  --color-warning: #f59e0b;
  --color-error: #ef4444;
  
  /* Typography */
  --font-heading: Poppins, system-ui, sans-serif;
  --font-body: Poppins, system-ui, sans-serif;
  --font-weight-heading: 600;
  --font-weight-body: 400;
  
  /* Layout */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --shadow-e1: 0 1px 2px rgba(0, 0, 0, 0.02);
  --shadow-e2: 0 2px 4px rgba(0, 0, 0, 0.03);

}

/* Target HeroUI's light theme class and default (no class) */
html.light,
html:not(.dark) {
  /* HeroUI Primary Color Override - HSL Format */
  --heroui-primary: 199 89% 48% !important;
  --heroui-primary-50: 199 30% 95% !important;
  --heroui-primary-100: 199 40% 90% !important;
  --heroui-primary-200: 199 50% 80% !important;
  --heroui-primary-300: 199 60% 70% !important;
  --heroui-primary-400: 199 70% 60% !important;
  --heroui-primary-500: 199 89% 48% !important;
  --heroui-primary-600: 199 89% 38% !important;
  --heroui-primary-700: 199 89% 28% !important;
  --heroui-primary-800: 199 89% 18% !important;
  --heroui-primary-900: 199 89% 8% !important;
  --heroui-primary-foreground: 0 0% 100% !important;

  /* HeroUI Secondary Color Override - HSL Format */
  --heroui-secondary: 200 98% 39% !important;
  --heroui-secondary-50: 200 30% 95% !important;
  --heroui-secondary-100: 200 40% 90% !important;
  --heroui-secondary-200: 200 50% 80% !important;
  --heroui-secondary-300: 200 60% 70% !important;
  --heroui-secondary-400: 200 70% 60% !important;
  --heroui-secondary-500: 200 98% 39% !important;
  --heroui-secondary-600: 200 98% 29% !important;
  --heroui-secondary-700: 200 98% 19% !important;
  --heroui-secondary-800: 200 98% 9% !important;
  --heroui-secondary-900: 200 98% 4% !important;
  --heroui-secondary-foreground: 0 0% 100% !important;

  /* HeroUI Default/Neutral Colors - HSL Format */
  --heroui-default: 210 40% 98% !important;
  --heroui-default-50: 210 40% 98% !important;
  --heroui-default-100: 210 40% 98% !important;
  --heroui-default-200: 210 40% 96% !important;
  --heroui-default-300: 214 32% 91% !important;
  --heroui-default-400: 214 32% 91% !important;
  --heroui-default-500: 215 16% 47% !important;
  --heroui-default-600: 215 16% 47% !important;
  --heroui-default-700: 222 47% 11% !important;
  --heroui-default-800: 222 47% 11% !important;
  --heroui-default-900: 222 47% 11% !important;
  --heroui-default-foreground: 222 47% 11% !important;

  /* HeroUI Background System - HSL Format */
  --heroui-background: 0 0% 100% !important;
  --heroui-foreground: 222 47% 11% !important;
  --heroui-content1: 0 0% 100% !important;
  --heroui-content2: 210 40% 98% !important;
  --heroui-content3: 210 40% 96% !important;
  --heroui-content4: 214 32% 91% !important;

  /* HeroUI Semantic Colors - HSL Format */
  --heroui-success: 142 71% 45% !important;
  --heroui-success-foreground: 0 0% 100% !important;
  --heroui-warning: 38 92% 50% !important;
  --heroui-warning-foreground: 0 0% 100% !important;
  --heroui-danger: 0 84% 60% !important;
  --heroui-danger-foreground: 0 0% 100% !important;

  /* HeroUI Focus */
  --heroui-focus: 200 98% 39% !important;

  /* HeroUI Layout */
  --heroui-radius-small: 6px !important;
  --heroui-radius-medium: 8px !important;
  --heroui-radius-large: 12px !important;
  --heroui-box-shadow-small: 0 1px 2px rgba(0, 0, 0, 0.02) !important;
  --heroui-box-shadow-medium: 0 2px 4px rgba(0, 0, 0, 0.03) !important;
  --heroui-box-shadow-large: 0 2px 4px rgba(0, 0, 0, 0.03) !important;
}

/* Ultra high specificity HeroUI component overrides */
html body .bg-primary,
html body [data-slot="base"].bg-primary,
html body button.bg-primary,
html body [data-color="primary"],
html body .heroui-button[data-color="primary"],
html body *[class*="bg-primary"] {
  background-color: #0ea5e9 !important;
}

html .text-primary-foreground,
html [data-slot="base"].text-primary-foreground,
html button.text-primary-foreground {
  color: #ffffff !important;
}

html .bg-secondary,
html [data-slot="base"].bg-secondary,
html button.bg-secondary,
html .heroui-button[data-color="secondary"] {
  background-color: #0284c7 !important;
}

html .text-secondary-foreground,
html [data-slot="base"].text-secondary-foreground,
html button.text-secondary-foreground {
  color: #ffffff !important;
}

html .bg-default,
html [data-slot="base"].bg-default,
html button.bg-default {
  background-color: #f8fafc !important;
}

html .text-default-foreground,
html [data-slot="base"].text-default-foreground {
  color: #0f172a !important;
}

html .bg-default-100 {
  background-color: #f8fafc !important;
}

html .bg-default-200 {
  background-color: #f1f5f9 !important;
}

html .text-default-600 {
  color: #64748b !important;
}

html .border-default {
  border-color: #e2e8f0 !important;
}

html .text-foreground {
  color: #0f172a !important;
}

html .text-primary {
  color: #0ea5e9 !important;
}

html .text-secondary {
  color: #64748b !important;
}

/* Custom utility classes */
.bg-brand { background-color: #0ea5e9 !important; }
.bg-accent { background-color: #0284c7 !important; }
.text-brand { color: #0ea5e9 !important; }
.text-accent { color: #0284c7 !important; }

/* Font family overrides */
.font-heading {
  font-family: Poppins, system-ui, sans-serif !important;
  font-weight: 600 !important;
}
.font-body {
  font-family: Poppins, system-ui, sans-serif !important;
  font-weight: 400 !important;
}

/* HeroUI Component Font Overrides */
html body button,
html body .heroui-button,
html body [data-slot="base"],
html body input,
html body textarea,
html body .heroui-input input,
html body .heroui-textarea textarea,
html body .heroui-chip,
html body .heroui-chip span,
html body [role="button"],
html body .heroui-navbar-item,
html body .heroui-link {
  font-family: Poppins, system-ui, sans-serif !important;
  font-weight: 400 !important;
}

/* Body background uses theme surface color */
body {
  background: #ffffff !important;
}