/* ========================================
   LAYOUT STABILITY CSS
   Removes ALL hover effects that cause layout shifts
   Ensures UI remains identical with or without cursor
   ======================================== */

/* ========================================
   0.1. CRITICAL - REMOVE ALL ICON BACKGROUNDS GLOBALLY
   This is the MASTER RULE that removes gradient backgrounds from ALL icons
   ======================================== */

/* Remove ALL gradient backgrounds from ALL icons - MASTER OVERRIDE */
/* EXCLUDE: testimonial stars, carousel buttons, hero check icons, benefit check icons */
[class*="icon"]:not(.hero-check-icon):not(.testimonial-stars-new svg):not(.carousel-btn svg):not(.benefit-check-icon):not(.benefit-check-icon svg):not(.acc-feature-icon),
[class*="Icon"]:not(.hero-check-icon):not(.benefit-check-icon),
.why-card-icon,
.stat-icon,
.stat-icon-new,
.benefit-icon-wrapper,
.feature-icon-wrapper,
.features-inner-sectio-icon,
.mtd-feature-icon,
.fbr-feature-icon,
.paperless-feature-icon,
.app-card-icon,
.product-icon,
.modern-product-icon,
.industry-icon-wrapper,
.dropdown-icon,
.social-icon,
.social-icon-pro,
.pricing-plan-icon,
.pos-option-icon,
.hardware-icon,
.compliance-feature-icon,
.feature-grid-icon,
.benefit-icon,
.icon-wrapper,
.icon-bg-blue,
.icon-bg-green,
.icon-bg-yellow,
.icon-bg-purple,
.icon-bg-pink,
.icon-bg-emerald,
.icon-bg-red,
.modern-card-icon,
.why-moneypex-section .why-card-icon,
.empowering-businesses-section .stat-icon,
.accounting-page .why-card-icon,
.accounting-page .benefit-icon,
.accounting-page .feature-grid-icon,
.accounting-page .compliance-feature-icon,
.fbr-page .icon-wrapper,
.fbr-page .benefit-icon-wrapper,
.fbr-page .fbr-feature-icon,
.fbr-step-number,
.cta-card-growth > div:first-child,
.pos-trial-badge,
.fbr-cta-wrapper .fbr-feature-icon {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    border: none !important;
}

/* CRITICAL: Preserve testimonial star icons - gold fill, no background changes */
.testimonial-stars-new,
.testimonial-stars-new svg,
.testimonial-card-new .testimonial-stars-new,
.testimonial-card-new .testimonial-stars-new svg {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
}

/* CRITICAL: Preserve carousel buttons - they need backgrounds */
.carousel-btn,
.carousel-btn-prev,
.carousel-btn-next {
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 50% !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08) !important;
}

/* CRITICAL: Preserve Key Features card icons - they need backgrounds */
.acc-feature-icon {
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%) !important;
    border-radius: 12px !important;
}

/* Remove ALL gradient backgrounds on hover too */
/* EXCLUDE: testimonial stars, carousel buttons, hero check icons, benefit check icons */
[class*="icon"]:hover:not(.hero-check-icon):not(.benefit-check-icon):not(.acc-feature-icon),
[class*="Icon"]:hover:not(.hero-check-icon):not(.benefit-check-icon),
.why-card:hover .why-card-icon,
.stat-card:hover .stat-icon,
.empowering-businesses-section .stat-card:hover .stat-icon,
.benefit-card-modern:hover .benefit-icon-wrapper,
.feature-card:hover .feature-icon-wrapper,
.app-selection-card:hover .app-card-icon,
.product-item:hover .product-icon {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    border: none !important;
}

/* Preserve carousel button hover states */
.carousel-btn:hover,
.carousel-btn-prev:hover,
.carousel-btn-next:hover {
    background: #1E5CAA !important;
    background-color: #1E5CAA !important;
    border: 1px solid #1E5CAA !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 15px rgba(30, 92, 170, 0.3) !important;
}

/* Preserve Key Features card icons on hover */
.acc-feature-icon:hover,
.acc-feature-card:hover .acc-feature-icon {
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%) !important;
    border-radius: 12px !important;
}

/* DISABLED: *:hover [class*="icon"] rules cause cookie flickering
*:hover [class*="icon"],
*:hover [class*="Icon"] {
    background: transparent !important;
}
*/

/* ========================================
   0.2. CRITICAL - REMOVE ALL IMAGE OPACITY/FILTER CHANGES
   Prevent images from fading or changing appearance on hover
   ======================================== */

