/*
 Theme Name:   Quattro Child - Lens Boites Auto
 Template:     quattro
 Version:      1.0.0
 Description:  Child theme pour Lens Boites Auto - modifications client
 Author:       123web / Sofiane
*/

/* ============================================
   NAVBAR - 3 CTA BUTTONS (Telephone, RDV, Panne)
   Design pro, intégré au site auto
   ============================================ */

.lba-cta-bar {
    display: flex;
    align-items: stretch;
    background: linear-gradient(135deg, #0f0f1a 0%, #1a1a2e 50%, #0f0f1a 100%);
    width: 100%;
    z-index: 9999;
    position: relative;
    border-bottom: 2px solid rgba(255, 56, 55, 0.4);
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.2);
}

.lba-cta-bar a {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 12px 20px;
    text-decoration: none !important;
    font-family: 'Jost', sans-serif;
    font-weight: 500;
    font-size: 13px;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-align: center;
    white-space: nowrap;
    position: relative;
    overflow: hidden;
    border: none;
}

/* Séparateur entre les boutons */
.lba-cta-bar a + a {
    border-left: 1px solid rgba(255, 255, 255, 0.08);
}

/* Effet hover lumineux */
.lba-cta-bar a::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.05), transparent);
    transition: left 0.5s ease;
}

.lba-cta-bar a:hover::before {
    left: 100%;
}

.lba-cta-bar a i {
    font-size: 15px;
    transition: transform 0.3s ease;
}

.lba-cta-bar a:hover i {
    transform: scale(1.15);
}

.lba-cta-bar a .lba-cta-text {
    font-size: 12.5px;
    letter-spacing: 1px;
}

/* ---- CTA Telephone ---- */
.lba-cta-phone {
    background: transparent;
    color: #4ade80 !important;
}
.lba-cta-phone i {
    color: #4ade80;
}
.lba-cta-phone:hover {
    background: rgba(74, 222, 128, 0.1);
    color: #6ee7a0 !important;
}
.lba-cta-phone .lba-cta-text {
    color: rgba(255,255,255,0.9) !important;
    font-weight: 600;
    font-size: 13.5px;
    letter-spacing: 0.5px;
}

