/* Toute la vignette annonce est cliquable sur la liste publique. */
.ecig-list-card-clickable {
    cursor: pointer !important;
}

/* Ecig-Occaz — lazy loading léger de /annonces/ */

.ecig-adverts-lazy-sentinel {
    clear: both;
    width: 100%;
    height: 1px;
    pointer-events: none;
}

/* Texte uniquement pour les lecteurs d'écran. */
.ecig-adverts-lazy-status {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* La pagination reste dans le HTML pour le SEO / no-JS et n'est masquée
 * qu'une fois IntersectionObserver réellement actif. */
html.ecig-adverts-lazy-active .adverts-pagination,
html.ecig-adverts-lazy-active .wpadverts-pagination {
    display: none !important;
}

/* Skeleton : on clone la vraie carte afin de conserver exactement sa taille,
 * ses colonnes et les overrides Design Hub. */
.ecig-lazy-skeleton {
    position: relative !important;
    overflow: hidden !important;
    pointer-events: none !important;
    user-select: none !important;
}

.ecig-lazy-skeleton.advert-is-featured::before,
.ecig-lazy-skeleton.advert-is-featured::after,
.ecig-lazy-skeleton.featured::before,
.ecig-lazy-skeleton.featured::after,
.ecig-lazy-skeleton.adverts-featured::before,
.ecig-lazy-skeleton.adverts-featured::after {
    content: none !important;
}

.ecig-lazy-skeleton > *:not(.ecig-lazy-skeleton-ui) {
    opacity: 0 !important;
}

.ecig-lazy-skeleton .ecig-lazy-skeleton-ui {
    position: absolute !important;
    inset: 0 !important;
    z-index: 60 !important;
    pointer-events: none !important;
}

.ecig-lazy-skeleton .ecig-lazy-skeleton-ui::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    background:
        linear-gradient(rgba(35, 42, 55, .075), rgba(35, 42, 55, .075)) 0 0 / 100% 68% no-repeat,
        linear-gradient(rgba(35, 42, 55, .075), rgba(35, 42, 55, .075)) 16px calc(68% + 16px) / 68% 12px no-repeat,
        linear-gradient(rgba(35, 42, 55, .06), rgba(35, 42, 55, .06)) 16px calc(68% + 39px) / 43% 10px no-repeat,
        rgba(255, 255, 255, .78) !important;
}

.ecig-lazy-skeleton .ecig-lazy-skeleton-ui::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    transform: translateX(-100%);
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255, 255, 255, .12) 36%,
        rgba(255, 255, 255, .58) 50%,
        rgba(255, 255, 255, .12) 64%,
        transparent 100%
    ) !important;
    animation: ecigLazyShimmer 1.35s ease-in-out infinite;
}

/* Entrée très légère des cartes réellement reçues. */
.adverts-list > .advert-item,
.wpa-block-list-results > .wpa-result-item {
    transition: opacity .18s ease, transform .18s ease;
}

.ecig-lazy-item-enter {
    opacity: .01 !important;
    transform: translateY(4px) !important;
}

@keyframes ecigLazyShimmer {
    100% {
        transform: translateX(100%);
    }
}

@media (prefers-reduced-motion: reduce) {
    .ecig-lazy-skeleton .ecig-lazy-skeleton-ui::after {
        animation: none !important;
        display: none !important;
    }

    .adverts-list > .advert-item,
    .wpa-block-list-results > .wpa-result-item {
        transition: none !important;
    }
}