/* 
CSS - DEVICE - MOBILE - V1.0
*/ 

/* Definições gerais */   
MAIN {
    max-height: 110px;
}

/* TAGS */
.only-d-desktop {
    display: none  !important
}

.card {
    background-color: white;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.card-shadow {
    background-color: white;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* HEADER */
#ct-e-AppDelivery-LogoBusca {
    margin-top: .5rem !important;
}

#ct-e-boxImagemLogo {
    max-width: 130px;
    max-height: 103px;
    position: relative;
}

.ct-c-imglogoparceiro {
    max-width: 100px;
    max-height: 100px;
    border: 5px solid #FFFFFF;
    margin-left: 3px;
}
/* MENU */
#ct-e-AppDelivery-Menu-Mobile img {
    max-width: 15px
}
#ct-e-AppDelivery-Menu-Mobile li{
    text-align: center;
    font-size: 0.7rem !important;
    line-height: 1 !important;
    margin-bottom: 0 !important;
}

/* Reduz altura do menu mobile */
.footer .list-inline {
    margin-bottom: 0 !important;
}

.footer .list-inline-item {
    padding: 2px 8px !important;
}

.footer .list-inline-item div {
    margin-top: 2px !important;
    font-size: 0.65rem !important;
}
#ct-e-AppDelivery-Menu-Mobile  .badge{
   background-color: #562357;
   color:#FFF
}

/* FOOTER */
.footer {
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 500;
    padding: 5px 0 !important;
    min-height: auto !important;
}

/* SOLUÇÃO PARA SOBREPOSIÇÃO DO MENU INFERIOR */
/* Adiciona padding-bottom ao container principal para evitar sobreposição */
#ct-e-AppDelivery .container {
    padding-bottom: 50px !important;
}

/* Garante que o botão de finalizar pedido tenha z-index maior que o footer */
#ct-e-AppDelivery-Pedido-Bloco .btn-primary {
    position: relative;
    z-index: 600 !important;
}

/* Adiciona margem inferior extra para o último botão de finalizar pedido */
#ct-e-AppDelivery-Pedido-Bloco .card-shadow:last-child {
    margin-bottom: 20px !important;
}

/* SOLUÇÃO ESPECÍFICA PARA PÁGINA DA SACOLA */
/* Quando a página mobile atual for 'sacola', adiciona padding extra */
body[data-page="sacola"] #ct-e-AppDelivery .container,
body[data-page="sacola"] #ct-e-AppDelivery-Pedido-Bloco {
    padding-bottom: 70px !important;
}

/* Garante que o botão de finalizar pedido seja sempre visível na sacola */
#ct-e-AppDelivery-Pedido-Bloco .btn-primary[ng-click*="finalizar"] {
    position: relative;
    z-index: 700 !important;
    margin-bottom: 15px !important;
    min-height: 66px !important; /* Aumentado em 50% */
    font-size: 1.1rem !important; /* Aumentado em 50% + extra para destaque */
    padding: 15px 25px !important; /* Aumentado padding em 50% + extra */
    font-weight: bold !important; /* Deixa o texto em negrito para destaque */
}

/* Adiciona espaço extra antes do footer quando há botões de ação */
#ct-e-AppDelivery-Pedido-Bloco .d-grid:last-child {
    margin-bottom: 30px !important;
}

/* SOLUÇÃO ALTERNATIVA - Detecta quando está na sacola via Angular */
/* Quando paginaMobileAtual for 'sacola', aplica estilos específicos */
#ct-e-AppDelivery-Pedido-Bloco[ng-show*="sacola"] {
    padding-bottom: 60px !important;
}

/* Garante que todos os botões de ação na sacola sejam visíveis */
#ct-e-AppDelivery-Pedido-Bloco .btn-primary {
    position: relative;
    z-index: 600 !important;
    min-height: 66px !important; /* Aumentado em 50% */
    font-size: 1rem !important; /* Aumentado em 50% */
    padding: 12px 20px !important; /* Aumentado padding em 50% */
}

/* Adiciona margem inferior extra para o container da sacola */
#ct-e-AppDelivery-Pedido-Bloco {
    margin-bottom: 50px !important;
}

/* Quando há múltiplos botões de ação, garante espaçamento adequado */
#ct-e-AppDelivery-Pedido-Bloco .card-shadow:last-child .d-grid {
    margin-bottom: 20px !important;
}

/* SOLUÇÃO FINAL - Detecta automaticamente quando está na sacola */
/* Quando o container da sacola está visível, aplica padding extra */
#ct-e-AppDelivery .container:has(#ct-e-AppDelivery-Pedido-Bloco[ng-show*="sacola"]) {
    padding-bottom: 70px !important;
}

