/**************** Root ****************/
:root {


  --inner-width: 640px;
  --font-inter: "Inter", sans-serif;
  --font-spectral: "Spectral", serif;
  --font-playfair: "Playfair Display", serif;
  --font-jetbrains: "JetBrains Mono", monospace;
  --font-eb-garamond: "EB Garamond", serif;
  --font-dancing-script: "Dancing Script", cursive;
  --font-lora: "Lora", serif;
  /* --font-source-serif: "Source Serif 4", serif;
    --font-architects: "Architects Daughter", cursive; */
    /* New ones */
  --font-lexend: "Lexend", sans-serif;
  --font-playfair: "Playfair Display", serif;




  /* --font-sans: var(--font-inter); */
  --font-sans: var(--font-lexend);
  --font-body: var(--font-lexend);
  --font-heading: var(--font-spectral);
  --font-mono: var(--font-jetbrains);
  --font-accent: var(--font-eb-garamond);
  --font-handwritten: var(--font-dancing-script);
  --font-strong: var(--font-lora);






  /* More daisyUI to avoid recomputing colors */
  /* TODO: shouldnt be soft ?
   */
  --color-primary-ghost: color-mix(in oklab, var(--color-primary, var(--color-base-content)) 8%, var(--color-base-100));
  --color-secondary-ghost: color-mix(in oklab, var(--color-secondary, var(--color-base-content)) 8%, var(--color-base-100));
  --color-accent-ghost: color-mix(in oklab, var(--color-accent, var(--color-base-content)) 8%, var(--color-base-100));
  --color-base-content-ghost: color-mix(in oklab, var(--color-base-content, var(--color-base-content)) 8%, var(--color-base-100));
  --color-success-ghost: color-mix(in oklab, var(--color-success, var(--color-base-content)) 8%, var(--color-base-100));
  --color-warning-ghost: color-mix(in oklab, var(--color-warning, var(--color-base-content)) 8%, var(--color-base-100));
  --color-error-ghost: color-mix(in oklab, var(--color-error, var(--color-base-content)) 8%, var(--color-base-100));
  --color-info-ghost: color-mix(in oklab, var(--color-info, var(--color-base-content)) 8%, var(--color-base-100));

  --color-base-content-ghost-variant: color-mix(in oklab, var(--color-base-content, var(--color-base-content)) 2%, var(--color-base-100));
  
  --scrollbar-color: var(--color-primary-content);
  --scrollbar-color-bg: var(--color-primary-content);

}


* {
  scrollbar-width: thin;
  scrollbar-color: var(--scrollbar-color) var(--scrollbar-color-bg);
}



