/*
 * Custom Color Palette for Monist
 * Override ONLY primary, secondary, and tertiary brand colors
 */

:root, [data-bs-theme=light] {
    /* Primary Color: Purple (#b53ac1) */
    --primary-color: #b53ac1;
    --primary-light: #d97ee3;
    --primary-lighter: #e8b0f0;
    --primary-dark: #8e2e9a;
    --primary-darker: #6a2273;

    /* Secondary Color: Teal (#1ae5be) */
    --secondary-color: #1ae5be;
    --secondary-light: #5defd2;
    --secondary-lighter: #9ff5e3;
    --secondary-dark: #16c7a6;
    --secondary-darker: #11a188;

    /* Tertiary Color: Orange (#FF6B35) */
    --tertiary-color: #FF6B35;
    --tertiary-light: #ff8c5e;
    --tertiary-lighter: #ffad87;
    --tertiary-dark: #FF8C42;
    --tertiary-darker: #e64a1a;

    /* Bootstrap primary color override (purple) */
    --bs-primary: #b53ac1;
    --bs-primary-rgb: 181, 58, 193;
    --bs-primary-active: #8e2e9a;
    --bs-primary-hover: #8e2e9a;
    --bs-link-color: #b53ac1;
    --bs-link-color-rgb: 181, 58, 193;
    --bs-link-hover-color: #8e2e9a;
    --bs-link-hover-color-rgb: 142, 46, 154;
    --bs-primary-bg-subtle: #f5e7f7;
    --bs-primary-border-subtle: #d97ee3;
    --bs-primary-text: #6a2273;

    /* Bootstrap secondary color override (teal) */
    --bs-secondary: #1ae5be;
    --bs-secondary-rgb: 26, 229, 190;
    --bs-secondary-active: #16c7a6;
    --bs-secondary-hover: #16c7a6;
    --bs-secondary-bg-subtle: #e6fcf7;
    --bs-secondary-border-subtle: #5defd2;
    --bs-secondary-text: #11a188;

    /* Component active states (forms, dropdowns, select, etc.) */
    --bs-component-active-color: #ffffff;
    --bs-component-active-bg: #b53ac1;

    /* Component hover colors */
    --bs-component-hover-color: #b53ac1;
    --bs-component-hover-bg: rgba(181, 58, 193, 0.1);
}

[data-bs-theme=dark] {
    /* Primary Color adjustments for dark mode */
    --primary-color: #d97ee3;
    --primary-light: #e8b0f0;
    --primary-dark: #b53ac1;

    /* Secondary Color adjustments for dark mode */
    --secondary-color: #5defd2;
    --secondary-light: #9ff5e3;
    --secondary-dark: #1ae5be;

    /* Tertiary Color adjustments for dark mode */
    --tertiary-color: #ff8c5e;
    --tertiary-light: #ffad87;
    --tertiary-dark: #FF6B35;

    /* Bootstrap overrides for dark mode */
    --bs-primary: #d97ee3;
    --bs-primary-rgb: 217, 126, 227;
    --bs-primary-active: #b53ac1;
    --bs-primary-hover: #b53ac1;
    --bs-link-color: #d97ee3;
    --bs-link-hover-color: #e8b0f0;

    --bs-secondary: #5defd2;
    --bs-secondary-rgb: 93, 239, 210;
    --bs-secondary-active: #1ae5be;
    --bs-secondary-hover: #1ae5be;

    /* Component active states for dark mode */
    --bs-component-active-color: #ffffff;
    --bs-component-active-bg: #d97ee3;

    /* Component hover colors for dark mode */
    --bs-component-hover-color: #d97ee3;
    --bs-component-hover-bg: rgba(217, 126, 227, 0.1);
}

/* Utility classes for brand colors */
.text-primary {
    color: var(--primary-color) !important;
}

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

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

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

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

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

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

.text-tertiary-custom {
    color: var(--tertiary-color) !important;
}

.text-tertiary-light {
    color: var(--tertiary-light) !important;
}

.text-tertiary-dark {
    color: var(--tertiary-dark) !important;
}

/* Background utility classes */
.bg-primary-custom {
    background-color: var(--primary-color) !important;
    color: #ffffff !important;
}

.bg-primary-light {
    background-color: var(--primary-light) !important;
    color: #000000 !important;
}

.bg-primary-dark {
    background-color: var(--primary-dark) !important;
    color: #ffffff !important;
}

.bg-secondary-custom {
    background-color: var(--secondary-color) !important;
    color: #000000 !important;
}