/* Alternativa para navegadores que não suportam :has() */
#ct-e-AppDelivery-Pedido-Bloco[ng-show*="sacola"] ~ .footer {
    margin-top: 100px !important;
}

/* Garante que o botão de finalizar pedido seja sempre clicável */
#ct-e-AppDelivery-Pedido-Bloco .btn-primary {
    position: relative;
    z-index: 600 !important;
    min-height: 66px !important; /* Aumentado em 50% de 44px para 66px */
    font-size: 1rem !important; /* Aumentado em 50% de 0.66rem para 1rem */
    padding: 12px 20px !important; /* Aumentado padding em 50% */
}

/* Adiciona espaço extra antes do footer quando há botões de ação */
#ct-e-AppDelivery-Pedido-Bloco .d-grid:last-child {
    margin-bottom: 30px !important;
    padding-bottom: 10px !important;
}

/* SOLUÇÃO SIMPLIFICADA E EFICAZ */
/* Garante que o container da sacola tenha espaço suficiente */
#ct-e-AppDelivery-Pedido-Bloco {
    padding-bottom: 60px !important;
}

/* Garante que o botão de finalizar pedido seja sempre visível */
#ct-e-AppDelivery-Pedido-Bloco .btn-primary {
    position: relative;
    z-index: 600 !important;
    margin-bottom: 20px !important;
}

/* Adiciona espaço extra antes do footer */
.footer {
    margin-top: 20px !important;
}

/* MODAL */
.modal-header {
    background: #562357;
    justify-content: left;
    color: #FFF;
    font-size: 16px;
}

.modal-header IMG, .barra-mobile IMG { 
    width: 21px;
    margin-right: 15px
}

/* INFORMAÇÕES DO PARCEIRO */
#ct-e-AppDelivery-Informacoes-Nome, #ct-e-AppDelivery-Informacoes-Endereco {
    text-align: center;
}
/* INFORMAÇÕES DO PARCEIRO FIM */

/* FALE CONOSCO */
#ct-e-AppDelivery-FaleConosco .ct-e-iconeTelefone {
    max-width: 15px;
}
/* FALE CONOSCO FIM*/

/* BARRA PARA PÁGINAS MOBILE */
.barra-mobile {
    background: #562357;
    justify-content: left;
    color: #FFF;
    font-size: 16px !important;
}
.barra-mobile .titulo{
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
}
/* BARRA PARA PÁGINAS MOBILE FIM */

/* BLOCO DE PEDIDOS */
#ct-e-AppDelivery-Pedido-Bloco {
    margin-top: 50px !important
}
.box-endereco.selecionado .checkcontainer .checkmark:after {
    top: 0px;
    left: 35%;
}
/* BLOCO DE PEDIDOS FIM */

/* PEDIDOS LISTA */
#ct-e-AppDelivery-PedidosListar .btn {
    width: 100%
}

#ct-e-AppDelivery-PedidosListar .bt-close {
    font-family: "Gotham-Bold";
    width: 1.5rem;
    color: #249ECD;
    background-color: transparent;
    border-color: transparent;
    padding: 0px !important;
    font-weight: bold;
    font-size: 1.3rem;
    margin-top: -0.3rem;
}

/* CARDÁPIO */
#ct-e-boxBusca-Resultado {
    margin-top: 100px;
}
/* CARDÁPIO FIM*/

/* COMPONENTE DE USUÁRIO - MOBILE */
@media (max-width: 768px) {
    .user-welcome-card {
        padding: 6px 8px !important;
        margin-right: 4px !important;
        border-radius: 8px !important;
    }
    
    .user-icon {
        width: 22px !important;
        height: 22px !important;
    }
    
    .user-icon i {
        font-size: 0.8rem !important;
    }
    
    .welcome-label {
        font-size: 0.6rem !important;
    }
    
    .user-name {
        font-size: 0.75rem !important;
    }
    
    .user-welcome-content {
        gap: 6px !important;
    }
    
    .user-welcome-text {
        gap: 4px !important;
    }
    
    .user-actions {
        margin-left: 4px !important;
    }
    
    .btn-logout {
        width: 18px !important;
        height: 18px !important;
        padding: 2px 3px !important;
    }
    
    .btn-logout i {
        font-size: 0.65rem !important;
    }
}

/* BOTÃO FINALIZAR PEDIDO - AUMENTADO EM 50% */
#ct-e-AppDelivery-Pedido-Bloco .btn-primary[ng-click*="finalizar"],
#ct-e-AppDelivery-Pedido-Bloco .btn-primary[ng-click*="finalizarPedido"],
#ct-e-AppDelivery-Pedido-Bloco .btn-primary[ng-click*="finalizarPedidoNaoLogado"] {
    min-height: 66px !important;
    font-size: 1.1rem !important;
    padding: 15px 25px !important;
    font-weight: bold !important;
    margin-bottom: 20px !important;
}