/**************** Custom DaisyUI Theme - Excellent Light=anchor (DaisyUI v5 format) ****************/
[data-theme="anchor"] {
  color-scheme: light;
  
  /* ===== BASE COLORS (BACKGROUNDS) ===== */
  /* Almost pure white background for maximum brightness and readability */
  --color-base-100: oklch(99.5% 0.002 120);    /* Nearly white with tiny warm hint */
  
  /* Subtle off-white for cards, modals, secondary backgrounds */
  /* Only slightly different from base-100 but noticeable for layering */
  /* --color-base-200: oklch(97% 0.005 120);      Very light warm gray */

  --color-base-200: oklch(96.5% 0.001 190);      /* Very light warm gray : SEL*/
  
  /* More pronounced but still very light for borders, dividers */
  --color-base-300: oklch(90% 0.002 155);      /* Light warm gray */
  
  /* Strong, matte dark text - not pure black but very readable */
  /* High contrast against white backgrounds for excellent readability */
  --color-base-content: oklch(22% 0.015 240);  /* Deep charcoal with slight blue undertone */
  
  /* ===== PRIMARY COLORS (PURPLE THEME) ===== */
  /* Dark but vibrant purple - professional yet colorful */
  --color-primary: oklch(45% 0.18 285);        /* Rich purple, dark enough for accessibility */
  
  /* Very light, almost white text for primary buttons/elements */
  /* Ensures maximum contrast against dark purple background */
  --color-primary-content: oklch(97% 0.02 285); /* Nearly white with purple hint */
  
  /* --color-secondary: oklch(0.563 0.2 340.55); */
  /* --color-secondary: oklch(0.25 0.2 340.55);   */
  --color-secondary-content: oklch(97% 0.02 240); /* Nearly white with blue hint */
  
  /* (Rich gold) */
  --color-accent: oklch(80% 0.12 80);
  /* oklch(80% 0.12 80);  #DCAE5B; */
  /* (Dark text for contrast) */
  --color-accent-content: #2F271F;
   /* #71412C; */
   /* oklch(12% 0.12 85);  */


  /* ===== ACCENT COLORS (STRONG GREEN THEME) ===== */
  /* Vibrant forest green for accent elements, CTAs, highlights */
  /* --color-accent: oklch(52% 0.20 150);         Strong emerald green */
  
  /* Very light text for accent elements */
  /* --color-accent-content: oklch(85% 0.02 150); Nearly white with green hint */
  
  /* ===== NEUTRAL COLORS ===== */
  --color-neutral: oklch(25% 0.01 240);        /* Dark gray for neutral elements */
  --color-neutral-content: oklch(95% 0.01 240); /* Light gray for text on neutral backgrounds */
  
  /* Dark text on neutral backgrounds */
  /* --color-neutral-content: oklch(25% 0.01 240); Dark gray for neutral text */
  
  /* ===== STATE COLORS (SEMANTIC FEEDBACK) ===== */
  /* Information blue - strong and high contrast */
  --color-info: oklch(45% 0.35 255);           /* Vibrant, stronger blue */
  --color-info-content: oklch(100% 0 0);       /* Pure white for maximum contrast */
  
  /* Success green - positive and encouraging */
  --color-success: oklch(62% 0.22 140);        /* Positive success green */
  --color-success-content: oklch(97% 0.02 140); /* Nearly white for success text */
  
  /* Warning yellow - attention-grabbing with strong contrast on white */
  --color-warning: oklch(60% 0.30 65);         /* Strong yellow-amber warning color */
  --color-warning-content: oklch(15% 0.05 65); /* Dark text for warning (better readability) */
  
  /* Error red - clear danger indication */
  --color-error: oklch(62% 0.22 15);           /* Strong error red */
  --color-error-content: oklch(97% 0.02 15);   /* Nearly white for error text */
  
  /* ===== COMPONENT STYLING VARIABLES ===== */
  /* Slightly rounded corners for modern but not overly playful look */
  --radius-box: 0.25rem;           /* Cards, containers */
  --radius-field: 0.15rem;       /* Input fields, form elements */
  --radius-selector: 0.15rem;      /* Buttons, selectors */
  
  /* Border and spacing for clean, structured layout */
  --size-field: 0.25rem;          /* Field border width */
  --size-selector: 0.25rem;       /* Selector border width */
  --border: 1px;                  /* Standard border width */
  
  /* Optional: Depth and visual effects */
  --depth: 2;                     /* Shadow depth multiplier */
  --noise: 0;                     /* Texture noise (disabled for clean look) */
}