.bg-secondary-light {
    background-color: var(--secondary-light) !important;
    color: #000000 !important;
}

.bg-secondary-dark {
    background-color: var(--secondary-dark) !important;
    color: #ffffff !important;
}

.bg-tertiary-custom {
    background-color: var(--tertiary-color) !important;
    color: #ffffff !important;
}

.bg-tertiary-light {
    background-color: var(--tertiary-light) !important;
    color: #000000 !important;
}

.bg-tertiary-dark {
    background-color: var(--tertiary-dark) !important;
    color: #ffffff !important;
}

/* Border utility classes */
.border-primary-custom {
    border-color: var(--primary-color) !important;
}

.border-secondary-custom {
    border-color: var(--secondary-color) !important;
}

.border-tertiary-custom {
    border-color: var(--tertiary-color) !important;
}

/* Button overrides - ONLY primary and secondary */
.btn-primary {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

.btn-primary:hover {
    background-color: var(--primary-dark) !important;
    border-color: var(--primary-dark) !important;
}

.btn-primary:active,
.btn-primary.active,
.btn-primary:focus {
    background-color: var(--primary-darker) !important;
    border-color: var(--primary-darker) !important;
}

.btn-primary:disabled,
.btn-primary.disabled {
    background-color: var(--primary-light) !important;
    border-color: var(--primary-light) !important;
}

.btn-secondary {
    --bs-btn-bg: var(--secondary-color);
    --bs-btn-border-color: var(--secondary-color);
    --bs-btn-color: #000000;
    --bs-btn-hover-bg: var(--secondary-dark);
    --bs-btn-hover-border-color: var(--secondary-dark);
    --bs-btn-active-bg: var(--secondary-darker);
    --bs-btn-active-border-color: var(--secondary-darker);
    --bs-btn-disabled-bg: var(--secondary-light);
    --bs-btn-disabled-border-color: var(--secondary-light);
}

/* Badge overrides - ONLY primary and secondary */
.badge.badge-primary {
    background-color: var(--primary-color) !important;
}

.badge.badge-secondary {
    background-color: var(--secondary-color) !important;
    color: #000000 !important;
}

/* Link colors */
.link-primary {
    color: var(--primary-color) !important;
}

.link-primary:hover,
.link-primary:focus {
    color: var(--primary-dark) !important;
}

/* Text hover primary - comprehensive coverage */
.text-hover-primary:hover,
a.text-hover-primary:hover,
.text-primary:hover {
    color: var(--primary-color) !important;
}

/* All hover states that should use primary color */
.hover-primary:hover,
[class*="hover-primary"]:hover {
    color: var(--primary-color) !important;
}

/* Link colors in navigation */
.menu-link:hover,
.menu-link.active {
    color: var(--primary-color) !important;
}

/* Button active color states for outline and text buttons */
.btn-active-color-primary:hover,
.btn-active-color-primary:active,
.btn-active-color-primary.active {
    color: var(--primary-color) !important;
}

.btn-outline.btn-active-color-primary:hover,
.btn-outline.btn-active-color-primary:active,
.btn-outline.btn-active-color-primary.active {
    border-color: var(--primary-color) !important;
    background-color: rgba(181, 58, 193, 0.1) !important;
}

/* Focus states */
.form-control:focus,
.form-select:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 0.25rem rgba(181, 58, 193, 0.25);
}

/* Progress bars */
.progress-bar {
    background-color: var(--primary-color);
}

/* Alerts - ONLY primary and secondary */
.alert-primary {
    background-color: var(--bs-primary-bg-subtle);
    border-color: var(--bs-primary-border-subtle);
    color: var(--bs-primary-text);
}

.alert-secondary {
    background-color: var(--bs-secondary-bg-subtle);
    border-color: var(--bs-secondary-border-subtle);
    color: var(--bs-secondary-text);
}

/* Floating menu - bottom left fixed button */
.floating-menu {
    position: fixed;
    bottom: 20px;
    left: 20px;
    z-index: 1000;
}

.floating-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.floating-menu ul li {
    margin: 0;
}

.floating-menu ul li a {
    display: inline-block;
    padding: 12px 24px;
    background-color: var(--primary-color);
    color: #ffffff;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(181, 58, 193, 0.3);
    transition: all 0.3s ease;
}

.floating-menu ul li a:hover {
    background-color: var(--primary-dark);
    box-shadow: 0 6px 16px rgba(181, 58, 193, 0.4);
    transform: translateY(-2px);
}