/*
Theme Name: Jahnke Child Theme
Theme URI: https://jahnke.com.br/
Description: Tema Filho personalizado para o site Jahnke, baseado no tema Hello Elementor.
Author: Ricardo Jahnke
Author URI: https://jahnke.com.br/
Template: hello-elementor
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: jahnke-child
*/


/* --- Estilos para o Fundo Geral da Página --- */
body {
    background-color: #1a1a1a; /* Fundo escuro para a página */
    color: #f0f0f0; /* Cor do texto padrão para contrastar com o fundo escuro */
}


/* --- Estilos para o Cabeçalho Dinâmico --- */


/* Estilos para o cabeçalho normal (não rolado) */
.elementor-location-header {
    height: 150px; /* Altura normal do cabeçalho principal */
    position: relative; /* Mantém no fluxo normal da página */
    transition: all 0.3s ease-in-out; /* Transição suave para todas as propriedades */
    z-index: 999; /* Garante que fique acima de outros elementos */
}


/* Estilos para o container interno quando o cabeçalho principal está NORMAL (não scrolled) */
.elementor-location-header:not(.scrolled) > .elementor-container.elementor-column-gap-no {
    height: 150px; /* Altura desejada para o container interno no estado normal */
    display: flex; /* Mantém o conteúdo centralizado verticalmente */
    align-items: center;
}


/* Estilos para quando o cabeçalho estiver "achatado" e fixo */
.elementor-location-header.scrolled {
    position: fixed; /* Torna o cabeçalho fixo */
    top: 0;
    left: 0;
    width: 100%; /* Garante que o cabeçalho ocupe toda a largura */
    height: 100px; /* A altura do cabeçalho principal quando "achatado" */
    background-color: #ffffff; /* Cor de fundo para o estado fixo - considere ajustar para um tom escuro se o site for full dark */
    box-shadow: 0 2px 5px rgba(0,0,0,0.1); /* Sombra para destacá-lo */
    z-index: 1000; /* Garante que fique acima de outros elementos */
}


/* --- Estilos para Botões e Inputs de Ação --- */


/* Estilos para botões e links de botão */
/* Aumentando a especificidade para garantir que as cores sejam aplicadas */
body input[type="button"],
body input[type="submit"],
body .wp-block-button__link {
    background-color: #DF9438; /* Cor de fundo padrão */
    color: #CDCDCD; /* Cor do texto padrão */
    border: none; /* Remove borda padrão se houver */
    padding: 10px 20px; /* Espaçamento interno */
    border-radius: 5px; /* Cantos arredondados */
    cursor: pointer; /* Indica que é clicável */
    transition: all 0.3s ease; /* Transição suave para o hover */
    text-decoration: none; /* Garante que links não tenham sublinhado */
    display: inline-block; /* Para que padding e margin funcionem bem em links */
}


/* Estilos para botões e links de botão no estado HOVER */
body input[type="button"]:hover,
body input[type="submit"]:hover,
body .wp-block-button__link:hover {
    background-color: #D58019; /* Cor de fundo no hover */
    color: #4D4D4D; /* Cor do texto no hover */
}


/* --- Estilos para Links Clicáveis --- */


/* Estilos para Links Clicáveis (gerais) */
/* Aumentando a especificidade para garantir que as cores sejam aplicadas */
body a {
    color: #8F8F8F; /* Cor do texto normal para links */
    text-decoration: none; /* Remove sublinhado padrão */
    transition: color 0.3s ease; /* Transição suave para o hover */
}


/* Estilos para Links Clicáveis no estado HOVER */
body a:hover {
    color: #4D4D4D; /* Cor do texto no hover para links */
    text-decoration: none; /* Remove sublinhado no hover também, se não quiser */
}


/* Seletor adicional para links dentro de elementos comuns como parágrafos, listas, etc. */
body p a,
body li a,
body div a,
body span a {
    color: #8F8F8F;
    text-decoration: none;
}


body p a:hover,
body li a:hover,
body div a:hover,
body span a:hover {
    color: #4D4D4D;
    text-decoration: none;
}


/* Seletor para links de navegação (muitas vezes têm estilos próprios) */
.main-navigation a,
.elementor-nav-menu a {
    color: #8F8F8F;
    text-decoration: none;
}


.main-navigation a:hover,
.elementor-nav-menu a:hover {
    color: #4D4D4D;
    text-decoration: none;
}


/* --- Estilos para Inputs de Rádio e Checkbox --- */


input[type="radio"],
input[type="checkbox"] {
    accent-color: #DF9438; /* Define a cor de destaque para o preenchimento/marca */
}


/* Opcional: Se você quiser um efeito no hover para rádio/checkbox */
input[type="radio"]:hover,
input[type="checkbox"]:hover {
    cursor: pointer; /* Indica que é clicável */
}