[data-theme="night"] {
  color-scheme: dark;

  /* ===== BASE COLORS (BACKGROUNDS) ===== */
  --color-base-100: oklch(20% 0.01 240);    /* Very dark gray with slight blue undertone */
  --color-base-200: oklch(25% 0.01 240);    /* Slightly lighter dark gray */
  --color-base-300: oklch(30% 0.015 240);   /* Even lighter for borders */
  --color-base-content: oklch(95% 0.01 240); /* Light gray for text on dark backgrounds */

  /* ===== PRIMARY COLORS (PURPLE THEME) ===== */
  --color-primary: oklch(55% 0.18 285);        /* Rich purple, adjusted for dark theme */
  --color-primary-content: oklch(97% 0.02 285); /* Nearly white with purple hint */

  /* ===== SECONDARY COLORS (GOLD THEME) ===== */
  --color-secondary: oklch(70% 0.12 80);       /* Deeper gold */
  --color-secondary-content: oklch(10% 0.02 80); /* Dark text for contrast */

  /* ===== ACCENT COLORS (BLUE THEME) ===== */
  --color-accent: oklch(60% 0.12 240);         /* Vibrant blue */
  --color-accent-content: oklch(97% 0.02 240); /* Nearly white with blue hint */

  /* ===== NEUTRAL COLORS ===== */
  --color-neutral: oklch(25% 0.01 240);        /* Dark gray for neutral elements */
  --color-neutral-content: oklch(95% 0.01 240); /* Light gray for text on neutral backgrounds */

  /* ===== STATE COLORS (SEMANTIC FEEDBACK) ===== */
  --color-info: oklch(55% 0.20 220);           /* Information blue */
  --color-info-content: oklch(97% 0.02 220);   /* Nearly white for info text */
  --color-success: oklch(58% 0.18 140);        /* Positive success green */
  --color-success-content: oklch(97% 0.02 140); /* Nearly white for success text */
  --color-warning: oklch(68% 0.15 65);         /* Warm warning orange */
  --color-warning-content: oklch(25% 0.05 65); /* Dark text for warning */
  --color-error: oklch(62% 0.22 15);           /* Strong error red */
  --color-error-content: oklch(97% 0.02 15);   /* Nearly white for error text */

  /* ===== COMPONENT STYLING VARIABLES ===== */
  --radius-box: 0;           /* No rounding for cards, containers */
  --radius-field: 0.05rem;         /* Very minimal rounding for input fields */
  --radius-selector: 0;        /* No rounding for buttons */
  --size-field: 0.25rem;           /* Field border width */
  --size-selector: 0.25rem;        /* Selector border width */
  --border: 1px;                   /* Standard border width */
  --depth: 2;                      /* Shadow depth multiplier */
  --noise: 0;                      /* Texture noise (disabled for clean look) */
}







[data-theme="purple"] {
  color-scheme: dark;

  /* ===== BASE COLORS (BACKGROUNDS) ===== */
  /* Main background - dark blue from color_theme_bg_web */
  --color-base-100: #1e1b4b;
  
  /* Slightly elevated background - from background_contrast_1 */
  --color-base-200: #2c2956;
  
  /* More elevated background for borders - from background_contrast_2 */
  --color-base-300: #3c3a63;
  
  /* Light text on dark backgrounds - from print_secondary_on_web_bg_color */
  --color-base-content: #a5a4b7;

  /* ===== PRIMARY COLORS (PURPLE THEME) ===== */
  /* Main purple color - from color_theme_bg_pop */
  --color-primary: #7c3aed;
  
  /* White text on purple - from print_on_pop */
  --color-primary-content: #ffffff;

  /* ===== SECONDARY COLORS ===== */
  /* Darker purple for secondary elements - from background_pop_darken */
  --color-secondary: #6c23eb;
  
  /* White text on secondary purple */
  --color-secondary-content: #ffffff;

  /* ===== ACCENT COLORS ===== */
  /* Purple accent - from color_theme_accent */
  --color-accent: #7c3aed;
  
  /* White text on accent purple */
  --color-accent-content: #ffffff;

  /* ===== NEUTRAL COLORS ===== */
  /* Medium contrast background - from background_contrast_3 */
  --color-neutral: #5d5b7e;
  
  /* Light text on neutral backgrounds */
  --color-neutral-content: #ffffff;

  /* ===== STATE COLORS (SEMANTIC FEEDBACK) ===== */
  /* Information blue - keeping similar to original but with purple tint */
  --color-info: #6366f1;
  
  /* White text on info background */
  --color-info-content: #ffffff;
  
  /* Success green - from primitive green values */
  --color-success: #10b981;
  
  /* White text on success background */
  --color-success-content: #ffffff;
  
  /* Warning orange - from primitive orange values */
  --color-warning: #f59e0b;
  
  /* Dark text on warning background for better contrast */
  --color-warning-content: #1f2937;
  
  /* Error red - from primitive red values */
  --color-error: #ef4444;
  
  /* White text on error background */
  --color-error-content: #ffffff;

  /* ===== COMPONENT STYLING VARIABLES ===== */
  /* Slightly rounded corners for modern look */
  --radius-box: 8px;
  
  /* Minimal rounding for input fields */
  --radius-field: 4px;
  
  /* Minimal rounding for buttons */
  --radius-selector: 4px;
  
  /* Field padding/sizing - keeping original rem values for proper sizing */
  --size-field: 0.25rem;
  
  /* Button padding/sizing - keeping original rem values for proper sizing */
  --size-selector: 0.25rem;
  
  /* Standard border width */
  --border: 1px;
  
  /* Shadow depth multiplier */
  --depth: 2;
  
  /* Texture noise disabled for clean look */
  --noise: 0;
}






