/**
 * Override da Paleta de Cores - Congas Lafaiete NGC
 * Este arquivo força a aplicação da nova paleta em todos os elementos
 * 
 * @author Roka Digital - https://rokadigital.com.br/contato/
 * @version 1.0 - Nova Paleta NGC
 */

/* === OVERRIDE DE CORES ESPECÍFICAS === */

/* Botões de produtos */
.btn-pedido-detalhado,
.btn-pedido-detalhado:not(:hover) {
    background: #204b9b !important;
    border-color: #204b9b !important;
    color: #ffffff !important;
}

.btn-pedido-detalhado:hover {
    background: #70b73e !important;
    border-color: #70b73e !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(112, 183, 62, 0.3) !important;
    transform: translateY(-2px) !important;
}

/* Links e elementos com cor vermelha antiga */
.ver-detalhes:hover,
.section-title,
.produto-preco {
    color: #f07e13 !important;
}

/* Fundo limpo para imagens dos produtos */
.produto-img-container {
    background: #ffffff !important;
}

/* Centralizar botões dos produtos */
.produto-acoes {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    gap: 8px !important;
    padding: 16px !important;
    width: 100% !important;
}

.produto-acoes .btn {
    width: 85% !important;
    max-width: 200px !important;
    margin: 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

/* Forçar centralização com máxima especificidade */
.produto-card .produto-acoes {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.produto-card .produto-acoes .btn {
    margin-left: auto !important;
    margin-right: auto !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    position: relative !important;
}

/* Cards de produtos hover */
.produto-card:hover {
    border-color: #f07e13 !important;
    box-shadow: 0 20px 40px rgba(240, 126, 19, 0.15) !important;
}

/* Header */
.header {
    background: #ffffff !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1) !important;
}

/* Navegação do Header */
.nav-link {
    color: #000000 !important;
}

.nav-link:hover {
    color: #000000 !important;
    background-color: rgba(240, 126, 19, 0.15) !important;
}

.logo {
    color: #000000 !important;
}

.mobile-menu-btn {
    color: #000000 !important;
}

/* Hero Section - Tela Toda */
.hero {
    background: url('/assets/img/hero-congaslafaiete.webp?v=1') no-repeat center top !important;
    background-size: cover !important;
    background-attachment: scroll !important;
    background-position: center 20% !important;
    min-height: 70vh !important;
    padding: 60px 0 40px 0 !important;
    width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.hero-image {
    background: url('/assets/img/hero-congaslafaiete.webp?v=1') no-repeat !important;
    background-size: cover !important;
    background-position: center 20% !important;
    width: 100% !important;
}

/* Container do hero centralizado */
.hero .container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    position: relative !important;
    z-index: 2 !important;
}

/* Ícones de contato - Nova paleta */
.phone-card .contato-card-icon,
.location-card .contato-card-icon,
.schedule-card .contato-card-icon {
    background: #204b9b !important;
    color: #ffffff !important;
}

.whatsapp-card .contato-card-icon {
    background: #25D366 !important;
    color: #ffffff !important;
}

/* Botão GPS */
.btn-gps {
    background: #70b73e !important;
    border-color: #70b73e !important;
    color: #ffffff !important;
}

.btn-gps:hover {
    background: #5a9632 !important;
    border-color: #5a9632 !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(112, 183, 62, 0.3) !important;
}

/* Botões hero */
.btn-phone,
.hero-buttons .btn-phone {
    background: #f07e13 !important;
}

.btn-phone:hover,
.hero-buttons .btn-phone:hover {
    background: #204b9b !important;
    border-color: #204b9b !important;
}

/* Card Nossa Localização */
.map-header {
    background: #204b9b !important;
    color: #ffffff !important;
    text-align: center !important;
    padding: 20px !important;
    border-radius: 12px 12px 0 0 !important;
}

.map-header h3 {
    color: #ffffff !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    margin: 0 !important;
    font-size: 1.4rem !important;
}

.map-header p {
    color: #ffffff !important;
    text-align: center !important;
    margin: 8px 0 0 0 !important;
    opacity: 0.9 !important;
}

.map-header i {
    color: #ffffff !important;
    font-size: 1.2rem !important;
}

/* Footer - Nova paleta */
.footer {
    background: #70b73e !important;
    color: #ffffff !important;
}

/* Linha final do rodapé */
.footer-bottom,
.footer-copyright {
    background: #204b9b !important;
    color: #ffffff !important;
    border-top: 2px solid #204b9b !important;
}

.footer-contact-item i {
    background: #ffffff !important;
    color: #70b73e !important;
}

.footer-contact-item:hover {
    color: #ffffff !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 25px rgba(112, 183, 62, 0.3) !important;
}

.footer-contact-item:hover i {
    background: #204b9b !important;
    color: #ffffff !important;
}

.footer-contact-item a:hover {
    color: #ffffff !important;
}

/* Elementos com texto secundário */
.section-subtitle,
.produto-descricao,
.contato-card-content p {
    color: #696969 !important;
}

/* Elementos com texto principal */
.section-title,
.hero-title,
.footer-title {
    color: #333333 !important;
}

/* ===== RESPONSIVIDADE MOBILE CORRIGIDA ===== */
@media (max-width: 768px) {
    
    /* Reset geral mobile */
    body {
        overflow-x: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    /* Header mobile simples - como na referência */
    .header {
        position: relative !important;
        width: 100vw !important;
        background: #ffffff !important;
        padding: 15px 0 !important;
        margin: 0 !important;
        box-shadow: none !important;
        z-index: 100 !important;
    }
    
    .header .container {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        padding: 0 20px !important;
        text-align: center !important;
    }
    
    .header-container {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }
    
    .logo {
        text-align: center !important;
    }
    
    .logo img {
        max-height: 50px !important;
        margin: 0 auto !important;
    }
    
    /* Esconder menu mobile */
    .mobile-menu-btn,
    .nav-menu {
        display: none !important;
    }
    
    /* Todas as seções - largura total */
    .section,
    .hero,
    .produtos,
    .contato,
    .footer,
    .site-footer {
        width: 100vw !important;
        position: relative !important;
        left: 50% !important;
        right: 50% !important;
        margin-left: -50vw !important;
        margin-right: -50vw !important;
    }
    
    /* Containers centralizados */
    .container {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        padding: 0 20px !important;
        box-sizing: border-box !important;
        text-align: center !important;
    }
    
    /* Hero mobile altura otimizada */
    .hero {
        min-height: 70vh !important;
        padding: 30px 0 20px 0 !important;
        background-position: center 30% !important;
        margin-top: 0 !important;
    }
    
    .hero .container {
        padding: 15px 20px !important;
        margin-top: 0 !important;
    }
    
    .hero-content {
        margin-top: 0 !important;
        padding-top: 10px !important;
    }
    
    .hero-title {
        font-size: 1.6rem !important;
        line-height: 1.2 !important;
        text-align: center !important;
        padding: 0 10px !important;
        word-wrap: break-word !important;
    }
    
    /* Botões hero altura otimizada */
    .hero-buttons {
        gap: 14px !important;
        margin-top: 15px !important;
        padding: 0 30px !important;
    }
    
    .hero-buttons .btn {
        width: 100% !important;
        max-width: 200px !important;
        padding: 8px 16px !important;
        font-size: 1rem !important;
        border-radius: 5px !important;
        font-weight: 700 !important;
        letter-spacing: 0.3px !important;
        text-transform: none !important;
        line-height: 1.2 !important;
    }
    
    /* Produtos mobile centralizados */
    .produtos .section-title {
        font-size: 1.8rem !important;
        text-align: center !important;
    }
    
    .produtos-grid {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 25px !important;
        width: 100% !important;
        margin: 0 auto !important;
    }
    
    .produto-card {
        width: 100% !important;
        max-width: 320px !important;
        margin: 0 auto !important;
        display: block !important;
    }
    
    /* Botões produtos mesmo padrão do hero */
    .produto-card .produto-acoes .btn {
        width: 90% !important;
        max-width: 200px !important;
        font-size: 0.9rem !important;
        padding: 8px 16px !important;
        font-weight: 600 !important;
        line-height: 1.2 !important;
        border-radius: 5px !important;
    }
    
    /* Contato mobile - padding interno máximo */
    .contato {
        padding: 40px 0 200px 0 !important;
    }
    
    .contato-cards {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 25px !important;
        width: 100% !important;
        margin: 0 auto !important;
    }
    
    .contato-card {
        width: 100% !important;
        max-width: 320px !important;
        margin: 0 auto !important;
        text-align: center !important;
        display: block !important;
    }
    
    .contato-card-content {
        padding: 20px !important;
    }
    
    /* Títulos dos cards destacados */
    .contato-card h3,
    .contato-card .contato-title {
        font-size: 1.3rem !important;
        font-weight: 700 !important;
        margin-bottom: 12px !important;
        color: #333333 !important;
    }
    
    /* Conteúdo dos cards - fonte maior */
    .contato-card p,
    .contato-card .contato-value,
    .contato-card .contato-info {
        font-size: 1.1rem !important;
        line-height: 1.4 !important;
        margin-bottom: 8px !important;
    }
    
    .contato-card .contato-label {
        font-size: 0.95rem !important;
        font-weight: 500 !important;
    }
    
    /* Mapa com espaçamento interno */
    .contato-map {
        width: 100% !important;
        max-width: 320px !important;
        margin: 30px auto 0 auto !important;
    }
    
    .map-container {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }
    
    /* Footer mobile tela toda */
    .footer,
    .site-footer {
        width: 100vw !important;
        left: 50% !important;
        margin-left: -50vw !important;
    }
    
    .footer .container,
    .site-footer .container {
        padding: 0 20px !important;
        text-align: center !important;
    }
}

/* Fundos */
.produtos {
    background-color: #f8f9fa !important;
}
.contato-card {
    background: #ffffff !important;
}

/* Botões de ação primários */
.btn-primary,
.btn-enviar-simple {
    background: #f07e13 !important;
    border-color: #f07e13 !important;
}

.btn-primary:hover,
.btn-enviar-simple:hover {
    background: #654345 !important;
    border-color: #654345 !important;
}

/* Botões secundários */
.btn-secondary {
    background: #204b9b !important;
    border-color: #204b9b !important;
    color: #ffffff !important;
}

.btn-secondary:hover {
    background: #1a3d82 !important;
    border-color: #1a3d82 !important;
}

/* Botões de sucesso */
.btn-success {
    background: #70b73e !important;
    border-color: #70b73e !important;
}

.btn-success:hover {
    background: #5a9632 !important;
    border-color: #5a9632 !important;
}

/* Elementos de destaque */
.badge-primary,
.alert-primary {
    background: #f07e13 !important;
    color: #ffffff !important;
}

.badge-secondary,
.alert-secondary {
    background: #204b9b !important;
    color: #ffffff !important;
}

.badge-success,
.alert-success {
    background: #70b73e !important;
    color: #ffffff !important;
}

/* Bordas e divisores */
.border-primary {
    border-color: #f07e13 !important;
}

.border-secondary {
    border-color: #204b9b !important;
}

.border-success {
    border-color: #70b73e !important;
}

/* Texto colorido */
.text-primary {
    color: #f07e13 !important;
}

.text-secondary {
    color: #204b9b !important;
}

.text-success {
    color: #70b73e !important;
}

.text-muted {
    color: #696969 !important;
}

/* Sombras coloridas */
.shadow-primary {
    box-shadow: 0 4px 16px rgba(240, 126, 19, 0.3) !important;
}

.shadow-secondary {
    box-shadow: 0 4px 16px rgba(32, 75, 155, 0.3) !important;
}

.shadow-success {
    box-shadow: 0 4px 16px rgba(112, 183, 62, 0.3) !important;
}