/*
 * owl-caroussel-prod.css
 * Fichier unique de personnalisation des carrousels Owl Carousel
 * Regroupe les règles dispersées dans chasseaddict.css, stylesheet.css et owl.carousel.min.css
 *
 * PERSONNALISATION : modifier les variables ci-dessous
 */

/* ============================================================
   VARIABLES — couleurs personnalisables
   ============================================================ */
:root {
    /* Boutons prev / next */
    --owl-btn-bg          : #ffffff;       /* fond bouton */
    --owl-btn-color       : #016734;       /* icône / texte bouton */
    --owl-btn-border      : #e8e8e8;       /* bordure bouton */
    --owl-btn-bg-hover    : #222;       /* fond bouton au survol */
    --owl-btn-color-hover : #ffffff;       /* icône / texte bouton au survol */

    /* Bordure des items produit */
    --owl-item-border         : #d3d3d3;   /* bordure item */
    --owl-item-border-hover   : #016734;   /* bordure item au survol */
    --owl-item-radius         : 15px;      /* rayon des coins */
}


/* ============================================================
   1. BASE LIBRARY — owl.carousel.min.css (source officielle)
   ============================================================ */
.owl-carousel,
.owl-carousel .owl-item {
    -webkit-tap-highlight-color: transparent;
    position: relative;
}
.owl-carousel {
    display: none;
    width: 100%;
    z-index: 1;
}
.owl-carousel .owl-stage {
    position: relative;
    -ms-touch-action: pan-Y;
}
.owl-carousel .owl-stage:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.owl-carousel .owl-stage-outer {
    position: relative;
    overflow: hidden;
    -webkit-transform: translate3d(0, 0, 0);
}
.owl-carousel .owl-item {
    min-height: 1px;
    float: left;
    -webkit-backface-visibility: hidden;
    -webkit-touch-callout: none;
}
.owl-carousel .owl-item img {
    display: block;
    width: 100%;
    height: auto;
}

/* Hauteur uniforme — ciblage du .image DIRECT de .product-thumb uniquement */
.owl-carousel .product-thumb > .image {
    height: 220px;
    overflow: hidden;
    background-color: #fff;
}
.owl-carousel .product-thumb > .image > a {
    display: block;
    width: 100%;
    height: 100%;
}
/* thumbnail-container : position:relative + overflow:hidden pour l'effet hover */
.owl-carousel .product-thumb > .image .thumbnail-container {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    background-color: #fff;
}
/* Les wrappers internes (product-visuel + .image imbriqués) sont transparents */
.owl-carousel .product-thumb > .image .product-visuel,
.owl-carousel .product-thumb > .image .product-visuel > .image {
    display: block;
    width: 100%;
}
/* picture : block pour éviter l'espace inline */
.owl-carousel .product-thumb > .image picture {
    display: block;
    width: 100%;
}
/* Hauteur fixe sur l'img — ne dépend pas d'un height:100% en cascade */
.owl-carousel .product-thumb > .image img {
    display: block;
    width: 100%;
    height: 220px;
    object-fit: contain;
    object-position: center;
    background-color: #fff;
}
/* Neutralise le skeleton lazyload dans le carousel */
.owl-carousel .product-thumb > .image .lazyload,
.owl-carousel .product-thumb > .image .lazyloading {
    min-height: 0 !important;
    background: #fff !important;
    animation: none !important;
}
.owl-carousel .owl-dots.disabled,
.owl-carousel .owl-nav.disabled { display: none; }

.no-js .owl-carousel,
.owl-carousel.owl-loaded { display: block; }

.owl-carousel .owl-dot,
.owl-carousel .owl-nav .owl-next,
.owl-carousel .owl-nav .owl-prev {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.owl-carousel.owl-loading  { opacity: 0; display: block; }
.owl-carousel.owl-hidden   { opacity: 0; }
.owl-carousel.owl-refresh .owl-item { visibility: hidden; }
.owl-carousel.owl-drag .owl-item {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.owl-carousel.owl-grab  { cursor: grab; }
.owl-carousel.owl-rtl   { direction: rtl; }
.owl-carousel.owl-rtl .owl-item { float: right; }

/* Animations */
.owl-carousel .animated                { animation-duration: 1s; animation-fill-mode: both; }
.owl-carousel .owl-animated-in         { z-index: 0; }
.owl-carousel .owl-animated-out        { z-index: 1; }
.owl-carousel .fadeOut                 { animation-name: fadeOut; }
@keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } }

.owl-height { transition: height .5s ease-in-out; }

/* Lazy load */
.owl-carousel .owl-item .owl-lazy     { opacity: 0; transition: opacity .4s ease; }
.owl-carousel .owl-item img.owl-lazy  { transform-style: preserve-3d; }