[data-theme="dark-black"] {
  color-scheme: dark;

  /* ===== BASE COLORS (BACKGROUNDS) ===== */
  --color-base-100: oklch(20% 0.01 240);    /* Very dark gray with slight blue undertone */
  --color-base-200: oklch(25% 0.01 240);    /* Slightly lighter dark gray */
  --color-base-300: oklch(30% 0.015 240);   /* Even lighter for borders */
  --color-base-content: red; /* Light gray for text on dark backgrounds */

  /* ===== PRIMARY COLORS (PURPLE THEME) ===== */
  --color-primary: oklch(55% 0.18 285);        /* Rich purple, adjusted for dark theme */
  --color-primary-content: oklch(97% 0.02 285); /* Nearly white with purple hint */

  /* ===== SECONDARY COLORS (GOLD THEME) ===== */
  --color-secondary: oklch(70% 0.12 80);       /* Deeper gold */
  --color-secondary-content: oklch(10% 0.02 80); /* Dark text for contrast */

  /* ===== ACCENT COLORS (BLUE THEME) ===== */
  --color-accent: oklch(60% 0.12 240);         /* Vibrant blue */
  --color-accent-content: oklch(97% 0.02 240); /* Nearly white with blue hint */

  /* ===== NEUTRAL COLORS ===== */
  --color-neutral: oklch(25% 0.01 240);        /* Dark gray for neutral elements */
  --color-neutral-content: oklch(95% 0.01 240); /* Light gray for text on neutral backgrounds */

  /* ===== STATE COLORS (SEMANTIC FEEDBACK) ===== */
  --color-info: oklch(55% 0.20 220);           /* Information blue */
  --color-info-content: oklch(97% 0.02 220);   /* Nearly white for info text */
  --color-success: oklch(58% 0.18 140);        /* Positive success green */
  --color-success-content: oklch(97% 0.02 140); /* Nearly white for success text */
  --color-warning: oklch(68% 0.15 65);         /* Warm warning orange */
  --color-warning-content: oklch(25% 0.05 65); /* Dark text for warning */
  --color-error: oklch(62% 0.22 15);           /* Strong error red */
  --color-error-content: oklch(97% 0.02 15);   /* Nearly white for error text */

  /* ===== COMPONENT STYLING VARIABLES ===== */
  --radius-box: 0;           /* No rounding for cards, containers */
  --radius-field: 0.05rem;         /* Very minimal rounding for input fields */
  --radius-selector: 0;        /* No rounding for buttons */
  --size-field: 0.25rem;           /* Field border width */
  --size-selector: 0.25rem;        /* Selector border width */
  --border: 1px;                   /* Standard border width */
  --depth: 2;                      /* Shadow depth multiplier */
  --noise: 0;                      /* Texture noise (disabled for clean look) */
}


/* ===== ADDITIONAL NOTES AND MISSING VARIABLES ===== */
/*
 * This theme includes all standard DaisyUI color variables.
 * 
 * Key design decisions:
 * 1. base-100 (99.5% lightness) - Nearly white for maximum brightness
 * 2. base-200 (97% lightness) - Subtle difference but noticeable for layering
 * 3. base-content (22% lightness) - Strong matte dark for excellent readability
 * 4. All content colors are 97% lightness - Very strong white-ish text
 * 5. Primary/Secondary/Accent are dark enough for WCAG AA accessibility
 * 
 * Color choices:
 * - Primary: Rich purple (285° hue) - Professional and distinctive
 * - Secondary: Strong blue (240° hue) - Trustworthy and corporate
 * - Accent: Emerald green (150° hue) - Fresh and action-oriented
 * 
 * Potential missing variables that some DaisyUI versions might use:
 * --rounded-box, --rounded-btn, --rounded-badge
 * --animation-btn, --animation-input
 * --btn-text-case, --btn-focus-scale
 * --border-btn, --tab-border, --tab-radius
 * 
 * If you need any of these, they can be added based on your specific needs.
 */

