/* SainityHealth Central Theme Styles */
:root {
  /* Light mode colors from Colors.ts */
  --sainity-bg: #F5F5DC;
  --sainity-primary: #FAC515; /* Gold - appLogoYinColor */
  --sainity-secondary: #0B5886; /* Dark blue - appLogoYangColor */
  --sainity-text: #4D3B29; /* appLogoRingColor */
  --sainity-background: #F5F5DC; /* appLogoBackgroundColor */
  --sainity-tint: #4D3B29; /* appLogoRingColor */
  --sainity-icon: #687076;
  --sainity-card-bg: #FFFFFF;
  --sainity-button-bg: #FFFFFF;
  --sainity-input-bg: #FFFFFF;
  --sainity-error: #ef4444;
  --sainity-success: #10b981;
  --sainity-warning: #f59e0b;
  --sainity-info: #3b82f6;
  --sainity-loading: #4D3B29; /* appLogoRingColor */
  --sainity-accent: #0B5886; /* appLogoYangColor */
  --sainity-text-on-primary: #4D3B29; /* appLogoRingColor */
  
  /* Hero gradient for light mode */
  --sainity-hero-gradient: linear-gradient(90deg, var(--sainity-card-bg) 0%, var(--sainity-bg) 150%);
  
  /* Card border color for light mode */
  --sainity-card-border: rgba(77, 59, 41, 0.1);
  
  /* Category colors */
  --sainity-category-emotion: #E52D2D;
  --sainity-category-food: #E8A550;
  --sainity-category-activity: #D9E850;
  --sainity-category-environment: #88E850;
  --sainity-category-sensation: #55E86D;
  --sainity-category-sleep: #55E8BE;
  --sainity-category-social: #55BBE3;
  --sainity-category-substance: #556BE3;
  --sainity-category-cycle: #8F55E3;
  --sainity-category-poop: #E055E3;
  --sainity-category-default: #6b7280;
  
  --sainity-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --sainity-font-logo: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Dark mode colors from Colors.ts */
[data-theme="dark"] {
  --sainity-bg: #4D3B29; /* appLogoRingColor */
  --sainity-primary: #0B5886; /* appLogoYangColor */
  --sainity-secondary: #FAC515; /* appLogoYinColor */
  --sainity-text: #F5F5DC; /* appLogoBackgroundColor */
  --sainity-background: #4D3B29; /* appLogoRingColor */
  --sainity-tint: #F5F5DC; /* appLogoBackgroundColor */
  --sainity-icon: #9BA1A6;
  --sainity-card-bg: #2A2A2A;
  --sainity-button-bg: #2A2A2A;
  --sainity-input-bg: #2A2A2A;
  --sainity-error: #ef4444;
  --sainity-success: #10b981;
  --sainity-warning: #f59e0b;
  --sainity-info: #3b82f6;
  --sainity-loading: #F5F5DC; /* appLogoBackgroundColor */
  --sainity-accent: #FAC515; /* appLogoYinColor */
  --sainity-text-on-primary: #F5F5DC; /* appLogoBackgroundColor */
  
  /* Card border color for dark mode - more subtle */
  --sainity-card-border: rgba(245, 245, 220, 0.1);
  
  /* Hero gradient for dark mode */
  --sainity-hero-gradient: linear-gradient(90deg, var(--sainity-card-bg) 0%, var(--sainity-bg) 150%);
  
  /* Category colors remain the same in dark mode */
  --sainity-category-emotion: #E52D2D;
  --sainity-category-food: #E8A550;
  --sainity-category-activity: #D9E850;
  --sainity-category-environment: #88E850;
  --sainity-category-sensation: #55E86D;
  --sainity-category-sleep: #55E8BE;
  --sainity-category-social: #55BBE3;
  --sainity-category-substance: #556BE3;
  --sainity-category-cycle: #8F55E3;
  --sainity-category-poop: #E055E3;
  --sainity-category-default: #6b7280;
}

/* Auto-detect system preference */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --sainity-bg: #4D3B29; /* appLogoRingColor */
    --sainity-primary: #0B5886; /* appLogoYangColor */
    --sainity-secondary: #FAC515; /* appLogoYinColor */
    --sainity-text: #F5F5DC; /* appLogoBackgroundColor */
    --sainity-background: #4D3B29; /* appLogoRingColor */
    --sainity-tint: #F5F5DC; /* appLogoBackgroundColor */
    --sainity-icon: #9BA1A6;
    --sainity-card-bg: #2A2A2A;
    --sainity-button-bg: #2A2A2A;
    --sainity-input-bg: #2A2A2A;
    --sainity-error: #ef4444;
    --sainity-success: #10b981;
    --sainity-warning: #f59e0b;
    --sainity-info: #3b82f6;
    --sainity-loading: #F5F5DC; /* appLogoBackgroundColor */
    --sainity-accent: #FAC515; /* appLogoYinColor */
    --sainity-text-on-primary: #F5F5DC; /* appLogoBackgroundColor */
    --sainity-card-border: rgba(245, 245, 220, 0.1);
    --sainity-hero-gradient: linear-gradient(90deg, var(--sainity-bg) 0%, var(--sainity-card-bg) 150%);
  }
}

body {
  font-family: var(--sainity-font-sans);
  background-color: var(--sainity-background);
  color: var(--sainity-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background-color 0.3s ease, color 0.3s ease;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--sainity-text);
  font-family: var(--sainity-font-sans);
}

/* Global link styles - only for general content links */
a:not(footer a):not(nav a) {
  color: var(--sainity-accent);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color 0.2s ease, color 0.3s ease;
}

a:not(footer a):not(nav a):hover {
  border-bottom-color: var(--sainity-accent);
}