/* Video */
.owl-carousel .owl-video-wrapper      { position: relative; height: 100%; background: #000; }
.owl-carousel .owl-video-play-icon    {
    position: absolute; height: 80px; width: 80px;
    left: 50%; top: 50%; margin-left: -40px; margin-top: -40px;
    background: url(owl.video.play.png) no-repeat;
    cursor: pointer; z-index: 1;
    transition: transform .1s ease;
}
.owl-carousel .owl-video-play-icon:hover { transform: scale(1.3, 1.3); }
.owl-carousel .owl-video-playing .owl-video-play-icon,
.owl-carousel .owl-video-playing .owl-video-tn { display: none; }
.owl-carousel .owl-video-tn   {
    opacity: 0; height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: opacity .4s ease;
}
.owl-carousel .owl-video-frame { position: relative; z-index: 1; height: 100%; width: 100%; }


/* ============================================================
   2. POSITIONNEMENT DES DOTS ET NAV (surcharge library)
      — issu de owl.carousel.min.css (bas de fichier)
   ============================================================ */
.owl-carousel .owl-dot,
.owl-carousel .owl-nav .owl-next,
.owl-carousel .owl-nav .owl-prev { position: absolute; top: 50%; }
.owl-carousel .owl-nav .owl-next { right: -10px; }
.owl-carousel .owl-nav .owl-prev { left: -10px; }


/* ============================================================
   3. ITEMS PRODUIT — bordure et style des cartes
      — issu de stylesheet.css (lignes 850-862)
   ============================================================ */
.owl-carousel                           { margin-bottom: 20px; }
.owl-carousel .product-thumb .image     { margin-bottom: 5px; }
.owl-carousel .product-thumb {
    padding: 7.5px;
    margin: 0 7.5px;
    position: relative;
    text-align: center;
    border: 1px solid var(--owl-item-border);
    border-radius: var(--owl-item-radius) !important;
}
@media only screen and (min-width: 1025px) {
    .owl-carousel .product-thumb:hover { border-color: var(--owl-item-border-hover); }
}

/* Liens dans le carousel */
.owl-carousel a,
.btn-action a { color: #000 !important; }
.owl-carousel a:hover { color: #222 !important; }


/* ============================================================
   4. BOUTONS PREV / NEXT — style et positionnement
      — issu de chasseaddict.css (lignes 1796-1825)
   ============================================================ */
/* .owl-nav en overlay sur toute la hauteur du carousel (qui est position:relative) */
.owl-nav {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    pointer-events: none; /* ne bloque pas les clics sur les items */
}

.owl-prev,
.owl-next {
    pointer-events: all;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.4em;
    background-color: var(--owl-btn-bg);
    color: var(--owl-btn-color);
    border-radius: 50% !important;
    height: 40px;
    width: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--owl-btn-border);
    transition: all 0.3s ease;
}
.owl-prev.disabled,
.owl-next.disabled { display: none; }

.owl-prev { left: -15px; }
.owl-next { right: -15px; }

.owl-prev:hover,
.owl-next:hover {
    color: var(--owl-btn-color-hover);
    background-color: var(--owl-btn-bg-hover);
    border-color: var(--owl-btn-bg-hover);
}

/* Boutons du slider single (ancienne classe owl v1) */
.owl-carousel.single-slider .owl-controls .owl-buttons .owl-next:hover,
.owl-carousel.single-slider .owl-controls .owl-buttons .owl-prev:hover {
    background-color: var(--owl-btn-bg-hover);
}


/* ============================================================
   5. CAROUSEL VENTE FLASH
      — issu de chasseaddict.css (lignes 1251-1304)
   ============================================================ */
.owl-carousel-VenteFlash .IconeVenteFlash {
    position: absolute;
    right: 0;
    top: 0;
}
.owl-carousel-VenteFlash .ChronoVenteFlash {
    position: absolute;
    background-color: rgba(0, 0, 0, 0.8);
    top: 30px;
    left: 0;
    color: #fff;
    padding: 5px;
    font-size: 13px;
}
.ChronoVenteFlash {
    background-color: rgba(0, 0, 0, 0.8);
    color: #fff;
    padding: 5px;
    font-size: 12px;
    width: auto;
}
.owl-carousel-VenteFlash h4 {
    position: absolute;
    background-color: rgba(0, 0, 0, 0.8);
    top: 240px;
    left: 0;
    width: 100%;
    text-align: center;
    color: #fff;
}
.owl-carousel-VenteFlash h4 a,
.owl-carousel-VenteFlash h4 a:link {
    width: 100%;
    text-align: center;
    color: #fff;
}
.owl-carousel-VenteFlash .price {
    position: absolute;
    background-color: #f58632;
    bottom: 10px;
    left: 0;
    width: 100%;
    text-align: center;
    color: #fff;
    font-size: 15px;
    font-weight: 100;
    padding: 8px 0;
}
.owl-carousel-VenteFlash .product-thumb:hover { border: 3px solid transparent; }


/* ============================================================
   6. CAROUSEL — règles liées aux grilles produit
      — issu de stylesheet.css (lignes 976-985)
   ============================================================ */
.product-grid .product-thumb .description,
.product-grid .product-thumb .price-tax,
.owl-carousel .product-thumb .price-tax { display: none; }

.product-grid .product-thumb .button-group .add-to-links button,
.owl-carousel .product-thumb .button-group .add-to-links button {
    /* défini dans les règles globales du theme */
}
.product-grid .product-thumb .button-group .add-to-links,
.owl-carousel .product-thumb .button-group .add-to-links { visibility: hidden; }

.product-grid:hover .product-thumb .button-group .add-to-links,
.owl-carousel .product-thumb:hover .button-group .add-to-links { visibility: visible; }


/* ============================================================
   7. CAROUSEL — règles Bootstrap carousel (caption, controls)
      — issu de stylesheet.css (lignes 865-873)
   ============================================================ */
.carousel-caption {
    color: #fff;
    text-shadow: 0 1px 0 #000;
}
.carousel-control .icon-prev:before { content: '\f053'; }
.carousel-control .icon-next:before { content: '\f054'; }


/* ============================================================
   8. RESPONSIVE
   ============================================================ */
@media (max-width: 480px) {
    .owl-carousel .product-thumb { padding: 0; margin: 0; }
    .owl-prev { left: 5px; }
    .owl-next { right: 5px; }
}



/* image de la fiche produit */
#PageFicheProduit .owl-carousel .product-thumb {border:0px!important;}