/**************** Custom DaisyUI Theme - Zelie (DaisyUI v5 format) ****************/
[data-theme="zelie"] {
  color-scheme: light;
  
  /* Base colors (backgrounds) */
  --color-base-100: oklch(100% 0 0);          /* Pure white */
  --color-base-200: oklch(97% 0.02 220);      /* Very light gray */
  --color-base-300: oklch(91% 0.04 220);      /* Light gray */
  --color-base-content: oklch(18% 0.05 220);  /* Dark text */
  
  /* Primary colors */
  --color-primary: oklch(60% 0.25 219);       /* Beautiful blue */
  --color-primary-content: oklch(100% 0 0);   /* White text on primary */
  
  /* Secondary colors */
  --color-secondary: oklch(36% 0.20 142);     /* Forest green */
  --color-secondary-content: oklch(100% 0 0); /* White text on secondary */
  
  /* Accent colors */
  --color-accent: oklch(70% 0.25 328);        /* Pink accent */
  --color-accent-content: oklch(15% 0.05 328); /* Dark text on accent */
  
  /* Neutral colors */
  --color-neutral: oklch(18% 0.05 220);       /* Dark neutral */
  --color-neutral-content: oklch(100% 0 0);   /* White text on neutral */
  
  /* State colors */
  --color-info: oklch(60% 0.25 198);          /* Info blue */
  --color-info-content: oklch(100% 0 0);      /* White text on info */
  
  --color-success: oklch(52% 0.20 158);       /* Success green */
  --color-success-content: oklch(100% 0 0);   /* White text on success */
  
  --color-warning: oklch(60% 0.30 65);        /* Strong yellow-amber warning color */
  --color-warning-content: oklch(15% 0.05 65); /* Dark text on warning */
  
  --color-error: oklch(71% 0.25 0);           /* Error red */
  --color-error-content: oklch(100% 0 0);     /* White text on error */
  
  /* Component specific variables */
  --radius-box: 0.75rem;
  --radius-field: 0.5rem;
  --radius-selector: 1rem;
  --size-field: 0.25rem;
  --size-selector: 0.25rem;
  --border: 1px;
}

/**************** Custom DaisyUI Theme - Zelie Dark (DaisyUI v5 format) ****************/
[data-theme="zelie-dark"] {
  color-scheme: dark;
  
  /* Base colors (backgrounds) */
  --color-base-100: oklch(18% 0.05 220);      /* Dark background */
  --color-base-200: oklch(15% 0.05 220);      /* Darker background */
  --color-base-300: oklch(12% 0.05 220);      /* Darkest background */
  --color-base-content: oklch(91% 0.04 220);  /* Light text */
  
  /* Primary colors */
  --color-primary: oklch(70% 0.25 219);       /* Lighter blue for dark mode */
  --color-primary-content: oklch(15% 0.05 219); /* Dark text on primary */
  
  /* Secondary colors */
  --color-secondary: oklch(46% 0.20 142);     /* Lighter forest green */
  --color-secondary-content: oklch(15% 0.05 142); /* Dark text on secondary */
  
  /* Accent colors */
  --color-accent: oklch(80% 0.25 328);        /* Lighter pink accent */
  --color-accent-content: oklch(15% 0.05 328); /* Dark text on accent */
  
  /* Neutral colors */
  --color-neutral: oklch(85% 0.04 220);       /* Light neutral */
  --color-neutral-content: oklch(18% 0.05 220); /* Dark text on neutral */
  
  /* State colors */
  --color-info: oklch(70% 0.25 198);          /* Lighter info blue */
  --color-info-content: oklch(15% 0.05 198);  /* Dark text on info */
  
  --color-success: oklch(62% 0.20 158);       /* Lighter success green */
  --color-success-content: oklch(15% 0.05 158); /* Dark text on success */
  
  /* Adjusted warning color to be more yellow and less reddish */
  --color-warning: oklch(60% 0.15 65);        /* Strong yellow-amber warning color */
  --color-warning-content: oklch(15% 0.05 65); /* Dark text on warning */
  
  --color-error: oklch(81% 0.25 0);           /* Lighter error red */
  --color-error-content: oklch(15% 0.05 0);   /* Dark text on error */
  
  /* Component specific variables */
  --radius-box: 0.75rem;
  --radius-field: 0.5rem;
  --radius-selector: 1rem;
  --size-field: 0.25rem;
  --size-selector: 0.25rem;
  --border: 1px;
}