/* Customização de Setas do Carrossel - Painel LI */

/* Posicionamento Externo Inteligente */

/* IMPORTANTE: Mantém os slides ocultos */
.slick-list {
    overflow: hidden !important;
}


/* Modo Smart: Usa pseudo-elementos para criar espaço visual */
.slick-slider {
    position: relative !important;
}

/* Cria espaço visual sem alterar largura do carrossel */
.slick-slider::before,
.slick-slider::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 70px !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.slick-slider::before {
    left: -70px !important;
}

.slick-slider::after {
    right: -70px !important;
}


.slick-prev,
.slick-next {
    width: 50px !important;
    height: 50px !important;
    z-index: 999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #ffffff !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.2) !important;
    transition: all 0.3s ease !important;
    opacity: 1 !important;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin-top: 0 !important;
}

.slick-prev {
    left: -50px !important;
}

.slick-next {
    right: -50px !important;
}

.slick-prev svg,
.slick-next svg {
    display: none !important;
}

.slick-prev:before {
    content: '' !important;
    display: block !important;
    width: 60% !important;
    height: 60% !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 6L9 12L15 18' stroke='%230888cd' stroke-width='1' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.slick-next:before {
    content: '' !important;
    display: block !important;
    width: 60% !important;
    height: 60% !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6L15 12L9 18' stroke='%230888cd' stroke-width='1' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.slick-prev:hover,
.slick-next:hover {
    opacity: 1 !important;
    transform: translateY(-50%) scale(1.1) !important;
    background: #f0f0f0 !important;
}



/* Painel do Header - Gerado pelo Painel LI */

/* Botão 1 - Atendimento */

.painel-atendimento .a {
    background: rgb(0 0 0 / 0%) !important;
    border: 2px solid rgba(255, 255, 255, 10%) !important;
    border-radius: 11px !important;
    padding: 20px 16px !important;
    transition: all 0.3s ease !important;
}

.painel-atendimento .a:hover {
    background: #06D28E !important;
    color: #000000 !important;
    border-color: #06D28E !important;
}

.painel-atendimento .a:hover svg,
.painel-atendimento .a:hover svg path {
    fill: #000000 !important;
}


/* Botão 2 - Login/Cadastro */

/* Mobile - Esconde o botão da barra superior */
@media (max-width: 767px) {
    .painel-conta.painel-item {
        display: none !important;
    }
}

.painel-conta .a {
    background: rgb(0 0 0 / 0%) !important;
    border: 2px solid rgba(255, 255, 255, 10%) !important;
    border-radius: 10px !important;
    padding: 20px !important;
    transition: all 0.3s ease !important;
}

.painel-conta .a:hover {
    background: transparent !important;
    color: #ffffff !important;
    border-color: #06D28E !important;
}

.painel-conta .a:hover svg,
.painel-conta .a:hover svg path {
    fill: #ffffff !important;
}


/* Carrinho */

.painel .carrinho > a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: #06D28E !important;
    width: 68px !important;
    height: 68px !important;
    border-radius: 11px !important;
    position: relative !important;
}

.painel .carrinho > a svg {
    fill: #000000 !important;
    width: 28px !important;
    height: 28px !important;
}

.painel .carrinho > a strong,
.painel .carrinho > a .qtd-carrinho {
    background-color: #000000 !important;
    color: #FFFFFF !important;
    width: 25px !important;
    height: 25px !important;
    border-radius: 50% !important;
    position: absolute !important;
    top: 7px !important;
    right: 6px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 13px !important;
    font-weight: bold !important;
    line-height: 1 !important;
}