/* ========================================
   HEENA BOUTIQUE - NEW COLOR SCHEME
   Colors: #F7F4F3 (Cream) & #5B2333 (Burgundy)
   ======================================== */

/* === GLOBAL BACKGROUND UPDATES === */
section,
.section {
    background-color: var(--bg-primary) !important;
}

/* Alternate section backgrounds */
section:nth-child(even),
.section:nth-child(even) {
    background: var(--gradient-light) !important;
}

/* === HEADER UPDATES === */
.header-top {
    background: var(--gradient-primary) !important;
    color: var(--white-color) !important;
}

.header-top * {
    color: var(--white-color) !important;
}

.app-navbar .navbar {
    background: var(--gradient-primary) !important;
}

/* Navbar Text Colors */
.app-navbar .nav-link,
.app-navbar .nav-link *,
.app-navbar .logo,
.app-navbar .quote-btn {
    color: var(--white-color) !important;
}

.app-navbar .nav-link:hover {
    color: var(--main-color) !important;
}

.sisf-e-title-text,
.sisf-icon-list-item a {
    color: var(--white-color) !important;
}

/* === BUTTON UPDATES === */
.btn-default,
.btn-slider,
.quote-btn {
    background: var(--gradient-primary) !important;
    color: var(--white-color) !important;
    border-color: var(--primary-color) !important;
}

.btn-default:hover,
.btn-slider:hover,
.quote-btn:hover {
    background: var(--gradient-accent) !important;
    border-color: var(--accent-color) !important;
    color: var(--white-color) !important;
}

/* === CARD UPDATES === */
.dress-card,
.gallery-card {
    background: var(--bg-secondary) !important;
    border: 1px solid var(--secondary-dark) !important;
}

.dress-card:hover,
.testimonial-card:hover,
.gallery-card:hover {
    box-shadow: 0 15px 40px rgba(91, 35, 51, 0.2) !important;
}

/* === FOOTER UPDATES === */
.main-footer {
    background: var(--gradient-primary) !important;
    color: var(--white-color) !important;
}

.main-footer *,
.main-footer p,
.main-footer h1,
.main-footer h2,
.main-footer h3,
.main-footer h4,
.main-footer h5,
.main-footer h6,
.main-footer a,
.main-footer span,
.main-footer li,
.footer-links a,
.fw-bold {
    color: var(--white-color) !important;
}

.mycolor{
    color: #deb3a4 !important;
}

.main-footer a:hover {
    color: var(--main-color) !important;
}

/* === SOCIAL MEDIA ICONS === */
.footer-social-icon {
    background-color: rgba(247, 244, 243, 0.15) !important;
}

.footer-social-icon:hover {
    background-color: var(--main-color) !important;
    color: var(--primary-color) !important;
    box-shadow: 0 5px 15px rgba(196, 150, 158, 0.4) !important;
}

.header-right-icons a {
    background-color: rgba(247, 244, 243, 0.15) !important;
}

.header-right-icons a:hover {
    background-color: var(--main-color) !important;
    color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(196, 150, 158, 0.4) !important;
}

/* === HERO SECTION === */
.hero,
.hero-slider {
    background: var(--gradient-light) !important;
}

/* === CATEGORY SECTIONS === */
.popular-categories-list {
    background: var(--bg-light) !important;
}

.sisf-categories-list {
    background: var(--bg-secondary) !important;
    border: 1px solid var(--secondary-dark) !important;
}

.sisf-categories-list:hover {
    box-shadow: 0 10px 30px rgba(91, 35, 51, 0.15) !important;
}

/* === GALLERY SECTION === */
.enhanced-gallery-box {
    box-shadow: 0 2px 12px rgba(196, 150, 158, 0.22) !important;
}

.enhanced-gallery-box:hover {
    box-shadow: 0 8px 32px rgba(196, 150, 158, 0.55) !important;
}

.gallery-overlay {
    background: linear-gradient(135deg, rgba(91, 35, 51, 0.7) 0%, rgba(196, 150, 158, 0.5) 100%) !important;
}

/* === TESTIMONIALS === */
.enhanced-testimonials {
    background: var(--gradient-light) !important;
}

.enhanced-testimonial-card {
    border: 1px solid var(--secondary-dark) !important;
    box-shadow: 0 4px 32px rgba(196, 150, 158, 0.22) !important;
}

.enhanced-testimonial-card:hover {
    box-shadow: 0 8px 48px rgba(196, 150, 158, 0.55) !important;
}

/* === FORMS === */
.form-control:focus,
.form-select:focus {
    border-color: var(--main-color) !important;
    box-shadow: 0 0 0 0.2rem rgba(196, 150, 158, 0.25) !important;
}

/* === LINKS === */
a {
    color: var(--primary-color) !important;
}

a:hover {
    color: var(--accent-color) !important;
}

/* === BREADCRUMB === */
.sisf-banner::before {
    background: linear-gradient(135deg, rgba(91, 35, 51, 0.7) 0%, rgba(196, 150, 158, 0.5) 100%) !important;
}

/* === SCROLL TO TOP === */
#scroll-top {
    background: var(--gradient-primary) !important;
    box-shadow: 0 5px 20px rgba(91, 35, 51, 0.4) !important;
}

#scroll-top:hover {
    box-shadow: 0 8px 30px rgba(91, 35, 51, 0.5) !important;
}

