/**
 * Estilos para Dual Pricing Display
 *
 * @package Everbrew_Customizations
 * @since 1.2.0
 * @updated 2025-12-12 - Sistema de visibilidade baseado em switcher
 */

/* ==========================================================================
   DUAL PRICING - CONTROLE DE VISIBILIDADE VIA SWITCHER
   ========================================================================== */

/**
 * LÓGICA:
 * - Ambos os preços (membro e não-membro) estão SEMPRE no HTML
 * - CSS controla qual fica visível baseado nas classes do body/html
 * - Classes adicionadas pelo switcher.js: .member-view ou .non-member-view
 * - Padrão inicial: não-membro (para usuários não-logados)
 */

/* Estado padrão: esconder preço de membro (mostrar apenas não-membro) */
.everbrew-price-member,
[data-member-price] {
    display: none;
}

.everbrew-price-non-member,
[data-non-member-price] {
    display: block;
}

/* Quando switcher ativa visualização de MEMBRO */
.member-view .everbrew-price-member,
.member-view [data-member-price],
html.member-view .everbrew-price-member,
html.member-view [data-member-price] {
    display: block;
}

.member-view .everbrew-price-non-member,
.member-view [data-non-member-price],
html.member-view .everbrew-price-non-member,
html.member-view [data-non-member-price] {
    display: none;
}

/* Quando switcher ativa visualização de NÃO-MEMBRO (padrão) */
.non-member-view .everbrew-price-member,
.non-member-view [data-member-price],
html.non-member-view .everbrew-price-member,
html.non-member-view [data-member-price] {
    display: none;
}

.non-member-view .everbrew-price-non-member,
.non-member-view [data-non-member-price],
html.non-member-view .everbrew-price-non-member,
html.non-member-view [data-non-member-price] {
    display: block;
}

/* ==========================================================================
   DUAL PRICE WRAPPER - Container principal
   ========================================================================== */

.everbrew-dual-price-wrapper {
    display: block;
    width: 100%;
}

.everbrew-price-display {
    display: block;
    margin: 0;
    padding: 0;
}

/* Preço (price tag) */
.everbrew-price-display .price {
    display: block;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}

/* Economia (savings) - só visível para membros */
.everbrew-savings {
    display: block;
    font-size: 0.85em;
    color: #059669;
    font-weight: 500;
    margin-top: 4px;
}

/* CTA para não-membros */
.everbrew-member-cta {
    display: block;
    font-size: 0.85em;
    color: #f59e0b;
    font-weight: 500;
    margin-top: 4px;
}

/* ==========================================================================
   CART & CHECKOUT DUAL PRICING
   ========================================================================== */

/* Container principal do dual pricing no carrinho */
.everbrew-cart-dual-price,
.everbrew-order-dual-price {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
    padding: 8px 0;
    font-size: 14px;
    line-height: 1.4;
}

/* Linha de preço individual */
.everbrew-cart-price-row,
.everbrew-order-price-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
}

