/* aqua-theme.css - DaisyUI Aqua Theme Variables */

:root {
  /* Theme: aqua */
  /* color-scheme: dark */
  
  /* Base colors */
  --color-base-100: oklch(37% 0.146 265.522);
  --color-base-200: oklch(28% 0.091 267.935);
  --color-base-300: oklch(22% 0.091 267.935);
  --color-base-content: oklch(90% 0.058 230.902);
  --color-primary: oklch(85.661% 0.144 198.645);
  --color-primary-content: oklch(40.124% 0.068 197.603);
  --color-secondary: oklch(60.682% 0.108 309.782);
  --color-secondary-content: oklch(96% 0.016 293.756);
  --color-accent: oklch(93.426% 0.102 94.555);
  --color-accent-content: oklch(18.685% 0.02 94.555);
  --color-neutral: oklch(27% 0.146 265.522);
  --color-neutral-content: oklch(80% 0.146 265.522);
  
  /* Semantic colors */
  --color-info: oklch(54.615% 0.215 262.88);
  --color-info-content: oklch(90.923% 0.043 262.88);
  --color-success: oklch(62.705% 0.169 149.213);
  --color-success-content: oklch(12.541% 0.033 149.213);
  --color-warning: oklch(66.584% 0.157 58.318);
  --color-warning-content: oklch(27% 0.077 45.635);
  --color-error: oklch(73.95% 0.19 27.33);
  --color-error-content: oklch(14.79% 0.038 27.33);
  
  /* Design properties */
  --radius-selector: 1rem;
  --radius-field: 0.5rem;
  --radius-box: 1rem;
  --size-selector: 0.25rem;
  --size-field: 0.25rem;
  --border: 1px;
  --depth: 1;
  --noise: 0;
  
  /* Additional convenience variables for traditional CSS usage */
  --bg-color: var(--color-base-100);
  --text-color: var(--color-base-content);
  --link-color: var(--color-primary);
  --link-hover-color: var(--color-secondary);
  --accent-color: var(--color-accent);
  --border-color: var(--color-base-300);
  --heading-color: var(--color-primary);
  --button-bg: var(--color-primary);
  --button-text: var(--color-primary-content);
  --button-hover-bg: var(--color-secondary);
  --button-hover-text: var(--color-secondary-content);
  --button-border-radius: var(--radius-field);
  
  /* Apply color scheme */
  color-scheme: dark;
}

/* Add classes for backward compatibility */
.bg-primary {
  background-color: var(--color-primary);
  color: var(--color-primary-content);
}

.bg-secondary {
  background-color: var(--color-secondary);
  color: var(--color-secondary-content);
}

.bg-accent {
  background-color: var(--color-accent);
  color: var(--color-accent-content);
}

.text-primary {
  color: var(--color-primary);
}

.text-secondary {
  color: var(--color-secondary);
}

.text-accent {
  color: var(--color-accent);
}

.btn {
  background-color: var(--button-bg);
  color: var(--button-text);
  border-radius: var(--button-border-radius);
  border: var(--border) solid var(--border-color);
  padding: 0.5rem 1rem;
  cursor: pointer;
  transition: all 0.3s ease;
}