/* ---- CTA RDV ---- */
.lba-cta-rdv {
    background: linear-gradient(135deg, #ff3837 0%, #e62d2c 100%);
    color: #fff !important;
    font-weight: 600 !important;
}
.lba-cta-rdv:hover {
    background: linear-gradient(135deg, #ff4a49 0%, #ff3837 100%);
    color: #fff !important;
    box-shadow: 0 0 20px rgba(255, 56, 55, 0.3);
}
.lba-cta-rdv .lba-cta-text {
    font-weight: 600;
}

/* ---- CTA Panne ---- */
.lba-cta-panne {
    background: transparent;
    color: #fbbf24 !important;
}
.lba-cta-panne i {
    color: #fbbf24;
}
.lba-cta-panne:hover {
    background: rgba(251, 191, 36, 0.1);
    color: #fcd34d !important;
}
.lba-cta-panne .lba-cta-text {
    color: rgba(255,255,255,0.85) !important;
}

/* Animation subtile icône panne */
.lba-cta-panne i {
    animation: lba-glow 3s ease-in-out infinite;
}

@keyframes lba-glow {
    0%, 100% { opacity: 1; text-shadow: none; }
    50% { opacity: 0.7; text-shadow: 0 0 8px rgba(251, 191, 36, 0.6); }
}

/* Animation icône téléphone */
.lba-cta-phone i {
    animation: lba-ring 4s ease-in-out infinite;
}

@keyframes lba-ring {
    0%, 100% { transform: rotate(0deg); }
    5% { transform: rotate(15deg); }
    10% { transform: rotate(-10deg); }
    15% { transform: rotate(10deg); }
    20% { transform: rotate(-5deg); }
    25% { transform: rotate(0deg); }
}

/* ---- Responsive ---- */
@media (max-width: 767px) {
    .lba-cta-bar a {
        padding: 10px 6px;
        gap: 6px;
    }
    .lba-cta-bar a .lba-cta-text {
        font-size: 9px;
        letter-spacing: 0.3px;
    }
    .lba-cta-phone .lba-cta-text {
        font-size: 10px !important;
    }
    .lba-cta-bar a i {
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .lba-cta-bar a .lba-cta-text {
        display: none;
    }
    .lba-cta-bar a i {
        font-size: 18px;
    }
    .lba-cta-bar a {
        padding: 12px 8px;
    }
    /* On mobile, show phone number still */
    .lba-cta-phone .lba-cta-text {
        display: inline !important;
        font-size: 12px !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .lba-cta-bar a {
        padding: 10px 12px;
    }
    .lba-cta-bar a .lba-cta-text {
        font-size: 11px;
    }
}

/* ---- Scroll state : fixé sous la navbar ---- */
.lba-cta-bar.lba-cta-scrolled {
    position: fixed;
    left: 0;
    right: 0;
    z-index: 99998;
    border-bottom: 1px solid rgba(255, 56, 55, 0.5);
    backdrop-filter: blur(12px);
    background: linear-gradient(135deg, rgba(15, 15, 26, 0.96) 0%, rgba(26, 26, 46, 0.96) 50%, rgba(15, 15, 26, 0.96) 100%);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
    transition: top 0.25s ease;
}

.lba-cta-bar.lba-cta-scrolled a {
    padding: 8px 15px;
}

.lba-cta-bar.lba-cta-scrolled a .lba-cta-text {
    font-size: 11.5px;
}

.lba-cta-bar.lba-cta-scrolled a i {
    font-size: 13px;
}

/* Navbar sticky du thème au-dessus */
.pix-header.sticky,
.pix-header.is-sticky,
header.pix-header {
    z-index: 99999 !important;
}


/* ============================================
   ZF PARTNER BADGE
   ============================================ */
.lba-zf-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #003d7a;
    color: #fff;
    padding: 6px 16px;
    border-radius: 4px;
    font-family: 'Jost', sans-serif;
    font-weight: 600;
    font-size: 13px;
}

/* ============================================
   GOOGLE RATING BADGE
   ============================================ */
.lba-rating {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: 'Jost', sans-serif;
}

.lba-rating-stars {
    color: #fbbc04;
    font-size: 18px;
}

.lba-rating-score {
    font-weight: 700;
    font-size: 20px;
    color: #333;
}

.lba-rating-count {
    font-size: 14px;
    color: #666;
}

/* ============================================
   PAGES CONTENT STYLING
   ============================================ */
.lba-page-content h2 {
    color: #1a1a2e;
    margin-top: 40px;
    margin-bottom: 20px;
    font-weight: 700;
}

.lba-page-content h3 {
    color: #ff3837;
    margin-top: 30px;
}

.lba-symptom-card {
    background: #f8f9fa;
    border-left: 4px solid #ff3837;
    padding: 20px 25px;
    margin: 20px 0;
    border-radius: 0 8px 8px 0;
}

.lba-check-list {
    list-style: none;
    padding: 0;
}

.lba-check-list li {
    padding: 8px 0;
    padding-left: 30px;
    position: relative;
}

.lba-check-list li::before {
    content: "\f00c";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color: #27ae60;
    position: absolute;
    left: 0;
}

.lba-alert-list li::before {
    content: "\f071";
    color: #f39c12;
}

.lba-cta-section {
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
    padding: 40px;
    border-radius: 12px;
    text-align: center;
    margin: 40px 0;
}

.lba-cta-section h3 {
    color: #fff !important;
    margin-top: 0;
}

.lba-cta-section p {
    color: #ccc;
}

.lba-cta-section .pix-button {
    margin: 10px;
}

/* Alma payment badge */
.lba-alma-badge {
    background: #FA5022;
    color: #fff;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border-radius: 6px;
    font-family: 'Jost', sans-serif;
    font-weight: 600;
}

/* ============================================
   CONTACT FORM 7 - STYLING (global)
   ============================================ */

/* Layout du formulaire */
.lba-form {
    background: #fff;
    padding: 5px 0;
}

.lba-form-row {
    display: flex;
    gap: 20px;
    margin-bottom: 0;
}

.lba-form-col {
    flex: 1;
    min-width: 0;
}

/* Labels */
.lba-form label,
.wpcf7 label {
    display: block !important;
    font-family: 'Jost', sans-serif !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    color: #1a1a2e !important;
    margin-bottom: 18px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

/* Tous les champs — sélecteurs ultra-spécifiques pour override le thème */
.lba-form input[type="text"],
.lba-form input[type="email"],
.lba-form input[type="tel"],
.lba-form select,
.lba-form textarea,
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 select,
.wpcf7 textarea,
.wpcf7-form-control:not(.wpcf7-submit) {
    width: 100% !important;
    max-width: 100% !important;
    padding: 13px 16px !important;
    border: 2px solid #e0e0e0 !important;
    border-radius: 8px !important;
    font-family: 'Jost', sans-serif !important;
    font-size: 15px !important;
    color: #333 !important;
    background: #f8f9fa !important;
    transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
    margin-top: 6px !important;
    box-sizing: border-box !important;
    -webkit-appearance: none !important;
    line-height: 1.4 !important;
}

/* Wrapper span CF7 */
.wpcf7-form-control-wrap {
    display: block !important;
    margin-top: 6px !important;
}

/* Focus state */
.lba-form input:focus,
.lba-form select:focus,
.lba-form textarea:focus,
.wpcf7 input:focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus {
    border-color: #ff3837 !important;
    box-shadow: 0 0 0 4px rgba(255, 56, 55, 0.08) !important;
    outline: none !important;
    background: #fff !important;
}

/* Textarea */
.lba-form textarea,
.wpcf7 textarea {
    min-height: 130px !important;
    resize: vertical !important;
}

/* Select dropdown */
.lba-form select,
.wpcf7 select {
    appearance: none !important;
    -webkit-appearance: none !important;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23666' d='M6 8L1 3h10z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    background-size: 12px !important;
    padding-right: 40px !important;
    cursor: pointer !important;
}

/* Footer du formulaire */
.lba-form-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 25px;
    flex-wrap: wrap;
    gap: 15px;
}

.lba-form-note {
    font-size: 12px;
    color: #999;
    font-style: italic;
    font-family: 'Jost', sans-serif;
}

/* Bouton submit */
.lba-submit,
input.wpcf7-submit,
.wpcf7 input[type="submit"] {
    background: linear-gradient(135deg, #ff3837 0%, #e62d2c 100%) !important;
    color: #fff !important;
    border: none !important;
    padding: 15px 45px !important;
    border-radius: 8px !important;
    font-family: 'Jost', sans-serif !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    text-transform: uppercase !important;
    letter-spacing: 1.2px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(255, 56, 55, 0.3) !important;
    width: auto !important;
    display: inline-block !important;
}

.lba-submit:hover,
input.wpcf7-submit:hover,
.wpcf7 input[type="submit"]:hover {
    background: linear-gradient(135deg, #ff4a49 0%, #ff3837 100%) !important;
    box-shadow: 0 6px 25px rgba(255, 56, 55, 0.4) !important;
    transform: translateY(-2px) !important;
}

/* Validation */
.wpcf7-not-valid {
    border-color: #ff3837 !important;
    background: #fff5f5 !important;
}

.wpcf7-not-valid-tip {
    color: #ff3837 !important;
    font-size: 12px !important;
    margin-top: 4px !important;
}

.wpcf7-response-output {
    border-radius: 8px !important;
    padding: 15px 20px !important;
    font-family: 'Jost', sans-serif !important;
    margin-top: 20px !important;
}

/* Placeholder style */
.lba-form ::placeholder,
.wpcf7 ::placeholder {
    color: #aaa !important;
    font-style: italic !important;
}

/* Responsive */
@media (max-width: 767px) {
    .lba-form-row {
        flex-direction: column;
        gap: 0;
    }
    .lba-form-footer {
        flex-direction: column;
        text-align: center;
    }
    input.wpcf7-submit,
    .wpcf7 input[type="submit"] {
        width: 100% !important;
    }
}

/* ============================================
   CONTACT PAGE - SPACING FIX
   ============================================ */

/* Espacement entre les colonnes horaires et formulaire */
.page-template-default.page .vc_row .vc_col-sm-4 + .vc_col-sm-8,
.page-template-default.page .vc_row .vc_column_container[data-vc-full-width] {
    padding-left: 30px !important;
}

/* Séparateur visuel entre les colonnes */
.page-template-default.page .vc_row > .vc_column_container:first-child {
    border-right: 1px solid #eee;
    padding-right: 25px !important;
}

/* Plus d'espace en général entre les colonnes 1/3 + 2/3 */
.vc_col-sm-4 {
    padding-right: 20px !important;
}

.vc_col-sm-8 {
    padding-left: 30px !important;
}

/* Fix pour que ça ne s'applique pas au footer */
.pix-footer .vc_col-sm-4,
.pix-footer .vc_col-sm-8 {
    padding-right: 15px !important;
    padding-left: 15px !important;
    border-right: none !important;
}

@media (max-width: 767px) {
    .vc_col-sm-4,
    .vc_col-sm-8 {
        padding-right: 15px !important;
        padding-left: 15px !important;
        border-right: none !important;
    }
}

/* ============================================
   SERVICE CARDS - MAILLAGE INTERNE
   ============================================ */
.lba-services-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    justify-content: center !important;
    margin: 20px auto !important;
    max-width: 900px !important;
}

.lba-services-grid a.lba-scard {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 150px !important;
    padding: 20px 10px !important;
    background: #fff !important;
    border-radius: 10px !important;
    text-decoration: none !important;
    text-align: center !important;
    border: 1px solid #e8e8e8 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
    transition: all 0.3s ease !important;
}

.lba-services-grid a.lba-scard:hover {
    border-color: #ff3837 !important;
    box-shadow: 0 4px 15px rgba(255,56,55,0.12) !important;
    transform: translateY(-3px) !important;
}

.lba-services-grid a.lba-scard i {
    font-size: 26px !important;
    margin-bottom: 10px !important;
    display: block !important;
}

.lba-services-grid .lba-scard-title {
    font-weight: 700 !important;
    color: #1a1a2e !important;
    font-size: 13px !important;
    font-family: 'Jost', sans-serif !important;
    line-height: 1.3 !important;
}

.lba-services-grid .lba-scard-desc {
    color: #888 !important;
    font-size: 11px !important;
    margin-top: 4px !important;
    font-family: 'Jost', sans-serif !important;
}

.lba-services-grid a.lba-scard-cta {
    background: #ff3837 !important;
    border-color: #ff3837 !important;
}

.lba-services-grid a.lba-scard-cta .lba-scard-title,
.lba-services-grid a.lba-scard-cta i {
    color: #fff !important;
}

.lba-services-grid a.lba-scard-cta .lba-scard-desc {
    color: rgba(255,255,255,0.8) !important;
}

.lba-services-grid a.lba-scard-cta:hover {
    background: #e62d2c !important;
    box-shadow: 0 4px 15px rgba(255,56,55,0.3) !important;
}

@media (max-width: 600px) {
    .lba-services-grid a.lba-scard {
        width: calc(50% - 10px) !important;
    }
}

/* ============================================
   LOGO NAVBAR
   Sans scroll = fond blanc arrondi (lisibilité sur slider)
   Au scroll (sticky) = dégradé subtil fondu dans la navbar
   ============================================ */

/* État par défaut : fond blanc arrondi */
.pix-header .menu-logo .navbar-brand,
.pix-header .menu-logo a.navbar-brand {
    background: rgba(255, 255, 255, 0.92) !important;
    padding: 8px 14px !important;
    border-radius: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1) !important;
    transition: all 0.4s ease !important;
    line-height: 0 !important;
}

.pix-header .menu-logo .navbar-brand img.pix-header-logo {
    display: block !important;
    margin: 0 auto !important;
    padding: 0 !important;
    vertical-align: middle !important;
}

.pix-header .menu-logo .navbar-brand:hover {
    background: rgba(255, 255, 255, 1) !important;
}

/* Au scroll (sticky) : dégradé subtil qui se fond dans la navbar sombre */
.pix-header.is-fixed .menu-logo .navbar-brand,
.pix-header.is-fixed .menu-logo a.navbar-brand {
    background: linear-gradient(135deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0.05) 100%) !important;
    box-shadow: none !important;
    border-radius: 6px !important;
    padding: 6px 12px !important;
}

.pix-header.is-fixed .menu-logo .navbar-brand img.pix-header-logo {
    filter: brightness(1.15) !important;
}

.pix-header.is-fixed .menu-logo .navbar-brand:hover {
    background: rgba(255, 255, 255, 0.15) !important;
}

/* Mobile */
.menu-mobile .navbar-brand {
    background: rgba(255, 255, 255, 0.92) !important;
    padding: 5px 10px !important;
    border-radius: 6px !important;
    display: inline-flex !important;
    align-items: center !important;
    line-height: 0 !important;
}

/* ============================================
   GOOGLE REVIEWS TICKER - Compact & élégant
   ============================================ */
.lba-reviews-ticker {
    background: linear-gradient(135deg, #f8f9fa 0%, #eef0f2 100%);
    overflow: hidden;
    padding: 8px 0;
    position: relative;
}

.lba-reviews-header {
    text-align: center;
    margin-bottom: 6px;
}

.lba-reviews-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-family: 'Jost', sans-serif;
    font-size: 12px;
    color: #555;
}

.lba-reviews-badge strong {
    font-size: 15px;
    color: #1a1a2e;
}

.lba-reviews-stars {
    color: #fbbc04;
    font-size: 13px;
    letter-spacing: 0.5px;
}

.lba-reviews-count {
    color: #999;
    font-size: 11px;
    margin-left: 2px;
}

.lba-reviews-track {
    overflow: hidden;
    width: 100%;
}

.lba-reviews-slide {
    display: flex;
    gap: 12px;
    will-change: transform;
    width: max-content;
}

.lba-review-card {
    flex-shrink: 0;
    width: 280px;
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    padding: 10px 14px;
    font-family: 'Jost', sans-serif;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}

.lba-review-stars {
    color: #fbbc04;
    font-size: 11px;
    letter-spacing: 1px;
    margin-bottom: 4px;
}

.lba-review-text {
    color: #555;
    font-size: 11.5px;
    line-height: 1.45;
    margin: 0 0 5px 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-style: italic;
}

.lba-review-author {
    color: #1a1a2e;
    font-size: 10.5px;
    font-weight: 600;
}

/* Fade edges - fond clair */
.lba-reviews-ticker::before,
.lba-reviews-ticker::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 60px;
    z-index: 2;
    pointer-events: none;
}

.lba-reviews-ticker::before {
    left: 0;
    background: linear-gradient(to right, #f8f9fa, transparent);
}

.lba-reviews-ticker::after {
    right: 0;
    background: linear-gradient(to left, #eef0f2, transparent);
}

@media (max-width: 767px) {
    .lba-review-card {
        width: 220px;
        padding: 8px 10px;
    }
    .lba-review-text {
        font-size: 10.5px;
    }
}

/* Ticker fullwidth - collé au slider */
.lba-reviews-ticker {
    width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
    max-width: none !important;
    margin-top: -2px !important;
    margin-bottom: 0 !important;
}

/* Supprimer l'espace entre le slider et le ticker */
.rev_slider_wrapper + .vc_section,
.rev_slider_wrapper + .vc_row {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.wpb_wrapper > .lba-reviews-ticker:first-child {
    margin-top: -15px !important;
}

/* Kill ALL spacing between slider and ticker */
.rev_slider_wrapper {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.rev_slider_wrapper + * {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Le row WPBakery qui contient le slider */
.wpb_revslider_element {
    margin-bottom: 0 !important;
}

/* La section/row juste après le slider */
.vc_row-no-padding,
.wpb_revslider_element + .vc_row,
.wpb_revslider_element + .vc_section {
    margin-top: 0 !important;
}

/* Force le ticker collé au slider */
.wpb_wrapper > .lba-reviews-ticker,
.vc_column_inner > .wpb_wrapper > .lba-reviews-ticker,
.vc_column > .wpb_wrapper > .lba-reviews-ticker,
.lba-reviews-ticker {
    margin-top: -30px !important;
    position: relative;
    z-index: 1;
}

/* Kill padding du vc_section après le slider */
.page-template-page-home .vc_section:first-of-type {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.page-template-page-home .vc_section:first-of-type > .vc_row:first-child {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* La page d'accueil n'utilise pas page-home template, c'est page-daccueil */
body.page-id-2472 .wpb_revslider_element,
body.page-id-2472 .vc_row:first-child {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

body.page-id-2472 .vc_section:first-of-type {
    padding-top: 0 !important;
    margin-top: -5px !important;
}