/* Footer Styles - Ensure footer is visible on all devices */

/* Force footer to be visible */
footer.bg-gray-800 {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    z-index: 10 !important;
}

/* Footer responsive grid */
footer .grid {
    display: grid !important;
    gap: 2rem !important;
}

/* Mobile footer adjustments */
@media (max-width: 768px) {
    footer.bg-gray-800 {
        padding-bottom: 5rem !important; /* Space for bottom navigation */
    }

    footer .grid {
        grid-template-columns: 1fr !important;
        gap: 1.5rem !important;
    }

    footer .max-w-7xl {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    footer .py-8 {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }
}

/* Tablet footer adjustments */
@media (min-width: 769px) and (max-width: 1024px) {
    footer .grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 2rem !important;
    }

    footer .max-w-7xl {
        padding-left: 2rem !important;
        padding-right: 2rem !important;
    }
}

/* Desktop footer adjustments */
@media (min-width: 1025px) {
    footer .grid {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 2rem !important;
    }

    footer .max-w-7xl {
        padding-left: 3rem !important;
        padding-right: 3rem !important;
    }
}

/* Footer content styling */
footer h3 {
    color: white !important;
    font-size: 1.125rem !important;
    font-weight: 600 !important;
    margin-bottom: 1rem !important;
}

footer p,
footer li {
    color: #d1d5db !important;
    line-height: 1.6 !important;
}

footer .text-gray-300 {
    color: #d1d5db !important;
}

/* Footer links and icons */
footer i {
    margin-right: 0.5rem !important;
    color: #9ca3af !important;
}

footer .border-t {
    border-top-color: #374151 !important;
}

/* Ensure footer is above bottom navigation on mobile */
@media (max-width: 768px) {
    footer.bg-gray-800 {
        z-index: 5 !important;
    }
}

/* Footer hover effects */
@media (hover: hover) and (pointer: fine) {
    footer a:hover {
        color: white !important;
        text-decoration: underline !important;
    }
}

/* Force override any conflicting styles */
html body footer.bg-gray-800 {
    display: block !important;
}