/* --- Estilos para Placeholder de Inputs --- */
/* Cor do texto do placeholder, igual à cor do texto dos botões (#CDCDCD) */
input::placeholder,
textarea::placeholder {
    color: #CDCDCD;
    opacity: 1; /* Garante que o placeholder não fique transparente em alguns navegadores */
}


/* Compatibilidade com navegadores Webkit (Chrome, Safari, Edge) */
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: #CDCDCD;
    opacity: 1;
}


/* Compatibilidade com Firefox */
input::-moz-placeholder,
textarea::-moz-placeholder {
    color: #CDCDCD;
}


/* Compatibilidade com Internet Explorer 10-11 */
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
    color: #CDCDCD;
}


/* Compatibilidade com Edge (versões mais antigas) */
input::-ms-input-placeholder,
textarea:-ms-input-placeholder {
    color: #CDCDCD;
}




/* --- Estilos para Mensagens do WooCommerce --- */
body .woocommerce-message {
    max-width: 600px !important; /* Largura máxima da caixa de mensagem */
    background-color: #1a1a1a !important; /* Fundo escuro, igual ao fundo do body */
    color: #f0f0f0 !important; /* Cor do texto para contrastar com o fundo escuro */
    margin-left: auto !important; /* Empurra a caixa para a direita */
    margin-right: 20px !important; /* Adiciona um espaçamento de 20px da borda direita da tela */
    padding: 15px 20px !important; /* Adiciona um pouco de padding para o conteúdo não ficar colado nas bordas */
    border-radius: 5px !important; /* Cantos levemente arredondados */
    box-sizing: border-box !important; /* Garante que padding não aumente a largura total */
    border: 1px solid #DF9438 !important; /* Adiciona uma borda sutil para destaque */
}

/* --- Estilos para o fundo de imagens PNG transparentes --- */
.woocommerce-product-gallery__image,
.product .elementor-jet-single-images .jet-single-images__wrap .woocommerce-product-gallery .flex-control-thumbs li img {
    background-color: white;
}


/* --- Estilos para o status "Em Estoque" do WooCommerce --- */
div.product .stock.in-stock {
    color: #DF9438; /* Cor do texto para contrastar com o fundo */
    padding: 3px 8px; /* Adiciona um pouco de espaçamento interno */
    border-radius: 3px; /* Cantos levemente arredondados */
    display: inline-block; /* Garante que padding e background funcionem bem */
}

/* --- Estilos para o campo de quantidade e botão "Adicionar ao Carrinho" --- */

/* Garante que o formulário (.cart) se comporte como um bloco normal, permitindo que os elementos internos fluam */
form.cart {
    display: block !important;
    /* Adicione um espaçamento inferior se o botão e o campo de quantidade ficarem muito colados no próximo elemento */
    margin-bottom: 20px !important; 
}

/* Ajusta o contêiner da quantidade (o div.quantity) */
form.cart .quantity {
    display: inline-block !important; /* Permite que ele fique na mesma linha que o botão */
    vertical-align: middle !important; /* Alinha verticalmente com o botão */
    width: 80px !important; /* Largura fixa para o contêiner da quantidade */
    margin-right: 15px !important; /* Espaço entre o campo de quantidade e o botão */
    text-align: left !important; /* Alinha o conteúdo (o input) à esquerda dentro deste div */
    margin-top: 0 !important; /* Remove margens superiores */
    margin-bottom: 0 !important; /* Remove margens inferiores */
    padding: 0 !important; /* Remove paddings */
    box-sizing: border-box !important; /* Inclui padding e border na largura total */
}

/* Ajusta o campo de quantidade (o input em si) */
form.cart .quantity .qty {
    width: 100% !important; /* Ocupa 100% da largura do seu pai (.quantity) */
    text-align: center !important; /* Centraliza o número dentro do input */
    margin: 0 !important; /* Remove margens */
    box-sizing: border-box !important; /* Inclui padding e border na largura total */
    height: auto !important; /* Garante que a altura se ajuste naturalmente */
    min-height: auto !important; /* Garante que min-height não cause problemas */
}

/* Ajusta o botão "Adicionar ao Carrinho" */
form.cart .single_add_to_cart_button {
    display: inline-block !important; /* Permite que ele fique na mesma linha que o campo de quantidade */
    vertical-align: middle !important; /* Alinha verticalmente com o campo de quantidade */
    min-width: 150px !important; /* Largura mínima para o botão */
    margin: 0 !important; /* Remove margens */
    padding: 10px 20px !important; /* Re-aplica padding padrão do botão */
    box-sizing: border-box !important; /* Inclui padding e border na largura total */
    height: auto !important; /* Garante que a altura se ajuste naturalmente */
}

/* Remove float e vertical-align que podem conflitar com o inline-block */
/* Aplica-se a qualquer elemento com a classe 'button' dentro do formulário */
form.cart .button {
    vertical-align: initial !important;
    float: none !important;
}

/* --- Estilos para o container da calculadora --- */
.containerCalculator {
    background-color: #1a1a1a !important; /* Fundo escuro para a página */
}