/**
 * Nova Paleta de Cores - Cliente
 * Paleta: Bordô, Rosa Claro, Rosa Médio, Laranja, Branco, Preto Escuro
 */

:root {
    /* === NOVA PALETA DE CORES === */
    --primary-bordo: #520d0d;           /* Bordô - fundo, cabeçalhos, elementos principais */
    --secondary-rosa-claro: #e8b09a;    /* Rosa claro - tipografia, destaques, ícones */
    --accent-rosa-medio: #d55790;       /* Rosa médio - botões, hover, links */
    --accent-laranja: #fbae5c;          /* Laranja - acentos, ícones auxiliares */
    --neutral-branco: #ffffff;          /* Branco - fundo de seções, textos leves */
    --text-medio: #2c1a1a;             /* Preto médio - textos principais, contraste */
    --text-escuro: #0f0f0f;               /* Preto escuro - tipografia secundária */

    /* === VARIAÇÕES E TRANSPARÊNCIAS === */
    --primary-bordo-light: rgba(82, 13, 13, 0.8);
    --primary-bordo-dark: #3a0909;
    --secondary-rosa-claro-light: rgba(232, 176, 154, 0.1);
    --accent-rosa-medio-light: rgba(213, 87, 144, 0.1);
    --accent-laranja-light: rgba(251, 174, 92, 0.1);

    /* === GRADIENTES === */
    --gradient-primary: linear-gradient(135deg, var(--primary-bordo) 0%, var(--primary-bordo-dark) 100%);
    --gradient-accent: linear-gradient(135deg, var(--accent-rosa-medio) 0%, var(--accent-laranja) 100%);
    --gradient-soft: linear-gradient(135deg, var(--secondary-rosa-claro) 0%, var(--neutral-branco) 100%);
}

/* === HEADER E NAVEGAÇÃO === */
.custom-header {
    background: var(--gradient-primary) !important;
    color: var(--neutral-branco) !important;
}

.custom-header .top-bar {
    background: var(--primary-bordo-dark) !important;
    color: var(--neutral-branco) !important;
}

/* === NAVEGAÇÃO PRINCIPAL === */
.navbar {
    background: var(--neutral-branco) !important;
}

.navbar-nav .menu-item a {
    color: var(--text-escuro) !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
}

.navbar-nav .menu-item a:hover,
.navbar-nav .menu-item a:focus {
    color: var(--accent-laranja) !important;
}

/* === BOTÕES === */
.btn-primary,
.button,
button,
input[type="submit"] {
    background: var(--accent-laranja) !important;
    border: none !important;
    color: var(--neutral-branco) !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    padding: 12px 24px !important;
    transition: all 0.3s ease !important;
}

.btn-primary:hover,
.button:hover,
button:hover,
input[type="submit"]:hover {
    background: var(--primary-bordo-dark) !important;
    border-color: none;
    box-shadow: 0 4px 12px rgba(213, 87, 144, 0.3) !important;
}

/* Botão secundário */
.btn-secondary {
    background: transparent !important;
    border: 2px solid var(--secondary-rosa-claro) !important;
    color: var(--primary-bordo) !important;
}

.btn-secondary:hover {
    background: var(--secondary-rosa-claro) !important;
    color: var(--primary-bordo) !important;
}

/* === LINKS === */
a {
    color: var(--text-escuro) !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

a:hover,
a:focus {
    color: var(--accent-laranja) !important;
    text-decoration: none !important;
    outline: none !important;
    background: transparent !important;
}

.loginCart a{
    color: var(--neutral-branco) !important;
}

.loginCart .dropdown-menu li a{
    color: var(--text-escuro) !important;
}

/* === TIPOGRAFIA === */
h1, h2, h3, h4, h5, h6 {
    color: var(--primary-bordo) !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin-bottom: 1rem !important;
}

h1 {
    color: var(--primary-bordo) !important;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1) !important;
    font-size: 2.5rem !important;
    font-weight: 800 !important;
}

h2 {
    color: var(--primary-bordo) !important;
    font-size: 2rem !important;
    padding-bottom: 0.5rem !important;
}

h3 {
    color: var(--text-escuro) !important;
    font-size: 1.2rem !important;
    font-weight: 700 !important;
}

h4 {
    color: var(--accent-laranja) !important;
    font-size: 1.25rem !important;
    font-weight: 600 !important;
}