/* Labels dos preços */
.everbrew-price-label {
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* Valores dos preços */
.everbrew-price-value {
    font-size: 15px;
    font-weight: 700;
}

/* Preço de MEMBRO (verde - mais baixo) */
.everbrew-member-price .everbrew-price-label {
    color: #059669;
}

.everbrew-member-price .everbrew-price-value {
    color: #059669;
}

/* Preço de NÃO-MEMBRO (cinza - mais alto) */
.everbrew-non-member-price .everbrew-price-label {
    color: #6b7280;
}

.everbrew-non-member-price .everbrew-price-value {
    color: #6b7280;
    text-decoration: none;
}

/* Destaque para preço PAGO em pedidos */
.everbrew-price-paid {
    background: #f0fdf4;
    padding: 4px 8px;
    border-radius: 4px;
    border-left: 3px solid #059669;
}

.everbrew-price-paid .everbrew-price-value {
    font-size: 16px;
}

/* Referência (preço não pago) */
.everbrew-price-reference {
    opacity: 0.7;
}

/* Economia no carrinho */
.everbrew-cart-savings {
    margin-top: 4px;
    padding: 4px 8px;
    background: #fef3c7;
    border-radius: 4px;
    text-align: center;
}

.everbrew-cart-savings small {
    color: #92400e;
    font-size: 12px;
    font-weight: 600;
}

/* Economia em pedidos (confirmado) */
.everbrew-order-savings {
    margin-top: 6px;
    padding: 8px 12px;
    background: #d1fae5;
    border-radius: 6px;
    border-left: 4px solid #059669;
    text-align: center;
}

.everbrew-order-savings strong {
    color: #059669;
    font-size: 13px;
    display: block;
}

/* Potencial economia (não-membros em pedidos) */
.everbrew-order-potential-savings {
    margin-top: 6px;
    padding: 8px 12px;
    background: #fef3c7;
    border-radius: 6px;
    border-left: 4px solid #f59e0b;
    text-align: center;
}

.everbrew-order-potential-savings small {
    color: #92400e;
    font-size: 12px;
    font-weight: 600;
    display: block;
}

/* ==========================================================================
   TABELA DO WOOCOMMERCE - Ajustes para melhor visualização
   ========================================================================== */

/* Aumentar espaçamento nas células com dual pricing */
.woocommerce-cart-form__cart-item td.product-price,
.woocommerce-cart-form__cart-item td.product-subtotal,
.woocommerce-checkout-review-order-table td.product-total,
.woocommerce-table--order-details td.product-total {
    padding: 16px 12px;
    vertical-align: top;
}

/* Mini cart widget */
.widget_shopping_cart .everbrew-cart-dual-price {
    gap: 4px;
    font-size: 12px;
}

.widget_shopping_cart .everbrew-price-label {
    font-size: 10px;
}

.widget_shopping_cart .everbrew-price-value {
    font-size: 13px;
}

/* ==========================================================================
   THANK YOU PAGE - Destaque especial
   ========================================================================== */

.woocommerce-order .everbrew-order-dual-price {
    background: #fafafa;
    padding: 12px;
    border-radius: 8px;
    margin: 4px 0;
}

.woocommerce-order .everbrew-order-savings {
    font-size: 14px;
    padding: 10px 14px;
}

.woocommerce-order .everbrew-order-savings strong {
    font-size: 15px;
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media (max-width: 768px) {
    .everbrew-cart-dual-price,
    .everbrew-order-dual-price {
        font-size: 13px;
    }

    .everbrew-price-label {
        font-size: 11px;
    }

    .everbrew-price-value {
        font-size: 14px;
    }

    .everbrew-cart-savings small,
    .everbrew-order-potential-savings small {
        font-size: 11px;
    }

    .woocommerce-cart-form__cart-item td.product-price,
    .woocommerce-cart-form__cart-item td.product-subtotal {
        padding: 12px 8px;
    }
}

/* ==========================================================================
   LEGACY DUAL PRICING (produtos individuais)
   ========================================================================== */

/* Container do dual pricing */
.everbrew-dual-pricing {
    margin: 20px 0;
    padding: 0;
}

/* Wrapper dos botões de toggle */
.everbrew-price-toggle {
    display: flex;
    gap: 10px;
    margin-bottom: 15px;
    flex-wrap: wrap;
}

/* Botões de toggle */
.everbrew-price-toggle button {
    padding: 10px 20px;
    border: 2px solid #ddd;
    background: #fff;
    color: #333;
    font-size: 14px;
    font-weight: 600;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s ease;
    flex: 1 1 auto;
    min-width: 140px;
}

.everbrew-price-toggle button:hover {
    border-color: #999;
    background: #f5f5f5;
}

.everbrew-price-toggle button.active {
    border-color: var(--everbrew-primary, #007bff);
    background: var(--everbrew-primary, #007bff);
    color: #fff;
}

/* Container dos valores de preço */
.everbrew-price-values {
    position: relative;
}

/* Cada valor de preço */
.everbrew-price-value {
    display: none;
    animation: fadeIn 0.3s ease;
}

.everbrew-price-value.active {
    display: block;
}

/* Animação de fade */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Preço formatado */
.everbrew-price-value .price {
    font-size: 28px;
    font-weight: 700;
    color: var(--everbrew-primary, #007bff);
}

.everbrew-price-value .price .woocommerce-Price-amount {
    font-size: inherit;
    color: inherit;
}

/* Badge de desconto */
.everbrew-price-badge {
    display: inline-block;
    margin-left: 10px;
    padding: 4px 12px;
    background: #28a745;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    border-radius: 12px;
    vertical-align: middle;
}

/* Mensagem de benefício */
.everbrew-benefit-message {
    margin-top: 10px;
    padding: 12px 16px;
    background: #f8f9fa;
    border-left: 4px solid var(--everbrew-primary, #007bff);
    font-size: 14px;
    border-radius: 4px;
}

.everbrew-benefit-message strong {
    color: var(--everbrew-primary, #007bff);
}

/* Responsivo */
@media (max-width: 480px) {
    .everbrew-price-toggle {
        flex-direction: column;
    }

    .everbrew-price-toggle button {
        width: 100%;
        min-width: unset;
    }

    .everbrew-price-value .price {
        font-size: 24px;
    }
}

/* Integração com Elementor */
.elementor-widget-woocommerce-product-price .everbrew-dual-pricing {
    margin: 10px 0;
}

/* Integração com tema */
.woocommerce div.product .everbrew-dual-pricing {
    margin: 15px 0 25px;
}

/* Estado de carregamento */
.everbrew-dual-pricing.loading {
    opacity: 0.6;
    pointer-events: none;
}

/* Dark mode (opcional) */
@media (prefers-color-scheme: dark) {
    .everbrew-price-toggle button {
        background: #2d2d2d;
        color: #fff;
        border-color: #444;
    }

    .everbrew-price-toggle button:hover {
        background: #3d3d3d;
        border-color: #666;
    }

    .everbrew-benefit-message {
        background: #2d2d2d;
        border-left-color: var(--everbrew-primary, #007bff);
        color: #e0e0e0;
    }
}

/* ============================================
   ESTILOS PARA PREÇO DE MEMBRO
   ============================================ */

.everbrew-member-price {
    position: relative;
}

.everbrew-member-price .member-badge {
    display: inline-block;
    padding: 4px 10px;
    background: linear-gradient(135deg, #f5a623, #f7c55a);
    color: #333;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    border-radius: 4px;
    margin-bottom: 6px;
}

.everbrew-member-price .savings {
    display: block;
    margin-top: 6px;
    color: #28a745;
    font-size: 12px;
    font-weight: 600;
}

/* ============================================
   ESTILOS PARA CASHBACK
   ============================================ */

.everbrew-cashback-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    padding: 6px 12px;
    background: linear-gradient(135deg, #28a745, #20c997);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    border-radius: 20px;
    box-shadow: 0 2px 4px rgba(40, 167, 69, 0.3);
}

.everbrew-cashback-badge .cashback-icon {
    font-size: 14px;
}

/* Variante para lista de produtos */
.woocommerce ul.products .everbrew-cashback-badge {
    font-size: 10px;
    padding: 4px 8px;
}

/* ============================================
   ESTILOS PARA MEMBER CTA
   ============================================ */

.member-cta {
    margin-top: 10px;
    padding: 8px 12px;
    background: linear-gradient(135deg, #f5a623, #f7c55a);
    border-radius: 4px;
}

.member-cta small {
    color: #333;
    font-weight: 600;
    font-size: 12px;
}

/* ============================================
   PRICE TOGGLE WRAPPER AJUSTES
   ============================================ */

.price-toggle-wrapper {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    flex-wrap: wrap;
}

.price-toggle-wrapper .price-member,
.price-toggle-wrapper .price-non-member {
    flex: 1;
    min-width: 100px;
    padding: 10px;
    border-radius: 6px;
    text-align: center;
    transition: all 0.3s ease;
}

.price-toggle-wrapper .price-member {
    background: linear-gradient(135deg, #fff5db, #fff9e6);
    border: 2px solid #f5a623;
}

.price-toggle-wrapper .price-member small {
    color: #b17a00;
    font-weight: 700;
    font-size: 11px;
}

.price-toggle-wrapper .price-non-member {
    background: #f8f9fa;
    border: 2px solid #e0e0e0;
}

.price-toggle-wrapper .price-non-member small {
    color: #666;
    font-weight: 600;
    font-size: 11px;
}

.price-toggle-wrapper .price-separator {
    display: none;
}

/* Responsivo para toggle */
@media (max-width: 480px) {
    .price-toggle-wrapper {
        flex-direction: column;
    }

    .price-toggle-wrapper .price-member,
    .price-toggle-wrapper .price-non-member {
        width: 100%;
    }
}

/* ============================================
   ESTILOS PARA "VOCÊ ECONOMIZA" (Widget Elementor)
   ============================================ */

.everbrew-price-display__savings {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #28a745;
}

.everbrew-price-display__savings-text {
    color: inherit;
}

.everbrew-price-display__savings-value {
    font-weight: 700;
    color: inherit;
}

/* Variante para layout compacto */
.everbrew-price-display--compact .everbrew-price-display__savings {
    font-size: 11px;
    margin-top: 4px;
}

/* Variante para layout empilhado */
.everbrew-price-display--stacked .everbrew-price-display__savings {
    justify-content: center;
}

/* Responsivo */
@media (max-width: 480px) {
    .everbrew-price-display__savings {
        font-size: 12px;
        flex-wrap: wrap;
        justify-content: center;
    }
}