/* ============================================================
   Kubi Banniere Taxo - Style Frontend
   ============================================================ */

.kubi-ban-taxo {
    position   : relative;
    width      : 100%;
    overflow   : hidden;
    display    : flex;
    align-items: center;
    box-sizing : border-box;
}

/* ---- Mode ACF : image en background-image sur le wrapper -- */
.kubi-ban-taxo--acf {
    background-repeat  : no-repeat;
}

/* ---- Slider background (mode normal) ---------------------- */
.kubi-ban-taxo__bg {
    position: absolute;
    inset   : 0;
    z-index : 0;
    width   : 100%;
    height  : 100%;
}

.kubi-ban-taxo__bg .swiper-wrapper,
.kubi-ban-taxo__bg .swiper-slide {
    width : 100%;
    height: 100%;
}

.kubi-ban-taxo__slide-img {
    width              : 100%;
    height             : 100%;
    background-size    : cover;
    background-position: center;
    background-repeat  : no-repeat;
}

.kubi-ban-taxo__slide-placeholder {
    width     : 100%;
    height    : 100%;
    background: #2a2a2a;
}

/* ---- Overlay ---------------------------------------------- */
.kubi-ban-taxo__overlay {
    position      : absolute;
    inset         : 0;
    z-index       : 1;
    pointer-events: none;
}

/* ---- Contenu (InnerBlocks) -------------------------------- */
.kubi-ban-taxo__content {
    position  : relative;
    z-index   : 2;
    width     : 100%;
    padding   : 60px 40px;
    box-sizing: border-box;
}

.kubi-ban-taxo__content--left   { text-align: left;   }
.kubi-ban-taxo__content--center { text-align: center; }
.kubi-ban-taxo__content--right  { text-align: right;  }

.kubi-ban-taxo__content h1,
.kubi-ban-taxo__content h2,
.kubi-ban-taxo__content h3,
.kubi-ban-taxo__content p,
.kubi-ban-taxo__content a {
    color: #ffffff;
}

/* ---- Controleurs ------------------------------------------ */
.kubi-ban-taxo__controls {
    position       : absolute;
    bottom         : 24px;
    left           : 0;
    right          : 0;
    z-index        : 3;
    display        : flex;
    align-items    : center;
    justify-content: center;
    gap            : 16px;
}

.kubi-ban-taxo__arrow {
    display        : flex;
    align-items    : center;
    justify-content: center;
    width          : 42px;
    height         : 42px;
    border-radius  : 50%;
    border         : 2px solid rgba(255,255,255,0.6);
    background     : rgba(0,0,0,0.3);
    color          : #ffffff;
    cursor         : pointer;
    padding        : 0;
    flex-shrink    : 0;
    transition     : background 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}

.kubi-ban-taxo__arrow:hover {
    background  : rgba(255,255,255,0.2);
    border-color: #ffffff;
    transform   : scale(1.08);
}

.kubi-ban-taxo__arrow:disabled,
.kubi-ban-taxo__arrow.swiper-button-disabled {
    opacity       : 0.35;
    pointer-events: none;
}

.kubi-ban-taxo__arrow svg {
    width  : 18px;
    height : 18px;
    display: block;
}

.kubi-ban-taxo__dots {
    display    : flex;
    align-items: center;
    gap        : 8px;
}

.kubi-ban-taxo__dots .swiper-pagination-bullet {
    width      : 10px;
    height     : 10px;
    border-radius: 50%;
    background : rgba(255,255,255,0.5);
    opacity    : 1;
    cursor     : pointer;
    transition : background 0.25s ease, transform 0.25s ease;
    display    : inline-block;
    margin     : 0 !important;
}

.kubi-ban-taxo__dots .swiper-pagination-bullet-active {
    background: #ffffff;
    transform : scale(1.3);
}

/* ---- Responsive ------------------------------------------- */
@media (max-width: 767px) {
    .kubi-ban-taxo__content {
        padding: 40px 20px;
    }
    .kubi-ban-taxo__controls {
        bottom: 16px;
        gap   : 12px;
    }
    .kubi-ban-taxo__arrow {
        width : 36px;
        height: 36px;
    }
}
