/**
 * TurboJet - Estilos para o Shortcode [tj_carrossel_posts]
 *
 * @version 1.4.0
 * @package TurboJet
 */

.tj-posts-carousel-wrapper {
    position: relative;
    margin: 20px 0;
    padding: 10px 45px;
}

.tj-carousel-track {
    display: flex;
}

.tj-carousel-slide {
    height: auto; /* Altura padrão para o modo galeria, que se ajusta ao conteúdo */
    display: flex;
    align-items: stretch;
}

/* CORREÇÃO: Aplica uma altura fixa ao slide apenas no modo destaque */
.tj-posts-carousel-wrapper.modo-destaque .tj-carousel-slide {
    height: var(--tj-carousel-destaque-height, 400px); /* Usa a variável do PHP com um fallback */
}

.tj-carousel-slide .tj-post-card {
    width: 100%;
}

/* --- Controles de Navegação: Setas --- */
.tj-carousel-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: var(--tj-arrow-bg-color, rgba(0, 0, 0, 0.5));
    color: var(--tj-arrow-icon-color, #fff);
    border: none;
    padding: 0;
    width: var(--tj-arrow-size, 44px);
    height: var(--tj-arrow-size, 44px);
    border-radius: 50%;
    cursor: pointer;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s ease;
    overflow: hidden;
}

.tj-carousel-arrow:hover {
    background-color: rgba(0, 0, 0, 0.8);
}

.tj-carousel-arrow::after {
    display: none !important;
}

.swiper-button-prev.tj-carousel-arrow {
    left: 0px;
}

.swiper-button-next.tj-carousel-arrow {
    right: 0px;
}

.tj-carousel-arrow svg {
    width: 60%;
    height: 60%;
    fill: currentColor;
}
.tj-carousel-arrow img {
    width: 100%;
    height: 100%;
    object-fit: contain; 
}

.swiper-button-disabled {
    opacity: 0.3;
    cursor: not-allowed !important;
}

/* --- Controles de Navegação: Pontos --- */
.swiper-pagination.tj-carousel-dots {
    position: static;
    margin-top: 25px;
}

.swiper-pagination-bullet {
    background-color: #ccc;
    width: 12px;
    height: 12px;
    opacity: 0.8;
}

.swiper-pagination-bullet-active {
    background-color: #555;
    opacity: 1;
}
