/* DevCode911 Theme Color Overrides */

/* Primary Button Overrides */
.btn-primary {
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
    color: white !important;
}

.btn-primary:hover {
    background-color: #c82333 !important;
    border-color: #c82333 !important;
    color: white !important;
}

.btn-primary:focus,
.btn-primary.focus,
.btn-primary:active,
.btn-primary.active,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
    background-color: #c82333 !important;
    border-color: #c82333 !important;
    color: white !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
}

/* Outline Primary Button Overrides */
.btn-outline-primary {
    color: #dc3545 !important;
    border-color: #dc3545 !important;
    background-color: transparent !important;
}

.btn-outline-primary:hover {
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
    color: white !important;
}

.btn-outline-primary:focus,
.btn-outline-primary.focus,
.btn-outline-primary:active,
.btn-outline-primary.active,
.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle {
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
    color: white !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
}

/* Danger Button Overrides (for consistency) */
.btn-danger {
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
    color: white !important;
}

.btn-danger:hover {
    background-color: #c82333 !important;
    border-color: #c82333 !important;
    color: white !important;
}

.btn-danger:focus,
.btn-danger.focus,
.btn-danger:active,
.btn-danger.active,
.btn-danger:not(:disabled):not(.disabled):active,
.btn-danger:not(:disabled):not(.disabled).active,
.show > .btn-danger.dropdown-toggle {
    background-color: #c82333 !important;
    border-color: #c82333 !important;
    color: white !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
}

/* Outline Secondary Button Overrides */
.btn-outline-secondary {
    color: #6c757d !important;
    border-color: #6c757d !important;
    background-color: transparent !important;
}

.btn-outline-secondary:hover {
    background-color: #6c757d !important;
    border-color: #6c757d !important;
    color: white !important;
}

.btn-outline-secondary:focus,
.btn-outline-secondary.focus,
.btn-outline-secondary:active,
.btn-outline-secondary.active {
    background-color: #6c757d !important;
    border-color: #6c757d !important;
    color: white !important;
    box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.25) !important;
}

/* Remove default focus outlines that might be blue/purple */
.btn:focus,
.btn.focus {
    outline: none !important;
}

/* Link colors (only for non-button links) */
a:not(.btn) {
    color: #dc3545 !important;
}

a:not(.btn):hover,
a:not(.btn):focus {
    color: #c82333 !important;
    text-decoration: none !important;
}

/* Form control focus states */
.form-control:focus {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
}

/* Custom control focus states */
.custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
}

.custom-control-input:checked ~ .custom-control-label::before {
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
}

/* Badge overrides */
.badge-primary {
    background-color: #dc3545 !important;
}

/* Text color overrides */
.text-primary {
    color: #dc3545 !important;
}

/* Background color overrides */
.bg-primary {
    background-color: #dc3545 !important;
}

/* Border color overrides */
.border-primary {
    border-color: #dc3545 !important;
}

/* Navigation link active states */
.nav-link.active {
    color: #dc3545 !important;
}

/* Dropdown item active states */
.dropdown-item.active,
.dropdown-item:active {
    background-color: #dc3545 !important;
}

/* Progress bar overrides */
.progress-bar {
    background-color: #dc3545 !important;
}

/* Alert overrides */
.alert-primary {
    background-color: rgba(220, 53, 69, 0.1) !important;
    border-color: #dc3545 !important;
    color: #721c24 !important;
}

/* Table hover states */
.table-hover tbody tr:hover {
    background-color: rgba(220, 53, 69, 0.05) !important;
}

/* Pagination overrides */
.page-link {
    color: #dc3545 !important;
}

.page-link:hover,
.page-link:focus {
    color: #c82333 !important;
    background-color: rgba(220, 53, 69, 0.1) !important;
    border-color: #dc3545 !important;
}

.page-item.active .page-link {
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
}

/* Input group overrides */
.input-group-text {
    border-color: #dc3545 !important;
}

/* Modal header close button */
.modal-header .close:hover,
.modal-header .close:focus {
    color: #dc3545 !important;
}

/* Secondary/Gray Button Overrides */
.btn-secondary {
    background-color: #6c757d !important;
    border-color: #6c757d !important;
    color: white !important;
}

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

/* Dark backgrounds for cards and sections */
.bg-dark {
    background-color: #343a40 !important;
    color: white !important;
}

/* Badge color overrides for consistency */
.badge-secondary {
    background-color: #6c757d !important;
}

