/* Brand Identity Colors - New Identity System */
:root {
    /* Brand Identity HEX Colors */
    --brand-navy-deep: #001b5e;
    --brand-blue-bright: #0049ff;
    --brand-orange-vibrant: #ff4900;
    --brand-gray-light: #d7d7d7;
    
    /* RGB versions for transparency usage */
    --brand-navy-deep-rgb: 0, 27, 94;
    --brand-blue-bright-rgb: 0, 73, 255;
    --brand-orange-vibrant-rgb: 255, 73, 0;
    --brand-gray-light-rgb: 215, 215, 215;
    
    /* Update main color variables to use brand colors */
    --main-color-one: var(--brand-blue-bright);
    --main-color-one-rgb: var(--brand-blue-bright-rgb);
    --main-color-two: var(--brand-navy-deep);
    --main-color-two-rgb: var(--brand-navy-deep-rgb);
    --main-color-three: var(--brand-orange-vibrant);
    --main-color-three-rgb: var(--brand-orange-vibrant-rgb);
    --main-color-four: var(--brand-gray-light);
    --main-color-four-rgb: var(--brand-gray-light-rgb);
    
    /* Update heading colors to use brand navy */
    --heading-color: var(--brand-navy-deep);
    --heading-color-one: var(--brand-navy-deep);
    --heading-color-three: var(--brand-navy-deep);
    
    /* Update secondary color */
    --secondary-color: var(--brand-gray-light);
    
    /* Update hover colors */
    --hover-color-one: var(--brand-orange-vibrant);
    --hover-color-two: var(--brand-blue-bright);
}

/* Brand Color Utility Classes */
.brand-navy-deep {
    color: var(--brand-navy-deep) !important;
}

.brand-blue-bright {
    color: var(--brand-blue-bright) !important;
}

.brand-orange-vibrant {
    color: var(--brand-orange-vibrant) !important;
}

.brand-gray-light {
    color: var(--brand-gray-light) !important;
}

/* Background Colors */
.bg-brand-navy-deep {
    background-color: var(--brand-navy-deep) !important;
}

.bg-brand-blue-bright {
    background-color: var(--brand-blue-bright) !important;
}

.bg-brand-orange-vibrant {
    background-color: var(--brand-orange-vibrant) !important;
}

.bg-brand-gray-light {
    background-color: var(--brand-gray-light) !important;
}

/* Border Colors */
.border-brand-navy-deep {
    border-color: var(--brand-navy-deep) !important;
}

.border-brand-blue-bright {
    border-color: var(--brand-blue-bright) !important;
}

.border-brand-orange-vibrant {
    border-color: var(--brand-orange-vibrant) !important;
}

.border-brand-gray-light {
    border-color: var(--brand-gray-light) !important;
}

/* Brand Gradients */
.bg-brand-gradient-primary {
    background: linear-gradient(135deg, var(--brand-blue-bright), var(--brand-navy-deep)) !important;
}

.bg-brand-gradient-warm {
    background: linear-gradient(135deg, var(--brand-orange-vibrant), var(--brand-blue-bright)) !important;
}

.bg-brand-gradient-cool {
    background: linear-gradient(135deg, var(--brand-navy-deep), var(--brand-gray-light)) !important;
}