/* === MOBILE MENU === */
.mobile-nav {
    background: linear-gradient(135deg, #FFFFFF 0%, #F7F4F3 100%) !important;
}

.mobile-nav-header {
    border-bottom: 2px solid var(--main-color) !important;
    background: linear-gradient(135deg, #FFFFFF 0%, #FBF9F8 100%) !important;
}

.mobile-nav-item:hover {
    background-color: rgba(196, 150, 158, 0.08) !important;
}

.mobile-nav-link:hover {
    color: var(--main-color) !important;
}

.mobile-dropdown-menu {
    background-color: rgba(196, 150, 158, 0.08) !important;
    border-left: 3px solid var(--main-color) !important;
}

.mobile-dropdown-item:hover {
    background-color: rgba(196, 150, 158, 0.15) !important;
    color: var(--main-color) !important;
    border-left-color: var(--main-color) !important;
}

/* === ACCENT ELEMENTS === */
.service-icon {
    color: var(--main-color) !important;
}

.service-item:hover .service-icon {
    color: var(--primary-color) !important;
}

/* === GRADIENTS FOR SPECIAL SECTIONS === */
.about-us-section {
    background: var(--gradient-light) !important;
}

.traditional-wear-showcase {
    background: linear-gradient(135deg, #FBF9F8 0%, #F7F4F3 100%) !important;
}

/* === WHATSAPP BUTTON === */
.whatsapp-book-btn {
    background: linear-gradient(135deg, #5B2333 0%, #7d3349 100%) !important;
}

.whatsapp-book-btn:hover {
    background: linear-gradient(135deg, #7d3349 0%, #5B2333 100%) !important;
}

/* === MODAL === */
.modal-content {
    background: var(--bg-secondary) !important;
    border: 1px solid var(--secondary-dark) !important;
}

/* === NEWSLETTER FORM === */
.footer-subscribe-form {
    background: var(--bg-secondary) !important;
}

.footer-subscribe-form:hover {
    box-shadow: 0 10px 30px rgba(91, 35, 51, 0.15) !important;
}

/* === SECTION TITLES === */
.sisf-m-title::after {
    background: var(--gradient-accent) !important;
}

/* Fix for sisf-subtitle visibility */
.section-title .sisf-subtitle,
.sisf-subtitle {
    color: var(--primary-color) !important;
}



/* === DIVIDERS === */
.section-divider {
    background: linear-gradient(90deg, transparent, var(--main-color), transparent) !important;
}

/* === CUSTOM SCROLLBAR === */
::-webkit-scrollbar-thumb {
    background: var(--gradient-primary) !important;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--gradient-accent) !important;
}

/* === SELECTION === */
::selection {
    background: var(--main-color) !important;
    color: var(--white-color) !important;
}

/* === LOADING SPINNER === */
.page-loader {
    background: var(--gradient-primary) !important;
}

/* === ENHANCED ELEMENTS === */
.shadow-premium {
    box-shadow: 0 10px 40px rgba(91, 35, 51, 0.15),
        0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

.shadow-premium:hover {
    box-shadow: 0 20px 60px rgba(91, 35, 51, 0.25),
        0 5px 15px rgba(0, 0, 0, 0.15) !important;
}

/* === GRADIENT TEXT === */
.gradient-text {
    background: var(--gradient-accent) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

/* === GLOW EFFECT === */
@keyframes glow-new {

    0%,
    100% {
        box-shadow: 0 0 20px rgba(196, 150, 158, 0.5);
    }

    50% {
        box-shadow: 0 0 40px rgba(196, 150, 158, 0.8);
    }
}

.glow-effect {
    animation: glow-new 2s ease-in-out infinite !important;
}

/* === NAVBAR DROPDOWN === */
.app-navbar .dropdown-menu {
    background-color: var(--bg-secondary) !important;
    border: 1px solid var(--secondary-dark) !important;
}

.app-navbar .dropdown-item:hover {
    background-color: var(--bg-light) !important;
    color: var(--primary-color) !important;
}

/* === BREADCRUMB CONTENT === */
.breadcrumb-content {
    color: var(--white-color) !important;
}

/* === ABOUT SECTION === */
.about-content {
    color: var(--text-color) !important;
}

/* === BLOG CARDS === */
.blog-card {
    background: var(--bg-secondary) !important;
    border: 1px solid var(--secondary-dark) !important;
}

.blog-card:hover {
    box-shadow: 0 15px 40px rgba(91, 35, 51, 0.2) !important;
}

/* === CONTACT FORM === */
.contact-form {
    background: var(--bg-secondary) !important;
}

/* === PRICING TABLES === */
.pricing-card {
    background: var(--bg-secondary) !important;
    border: 2px solid var(--secondary-dark) !important;
}

.pricing-card:hover {
    border-color: var(--main-color) !important;
    box-shadow: 0 15px 40px rgba(91, 35, 51, 0.2) !important;
}

/* === FEATURED BADGE === */
.badge-featured {
    background: var(--gradient-primary) !important;
    color: var(--white-color) !important;
}

/* === PROGRESS BARS === */
.progress-bar {
    background: var(--gradient-primary) !important;
}

/* === TABS === */
.nav-tabs .nav-link.active {
    background: var(--gradient-primary) !important;
    color: var(--white-color) !important;
}

/* === ALERTS === */
.alert-success {
    background: rgba(196, 150, 158, 0.1) !important;
    border-color: var(--main-color) !important;
    color: var(--primary-color) !important;
}

/* === FINAL TOUCHES === */
.text-primary {
    color: var(--primary-color) !important;
}

.bg-primary {
    background-color: var(--primary-color) !important;
}

.border-primary {
    border-color: var(--primary-color) !important;
}

.text-secondary {
    color: var(--text-muted) !important;
}

.bg-secondary {
    background-color: var(--bg-primary) !important;
}