/* ═══════════════════════════════════════
   Novacare — Mobile Compatibility Fixes
   Add after style.css in inc/head.php
   ═══════════════════════════════════════ */

/* ─── reCAPTCHA overflow fix (all forms) ─── */
@media (max-width: 400px) {
    .nc-recaptcha,
    .g-recaptcha {
        transform: scale(0.85) !important;
        transform-origin: 0 0 !important;
    }
}

/* ─── Product grid: 2 columns on mobile ─── */
@media (max-width: 575px) {
    .product-grid-item {
        flex: 0 0 50% !important;
        max-width: 50% !important;
    }
    /* For the existing col-md-4 col-lg-3 product cards */
    section .col-md-4.col-lg-3,
    section .col-lg-3.col-md-4 {
        flex: 0 0 50%;
        max-width: 50%;
        padding-left: 8px;
        padding-right: 8px;
    }
    section .col-md-4.col-lg-3 img,
    section .col-lg-3.col-md-4 img {
        height: 140px !important;
        object-fit: cover;
    }
}

/* ─── Blog tags wrap nicely ─── */
@media (max-width: 480px) {
    .nc-blog-date {
        gap: 4px !important;
    }
    .nc-blog-date .nc-blog-tag {
        font-size: 10px !important;
        padding: 2px 6px !important;
    }
    .nc-blog-card img {
        height: 180px !important;
    }
    .nc-blog-card-body {
        padding: 14px !important;
    }
    .nc-blog-card-body h3 {
        font-size: 14px !important;
    }
}

/* ─── Blog detail: sidebar form padding ─── */
@media (max-width: 575px) {
    .nc-sidebar-form {
        padding: 20px 16px !important;
    }
    .nc-share-bar {
        gap: 8px !important;
    }
    .nc-share-btn {
        width: 36px !important;
        height: 36px !important;
        font-size: 14px !important;
    }
    .nc-article-body {
        font-size: 15px !important;
    }
    .nc-article-body img {
        max-width: 100% !important;
        height: auto !important;
    }
}

/* ─── Outsourcing: solution cards stack on tablet ─── */
@media (max-width: 991px) {
    .services-section .col-lg-7,
    .services-section .col-lg-5 {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .services-section .col-lg-5 {
        margin-top: 30px;
    }
    .services-section video.earth-gif {
        max-height: 350px;
    }
}

/* ─── Contact form: info panel overflow ─── */
@media (max-width: 380px) {
    .nc-info-panel {
        padding: 20px 16px !important;
    }
    .nc-info-item {
        gap: 10px !important;
    }
    .nc-info-item .nc-info-icon {
        width: 36px !important;
        height: 36px !important;
        font-size: 14px !important;
    }
}

/* ─── 404 page: buttons stack on small screens ─── */
@media (max-width: 480px) {
    .nc-404-links {
        flex-direction: column !important;
        align-items: center;
    }
    .nc-404-links a {
        width: 100%;
        justify-content: center;
    }
    .nc-404-popular-links {
        gap: 8px !important;
    }
    .nc-404-popular-links a {
        font-size: 12px !important;
        padding: 6px 14px !important;
    }
}

/* ─── Footer callback form: tighter on small screens ─── */
@media (max-width: 400px) {
    .nc-footer-form .nc-ff-field input {
        font-size: 14px !important;
        padding: 10px 14px !important;
    }
}

/* ─── Product modal: full width on mobile ─── */
@media (max-width: 575px) {
    .nc-enq-modal .modal-dialog {
        margin: 8px !important;
        max-width: calc(100% - 16px) !important;
    }
    .nc-enq-body {
        padding: 20px 16px !important;
    }
}

/* ─── Career form: spacing ─── */
@media (max-width: 575px) {
    .career-form-section .form-inputout {
        margin-bottom: 12px;
    }
}

/* ─── Tables in CKEditor content: prevent overflow ─── */
.sec-center table,
.nc-article-body table,
.p_description table {
    width: 100% !important;
    overflow-x: auto;
    display: block;
}

/* ─── CKEditor images: responsive ─── */
.sec-center img,
.nc-article-body img,
.p_description img {
    max-width: 100% !important;
    height: auto !important;
}

/* ─── WhatsApp floating button: don't overlap content ─── */
@media (max-width: 575px) {
    .call_me {
        bottom: 15px !important;
        right: 15px !important;
        width: 48px !important;
        height: 48px !important;
        font-size: 22px !important;
    }
}

/* ─── Breadcrumb: prevent text overflow ─── */
@media (max-width: 400px) {
    section.nc-breadcrumb-section h1 {
        font-size: 17px !important;
        word-break: break-word;
    }
    section.nc-breadcrumb-section .nc-breadcrumb-nav {
        font-size: 11px !important;
    }
}

/* ─── Stats counter section ─── */
@media (max-width: 400px) {
    .counter-inner h6.number {
        font-size: 28px !important;
    }
    .counter-inner p {
        font-size: 12px !important;
    }
}

/* ─── Product image borders ─── */
.nc-pcard-circle {
    border: 2px solid #dde3e8 !important;
}
.nc-pcard:hover .nc-pcard-circle {
    border-color: #00476b !important;
}
.product-img img,
.category__thumb.sub-code-categ img,
.category__thumb img {
    border: 2px solid #dde3e8 !important;
    border-radius: 8px;
}

/* ─── Fix duplicate select on contact form ─── */
.nc-form-panel .nice-select { display: none !important; }
.nc-form-panel select { display: block !important; opacity: 1 !important; height: 56px !important; position: relative !important; }
.nc-enq-body .nice-select { display: none !important; }
.nc-enq-body select { display: block !important; opacity: 1 !important; }
.nc-sidebar-form .nice-select { display: none !important; }
.nc-sidebar-form select { display: block !important; opacity: 1 !important; }