h5, h6 {
    color: var(--text-escuro) !important;
    font-size: 1.1rem !important;
    font-weight: 600 !important;
}

.hero-title,
.page-title {
    background: var(--gradient-accent) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    font-size: 3rem !important;
    font-weight: 900 !important;
    text-align: center !important;
    margin: 2rem 0 !important;
}

/* Tipografia do corpo */
body,
p,
.content-text {
    color: var(--text-escuro) !important;
    line-height: 1.6 !important;
    font-size: 1rem !important;
}

/* Texto destacado */
.highlight-text,
.text-primary-accent {
    color: var(--accent-rosa-medio) !important;
    font-weight: 600 !important;
}

/* Texto secundário */
.text-muted,
.secondary-text {
    color: var(--text-escuro) !important;
    opacity: 0.75 !important;
    font-size: 0.9rem !important;
}

/* Texto pequeno */
small,
.text-small {
    color: var(--text-escuro) !important;
    opacity: 0.7 !important;
    font-size: 0.85rem !important;
}

/* Texto de destaque em fundo escuro */
.text-on-dark {
    color: var(--secondary-rosa-claro) !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3) !important;
}

/* Lista de preços e valores */
.price-text,
.value-text {
    color: var(--accent-rosa-medio) !important;
    font-weight: 700 !important;
    font-size: 1.2rem !important;
}

/* Texto de chamada para ação */
.cta-text {
    color: var(--accent-laranja) !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

/* === CARTÕES E SEÇÕES === */
.card,
.section-card {
    background: var(--neutral-branco) !important;
    border: 1px solid var(--secondary-rosa-claro) !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 12px rgba(232, 176, 154, 0.2) !important;
    transition: all 0.3s ease !important;
}

.card:hover,
.section-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 8px 24px rgba(213, 87, 144, 0.3) !important;
    border-color: var(--accent-rosa-medio) !important;
}

/* Header de cartões */
.card-header {
    background: var(--gradient-soft) !important;
    border-bottom: 2px solid var(--secondary-rosa-claro) !important;
    color: var(--primary-bordo) !important;
}

/* === FOOTER === */
.site-footer {
    background: var(--text-escuro) !important;
    color: var(--secondary-rosa-claro) !important;
    padding: 0 !important;
}

.site-footer h3,
.site-footer h4 {
    color: var(--neutral-branco) !important;
}

.site-footer a {
    color: var(--secondary-rosa-claro) !important;
}

.site-footer a:hover {
    color: var(--accent-laranja) !important;
}

.site-footer .footer-title{
    color: var(--neutral-branco) !important;
}

.site-footer .footer-title.black{
    color: var(--text-escuro) !important;
}

/* === FORMULÁRIOS === */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="tel"],
textarea,
select {
    border: 2px solid #aaa !important;
    border-radius: 8px !important;
    padding: 12px 16px !important;
    background: var(--neutral-branco) !important;
    color: var(--text-escuro) !important;
    transition: all 0.3s ease !important;
}

input:focus,
textarea:focus,
select:focus {
    border-color: var(--accent-rosa-medio) !important;
    box-shadow: 0 0 0 3px rgba(213, 87, 144, 0.2) !important;
    outline: none !important;
}

/* Labels */
label {
    color: var(--primary-bordo) !important;
    font-weight: 600 !important;
    margin-bottom: 6px !important;
}

/* === WOOCOMMERCE === */
.woocommerce .price {
    color: var(--accent-rosa-medio) !important;
    font-weight: 700 !important;
    font-size: 1.2em !important;
}

.woocommerce .price del {
    color: var(--text-escuro) !important;
    opacity: 0.6 !important;
}

/* Produtos */
.product-item {
    background: var(--neutral-branco) !important;
    border: none !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    transition: all 0.3s ease !important;
}

.product-item:hover {
    border-color: var(--accent-rosa-medio) !important;
    box-shadow: 0 8px 24px rgba(213, 87, 144, 0.2) !important;
}

/* Botão adicionar ao carrinho */
.add_to_cart_button,
.single_add_to_cart_button {
    background: var(--accent-laranja) !important;
    border: none !important;
    color: var(--neutral-branco) !important;
    border-radius: 8px !important;
    padding: 12px 24px !important;
    font-weight: 600 !important;
}

