/* ============================================================
   RESPONSIVE MOBILE — css/responsive-patch.css
   ============================================================ */

@media (max-width: 1079px) {
    body { padding-top: 110px !important; padding-bottom: 100px; }

    .header-main { height: 72px !important; }
    .logo-wrap img { height: 40px !important; }

    .hero-flex {
        flex-direction: column !important;
        text-align: center !important;
        gap: 20px !important;
        padding: 20px 0 40px !important;
    }
    .hero-text, .hero-img-wrap, .hero-slider-wrap { flex: none !important; width: 100% !important; }
    .hero-title { font-size: clamp(2.8rem, 11vw, 4rem) !important; margin-bottom: 16px !important; }
    .hero-eyebrow { margin-bottom: 14px !important; }
    .hero-desc { font-size: 0.9rem !important; margin-bottom: 20px !important; }
    .section-eyebrow { text-align: center !important; }
    .btn-primary { justify-content: center; }

    .hero-stats { margin-top: 24px !important; padding-top: 20px !important; gap: 20px !important; }
    .stat strong { font-size: 1.8rem !important; }

    .hero-slider-wrap { margin-top: 0 !important; max-width: 100% !important; }

    .products-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
    }
    .product-card { padding: 14px !important; border-radius: 18px !important; }
    .product-img { border-radius: 12px !important; margin-bottom: 12px !important; }
    .product-price { font-size: 1.1rem !important; }
    .product-name { font-size: 0.8rem !important; }
    .product-badge { font-size: 0.52rem !important; }
    .btn-add { width: 34px !important; height: 34px !important; border-radius: 10px !important; font-size: 0 !important; padding: 0 !important; }
    .btn-add i { font-size: 0.85rem !important; }

    .livraison-feat strong { color: #fff !important; }

    .section-title {
        font-size: clamp(2.2rem, 9vw, 3.5rem) !important;
        margin-bottom: 36px !important;
    }

    .filter-bar {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        justify-content: flex-start !important;
        padding-bottom: 8px !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .filter-bar::-webkit-scrollbar { display: none; }
    .filter-btn {
        flex-shrink: 0 !important;
        padding: 10px 20px !important;
        font-size: 0.72rem !important;
    }

    .showcase-box {
        grid-template-columns: 1fr !important;
        padding: 36px 24px !important;
        border-radius: 24px !important;
    }
    .showcase-text h2 { font-size: 2rem !important; }

    .dossier-grid { grid-template-columns: 1fr !important; gap: 16px !important; }
    .dossier-card { padding: 28px 20px !important; border-radius: 20px !important; }
}

@media (max-width: 768px) {
    .cart-grid { grid-template-columns: 1fr !important; display: block !important; }
    .cart-card { padding: 20px 16px !important; }
    .cart-table, .cart-table tbody, .cart-item-row { display: block !important; width: 100% !important; }
    .cart-table thead { display: none !important; }
    .cart-item-row { display: flex !important; flex-direction: column !important; align-items: flex-start !important; padding: 16px 0 !important; border-bottom: 1px solid rgba(0,0,0,0.08) !important; position: relative !important; }
    .cart-item-row td { display: block !important; width: 100% !important; padding: 4px 0 !important; text-align: left !important; }
    .cart-item-row td:first-child { margin-bottom: 8px !important; }
    .cart-item-row td:last-child { display: flex !important; justify-content: space-between !important; align-items: center !important; width: 100% !important; margin-top: 10px !important; }
    .item-flex { gap: 12px !important; }
    .item-img-wrap { width: 60px !important; height: 60px !important; flex-shrink: 0 !important; }
    .item-name { font-size: 0.85rem !important; word-break: break-word !important; }
    .item-price { font-size: 1.2rem !important; font-weight: 900 !important; }
    .qty-control { margin: 5px 0 !important; }
    .cart-summary { position: static !important; margin-top: 20px !important; padding: 25px 20px !important; }
}

@media (max-width: 1079px) {
    .footer { margin-top: 20px !important; padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px)) !important; }
}

@media(max-width: 768px) {
    .header-phones { display: none !important; }
    .logo-wrap { gap: 8px !important; }
    .logo-wrap img { height: 35px !important; width: 35px !important; }
    .logo-text strong { font-size: 0.95rem !important; }
    .logo-text span { font-size: 0.42rem !important; white-space: nowrap !important; }
    .header-actions { gap: 6px !important; }
    .header-icon-btn { width: 34px !important; height: 34px !important; font-size: 0.9rem !important; }
}

html, body {
    overflow-x: hidden;
    max-width: 100vw;
    overscroll-behavior-x: none;
}

/* Correction de la taille du slogan sur mobile */
@media (max-width: 768px) {
    .logo-text span {
        font-size: 0.55rem !important; /* On augmente légèrement la taille */
        letter-spacing: 0.1em !important; /* Espacement ajusté pour qu'il tienne bien */
        white-space: nowrap !important;
    }
}

/* ============================================================
   CORRECTIF CHAMPS DU PROFIL SUR MOBILE
   ============================================================ */
@media (max-width: 768px) {
    /* Force les lignes d'informations à passer en colonne sur mobile */
    .info-row {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 6px !important;
    }
    
    /* Fait en sorte que les champs de saisie prennent toute la largeur disponible */
    .user-input {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* Aligne la valeur/input correctement */
    .info-value {
        width: 100% !important;
        justify-content: flex-start !important;
    }
}