/* Footer link styles - override global styles */
footer a {
  color: var(--sainity-text) !important;
  text-decoration: none;
  border-bottom: none;
  transition: color 0.3s ease;
}

footer a:hover {
  color: var(--sainity-accent) !important;
  border-bottom: none;
}

/* Navigation link styles - ensure they're not affected by global styles */
nav a {
  text-decoration: none;
  border-bottom: none;
}

/* Centralized Logo Styling */
.logo, .font-logo, .logo-text {
  font-family: var(--sainity-font-logo);
  color: var(--sainity-text);
  font-weight: 700;
  letter-spacing: -0.025em;
}

.logo {
  font-size: 1.875rem; /* text-3xl */
  line-height: 2.25rem;
}

.logo-text {
  font-size: 1.5rem; /* text-2xl */
  line-height: 2rem;
}

.font-logo {
  font-size: 1.25rem; /* text-xl */
  line-height: 1.75rem;
}

.section {
  background: var(--sainity-card-bg);
  padding: 1.5rem;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(77, 59, 41, 0.1);
  border-left: 4px solid var(--sainity-card-border);
  margin-bottom: 2rem;
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

/* Theme toggle button */
.theme-toggle {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 1000;
  background: var(--sainity-card-bg);
  border: 2px solid var(--sainity-secondary);
  border-radius: 50%;
  width: 3rem;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.theme-toggle:hover {
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.theme-toggle i {
  color: var(--sainity-text);
  font-size: 1.2rem;
  transition: color 0.3s ease;
}

/* Utility classes for backgrounds */
.bg-sainity {
  background-color: var(--sainity-background) !important;
}
.bg-primary {
  background-color: var(--sainity-primary) !important;
}
.bg-secondary {
  background-color: var(--sainity-secondary) !important;
}
.bg-card {
  background-color: var(--sainity-card-bg) !important;
}
.bg-button {
  background-color: var(--sainity-button-bg) !important;
}
.bg-input {
  background-color: var(--sainity-input-bg) !important;
}

/* Utility classes for text */
.text-sainity-text {
  color: var(--sainity-text) !important;
}
.text-primary {
  color: var(--sainity-primary) !important;
}
.text-secondary {
  color: var(--sainity-secondary) !important;
}
.text-accent {
  color: var(--sainity-accent) !important;
}
.text-error {
  color: var(--sainity-error) !important;
}
.text-success {
  color: var(--sainity-success) !important;
}
.text-warning {
  color: var(--sainity-warning) !important;
}
.text-info {
  color: var(--sainity-info) !important;
}

/* Category color utilities */
.text-category-emotion { color: var(--sainity-category-emotion) !important; }
.text-category-food { color: var(--sainity-category-food) !important; }
.text-category-activity { color: var(--sainity-category-activity) !important; }
.text-category-environment { color: var(--sainity-category-environment) !important; }
.text-category-sensation { color: var(--sainity-category-sensation) !important; }
.text-category-sleep { color: var(--sainity-category-sleep) !important; }
.text-category-social { color: var(--sainity-category-social) !important; }
.text-category-substance { color: var(--sainity-category-substance) !important; }
.text-category-cycle { color: var(--sainity-category-cycle) !important; }
.text-category-poop { color: var(--sainity-category-poop) !important; }
.text-category-default { color: var(--sainity-category-default) !important; }

/* Border utilities */
.border-primary {
  border-color: var(--sainity-primary) !important;
}
.border-secondary {
  border-color: var(--sainity-secondary) !important;
}
.border-accent {
  border-color: var(--sainity-accent) !important;
}

/* Form elements */
input, textarea, select {
  background-color: var(--sainity-input-bg);
  color: var(--sainity-text);
  border: 1px solid var(--sainity-secondary);
  border-radius: 4px;
  padding: 0.5rem;
  transition: all 0.3s ease;
}

input:focus, textarea:focus, select:focus {
  outline: none;
  border-color: var(--sainity-accent);
  box-shadow: 0 0 0 3px rgba(240, 59, 155, 0.1);
}

/* Button styles */
.btn {
  background-color: var(--sainity-button-bg);
  color: var(--sainity-text);
  border: 2px solid var(--sainity-secondary);
  border-radius: 6px;
  padding: 0.5rem 1rem;
  cursor: pointer;
  transition: all 0.3s ease;
  font-weight: 500;
  text-decoration: none;
  display: inline-block;
  text-align: center;
}

.btn:hover {
  background-color: var(--sainity-secondary);
  color: var(--sainity-text-on-primary);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.btn-primary {
  background-color: var(--sainity-primary);
  color: var(--sainity-text-on-primary);
  border-color: var(--sainity-primary);
}

.btn-primary:hover {
  background-color: var(--sainity-accent);
  border-color: var(--sainity-accent);
  color: var(--sainity-text-on-primary);
}

.btn-secondary {
  background-color: var(--sainity-secondary);
  color: var(--sainity-text-on-primary);
  border-color: var(--sainity-secondary);
}

.btn-secondary:hover {
  background-color: var(--sainity-primary);
  border-color: var(--sainity-primary);
  color: var(--sainity-text-on-primary);
}

.btn-outline {
  background-color: transparent;
  color: var(--sainity-primary);
  border-color: var(--sainity-primary);
}

.btn-outline:hover {
  background-color: var(--sainity-primary);
  color: var(--sainity-text-on-primary);
}

.btn-accent {
  background-color: var(--sainity-accent);
  color: var(--sainity-text-on-primary);
  border-color: var(--sainity-accent);
}

.btn-accent:hover {
  background-color: var(--sainity-primary);
  border-color: var(--sainity-primary);
  color: var(--sainity-text-on-primary);
}

/* Card border utility class */
.card-border {
  border-color: var(--sainity-card-border) !important;
}

/* Smooth transitions for all elements */
* {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
} 