/* Force ALL images to maintain full opacity and no filters */
img,
img:hover,
picture,
picture:hover,
.section-image img,
.section-image:hover img,
.section-image img:hover,
.hero-main-image,
.hero-main-image:hover,
.home-hero-image,
.home-hero-image:hover,
.hero-dashboard-image,
.hero-dashboard-image:hover,
.hero-image-wrapper img,
.hero-image-wrapper:hover img,
.hero-form-wrapper img,
.hero-form-wrapper:hover img,
.fbr-image-wrapper img,
.fbr-image-wrapper:hover img,
.fbr-image img,
.fbr-image:hover img,
.paperless-image-wrapper img,
.paperless-image-wrapper:hover img,
.feature-image img,
.feature-image:hover img,
.pos-hero-image,
.pos-hero-image:hover,
.pos-dashboard-image,
.pos-dashboard-image:hover,
[class*="image"] img,
[class*="image"]:hover img,
[class*="Image"] img,
[class*="Image"]:hover img,
.trusted-by-section img,
.trusted-by-section img:hover,
.trusted-by-card img,
.trusted-by-card:hover img,
.company-logo-wrapper img,
.company-logo-wrapper:hover img {
    opacity: 1 !important;
    filter: none !important;
    -webkit-filter: none !important;
    transition: none !important;
    -webkit-transition: none !important;
}

/* DISABLED: *:hover img rules cause cookie flickering
*:hover img,
*:hover picture {
    opacity: 1 !important;
}
*/

/* Remove opacity from image wrappers */
.section-image,
.section-image:hover,
.hero-image-wrapper,
.hero-image-wrapper:hover,
.hero-form-wrapper,
.hero-form-wrapper:hover,
.fbr-image-wrapper,
.fbr-image-wrapper:hover,
.paperless-image-wrapper,
.paperless-image-wrapper:hover,
[class*="image-wrapper"],
[class*="image-wrapper"]:hover {
    opacity: 1 !important;
    filter: none !important;
    -webkit-filter: none !important;
}

/* ========================================
   0. MODAL PROTECTION - Exclude modals from stability rules
   ======================================== */
/* Allow Bootstrap modals to work normally - only exclude from specific rules */
.modal,
.modal-dialog,
.modal-content,
.modal-header,
.modal-body,
.modal-footer,
.modal-backdrop,
#cookieConsentModal,
#cookieConsentModal *,
#mpProductsModal,
#mpProductsModal * {
    /* Allow Bootstrap defaults - don't override with revert */
    transition: opacity 0.15s linear !important;
    -webkit-transition: opacity 0.15s linear !important;
}

/* ========================================
   1. GLOBAL RULES - NO HOVER TRANSFORMS
   ======================================== */

/* DISABLED: Global *:hover rules cause cookie banner flickering
   These rules break because :not() with descendant selectors doesn't work reliably.
   Use targeted element selectors instead (see section below).
*/
/*
*:hover:not(.modal):not(.modal *)... {
    transform: none !important;
}
*/

