/**
 * Alatreyu Global Theme
 * Nature-inspired color palette with consistent styling
 *
 * Colors:
 * - Primary: Dark charcoal (nav background)
 * - Green: Forest green (nature-inspired)
 * - Red: Fire red (warm, natural)
 * - Yellow: Amber/gold (warm, earthy)
 */

:root {
    /* ==========================================================================
       Primary Brand Colors
       ========================================================================== */
    --theme-primary: #1e1e2d;           /* Dark charcoal - main brand color */
    --theme-primary-hover: #2d2d3d;     /* Lighter charcoal for hover states */
    --theme-primary-light: #3d3d4d;     /* Even lighter for subtle accents */

    /* ==========================================================================
       Status Colors - Nature Inspired
       ========================================================================== */

    /* Forest Green - Success/Positive */
    --theme-green: #2d6a4f;             /* Forest green - dark */
    --theme-green-light: #d8f3dc;       /* Soft sage - light background */
    --theme-green-dark: #1b4332;        /* Deep forest - darker accent */
    --theme-green-text: #1b4332;        /* Text on light green background */

    /* Fire Red - Danger/Urgent */
    --theme-red: #c9302c;               /* Fire red - dark */
    --theme-red-light: #fce8e8;         /* Soft blush - light background */
    --theme-red-dark: #9b2226;          /* Deep ember - darker accent */
    --theme-red-text: #9b2226;          /* Text on light red background */

    /* Amber Yellow - Warning/Attention */
    --theme-yellow: #cc8400;            /* Amber - dark */
    --theme-yellow-light: #fff8e6;      /* Soft cream - light background */
    --theme-yellow-dark: #996300;       /* Deep gold - darker accent */
    --theme-yellow-text: #7a5000;       /* Text on light yellow background */

    /* ==========================================================================
       Neutral Colors - UI Elements
       ========================================================================== */

    /* Backgrounds */
    --theme-bg-body: #f8f9fa;           /* Main body background */
    --theme-bg-card: #ffffff;           /* Card backgrounds */
    --theme-bg-muted: #f1f3f5;          /* Muted/subtle backgrounds */
    --theme-bg-hover: #e9ecef;          /* Hover state backgrounds */

    /* Borders */
    --theme-border: #dee2e6;            /* Default border color */
    --theme-border-light: #e9ecef;      /* Lighter borders */
    --theme-border-dark: #ced4da;       /* Darker borders */

    /* Text Colors */
    --theme-text-primary: #212529;      /* Primary text - near black */
    --theme-text-secondary: #6c757d;    /* Secondary/muted text */
    --theme-text-muted: #adb5bd;        /* Very muted text */
    --theme-text-white: #ffffff;        /* White text */

    /* ==========================================================================
       Semantic Aliases (for easier usage)
       ========================================================================== */
    --color-success: var(--theme-green);
    --color-success-light: var(--theme-green-light);
    --color-success-dark: var(--theme-green-dark);

    --color-danger: var(--theme-red);
    --color-danger-light: var(--theme-red-light);
    --color-danger-dark: var(--theme-red-dark);

    --color-warning: var(--theme-yellow);
    --color-warning-light: var(--theme-yellow-light);
    --color-warning-dark: var(--theme-yellow-dark);

    --color-primary: var(--theme-primary);
    --color-primary-hover: var(--theme-primary-hover);
}

/* ==========================================================================
   Utility Classes
   ========================================================================== */

/* Background colors */
.bg-theme-primary { background-color: var(--theme-primary) !important; }
.bg-theme-green { background-color: var(--theme-green) !important; }
.bg-theme-green-light { background-color: var(--theme-green-light) !important; }
.bg-theme-red { background-color: var(--theme-red) !important; }
.bg-theme-red-light { background-color: var(--theme-red-light) !important; }
.bg-theme-yellow { background-color: var(--theme-yellow) !important; }
.bg-theme-yellow-light { background-color: var(--theme-yellow-light) !important; }

/* Text colors */
.text-theme-primary { color: var(--theme-primary) !important; }
.text-theme-green { color: var(--theme-green) !important; }
.text-theme-green-dark { color: var(--theme-green-dark) !important; }
.text-theme-red { color: var(--theme-red) !important; }
.text-theme-red-dark { color: var(--theme-red-dark) !important; }
.text-theme-yellow { color: var(--theme-yellow) !important; }
.text-theme-yellow-dark { color: var(--theme-yellow-dark) !important; }

/* Border colors */
.border-theme-green { border-color: var(--theme-green) !important; }
.border-theme-red { border-color: var(--theme-red) !important; }
.border-theme-yellow { border-color: var(--theme-yellow) !important; }

/* ==========================================================================
   Button Overrides - Use Primary Dark
   ========================================================================== */
.btn-primary {
    background-color: var(--theme-primary);
    border-color: var(--theme-primary);
    color: var(--theme-text-white);
}
.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--theme-primary-hover);
    border-color: var(--theme-primary-hover);
    color: var(--theme-text-white);
}
.btn-primary:active {
    background-color: var(--theme-primary-light);
    border-color: var(--theme-primary-light);
}

.btn-outline-primary {
    color: var(--theme-primary);
    border-color: var(--theme-primary);
}
.btn-outline-primary:hover,
.btn-outline-primary:focus {
    background-color: var(--theme-primary);
    border-color: var(--theme-primary);
    color: var(--theme-text-white);
}

