/* ===== THEME DEFINITIONS ===== */

/* ===== VIEW TRANSITIONS FOR THEME SWITCHING ===== */
/* Smooth theme transitions using the View Transitions API */

/* Enable view transitions for theme changes */
::view-transition {
    /* Ensure view transitions cover the entire viewport */
    pointer-events: none;
}

/* Old state (outgoing theme) */
::view-transition-old(root) {
    animation: theme-fade-out 300ms ease-out both;
}

/* New state (incoming theme) */
::view-transition-new(root) {
    animation: theme-fade-in 300ms ease-in both;
}

/* Crossfade animations */
@keyframes theme-fade-out {
    from {
        opacity: 1;
        filter: brightness(1);
    }
    to {
        opacity: 0;
        filter: brightness(1.1);
    }
}

@keyframes theme-fade-in {
    from {
        opacity: 0;
        filter: brightness(0.9);
    }
    to {
        opacity: 1;
        filter: brightness(1);
    }
}

/* Respect reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
    ::view-transition-old(root),
    ::view-transition-new(root) {
        animation-duration: 0.01ms !important;
    }
}

/* ===== BASE DESIGN TOKENS ===== */

/* Base Design Tokens (Shared) */
:root {
    /* Rounded corners */
    --rounded-box: 1rem;
    --rounded-btn: 0.5rem;
    --rounded-badge: 2rem;

    /* Animation speed */
    --animation-btn: 0.2s;
    --animation-input: 0.2s;

    /* Border settings */
    --btn-focus-scale: 0.98;
    --border-btn: 1px;
    --tab-border: 1px;
    --tab-radius: 0.5rem;

    /* Tonality Simulator Colors */
    --tone-friendly: 0.72 0.19 142;
    /* Amical - Vert vif */
    --tone-firm: 0.75 0.18 85;
    /* Ferme - Amber/Gold */
    --tone-strict: 0.63 0.24 29;
    /* Strict - Rouge */

    /* Email preview component */
    --email-preview-bg: var(--b1);
    /* Fond principal - référence base-100 */
    --email-preview-border: var(--b3);
    /* Bordures - référence base-300 */
    --email-preview-text: var(--bc);
    /* Texte - référence base-content */
    --email-preview-placeholder: var(--b3);
    /* Placeholders - référence base-300 */
}

/* Light Theme - Premium Cash/Fintech (Milk Mint) */
[data-theme="milkmint"] {
    color-scheme: light;

    /* Primary: Deep Emerald Green (Trust, Wealth) */
    --p: 0.35 0.12 155;
    /* ~#005C42 (British Racing Green ish) */
    --pc: 0.98 0.02 155;
    /* White text */

    /* Secondary: Vibrant Mint (Growth, Modernity) */
    --s: 0.85 0.15 150;
    /* ~#6EE7B7 (Tailwind Emerald 300) */
    --sc: 0.2 0.05 155;
    /* Dark Green text */

    /* Accent: Gold/Amber (Cash) */
    --a: 0.75 0.18 85;
    /* ~#F59E0B (Amber 500) */
    --ac: 0.98 0.02 85;

    /* Neutral */
    --n: 0.25 0.03 155;
    /* Deep Green/Slate */
    --nc: 0.98 0.01 155;

    /* Base background - Mint Tint (Very Subtle, near white) */
    --b1: 0.98 0.015 150;
    /* Almost white, very faint mint */
    --b2: 0.95 0.03 150;
    --b3: 0.92 0.05 150;
    --bc: 0.2 0.04 155;
    /* Dark Green/Black for text */

    /* Status Colors - Adjusted to harmonize */
    --in: 0.65 0.12 240;
    /* Blue (Info) */
    --inc: 1 0 0;
    --su: 0.75 0.2 145;
    /* VIVID Green (Success) */
    --suc: 0.15 0.05 145;
    --wa: 0.85 0.16 85;
    /* Warm Amber */
    --wac: 0.2 0.05 85;
    --er: 0.65 0.2 25;
    /* Soft Red */
    --erc: 0.98 0.02 25;

    /* ===== VIBRANT SECTION BACKGROUNDS ===== */
    /* Pour sections avec contraste élevé (KILLER FEATURE, ROI, etc.) */
    --bg-section-accent: 0.95 0.04 150;
    /* Mint Accent - Lightness: 95% (inchangé), Chroma: 0.05 (subtil mais visible), Hue: 150 */
    --bg-section-emerald: 0.96 0.07 155;
    /* Emerald Accent - Légèrement plus vert que mint */
    --bg-section-gold: 0.96 0.06 85;
    /* Gold Accent - Pour sections cash-focused */

    /* Icon accent backgrounds (pour remplacer orange/purple hardcodés) */
    --icon-bg-warning: 0.85 0.16 85;
    /* Reprend --wa (amber) pour cohérence */
    --icon-bg-accent: 0.85 0.15 150;
    /* Reprend --s (mint) pour cohérence */
    --icon-text-warning: 0.45 0.18 85;
    /* Amber foncé pour texte */
    --icon-text-accent: 0.35 0.12 155;
    /* Vert foncé pour texte */
}

/* Dark Theme - Premium Cash/Fintech (Milk Mint Dark) */
[data-theme="milkmint-dark"] {
    color-scheme: dark;

    /* Primary: Vibrant Emerald Green (Brighter for dark background) */
    --p: 0.55 0.15 155;
    --pc: 0.98 0.02 155;

    /* Secondary: Bright Mint */
    --s: 0.75 0.18 150;
    --sc: 0.15 0.05 155;

    /* Accent: Gold/Amber */
    --a: 0.75 0.18 85;
    --ac: 0.15 0.05 85;

    /* Neutral */
    --n: 0.85 0.02 155;
    --nc: 0.15 0.03 155;

    /* Base background - Deep Green/Slate */
    --b1: 0.15 0.03 155;
    --b2: 0.18 0.04 155;
    --b3: 0.22 0.05 155;
    --bc: 0.95 0.02 155;

    /* Status Colors */
    --in: 0.65 0.14 240;
    --inc: 0.98 0 0;
    --su: 0.7 0.2 145;
    --suc: 0.15 0.05 145;
    --wa: 0.8 0.18 85;
    --wac: 0.15 0.05 85;
    --er: 0.65 0.22 25;
    --erc: 0.98 0.02 25;

    /* Section backgrounds (darker variants) */
    --bg-section-accent: 0.18 0.04 155;
    --bg-section-emerald: 0.20 0.06 155;
    --bg-section-gold: 0.20 0.05 85;

    /* Icon backgrounds */
    --icon-bg-warning: 0.75 0.18 85;
    --icon-bg-accent: 0.65 0.15 150;
    --icon-text-warning: 0.85 0.18 85;
    --icon-text-accent: 0.75 0.15 155;
}