/* Ensure no element changes size/position on hover */
.hero-card-animate:hover .hero-card-inner,
.modern-hero-btn:hover,
.modern-hero-btn:active,
.trusted-by-carousel .trusted-by-card:hover,
.modern-hero-section .hero-form-wrapper:hover,
.modern-hero-section .modern-form .btn-modern:hover,
.modern-hero-section .modern-form .btn-modern:active,
.explore-feature-item:hover,
.modern-faq .accordion-item:hover,
.paperless-feature-item:hover,
.paperless-cta .btn-premium:hover,
.paperless-cta .btn-premium:hover svg,
.paperless-image-wrapper:hover,
.modern-card:hover,
.modern-card:hover::before,
.why-card:hover,
.why-moneypex-section .why-card:hover,
.why-moneypex-section .why-card:hover::before,
.benefit-card-modern:hover,
.product-item:hover,
.industry-card-inner:hover,
.testimonial-card-growth:hover,
.pricing-card:hover,
.modern-pricing-card:hover,
.stat-card-new:hover,
.cta-card-growth:hover,
.btn-premium:hover,
.btn-premium:hover svg,
.btn-primary:hover,
.btn-premium-outline:hover,
.cta-button:hover,
.feature-card:hover,
.app-selection-card:hover,
.mtd-feature-item:hover,
.pos-option-card:hover,
.hardware-card:hover,
.risk-card:hover,
.process-card:hover,
.stakeholder-card:hover,
.compliance-card:hover,
.workflow-card:hover,
.pain-point-card:hover,
.fbr-feature-card:hover,
a:hover:not([class*="cookie"]):not(.cookie-btn):not(#cookieConsentBanner *):not(#cookieConsentModal *):not(.cookie-consent-overlay *),
button:hover:not([class*="cookie"]):not(.cookie-btn):not(.cookie-consent-close):not(#cookieConsentBanner *):not(#cookieConsentModal *):not(.cookie-consent-overlay *),
.card:hover:not(.cookie-option-card),
[class*="card"]:hover:not(#cookieConsentModal *):not(.cookie-option-card):not(.cookie-option-card *):not([class*="cookie"]),
[class*="Card"]:hover:not(#cookieConsentModal *):not(.cookie-option-card):not(.cookie-option-card *):not([class*="cookie"]),
[class*="item"]:hover:not(#cookieConsentModal *):not([class*="cookie"]),
[class*="Item"]:hover:not(#cookieConsentModal *):not([class*="cookie"]) {
    transform: none !important;
    -webkit-transform: none !important;
    scale: 1 !important;
}

/* ========================================
   2. NO Z-INDEX CHANGES ON HOVER - EXCLUDING MODALS
   ======================================== */

/* DISABLED: *:hover z-index rule causes cookie flickering
*:hover:not(.modal *)... {
    z-index: auto !important;
}
*/

.explore-feature-item:hover,
.explore-feature-item:hover ~ *,
[class*="card"]:hover:not(.modal-content):not(.mp-products-modal-content):not([class*="cookie"]),
[class*="item"]:hover:not(.modal *):not([class*="cookie"]) {
    z-index: auto !important;
}

/* Ensure modals have proper z-index */
.modal {
    z-index: 1050 !important;
}

.modal-backdrop {
    z-index: 1040 !important;
}

.modal-dialog {
    z-index: 1055 !important;
}

#mpProductsModal {
    z-index: 1060 !important;
}

#mpProductsModal .modal-dialog {
    z-index: 1065 !important;
}

#mpProductsModal .modal-content {
    z-index: 1070 !important;
}

/* ========================================
   3. NO BOX-SHADOW CHANGES ON HOVER
   ======================================== */

.hero-card-animate:hover .hero-card-inner,
.modern-hero-btn:hover,
.modern-hero-section .modern-form .btn-modern:hover,
.modern-faq .accordion-item:hover,
.paperless-cta .btn-premium:hover,
.paperless-image-wrapper:hover,
.modern-card:hover,
.why-card:hover,
.why-moneypex-section .why-card:hover,
.benefit-card-modern:hover,
.industry-card-inner:hover,
.testimonial-card-growth:hover,
.pricing-card:hover,
.modern-pricing-card:hover,
.stat-card-new:hover,
.cta-card-growth:hover,
.btn-premium:hover,
.btn-primary:hover,
.feature-card:hover,
.app-selection-card:hover,
.mtd-feature-item:hover,
.pos-option-card:hover,
.hardware-card:hover,
.risk-card:hover,
.process-card:hover,
.stakeholder-card:hover,
.compliance-card:hover,
.workflow-card:hover,
.pain-point-card:hover,
.fbr-feature-card:hover,
.card:hover,
[class*="card"]:hover,
[class*="Card"]:hover {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

/* ========================================
   4/5. (removed) Empty rulesets that were no-ops
   ======================================== */

/* Buttons should maintain their blue gradient on hover - DO NOT inherit white */
/* CRITICAL: Remove background: inherit for buttons - it causes white background */
/* Let the original button styles control the gradient background */

/* ========================================
   6. NO ANIMATIONS ON HOVER
   ======================================== */

.modern-hero-btn:hover,
.btn-premium:hover::before,
.paperless-cta .btn-premium:hover::before,
.modern-hero-section .modern-form .btn-modern:hover::before {
    animation: none !important;
    -webkit-animation: none !important;
}

/* DISABLED: *:hover::before/after rules cause cookie flickering
*:hover::before,
*:hover::after {
    animation: none !important;
}
*/

/* ========================================
   7. DISABLE ALL TRANSITIONS AND ANIMATIONS
   ======================================== */

/* DISABLED: These global wildcard rules cause cookie banner flickering.
   The :not() selector chains don't work reliably with descendant selectors.
   CSS specificity with *:not() and descendant combinators is fundamentally broken.
*/
/*
*:not(.modal)... {
    transition: none !important;
}
*:hover:not(.modal)... {
    transition: none !important;
}
*:hover:not(.modal)... {
    opacity: 1 !important;
}
*/

/* Allow background SVG elements to maintain their opacity */
[class*="-section"]::before,
[class*="-section"]::after,
.hero-bg-m,
[class*="svg-blob"] {
    opacity: 1 !important;
}

/* ========================================
   8. WIDTH/HEIGHT STABILITY
   ======================================== */

/* Use 100% instead of 100vw to prevent scrollbar layout shift */
html,
body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
}

/* Fixed elements should use 100% width */
.modal-backdrop,
[class*="backdrop"],
.fixed-top,
.fixed-bottom,
.sticky-top {
    width: 100% !important;
}

/* ========================================
   9. PREVENT PSEUDO-ELEMENT TRANSFORMS
   ======================================== */

.modern-card::before,
.why-card::before,
.why-moneypex-section .why-card::before,
.why-card-icon::before,
.btn-premium::before,
.modern-hero-btn::before,
*::before,
*::after {
    transform: none !important;
    -webkit-transform: none !important;
}

/* ========================================
   10. EXPLORE FEATURES SECTION STABILITY
   ======================================== */

.explore-feature-item,
.explore-feature-item:hover,
.explore-feature-item.active,
.explore-features-visual,
.explore-features-right,
#featureDashboardImage {
    transform: none !important;
    -webkit-transform: none !important;
    z-index: auto !important;
    opacity: 1 !important;
}

/* ========================================
   11. CARDS - NO HOVER EFFECTS
   ======================================== */

.modern-card,
.modern-card:hover,
.why-card,
.why-card:hover,
.benefit-card-modern,
.benefit-card-modern:hover,
.product-item,
.product-item:hover,
.pricing-card,
.pricing-card:hover,
.modern-pricing-card,
.modern-pricing-card:hover,
.stat-card-new,
.stat-card-new:hover,
.testimonial-card-growth,
.testimonial-card-growth:hover,
.feature-card,
.feature-card:hover,
.app-selection-card,
.app-selection-card:hover,
.industry-card-inner,
.industry-card-inner:hover {
    transform: none !important;
    -webkit-transform: none !important;
}

/* ========================================
   12. BUTTONS - NO HOVER TRANSFORMS
   ======================================== */

.btn-premium,
.btn-premium:hover,
.btn-premium:active,
.btn-premium:focus,
.btn-primary,
.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus,
.btn-premium-outline,
.btn-premium-outline:hover,
.btn-premium-outline:active,
.cta-button,
.cta-button:hover,
.cta-button:active,
.modern-hero-btn,
.modern-hero-btn:hover,
.modern-hero-btn:active,
.modern-form .btn-modern,
.modern-form .btn-modern:hover,
.modern-form .btn-modern:active {
    transform: none !important;
    -webkit-transform: none !important;
}

/* Button SVGs should not move */
.btn-premium svg,
.btn-premium:hover svg,
.btn-primary svg,
.btn-primary:hover svg,
.cta-button svg,
.cta-button:hover svg {
    transform: none !important;
    -webkit-transform: none !important;
}

/* ========================================
   12a. BUTTONS - NO HOVER EFFECTS
   ======================================== */

/* Completely disable ALL hover effects on SOLID buttons - keep them static */
/* Solid buttons keep their default gradient, but NO changes on hover */
.btn-premium:hover,
.btn-primary:hover,
.cta-button:hover,
.hero-button-animate .btn-premium:hover,
.paperless-cta .btn-premium:hover,
.modern-hero-section .modern-form .btn-modern:hover,
.modern-hero-btn:hover {
    /* No transform effects - stay in place */
    transform: none !important;
    -webkit-transform: none !important;
    scale: 1 !important;
    /* No box-shadow changes - keep default shadow */
    box-shadow: 0 10px 25px -5px rgba(30, 92, 170, 0.4), 0 8px 10px -6px rgba(30, 92, 170, 0.3) !important;
    -webkit-box-shadow: 0 10px 25px -5px rgba(30, 92, 170, 0.4), 0 8px 10px -6px rgba(30, 92, 170, 0.3) !important;
    /* No background changes - keep default gradient */
    background: linear-gradient(135deg, #1E5CAA 0%, #3b82f6 100%) !important;
    background-image: linear-gradient(135deg, #1E5CAA 0%, #3b82f6 100%) !important;
    /* No transitions */
    transition: none !important;
    -webkit-transition: none !important;
}

/* OUTLINE BUTTON - Separate hover rules (no gradient, use solid blue) */
.btn-premium-outline:hover,
a.btn-premium-outline:hover,
.hero-button-animate .btn-premium-outline:hover {
    transform: none !important;
    -webkit-transform: none !important;
    scale: 1 !important;
    /* Solid blue background for outline button hover */
    background: #1E5CAA !important;
    background-color: #1E5CAA !important;
    background-image: none !important;
    border-color: #1E5CAA !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(30, 92, 170, 0.3) !important;
    transition: none !important;
    -webkit-transition: none !important;
}

/* OUTLINE BUTTON DEFAULT STATE - White background with blue border */
.btn-premium-outline,
a.btn-premium-outline,
.hero-button-animate .btn-premium-outline {
    background: #ffffff !important;
    background-color: #ffffff !important;
    background-image: none !important;
    border: 2px solid #1E5CAA !important;
    color: #1E5CAA !important;
}

/* Disable button SVG arrow movements on hover */
.btn-premium svg,
.btn-premium:hover svg,
.btn-primary svg,
.btn-primary:hover svg,
.btn-premium-outline svg,
.btn-premium-outline:hover svg,
.cta-button svg,
.cta-button:hover svg,
.hero-button-animate .btn-premium svg,
.hero-button-animate .btn-premium:hover svg,
.paperless-cta .btn-premium svg,
.paperless-cta .btn-premium:hover svg,
.modern-hero-section .modern-form .btn-modern svg,
.modern-hero-section .modern-form .btn-modern:hover svg {
    transform: none !important;
    -webkit-transform: none !important;
    transition: none !important;
    -webkit-transition: none !important;
}

/* Disable button pseudo-element animations */
.btn-premium:hover::before,
.btn-premium:hover::after,
.btn-primary:hover::before,
.btn-primary:hover::after,
.cta-button:hover::before,
.cta-button:hover::after,
.hero-button-animate .btn-premium:hover::before,
.paperless-cta .btn-premium:hover::before,
.modern-hero-section .modern-form .btn-modern:hover::before {
    display: none !important;
    opacity: 0 !important;
    transform: none !important;
    animation: none !important;
    -webkit-animation: none !important;
}

/* ========================================
   13. IMAGES - NO HOVER EFFECTS
   ======================================== */

img,
img:hover,
picture,
picture:hover,
.hero-main-image,
.hero-main-image:hover,
.hero-dashboard-image,
.hero-dashboard-image:hover,
.home-hero-image,
.home-hero-image:hover,
.paperless-image-wrapper,
.paperless-image-wrapper:hover,
.paperless-image-wrapper img,
.paperless-image-wrapper:hover img,
.hero-form-wrapper,
.hero-form-wrapper:hover,
[class*="image"],
[class*="image"]:hover {
    transform: none !important;
    -webkit-transform: none !important;
}

/* ========================================
   14. FAQ ACCORDION - NO HOVER EFFECTS
   ======================================== */

.modern-faq .accordion-item,
.modern-faq .accordion-item:hover,
.accordion-item,
.accordion-item:hover,
.faq-item,
.faq-item:hover {
    transform: none !important;
    -webkit-transform: none !important;
}

/* ========================================
   15. NAVBAR - STABLE LAYOUT
   ======================================== */

.modern-navbar,
.navbar,
.nav-item,
.nav-item:hover,
.nav-link,
.nav-link:hover,
.dropdown-menu,
.modern-dropdown {
    transform: none !important;
    -webkit-transform: none !important;
}

/* ========================================
   15a. MOBILE NAVBAR - ALLOW PROPER FUNCTIONALITY
   ======================================== */

/* Mobile hamburger button - allow proper hover effects */
button[data-bs-toggle="collapse"][data-bs-target="#mobileNavbar"],
button[data-bs-toggle="collapse"][data-bs-target="#mobileNavbar"]:hover,
button[data-bs-toggle="collapse"][data-bs-target="#mobileNavbar"] svg,
button[data-bs-toggle="collapse"][data-bs-target="#mobileNavbar"]:hover svg,
.mobile-menu-toggle,
.mobile-menu-toggle:hover,
.navbar-toggler,
.navbar-toggler:hover {
    transform: none !important;
    -webkit-transform: none !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
    -webkit-transition: background-color 0.2s ease, color 0.2s ease !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Mobile menu accordion buttons - allow proper functionality */
#mobileNavbar .accordion-button,
#mobileNavbar .accordion-button:hover,
#mobileNavbar .accordion-button::after,
#mobileNavbar .nav-link-mobile,
#mobileNavbar .nav-link-mobile:hover,
#mobileNavbar .mobile-nav-section-btn,
#mobileNavbar .mobile-nav-section-btn:hover,
#mobileNavbar .btn-premium,
#mobileNavbar .btn-premium:hover {
    /* Allow mobile nav to work properly */
    opacity: 1 !important;
    visibility: visible !important;
}

/* Allow accordion arrow rotation */
#mobileNavbar .accordion-button:not(.collapsed)::after {
    transform: rotate(180deg) !important;
    -webkit-transform: rotate(180deg) !important;
}

/* ========================================
   16. TRUSTED BY CAROUSEL - ALLOW ANIMATION
   Allow carousel animation to work
   ======================================== */

/* CRITICAL: Re-enable animation for trusted-by-carousel */
.trusted-by-carousel {
    animation: scrollRight 70s linear infinite !important;
    -webkit-animation: scrollRight 70s linear infinite !important;
}

.trusted-by-carousel.reverse {
    animation: scrollLeft 70s linear infinite !important;
    -webkit-animation: scrollLeft 70s linear infinite !important;
}

/* Pause on hover */
.trusted-by-carousel:hover,
.trusted-by-carousel.reverse:hover {
    animation-play-state: paused !important;
    -webkit-animation-play-state: paused !important;
}

/* ========================================
   17. HERO SECTION - STABLE LAYOUT
   ======================================== */

.hero-card-animate,
.hero-card-animate:hover,
.hero-card-animate .hero-card-inner,
.hero-card-animate:hover .hero-card-inner,
.modern-hero-section .hero-form-wrapper,
.modern-hero-section .hero-form-wrapper:hover {
    transform: none !important;
    -webkit-transform: none !important;
}

/* ========================================
   18. MOBILE - ENSURE NO HOVER EFFECTS
   ======================================== */

/* DISABLED: This rule causes cookie banner flickering
@media (max-width: 991px) {
    *,
    *:hover,
    *:active,
    *:focus {
        transform: none !important;
    }
}
*/

/* ========================================
   19. FORCE STATIC LAYOUT
   ======================================== */

/* Ensure elements maintain their position */
.container,
.container-fluid,
.row,
.col,
[class*="col-"] {
    transform: none !important;
    -webkit-transform: none !important;
}

/* ========================================
   20. SCROLLBAR HANDLING
   ======================================== */

/* Prevent layout shift from scrollbar appearance */
html {
    scrollbar-gutter: stable !important;
    overflow-y: scroll !important;
}

/* Consistent scrollbar styling */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f5f9;
}

::-webkit-scrollbar-thumb {
    background: #94a3b8;
    border-radius: 4px;
}

/* ========================================
   21. TITLE COLORS - NO HOVER CHANGES
   ======================================== */

.modern-card-title,
.modern-card:hover .modern-card-title,
.why-card-title,
.why-card:hover .why-card-title,
[class*="title"],
[class*="title"]:hover {
    /* no hover overrides here (keep source styles) */
    transition: none !important;
}

/* ========================================
   22. STAT CARDS - NO BACKGROUNDS OR BORDERS
   ======================================== */

/* Remove card backgrounds from empowering section */
.stat-card-new,
.stat-card-new:hover,
.empowering-businesses-section-new .stat-card-new,
.empowering-businesses-section-new .stat-card-new:hover {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Remove icon backgrounds */
.stat-icon-new,
.stat-icon-new:hover,
.stat-card-new:hover .stat-icon-new,
.empowering-businesses-section-new .stat-icon-new,
.empowering-businesses-section-new .stat-icon-new:hover {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Why Moneypex Section - No card backgrounds */
.why-card,
.why-card:hover,
.why-moneypex-section .why-card,
.why-moneypex-section .why-card:hover {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Why Card Icons - No backgrounds */
.why-card-icon,
.why-card-icon:hover,
.why-card:hover .why-card-icon,
.why-moneypex-section .why-card-icon,
.why-moneypex-section .why-card-icon:hover,
.why-card-1 .why-card-icon,
.why-card-2 .why-card-icon,
.why-card-3 .why-card-icon,
.why-card-4 .why-card-icon {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Remove ::after pseudo-element from why-card-icon */
.why-card-icon::after,
.why-moneypex-section .why-card-icon::after {
    display: none !important;
    content: none !important;
}

/* ========================================
   22.5. BOOTSTRAP MODAL - Allow default Bootstrap behavior
   ======================================== */

/* Ensure modals display correctly and have proper z-index */
.modal.show,
.modal.show .modal-dialog,
#cookieConsentModal.show,
#cookieConsentModal.show .modal-dialog {
    display: block !important;
    opacity: 1 !important;
}

.modal:not(.show) {
    display: none !important;
}

.modal-backdrop.show {
    opacity: 0.5 !important;
}

/* ========================================
   22.6. COOKIE CONSENT - COMPLETE ISOLATION FROM GLOBAL RULES
   All cookie elements must be fully isolated from global hover rules
   ======================================== */

/* Cookie modal and banner - ensure full visibility */
#cookieConsentModal,
#cookieConsentModal *,
#cookieConsentBanner,
#cookieConsentBanner *,
.cookie-consent-overlay,
.cookie-consent-overlay *,
.cookie-consent-container,
.cookie-consent-container *,
.cookie-consent-content,
.cookie-consent-content *,
.cookie-option-card,
.cookie-option-card *,
.cookie-checkbox,
.cookie-btn,
.cookie-btn-primary,
.cookie-btn-secondary,
.btn-save-cookies,
[class*="cookie-consent"],
[class*="cookie-consent"] * {
    opacity: 1 !important;
    visibility: visible !important;
    filter: none !important;
    -webkit-filter: none !important;
}

/* Cookie elements - allow transitions */
#cookieConsentModal,
#cookieConsentModal *,
#cookieConsentBanner,
#cookieConsentBanner *,
.cookie-consent-overlay,
.cookie-consent-overlay *,
.cookie-btn,
.cookie-btn-primary,
.cookie-btn-secondary,
.btn-save-cookies,
.cookie-option-card {
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease !important;
    -webkit-transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease !important;
}

/* Cookie elements hover - prevent flickering and allow proper effects */
#cookieConsentModal:hover,
#cookieConsentModal *:hover,
#cookieConsentBanner:hover,
#cookieConsentBanner *:hover,
.cookie-consent-overlay:hover,
.cookie-consent-overlay *:hover,
.cookie-consent-content:hover,
.cookie-consent-content *:hover,
.cookie-option-card:hover,
.cookie-option-card *:hover,
.cookie-btn:hover,
.cookie-btn-primary:hover,
.cookie-btn-secondary:hover,
.btn-save-cookies:hover,
[class*="cookie-consent"]:hover,
[class*="cookie-consent"] *:hover {
    opacity: 1 !important;
    visibility: visible !important;
    filter: none !important;
    -webkit-filter: none !important;
    /* Do NOT set transform: none here - allow button transforms */
}

/* Cookie buttons - NO transforms to prevent flickering */
.cookie-btn,
.cookie-btn:hover,
.cookie-btn-primary,
.cookie-btn-primary:hover,
.cookie-btn-secondary,
.cookie-btn-secondary:hover {
    transform: none !important;
    -webkit-transform: none !important;
}

/* Cookie option card hover */
#cookieConsentModal .cookie-option-card:hover,
.cookie-option-card:hover {
    border-color: #d1d5db !important;
    background: #ffffff !important;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06) !important;
}

/* Cookie checkbox */
#cookieConsentModal .cookie-checkbox,
.cookie-checkbox {
    transition: all 0.2s ease !important;
    -webkit-transition: all 0.2s ease !important;
}

/* Save button hover */
#cookieConsentModal .btn-save-cookies:hover,
.btn-save-cookies:hover {
    background: linear-gradient(135deg, #174a85 0%, #1d4ed8 100%) !important;
}

/* Cookie close button */
.cookie-consent-close,
.cookie-consent-close:hover {
    opacity: 1 !important;
    visibility: visible !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
    -webkit-transition: background-color 0.2s ease, color 0.2s ease !important;
    transform: none !important;
    -webkit-transform: none !important;
}

.cookie-consent-close:hover {
    background: #f3f4f6 !important;
    color: #111827 !important;
}

/* CRITICAL OVERRIDE: Absolutely NO transforms on ANY cookie element */
#cookieConsentBanner,
#cookieConsentBanner *,
.cookie-consent-overlay,
.cookie-consent-overlay *,
.cookie-consent-container,
.cookie-consent-container *,
.cookie-consent-content,
.cookie-consent-content *,
.cookie-consent-header,
.cookie-consent-header *,
.cookie-consent-body,
.cookie-consent-body *,
.cookie-consent-actions,
.cookie-consent-actions *,
.cookie-btn,
.cookie-btn *,
.cookie-btn-primary,
.cookie-btn-primary *,
.cookie-btn-secondary,
.cookie-btn-secondary *,
.cookie-consent-close,
.cookie-consent-close * {
    transform: none !important;
    -webkit-transform: none !important;
}

#cookieConsentBanner:hover,
#cookieConsentBanner *:hover,
.cookie-consent-overlay:hover,
.cookie-consent-overlay *:hover,
.cookie-consent-container:hover,
.cookie-consent-container *:hover,
.cookie-consent-content:hover,
.cookie-consent-content *:hover,
.cookie-consent-header:hover,
.cookie-consent-header *:hover,
.cookie-consent-body:hover,
.cookie-consent-body *:hover,
.cookie-consent-actions:hover,
.cookie-consent-actions *:hover,
.cookie-btn:hover,
.cookie-btn *:hover,
.cookie-btn:hover *,
.cookie-btn-primary:hover,
.cookie-btn-primary *:hover,
.cookie-btn-primary:hover *,
.cookie-btn-secondary:hover,
.cookie-btn-secondary *:hover,
.cookie-btn-secondary:hover *,
.cookie-consent-close:hover,
.cookie-consent-close *:hover,
.cookie-consent-close:hover * {
    transform: none !important;
    -webkit-transform: none !important;
}

/* ========================================
   23. NAVBAR DROPDOWN - REMOVE ALL BORDERS AND HOVER EFFECTS
   ======================================== */

/* Remove right/left borders from dropdown items */
.dropdown-item-modern,
.dropdown-item-modern:hover,
.modern-dropdown .dropdown-item-modern,
.modern-dropdown.mega-menu .dropdown-item-modern,
.modern-dropdown.mega-menu > .p-3 > ul > li,
.modern-dropdown.mega-menu > .p-3 > ul > li > a,
.modern-dropdown.mega-menu li,
.modern-dropdown.mega-menu li a,
.modern-dropdown li,
.modern-dropdown li a {
    border: none !important;
    border-right: none !important;
    border-left: none !important;
    border-top: none !important;
    border-bottom: none !important;
}

/* Remove ALL pseudo-elements from dropdown items */
.dropdown-item-modern::before,
.dropdown-item-modern::after,
.modern-dropdown .dropdown-item-modern::before,
.modern-dropdown .dropdown-item-modern::after,
.modern-dropdown.mega-menu .dropdown-item-modern::before,
.modern-dropdown.mega-menu .dropdown-item-modern::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    border: none !important;
}

/* Dropdown items - ALLOW hover effects (they're functional, not decorative) */
/* Keep hover effects for dropdown items - they're needed for UX */
.dropdown-item-modern:hover,
.modern-dropdown .dropdown-item-modern:hover,
.modern-dropdown.mega-menu .dropdown-item-modern:hover {
    /* Allow background and color changes for dropdown items */
    transform: none !important;
    -webkit-transform: none !important;
    box-shadow: none !important;
    border: none !important;
}

/* Dropdown icons - NO hover effect (icons/images must not change) */
.dropdown-icon,
.dropdown-icon:hover,
.dropdown-item-modern:hover .dropdown-icon,
.modern-dropdown .dropdown-item-modern:hover .dropdown-icon {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    transform: none !important;
    -webkit-transform: none !important;
}

/* (removed) Cookie consent reset block:
   It was fighting Bootstrap/app.css and causing broken modal visuals. */

/* ========================================
   FOOTER - SUBTLE HOVER EFFECTS ALLOWED
   ======================================== */
footer a:hover,
footer .footer-link:hover,
.modern-footer a:hover,
.modern-footer .footer-link:hover {
    color: #cbd5e1 !important;
    text-decoration: none !important;
}

/* Footer Logo - NO hover effects whatsoever */
.footer-logo,
.footer-logo-img,
.footer-brand-link,
.footer-brand-link img,
.modern-footer .footer-logo,
.modern-footer .footer-logo-img,
.modern-footer .footer-brand-link,
.modern-footer .footer-brand-link img,
footer .footer-logo,
footer .footer-logo-img,
footer .footer-brand-link,
footer .footer-brand-link img,
footer a.footer-brand-link,
footer a.footer-brand-link img,
.modern-footer a.footer-brand-link,
.modern-footer a.footer-brand-link img {
    transform: none !important;
    -webkit-transform: none !important;
    transition: none !important;
    -webkit-transition: none !important;
    animation: none !important;
    -webkit-animation: none !important;
}

.footer-logo:hover,
.footer-logo-img:hover,
.footer-brand-link:hover,
.footer-brand-link:hover img,
.modern-footer .footer-logo:hover,
.modern-footer .footer-logo-img:hover,
.modern-footer .footer-brand-link:hover,
.modern-footer .footer-brand-link:hover img,
footer .footer-logo:hover,
footer .footer-logo-img:hover,
footer .footer-brand-link:hover,
footer .footer-brand-link:hover img,
footer a.footer-brand-link:hover,
footer a.footer-brand-link:hover img,
.modern-footer a.footer-brand-link:hover,
.modern-footer a.footer-brand-link:hover img {
    transform: none !important;
    -webkit-transform: none !important;
    scale: 1 !important;
    opacity: 1 !important;
    filter: brightness(0) invert(1) !important;
    -webkit-filter: brightness(0) invert(1) !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    animation: none !important;
    -webkit-animation: none !important;
    background: transparent !important;
}