.badge-dark {
    background-color: #343a40 !important;
}

/* Text color utilities */
.text-dark {
    color: #343a40 !important;
}

.text-muted {
    color: #6c757d !important;
}

/* Ensure white text on dark backgrounds */
.bg-dark .text-muted {
    color: #adb5bd !important;
}

/* Ensure primary colors show correctly on dark backgrounds */
.bg-dark .text-primary {
    color: #dc3545 !important;
}

.bg-dark .text-danger {
    color: #dc3545 !important;
}

/* Ensure text is visible on dark backgrounds */
.bg-dark h1, .bg-dark h2, .bg-dark h3, .bg-dark h4, .bg-dark h5, .bg-dark h6 {
    color: #ffffff !important;
}

.bg-dark p, .bg-dark li, .bg-dark span {
    color: #ffffff !important;
}

.bg-dark .text-light {
    color: #f8f9fa !important;
}

.bg-dark .lead {
    color: #e9ecef !important;
}

/* Hover state overrides for consistent theme */
.btn-primary:hover {
    background-color: #c82333 !important;
    border-color: #c82333 !important;
    color: white !important;
    transform: translateY(-1px);
    transition: all 0.2s ease;
}

.btn-secondary:hover {
    background-color: #545b62 !important;
    border-color: #545b62 !important;
    color: white !important;
    transform: translateY(-1px);
    transition: all 0.2s ease;
}

.btn-outline-secondary:hover {
    background-color: #6c757d !important;
    border-color: #6c757d !important;
    color: white !important;
}

.btn-dark:hover {
    background-color: #23272b !important;
    border-color: #23272b !important;
    color: white !important;
}

/* Card hover effects */
.card:hover {
    box-shadow: 0 4px 15px rgba(220, 53, 69, 0.1) !important;
    transition: all 0.3s ease;
}

/* Navigation hover states */
.nav-link:hover {
    color: #dc3545 !important;
}

.dropdown-item:hover {
    background-color: rgba(220, 53, 69, 0.1) !important;
    color: #dc3545 !important;
}

/* ============================================
   Sidebar Messages Unread Badge
   ============================================ */
.sidebar-message-badge {
    position: absolute;
    top: 6px;
    right: 15px;
    background-color: #dc3545 !important;
    color: white !important;
    font-size: 10px;
    font-weight: 700;
    padding: 3px 7px;
    border-radius: 12px;
    min-width: 20px;
    text-align: center;
    line-height: 1.2;
    box-shadow: 0 2px 4px rgba(220, 53, 69, 0.3);
    animation: badgePulse 2s ease-in-out infinite;
}

/* Pulse animation for sidebar badge */
@keyframes badgePulse {
    0%, 100% {
        box-shadow: 0 2px 4px rgba(220, 53, 69, 0.3);
    }
    50% {
        box-shadow: 0 2px 8px rgba(220, 53, 69, 0.6), 0 0 12px rgba(220, 53, 69, 0.4);
    }
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .sidebar-message-badge {
        top: 6px;
        right: 10px;
        font-size: 9px;
        padding: 2px 6px;
    }
}

/* ============================================
   Registration Promotional Banner
   ============================================ */
.promo-banner {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    border-radius: 12px;
    padding: 14px 16px;
    margin-bottom: 20px;
    box-shadow: 0 4px 15px rgba(220, 53, 69, 0.3);
    animation: fadeInBanner 0.8s ease-in-out;
}

.promo-content {
    text-align: center;
}

.promo-title {
    color: #ffffff !important;
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 8px;
    line-height: 1.3;
}

.promo-text {
    color: #ffffff !important;
    font-size: 0.85rem;
    margin-bottom: 0;
    opacity: 0.95;
    line-height: 1.4;
}

/* Fade-in animation for promotional banner */
@keyframes fadeInBanner {
    0% {
        opacity: 0;
        transform: translateY(-10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Mobile responsive adjustments for promo banner */
@media (max-width: 768px) {
    .promo-banner {
        padding: 12px 14px;
        margin-bottom: 16px;
    }

    .promo-title {
        font-size: 0.95rem;
    }

    .promo-text {
        font-size: 0.8rem;
    }
}

@media (max-width: 576px) {
    .promo-banner {
        padding: 10px 12px;
        margin-bottom: 14px;
    }

    .promo-title {
        font-size: 0.9rem;
    }

    .promo-text {
        font-size: 0.75rem;
    }
}