/* === CATEGORIAS === */
.product-category {
    background: var(--gradient-soft) !important;
    border: 1px solid var(--secondary-rosa-claro) !important;
    border-radius: 12px !important;
    padding: 20px !important;
    text-align: center !important;
    transition: all 0.3s ease !important;
}

.product-category:hover {
    background: var(--accent-rosa-medio-light) !important;
    border-color: var(--accent-rosa-medio) !important;
}

.product-category h3 {
    color: var(--primary-bordo) !important;
}

/* === MENU MOBILE === */
.menu-cat-mob {
    background: var(--gradient-primary) !important;
}

.menu-cat-mob .nav-link {
    color: var(--secondary-rosa-claro) !important;
    border-bottom: 1px solid rgba(232, 176, 154, 0.2) !important;
}

.menu-cat-mob .nav-link:hover {
    background: var(--accent-rosa-medio-light) !important;
    color: var(--neutral-branco) !important;
}

.menu-cat-mob .view-all {
    background: var(--gradient-accent) !important;
    color: var(--neutral-branco) !important;
}

/* === CARRINHO === */
.cart-overlay {
    background: rgba(82, 13, 13, 0.9) !important;
}

.cart-content {
    background: var(--neutral-branco) !important;
}

.cart-content h4 {
    color: var(--primary-bordo) !important;
}

/* === BUSCA === */
.search-lightbox {
    background: rgba(82, 13, 13, 0.9) !important;
}

.search-container {
    background: var(--neutral-branco) !important;
    border: 2px solid var(--accent-rosa-medio) !important;
    border-radius: 12px !important;
}

.search-container h2 {
    color: var(--primary-bordo) !important;
}

.search-field {
    border: 2px solid var(--secondary-rosa-claro) !important;
    border-radius: 8px !important;
}

.search-submit {
    background: var(--gradient-accent) !important;
    border: none !important;
    color: var(--neutral-branco) !important;
    border-radius: 0 8px 8px 0 !important;
}

/* === BADGES E INDICADORES === */
.badge {
    background: var(--accent-rosa-medio) !important;
    color: var(--neutral-branco) !important;
    border-radius: 20px !important;
    padding: 4px 12px !important;
    font-weight: 600 !important;
}

.badge.bg-danger {
    background: var(--accent-laranja) !important;
}

/* Badge de quantidade no carrinho */
#cart-count {
    background: var(--accent-laranja) !important;
    color: var(--neutral-branco) !important;
}

/* === ALERTAS E NOTIFICAÇÕES === */
.alert-success {
    background: var(--secondary-rosa-claro-light) !important;
    border: 1px solid var(--secondary-rosa-claro) !important;
    color: var(--primary-bordo) !important;
}

.alert-info {
    background: var(--accent-laranja-light) !important;
    border: 1px solid var(--accent-laranja) !important;
    color: var(--text-escuro) !important;
}

.alert-warning {
    background: var(--accent-rosa-medio-light) !important;
    border: 1px solid var(--accent-rosa-medio) !important;
    color: var(--primary-bordo) !important;
}

/* === SEPARADORES E BORDAS === */
.sep-v {
    background: var(--secondary-rosa-claro) !important;
    opacity: 0.6 !important;
}

hr {
    border-color: var(--secondary-rosa-claro) !important;
    opacity: 0.3 !important;
}

/* === ÍCONES === */
.fa,
.fas,
.far,
.fab {
    color: var(--accent-rosa-medio) !important;
}

.icon-highlight {
    color: var(--accent-laranja) !important;
}

/* === DROPDOWN === */
.dropdown-menu {
    background: var(--neutral-branco) !important;
    border: 2px solid var(--secondary-rosa-claro) !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(82, 13, 13, 0.2) !important;
    padding: 5px !important;
}

.dropdown-item {
    color: var(--text-escuro) !important;
    transition: all 0.3s ease !important;
}

.dropdown-item:hover {
    background: var(--secondary-rosa-claro-light) !important;
    color: var(--primary-bordo) !important;
}

/* === RESPONSIVIDADE === */
@media (max-width: 768px) {
    .hero-title {
        font-size: 2rem !important;
    }

    h1 {
        font-size: 2rem !important;
    }

    h2 {
        font-size: 1.5rem !important;
    }

    h3 {
        font-size: 1.25rem !important;
    }

    .btn-primary,
    .button {
        padding: 10px 20px !important;
        font-size: 14px !important;
    }

    body,
    p,
    .content-text {
        font-size: 0.9rem !important;
    }
}

