/*
Theme Name:  Vault Child
Description: Child theme do Vault para a 3D Procer. Todo CSS, JS e PHP customizado do projeto vive aqui, protegido contra atualizacoes do tema pai.
Author:      Agencia VControl
Template:    vault
Version:     1.1.0
Text Domain: vault-child
*/

/* =====================================================
   3D PROCER - DESIGN SYSTEM "PRECISION DARK"
   Tokens globais. Fonte unica de verdade do projeto.
   ===================================================== */

:root {
    /* Cores de marca */
    --procer-laranja:      #FF6A2B;
    --procer-laranja-deep: #E8551A;
    --procer-prata:        #9AA3B2;

    /* Superficies */
    --procer-preto:        #0B0D10;
    --procer-grafite:      #151920;
    --procer-aco:          #2A303B;

    /* Texto */
    --procer-texto:        #F5F6F8;
    --procer-texto-sec:    #9AA3B2;

    /* Funcionais */
    --procer-sucesso:      #2ECC71;
    --procer-erro:         #E74C3C;

    /* Tipografia */
    --procer-font-titulo:  'Space Grotesk', sans-serif;
    --procer-font-corpo:   'Inter', sans-serif;

    /* Geometria */
    --procer-radius:       12px;
    --procer-radius-sm:    8px;
    --procer-shadow:       0 12px 32px rgba(0, 0, 0, 0.45);
    --procer-glow:         0 8px 24px rgba(255, 106, 43, 0.35);

    /* Transicoes */
    --procer-ease:         all 0.25s ease;
}

/* =====================================================
   COMPONENTES BASE
   ===================================================== */

/* Botao primario (aplicar classe .procer-btn em botoes Elementor) */
.procer-btn .elementor-button,
.procer-btn.elementor-button {
    background-color: var(--procer-laranja);
    color: #FFFFFF;
    font-family: var(--procer-font-corpo);
    font-weight: 600;
    border-radius: var(--procer-radius-sm);
    transition: var(--procer-ease);
}

.procer-btn .elementor-button:hover,
.procer-btn.elementor-button:hover {
    background-color: var(--procer-laranja-deep);
    box-shadow: var(--procer-glow);
    transform: translateY(-2px);
}

/* Cartao padrao */
.procer-card {
    background-color: var(--procer-grafite);
    border: 1px solid var(--procer-aco);
    border-radius: var(--procer-radius);
    transition: var(--procer-ease);
}

.procer-card:hover {
    border-color: var(--procer-laranja);
    box-shadow: var(--procer-shadow);
    transform: translateY(-4px);
}

/* =====================================================
   WOOCOMMERCE - CAMADA DARK (grids de produto)
   ===================================================== */

.woocommerce ul.products li.product {
    background-color: var(--procer-grafite);
    border: 1px solid var(--procer-aco);
    border-radius: var(--procer-radius);
    padding: 16px 16px 20px;
    transition: var(--procer-ease);
}

.woocommerce ul.products li.product:hover {
    border-color: var(--procer-laranja);
    box-shadow: var(--procer-shadow);
    transform: translateY(-4px);
}

.woocommerce ul.products li.product img {
    border-radius: var(--procer-radius-sm);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
    color: var(--procer-texto);
    font-family: var(--procer-font-titulo);
    font-size: 17px;
    font-weight: 500;
}

.woocommerce ul.products li.product .price {
    color: var(--procer-laranja);
    font-family: var(--procer-font-corpo);
    font-size: 18px;
    font-weight: 600;
}

.woocommerce ul.products li.product .button,
.woocommerce a.button,
.woocommerce button.button {
    background-color: var(--procer-laranja);
    color: #FFFFFF;
    font-family: var(--procer-font-corpo);
    font-weight: 600;
    border-radius: var(--procer-radius-sm);
    transition: var(--procer-ease);
}

.woocommerce ul.products li.product .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover {
    background-color: var(--procer-laranja-deep);
    color: #FFFFFF;
    box-shadow: var(--procer-glow);
}

/* =====================================================
   FOOTER DARK - degrade preto/azul com textos brancos
   ===================================================== */

.procer-footer-dark,
.procer-footer-dark p,
.procer-footer-dark a,
.procer-footer-dark .wp-block-navigation-item__content,
.procer-footer-dark .wp-block-site-tagline {
    color: #FFFFFF;
}

.procer-footer-dark .has-mbf-secondary-color,
.procer-footer-dark .wp-block-site-tagline,
.procer-footer-dark p.has-x-small-font-size {
    color: rgba(255, 255, 255, 0.72) !important;
}

.procer-footer-dark a:hover,
.procer-footer-dark .wp-block-navigation-item__content:hover {
    color: #FF6A2B;
}

/* =====================================================
   FOOTER DARK v2 - corrige links + compacta 40%
   ===================================================== */

/* Links de navegacao: forca branco (vence estilos do bloco e inline) */
.procer-footer-dark .wp-block-navigation a,
.procer-footer-dark .wp-block-navigation .wp-block-navigation-item__content,
.procer-footer-dark .wp-block-navigation-item__label {
    color: #FFFFFF !important;
    font-size: 14px;
}

.procer-footer-dark .wp-block-navigation a:hover,
.procer-footer-dark .wp-block-navigation a:hover .wp-block-navigation-item__label {
    color: #FF6A2B !important;
}

/* Logo 40% menor */
.procer-footer-dark .wp-block-image img {
    max-width: 200px;
    height: auto;
}

/* Altura do cartao: paddings reduzidos a 60% do original */
.procer-footer-dark {
    padding-top: calc(var(--wp--preset--spacing--130) * 0.6) !important;
    padding-bottom: calc(var(--wp--preset--spacing--130) * 0.6) !important;
}

/* Respiro entre colunas e blocos internos mais enxuto */
.procer-footer-dark .mbf-footer-cols {
    --mbf-adaptive-columns-gap: var(--wp--preset--spacing--50) !important;
}

/* Margens externas do cartao (acima/abaixo) tambem 60% */
.wp-block-group.alignfull:has(> .procer-footer-dark) {
    margin-top: calc(var(--wp--preset--spacing--160) * 0.6) !important;
    margin-bottom: calc(var(--wp--preset--spacing--110) * 0.6) !important;
}

/* Tagline mais discreta e colada no logo */
.procer-footer-dark .wp-block-site-tagline {
    font-size: 13px;
    margin-top: var(--wp--preset--spacing--30) !important;
}

/* =====================================================
   PAGINA DE PRODUTO - descricao com tipografia comedida
   ===================================================== */

.wc-block-product-description h2 {
    font-size: 19px;
    font-weight: 600;
    line-height: 1.35;
    margin: 0 0 0.5em;
}

.wc-block-product-description h3 {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.35;
    margin: 1.4em 0 0.4em;
}

.wc-block-product-description p,
.wc-block-product-description li {
    font-size: 14px;
    line-height: 1.65;
}

.wc-block-product-description strong {
    font-weight: 600;
}

.wc-block-product-description ul {
    padding-left: 1.2em;
    margin: 0.4em 0 1em;
}