/* Mobile Optimization & Performance Fixes */

/* ==================================
   MOBILE TOUCH TARGETS (Min 44x44px)
   ================================== */

/* Make all buttons touch-friendly */
.btn,
button,
a.btn {
    min-height: 44px;
    min-width: 44px;
    padding: 12px 24px;
}

/* Navigation links on mobile */
@media (max-width: 768px) {
    .navbar-nav .nav-link {
        min-height: 44px;
        padding: 12px 16px;
        display: flex;
        align-items: center;
    }

    /* Menu toggle button */
    .navbar-toggler {
        min-width: 44px;
        min-height: 44px;
        padding: 8px;
    }

    /* Social icons */
    .social-list li a {
        min-width: 44px;
        min-height: 44px;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
    }
}

/* ==================================
   MOBILE RESPONSIVE IMPROVEMENTS
   ================================== */

/* Hero section mobile */
@media (max-width: 768px) {
    .hero-slider-content {
        padding: 20px 0 !important;
        text-align: center;
    }

    .hero-slider-content h4 {
        font-size: 1.5rem;
    }

    .image-wrap img {
        margin-left: 0 !important;
        max-width: 100%;
        height: auto !important;
    }
}

/* Service cards mobile */
@media (max-width: 576px) {
    .staff-member {
        height: 250px;
    }

    .service-title {
        font-size: 1.1rem;
    }

    .service-subtitle {
        font-size: 0.85rem;
    }
}

/* Contact form mobile */
@media (max-width: 768px) {

    .contact-us-form input,
    .contact-us-form textarea,
    .contact-us-form select {
        min-height: 44px;
        font-size: 16px;
        /* Prevents zoom on iOS */
    }
}

/* ==================================
   IMAGE OPTIMIZATION
   ================================== */

/* Lazy load placeholder */
img[loading="lazy"] {
    background: #f0f0f0;
}

/* Prevent layout shift */
img {
    max-width: 100%;
    height: auto;
}

/* ==================================
   ACCESSIBILITY IMPROVEMENTS
   ================================== */

/* Focus states */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus {
    outline: 2px solid #65258a;
    outline-offset: 2px;
}

/* Skip to main content link */
.skip-to-main {
    position: absolute;
    left: -9999px;
    z-index: 999;
    padding: 12px 24px;
    background-color: #65258a;
    color: white;
    text-decoration: none;
}

.skip-to-main:focus {
    left: 50%;
    transform: translateX(-50%);
    top: 10px;
}

/* ==================================
   PERFORMANCE OPTIMIZATIONS
   ================================== */

/* Reduce animations on slow connections */
@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Font loading optimization handled by Google Fonts display=swap parameter */


/* ==================================
   MOBILE MENU IMPROVEMENTS
   ================================== */

@media (max-width: 991px) {
    .navbar-collapse {
        max-height: 70vh;
        overflow-y: auto;
    }

    .dropdown-menu {
        border: none;
        padding: 0;
    }

    .dropdown-item {
        min-height: 44px;
        padding: 12px 20px;
    }
}

/* ==================================
   CONTRAST IMPROVEMENTS
   ================================== */

/* Ensure sufficient contrast */
.text-muted {
    color: #6c757d !important;
}

.color-secondary {
    color: #65258a !important;
}

/* Link contrast */
a {
    color: #007bff;
}

a:hover {
    color: #0056b3;
}

/* ==================================
   MOBILE SPACING
   ================================== */

@media (max-width: 768px) {
    .ptb-100 {
        padding: 50px 0;
    }

    .ptb-70 {
        padding: 35px 0;
    }

    .pb-100 {
        padding-bottom: 50px;
    }

    /* Reduce excessive margins */
    .mb-5 {
        margin-bottom: 2rem !important;
    }

    .mt-5 {
        margin-top: 2rem !important;
    }
}

/* ==================================
   TABLE RESPONSIVENESS
   ================================== */

@media (max-width: 768px) {
    table {
        font-size: 14px;
    }

    .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* ==================================
   FORM IMPROVEMENTS
   ================================== */

/* Better form controls on mobile */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
textarea,
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* Prevent zooming on form focus for iOS */
@media screen and (max-width: 768px) {

    select,
    textarea,
    input[type="text"],
    input[type="password"],
    input[type="datetime"],
    input[type="datetime-local"],
    input[type="date"],
    input[type="month"],
    input[type="time"],
    input[type="week"],
    input[type="number"],
    input[type="email"],
    input[type="url"],
    input[type="search"],
    input[type="tel"],
    input[type="color"] {
        font-size: 16px !important;
    }
}