/* Text Gradients */
.text-brand-gradient {
    background: linear-gradient(135deg, var(--brand-blue-bright), var(--brand-navy-deep));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.text-brand-gradient-warm {
    background: linear-gradient(135deg, var(--brand-orange-vibrant), var(--brand-blue-bright));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Brand Shadows */
.shadow-brand {
    box-shadow: 0 4px 20px rgba(var(--brand-blue-bright-rgb), 0.2) !important;
}

.shadow-brand-lg {
    box-shadow: 0 10px 40px rgba(var(--brand-blue-bright-rgb), 0.3) !important;
}

.shadow-brand-orange {
    box-shadow: 0 4px 20px rgba(var(--brand-orange-vibrant-rgb), 0.2) !important;
}

/* Brand Glass Effect */
.bg-brand-glass {
    background: rgba(var(--brand-blue-bright-rgb), 0.1) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(var(--brand-blue-bright-rgb), 0.2);
}

.bg-brand-glass-navy {
    background: rgba(var(--brand-navy-deep-rgb), 0.1) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(var(--brand-navy-deep-rgb), 0.2);
}

/* Button Styles with Brand Colors */
.btn-brand-primary {
    background: var(--brand-blue-bright) !important;
    border-color: var(--brand-blue-bright) !important;
    color: white !important;
}

.btn-brand-primary:hover {
    background: var(--brand-navy-deep) !important;
    border-color: var(--brand-navy-deep) !important;
    color: white !important;
}

.btn-brand-secondary {
    background: var(--brand-orange-vibrant) !important;
    border-color: var(--brand-orange-vibrant) !important;
    color: white !important;
}

.btn-brand-secondary:hover {
    background: #e6420a !important;
    border-color: #e6420a !important;
    color: white !important;
}

.btn-brand-outline {
    background: transparent !important;
    border: 2px solid var(--brand-blue-bright) !important;
    color: var(--brand-blue-bright) !important;
}

.btn-brand-outline:hover {
    background: var(--brand-blue-bright) !important;
    border-color: var(--brand-blue-bright) !important;
    color: white !important;
}

/* Responsive Utilities */
@media (max-width: 768px) {
    .text-brand-gradient,
    .text-brand-gradient-warm {
        background: none;
        -webkit-background-clip: unset;
        -webkit-text-fill-color: unset;
        background-clip: unset;
        color: var(--brand-navy-deep);
    }
}

/* Animation Classes for Brand Elements */
.brand-pulse {
    animation: brand-pulse 2s infinite;
}

@keyframes brand-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(var(--brand-blue-bright-rgb), 0.7);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(var(--brand-blue-bright-rgb), 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(var(--brand-blue-bright-rgb), 0);
    }
}

/* Brand Color Combinations */
.brand-combo-primary {
    background: var(--brand-blue-bright);
    color: white;
}

.brand-combo-primary:hover {
    background: var(--brand-navy-deep);
}

.brand-combo-accent {
    background: var(--brand-orange-vibrant);
    color: white;
}

.brand-combo-accent:hover {
    background: var(--brand-blue-bright);
}

/* Override common elements with brand colors */
.alert-primary {
    background: rgba(var(--brand-blue-bright-rgb), 0.1) !important;
    border-color: var(--brand-blue-bright) !important;
    color: var(--brand-navy-deep) !important;
}

.badge-primary {
    background: var(--brand-blue-bright) !important;
    color: white !important;
}

.text-primary {
    color: var(--brand-blue-bright) !important;
}

.link-primary {
    color: var(--brand-blue-bright) !important;
}

.link-primary:hover {
    color: var(--brand-navy-deep) !important;
}

/* Form elements with brand colors */
.form-control:focus {
    border-color: var(--brand-blue-bright) !important;
    box-shadow: 0 0 0 0.2rem rgba(var(--brand-blue-bright-rgb), 0.25) !important;
}

.form-check-input:checked {
    background-color: var(--brand-blue-bright) !important;
    border-color: var(--brand-blue-bright) !important;
}

/* Table styles with brand colors */
.table-primary {
    --bs-table-bg: rgba(var(--brand-blue-bright-rgb), 0.1) !important;
    --bs-table-border-color: rgba(var(--brand-blue-bright-rgb), 0.2) !important;
}

/* Progress bars with brand colors */
.progress-bar {
    background-color: var(--brand-blue-bright) !important;
}

/* Pagination with brand colors */
.page-link {
    color: var(--brand-blue-bright) !important;
}

.page-link:hover {
    color: var(--brand-navy-deep) !important;
    background-color: rgba(var(--brand-blue-bright-rgb), 0.1) !important;
    border-color: var(--brand-blue-bright) !important;
}

.page-item.active .page-link {
    background-color: var(--brand-blue-bright) !important;
    border-color: var(--brand-blue-bright) !important;
}
