/* ============================================== */
/* Mannito Cloud Color Configuration              */
/* ============================================== */
/* 
 * This file defines the primary, secondary, and tertiary colors for the application.
 * 
 * Primary Color: #49793f (Green)
 * Secondary Color: #5a6c7d (Grey-Blue)
 * Tertiary Color: #6d8fa8 (Light Blue-Grey)
 */

:root {
    /* ========================================== */
    /* Primary Color (Green)                     */
    /* ========================================== */
    --mannito-primary-color: #49793f;
    --mannito-primary-rgb: 73, 121, 63;
    --mannito-primary-hover: #3d6432;
    --mannito-primary-active: #2f4d27;
    --mannito-primary-light: rgba(73, 121, 63, 0.1);
    --mannito-primary-border: rgba(73, 121, 63, 0.25);
    --mannito-primary-shadow: rgba(73, 121, 63, 0.2);
    
    /* ========================================== */
    /* Secondary Color (Grey-Blue)               */
    /* ========================================== */
    --mannito-secondary-color: #5a6c7d;
    --mannito-secondary-rgb: 90, 108, 125;
    --mannito-secondary-hover: #4a5a68;
    --mannito-secondary-active: #3d4a56;
    --mannito-secondary-light: rgba(90, 108, 125, 0.1);
    
    /* ========================================== */
    /* Tertiary Color (Light Blue-Grey)          */
    /* ========================================== */
    --mannito-tertiary-color: #6d8fa8;
    --mannito-tertiary-rgb: 109, 143, 168;
    --mannito-tertiary-hover: #5a7a91;
    --mannito-tertiary-active: #4a6579;
    --mannito-tertiary-light: rgba(109, 143, 168, 0.1);
    
    /* ========================================== */
    /* Success Color (Use Primary)               */
    /* ========================================== */
    --mannito-success-color: var(--mannito-primary-color);
    --mannito-success-rgb: var(--mannito-primary-rgb);
    
    /* ========================================== */
    /* Override Phoenix Theme Primary Colors    */
    /* ========================================== */
    --phoenix-primary: var(--mannito-primary-color);
    --phoenix-primary-rgb: var(--mannito-primary-rgb);
    --phoenix-success: var(--mannito-primary-color);
    --phoenix-success-rgb: var(--mannito-primary-rgb);
    --phoenix-green: var(--mannito-primary-color);
    
    /* ========================================== */
    /* Override Phoenix Button Colors            */
    /* ========================================== */
    --phoenix-btn-bg: var(--mannito-primary-color);
    --phoenix-btn-border-color: var(--mannito-primary-color);
    --phoenix-btn-hover-bg: var(--mannito-primary-hover);
    --phoenix-btn-hover-border-color: var(--mannito-primary-hover);
    --phoenix-btn-active-bg: var(--mannito-primary-active);
    --phoenix-btn-active-border-color: var(--mannito-primary-active);
    
    /* ========================================== */
    /* Override Other Phoenix Theme Colors       */
    /* ========================================== */
    --phoenix-primary-text-emphasis: var(--mannito-primary-active);
    --phoenix-primary-bg-subtle: var(--mannito-primary-light);
    --phoenix-link-color: var(--mannito-primary-color);
    --phoenix-link-hover-color: var(--mannito-primary-hover);
}

/* ========================================== */
/* Class-Level Button Variable Overrides     */
/* ========================================== */
/* Override the CSS variables that .btn-primary sets */
.btn-primary,
.tox .tox-dialog__footer .tox-button:last-child,
.tox .tox-button {
    --phoenix-btn-color: #fff;
    --phoenix-btn-bg: var(--mannito-primary-color);
    --phoenix-btn-border-color: var(--mannito-primary-color);
    --phoenix-btn-hover-color: #fff;
    --phoenix-btn-hover-bg: var(--mannito-primary-hover);
    --phoenix-btn-hover-border-color: var(--mannito-primary-hover);
    --phoenix-btn-focus-shadow-rgb: var(--mannito-primary-rgb);
    --phoenix-btn-active-color: #fff;
    --phoenix-btn-active-bg: var(--mannito-primary-active);
    --phoenix-btn-active-border-color: var(--mannito-primary-active);
    --phoenix-btn-active-shadow: initial;
    --phoenix-btn-disabled-color: #fff;
    --phoenix-btn-disabled-bg: var(--mannito-primary-color);
    --phoenix-btn-disabled-border-color: var(--mannito-primary-color);
}

