/* ========================================
   PREVENT ELEMENTS FROM DISAPPEARING
   Fix for pages disappearing after deployment
   Ensures all elements stay visible after animations
   ======================================== */

/* Global fix: Ensure all fade-in-up elements stay visible */
.fade-in-up {
    animation-fill-mode: forwards !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* After animation completes, force visibility */
.fade-in-up[style*="opacity"] {
    opacity: 1 !important;
}

/* Ensure all sections stay visible (but not modals/toasts) */
section:not(.modal):not([class*="modal"]):not([class*="toast"]),
.section:not(.modal):not([class*="modal"]):not([class*="toast"]),
.container:not(.modal):not([class*="modal"]):not([class*="toast"]),
.container-fluid:not(.modal):not([class*="modal"]):not([class*="toast"]),
.row:not(.modal):not([class*="modal"]):not([class*="toast"]),
.col:not(.modal):not([class*="modal"]):not([class*="toast"]),
[class*="col-"]:not(.modal):not([class*="modal"]):not([class*="toast"]) {
    visibility: visible !important;
    opacity: 1 !important;
}

/* Specific fixes for common page elements (exclude modals) */
main:not(.modal):not([class*="modal"]),
body > section:not(.modal):not([class*="modal"]):not([class*="toast"]),
body > div:not([class*="modal"]):not([class*="toast"]):not([class*="backdrop"]) {
    visibility: visible !important;
    opacity: 1 !important;
}

/* Fix for all animated elements */
.fade-in,
.fade-in-up,
.fade-in-down,
.slide-in-left,
.slide-in-right,
.scale-in,
.fade-in-up-delay {
    animation-fill-mode: forwards !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Ensure cards and content blocks stay visible */
.card,
.modern-card,
.app-selection-card,
.product-item,
.benefit-card-modern,
.testimonial-card-growth,
.cta-card-growth {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}

/* Fix for all headings and text (but not in modals) */
h1:not(.modal *), h2:not(.modal *), h3:not(.modal *), h4:not(.modal *), h5:not(.modal *), h6:not(.modal *),
p:not(.modal *), span:not(.modal *), div:not(.modal *):not([class*="modal"]), 
a:not(.modal *), li:not(.modal *), td:not(.modal *), th:not(.modal *) {
    visibility: visible !important;
    opacity: 1 !important;
}

/* Ensure images stay visible */
img {
    opacity: 1 !important;
    visibility: visible !important;
    display: inline-block !important;
}

/* Fix for buttons */
button,
.btn,
.btn-premium,
.btn-premium-outline {
    opacity: 1 !important;
    visibility: visible !important;
    display: inline-block !important;
}

/* Ensure navigation stays visible */
nav,
.navbar,
.nav,
.nav-link {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}

/* Fix for footer */
footer,
.footer,
.modern-footer {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}

/* Prevent any element from being hidden after animation */
*[class*="fade"],
*[class*="slide"],
*[class*="scale"],
*[class*="animate"] {
    animation-fill-mode: forwards !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Force visibility after page load */
body.loaded *,
html.loaded * {
    visibility: visible !important;
    opacity: 1 !important;
}

/* Specific page fixes */
.accounting-page,
.distribution-page,
.manufacturing-page,
.rental-page,
.pos-page,
.mtd-page,
.fbr-page,
.select-app-page,
.signup-page {
    opacity: 1 !important;
    visibility: visible !important;
    min-height: 100vh !important;
}

.accounting-page *,
.distribution-page *,
.manufacturing-page *,
.rental-page *,
.pos-page *,
.mtd-page *,
.fbr-page *,
.select-app-page *,
.signup-page * {
    visibility: visible !important;
}

/* Ensure scroll-to-top button persists */
.scroll-to-top,
.scroll-to-top[data-persistent="true"] {
    position: fixed !important;
    z-index: 1000 !important;
    visibility: visible !important;
    opacity: 1 !important;
    display: flex !important;
}

/* Ensure hero section backgrounds persist */
/* M Logo in text column */




/* Lines in image column */
.home-hero-section .hero-right-column,
.home-hero-section .hero-right-wrapper {
    background-image: url('/lines-bg-header.svg') !important;
    background-repeat: no-repeat !important;
    background-position: center right !important;
    background-size: contain !important;
}

.home-hero-section .hero-right-column::before,
.home-hero-section .hero-right-wrapper::before {
    background-image: url('/lines-bg-header.svg') !important;
    background-repeat: no-repeat !important;
    background-position: center right !important;
    background-size: contain !important;
}
    opacity: 1 !important;
}

/* Ensure all keyframe animations end with visible state */
@keyframes fadeInUpCard {
    from {
        opacity: 0;
        transform: translateY(30px);
        visibility: visible;
    }
    to {
        opacity: 1 !important;
        transform: translateY(0);
        visibility: visible !important;
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(40px);
        visibility: visible;
    }
    to {
        opacity: 1 !important;
        transform: translateY(0);
        visibility: visible !important;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
        visibility: visible;
    }
    to {
        opacity: 1 !important;
        visibility: visible !important;
    }
}

/* Media queries to ensure visibility on all screen sizes (but not modals) */
@media (max-width: 767px) {
    *:not(.modal):not([class*="modal"]):not([class*="toast"]):not([class*="backdrop"]) {
        visibility: visible !important;
        opacity: 1 !important;
    }
}

@media (min-width: 768px) {
    *:not(.modal):not([class*="modal"]):not([class*="toast"]):not([class*="backdrop"]) {
        visibility: visible !important;
        opacity: 1 !important;
    }
}