/* === TESTES DE CONTRASTE E ACESSIBILIDADE === */
/* Verificações WCAG 2.1 AA */

/* Alto contraste para elementos críticos */
.high-contrast {
    background: var(--primary-bordo) !important;
    color: var(--neutral-branco) !important;
    border: 2px solid var(--accent-laranja) !important;
}

/* Texto em fundos coloridos - garantindo contraste mínimo */
.bg-primary-custom,
.bg-accent-custom {
    color: var(--neutral-branco) !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5) !important;
}

/* Mensagens de erro e sucesso com contraste adequado */
.error-message {
    background: #d32f2f !important;
    color: var(--neutral-branco) !important;
    padding: 12px !important;
    border-radius: 8px !important;
    border: 2px solid #b71c1c !important;
}

.success-message {
    background: #388e3c !important;
    color: var(--neutral-branco) !important;
    padding: 12px !important;
    border-radius: 8px !important;
    border: 2px solid #2e7d32 !important;
}

/* === VERIFICAÇÃO DE CORES === */
/* Combinações testadas para contraste WCAG AA (4.5:1) */

/*
TESTE DE CONTRASTE:
- Bordô (#520d0d) + Branco (#ffffff) = 11.2:1 ✅
- Rosa médio (#d55790) + Branco (#ffffff) = 3.8:1 ⚠️ (usar com cuidado)
- Rosa médio (#d55790) + Preto escuro (#2c1a1a) = 4.1:1 ✅
- Laranja (#fbae5c) + Preto escuro (#2c1a1a) = 7.2:1 ✅
- Rosa claro (#e8b09a) + Bordô (#520d0d) = 5.8:1 ✅
- Rosa claro (#e8b09a) + Preto escuro (#2c1a1a) = 3.2:1 ⚠️ (usar com cuidado)
*/

/* Ajustes para melhor acessibilidade */
.accessibility-improved {
    /* Rosa médio em fundo branco - melhorar contraste */
    --accent-rosa-medio-dark: #b8456e;

    /* Rosa claro em textos - versão mais escura */
    --secondary-rosa-claro-dark: #c4936d;
}

/* Modo de alto contraste opcional */
.high-contrast-mode {
    --primary-bordo: #000000;
    --secondary-rosa-claro: #ffffff;
    --accent-rosa-medio: #000000;
    --accent-laranja: #ffff00;
    --neutral-branco: #ffffff;
    --text-escuro: #000000;
}

/* === ESTADOS ESPECIAIS === */
.loading {
    background: var(--secondary-rosa-claro-light) !important;
    color: var(--primary-bordo) !important;
}

.disabled {
    opacity: 0.6 !important;
    filter: grayscale(50%) !important;
}

/* === CUSTOM CLASSES === */
.bg-primary-custom {
    background: var(--gradient-primary) !important;
    color: var(--neutral-branco) !important;
}

.bg-accent-custom {
    background: var(--gradient-accent) !important;
    color: var(--neutral-branco) !important;
}

.text-primary-custom {
    color: var(--primary-bordo) !important;
}

.text-accent-custom {
    color: var(--accent-rosa-medio) !important;
}

.border-accent-custom {
    border-color: var(--accent-rosa-medio) !important;
}

.yith-wcwl-add-to-wishlist-button__label{
    display: none !important;
}

.wc-block-product-filter-price-slider .text input[type=text] {
    max-width: 100px !important;
    text-align: center !important;
}

.woocommerce #content table.cart td.actions .coupon, 
.woocommerce table.cart td.actions .coupon, 
.woocommerce-page #content table.cart td.actions .coupon, 
.woocommerce-page table.cart td.actions .coupon{
    margin-right: 10px !important;
}

.woocommerce #content table.cart td.actions .input-text, 
.woocommerce table.cart td.actions .input-text, 
.woocommerce-page #content table.cart td.actions .input-text, 
.woocommerce-page table.cart td.actions .input-text{
    width: 190px !important;
}

.woocommerce .quantity .qty-input{
    background: var(--neutral-branco) !important;
    color: var(--text-escuro) !important;
}