.btn-success {
    --phoenix-btn-color: #fff;
    --phoenix-btn-bg: var(--mannito-primary-color);
    --phoenix-btn-border-color: var(--mannito-primary-color);
    --phoenix-btn-hover-color: #fff;
    --phoenix-btn-hover-bg: var(--mannito-primary-hover);
    --phoenix-btn-hover-border-color: var(--mannito-primary-hover);
    --phoenix-btn-active-bg: var(--mannito-primary-active);
    --phoenix-btn-active-border-color: var(--mannito-primary-active);
    --phoenix-btn-disabled-bg: var(--mannito-primary-color);
    --phoenix-btn-disabled-border-color: var(--mannito-primary-color);
}

/* ========================================== */
/* Dark Mode Color Overrides                 */
/* ========================================== */
[data-bs-theme=dark] {
    --mannito-primary-color: #5a8f4e;
    --mannito-primary-rgb: 90, 143, 78;
    --mannito-primary-hover: #6ba55e;
    --mannito-primary-light: rgba(90, 143, 78, 0.15);
    
    --mannito-secondary-color: #6a7d8f;
    --mannito-secondary-rgb: 106, 125, 143;
    
    --mannito-tertiary-color: #7da3ba;
    --mannito-tertiary-rgb: 125, 163, 186;
    
    --phoenix-primary: var(--mannito-primary-color);
    --phoenix-primary-rgb: var(--mannito-primary-rgb);
    --phoenix-success: var(--mannito-primary-color);
    --phoenix-success-rgb: var(--mannito-primary-rgb);
    
    /* Button colors for dark mode */
    --phoenix-btn-bg: var(--mannito-primary-color);
    --phoenix-btn-border-color: var(--mannito-primary-color);
    --phoenix-btn-hover-bg: var(--mannito-primary-hover);
    --phoenix-btn-hover-border-color: var(--mannito-primary-hover);
    --phoenix-btn-active-bg: var(--mannito-primary-active);
    --phoenix-btn-active-border-color: var(--mannito-primary-active);
    
    --phoenix-link-color: var(--mannito-primary-color);
    --phoenix-link-hover-color: var(--mannito-primary-hover);
}

/* Dark mode class-level button overrides */
[data-bs-theme=dark] .btn-primary,
[data-bs-theme=dark] .tox .tox-dialog__footer .tox-button:last-child,
[data-bs-theme=dark] .tox .tox-button {
    --phoenix-btn-bg: var(--mannito-primary-color);
    --phoenix-btn-border-color: var(--mannito-primary-color);
    --phoenix-btn-hover-bg: var(--mannito-primary-hover);
    --phoenix-btn-hover-border-color: var(--mannito-primary-hover);
    --phoenix-btn-active-bg: var(--mannito-primary-active);
    --phoenix-btn-active-border-color: var(--mannito-primary-active);
    --phoenix-btn-disabled-bg: var(--mannito-primary-color);
    --phoenix-btn-disabled-border-color: var(--mannito-primary-color);
}

[data-bs-theme=dark] .btn-success {
    --phoenix-btn-bg: var(--mannito-primary-color);
    --phoenix-btn-border-color: var(--mannito-primary-color);
    --phoenix-btn-hover-bg: var(--mannito-primary-hover);
    --phoenix-btn-hover-border-color: var(--mannito-primary-hover);
    --phoenix-btn-active-bg: var(--mannito-primary-active);
    --phoenix-btn-active-border-color: var(--mannito-primary-active);
}