/* Success button - Forest Green */
.btn-success {
    background-color: var(--theme-green);
    border-color: var(--theme-green);
}
.btn-success:hover,
.btn-success:focus {
    background-color: var(--theme-green-dark);
    border-color: var(--theme-green-dark);
}

.btn-outline-success {
    color: var(--theme-green);
    border-color: var(--theme-green);
}
.btn-outline-success:hover {
    background-color: var(--theme-green);
    border-color: var(--theme-green);
    color: var(--theme-text-white);
}

/* Danger button - Fire Red */
.btn-danger {
    background-color: var(--theme-red);
    border-color: var(--theme-red);
}
.btn-danger:hover,
.btn-danger:focus {
    background-color: var(--theme-red-dark);
    border-color: var(--theme-red-dark);
}

.btn-outline-danger {
    color: var(--theme-red);
    border-color: var(--theme-red);
}
.btn-outline-danger:hover {
    background-color: var(--theme-red);
    border-color: var(--theme-red);
    color: var(--theme-text-white);
}

/* Warning button - Amber */
.btn-warning {
    background-color: var(--theme-yellow);
    border-color: var(--theme-yellow);
    color: var(--theme-text-white);
}
.btn-warning:hover,
.btn-warning:focus {
    background-color: var(--theme-yellow-dark);
    border-color: var(--theme-yellow-dark);
    color: var(--theme-text-white);
}

.btn-outline-warning {
    color: var(--theme-yellow);
    border-color: var(--theme-yellow);
}
.btn-outline-warning:hover {
    background-color: var(--theme-yellow);
    border-color: var(--theme-yellow);
    color: var(--theme-text-white);
}

/* ==========================================================================
   Badge Overrides
   ========================================================================== */

/* Success badges - Forest Green */
.badge.bg-success,
.bg-success {
    background-color: var(--theme-green) !important;
}
.badge.bg-success-lt,
.bg-success-lt {
    background-color: var(--theme-green-light) !important;
    color: var(--theme-green-text) !important;
}

/* Danger badges - Fire Red */
.badge.bg-danger,
.bg-danger {
    background-color: var(--theme-red) !important;
}
.badge.bg-danger-lt,
.bg-danger-lt {
    background-color: var(--theme-red-light) !important;
    color: var(--theme-red-text) !important;
}

/* Warning badges - Amber */
.badge.bg-warning,
.bg-warning {
    background-color: var(--theme-yellow) !important;
    color: var(--theme-text-white) !important;
}
.badge.bg-warning-lt,
.bg-warning-lt {
    background-color: var(--theme-yellow-light) !important;
    color: var(--theme-yellow-text) !important;
}

/* Primary badges - Dark charcoal */
.badge.bg-primary,
.bg-primary {
    background-color: var(--theme-primary) !important;
}

/* ==========================================================================
   Alert Overrides
   ========================================================================== */
.alert-success {
    background-color: var(--theme-green-light);
    border-color: var(--theme-green);
    color: var(--theme-green-text);
}

.alert-danger {
    background-color: var(--theme-red-light);
    border-color: var(--theme-red);
    color: var(--theme-red-text);
}

.alert-warning {
    background-color: var(--theme-yellow-light);
    border-color: var(--theme-yellow);
    color: var(--theme-yellow-text);
}

/* ==========================================================================
   Status Indicator Classes
   ========================================================================== */
.status-success,
.status-ready,
.status-good {
    color: var(--theme-green);
}

.status-danger,
.status-critical,
.status-urgent {
    color: var(--theme-red);
}

.status-warning,
.status-low,
.status-partial {
    color: var(--theme-yellow);
}

/* Status backgrounds */
.bg-status-success,
.bg-status-ready,
.bg-status-good {
    background-color: var(--theme-green-light);
    color: var(--theme-green-text);
}

.bg-status-danger,
.bg-status-critical,
.bg-status-urgent {
    background-color: var(--theme-red-light);
    color: var(--theme-red-text);
}

.bg-status-warning,
.bg-status-low,
.bg-status-partial {
    background-color: var(--theme-yellow-light);
    color: var(--theme-yellow-text);
}

/* Status borders (for cards, reminders, etc.) */
.border-status-success,
.border-status-ready {
    border-left: 4px solid var(--theme-green) !important;
}

.border-status-danger,
.border-status-urgent {
    border-left: 4px solid var(--theme-red) !important;
}

.border-status-warning,
.border-status-low {
    border-left: 4px solid var(--theme-yellow) !important;
}

/* ==========================================================================
   Form Elements
   ========================================================================== */
.form-control:focus,
.form-select:focus {
    border-color: var(--theme-primary);
    box-shadow: 0 0 0 0.2rem rgba(30, 30, 45, 0.15);
}

/* ==========================================================================
   Links
   ========================================================================== */
a {
    color: var(--theme-primary);
}
a:hover {
    color: var(--theme-primary-hover);
}

/* ==========================================================================
   Navigation specific
   ========================================================================== */
.navbar-dark-custom {
    background-color: var(--theme-primary) !important;
}

/* ==========================================================================
   Progress bars
   ========================================================================== */
.progress-bar.bg-success {
    background-color: var(--theme-green) !important;
}
.progress-bar.bg-danger {
    background-color: var(--theme-red) !important;
}
.progress-bar.bg-warning {
    background-color: var(--theme-yellow) !important;
}