/*
 * elementor-widgets.css
 * CSS extrait des widgets Elementor custom (VALR-OUTILS)
 * À enqueuer via wp_enqueue_style() dans chaque widget (get_style_depends)
 * ou via un hook global wp_enqueue_scripts.
 *
 * Sources :
 *   - listings-ads.php          → mobile scroll + marchés du jour
 *   - tdf-listeo-single-listing-owner.php → owner box + masquage champs formulaire
 *   - tdf-listeo-single-nearby-advanced.php → nearby grid
 *   - tdf-listeo-simple-slider.php → home search carousel
 */


/* ==========================================================================
   1. LISTINGS WITH ADS — Mobile scroll horizontal
   Source : listings-ads.php → get_style_depends()
   ========================================================================== */

@media (max-width: 767px) {

    .tdf-mobile-scroll .list-layout {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: visible !important;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding-bottom: 20px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .tdf-mobile-scroll .list-layout::-webkit-scrollbar {
        display: none;
    }

    .tdf-mobile-scroll .list-layout .listing-card-container-nl {
        flex: 0 0 82vw !important;
        width: 82vw !important;
        max-width: 82vw !important;
        min-width: 0 !important;
        float: none !important;
        scroll-snap-align: start;
        padding-right: 12px !important;
        box-sizing: border-box !important;
    }

    .tdf-mobile-scroll .list-layout .listing-card-container-nl:last-child {
        padding-right: 0 !important;
    }

    .tdf-mobile-scroll .loader-ajax-container,
    .tdf-mobile-scroll .pagination-container,
    .tdf-mobile-scroll nav.pagination,
    .tdf-mobile-scroll .load-more-button {
        display: none !important;
    }

}


/* ==========================================================================
   2. LISTINGS WITH ADS — Marchés du jour
   Source : listings-ads.php → render() méthode marchés
   ========================================================================== */

.tdf-marches-du-jour {
    margin-bottom: 20px;
}

.tdf-marches-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.tdf-marches-title {
    font-size: .82em;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #475569;
}

.tdf-marches-count {
    font-size: .72em;
    font-weight: 600;
    background: #f1f5f9;
    color: #64748b;
    padding: 2px 8px;
    border-radius: 10px;
}

.tdf-marches-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.tdf-march-card {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 9px;
    padding: 9px 12px;
    text-decoration: none;
    color: inherit;
    transition: box-shadow .15s, transform .15s;
}

a.tdf-march-card:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
    transform: translateY(-1px);
}

.tdf-march-card--ferme {
    opacity: .55;
}

.tdf-march-emoji {
    font-size: 1.25em;
    flex-shrink: 0;
    line-height: 1;
}

.tdf-march-info {
    flex: 1;
    min-width: 0;
}

.tdf-march-nom {
    font-size: .88em;
    font-weight: 600;
    color: #1a202c;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tdf-march-meta {
    font-size: .75em;
    color: #64748b;
    margin-top: 1px;
}

.tdf-march-statut {
    font-size: .72em;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 10px;
    white-space: nowrap;
    flex-shrink: 0;
}

.tdf-march-ouvert {
    background: #dcfce7;
    color: #166534;
}

.tdf-march-avenir {
    background: #dbeafe;
    color: #1e40af;
}

.tdf-march-ferme {
    background: #f1f5f9;
    color: #94a3b8;
}

@media (max-width: 480px) {
    .tdf-march-meta {
        display: none;
    }
}


/* ==========================================================================
   3. LISTING OWNER — Boîte propriétaire / rédaction
   Source : tdf-listeo-single-listing-owner.php → render()
   ========================================================================== */

/* Masquage des champs pré-remplis du formulaire Forminator */
#text-1,
#email-2 {
    display: none !important;
}

.listing-owner-box {
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    padding: 30px;
    background: #fff;
}

.owner-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: .75rem;
}

.owner-avatar {
    min-width: 72px;
}

.owner-avatar img {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    object-fit: contain;
    background: #c5c5c5;
}

.owner-meta h4 {
    margin: 0 0 .25rem;
    font-size: 1em;
}

.owner-subtext {
    margin: 0;
    font-size: .9em;
    color: #666;
    line-height: 1.3em;
}

.owner-contact {
    margin-top: .75em;
}

.owner-contact .button {
    display: inline-block;
    margin-top: .25rem;
    font-size: .9em;
}


/* ==========================================================================
   4. NEARBY LISTINGS — Grille de proximité
   Source : tdf-listeo-single-nearby-advanced.php → render() (layout=grid)
   ========================================================================== */

.listeo-nearby-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
    margin-top: 20px;
}

@media (max-width: 768px) {
    .listeo-nearby-grid {
        grid-template-columns: 1fr;
    }
}


/* ==========================================================================
   5. HOME SEARCH CAROUSEL — Slider de la page d'accueil
   Source : tdf-listeo-simple-slider.php → render()
   ========================================================================== */

.home-search-carousel .home-search-slide {
    background-size: cover;
    background-position: center;
    position: relative;
    color: #fff;
}

.home-search-slider-headlines {
    position: relative;
    padding: 180px 0 160px;
    text-align: center;
}

.home-search-slider-headlines h1 {
    font-size: 3rem;
    margin-bottom: 10px;
}

.home-search-slider-headlines h2 {
    font-size: 1.8rem;
    margin-bottom: 15px;
}

.home-search-slider-headlines .tdf-slide-intro {
    font-size: 1.1rem;
    margin: 0 auto 20px;
    max-width: 720px;
}