/**
 * TUH Order Bump - Estilos do Item no Resumo do Pedido
 *
 * Este arquivo controla como o produto do Order Bump aparece
 * na lista de produtos do resumo do pedido (sidebar direita)
 * quando o usuário marca o checkbox e adiciona o bump ao carrinho.
 *
 * NOTA: Estes estilos são diferentes do card de oferta (base.css).
 * - base.css = Card amarelo com checkbox "OFERTA ESPECIAL"
 * - summary-item.css = Linha do produto no resumo quando adicionado
 *
 * @package TUH_Checkout
 * @subpackage OrderBump
 * @since 2.3.0
 */

/* =======================================================
   ITEM DO BUMP NO RESUMO DO PEDIDO
   Quando o bump é adicionado, aparece na lista de produtos
   com destaque visual diferenciado
   ======================================================= */

.tuh-product-item.tuh-bump-item {
    background: linear-gradient(135deg, rgba(140, 82, 255, 0.1) 0%, rgba(140, 82, 255, 0.05) 100%);
    border: 1px solid rgba(140, 82, 255, 0.2);
    border-radius: var(--tuh-radius-md, 8px);
}

.tuh-product-item.tuh-bump-item:hover {
    background: linear-gradient(135deg, rgba(140, 82, 255, 0.15) 0%, rgba(140, 82, 255, 0.08) 100%);
}

/* Badge "OFERTA" no item do resumo */
.tuh-bump-badge {
    display: inline-block;
    background: var(--tuh-primary, #8C52FF);
    color: white;
    font-size: 10px;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 4px;
    margin-top: 4px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* =======================================================
   OVERRIDES COM ALTA ESPECIFICIDADE
   Para garantir que os estilos sejam aplicados mesmo
   com CSS do tema interferindo
   ======================================================= */

html body.tuh-checkout-page .tuh-checkout-wrapper .tuh-product-item.tuh-bump-item {
    background: linear-gradient(135deg, rgba(140, 82, 255, 0.1) 0%, rgba(140, 82, 255, 0.05) 100%);
    border: 1px solid rgba(140, 82, 255, 0.2);
}

html body.tuh-checkout-page .tuh-checkout-wrapper .tuh-bump-badge {
    display: inline-block;
    background: var(--tuh-primary, #8C52FF);
    color: white;
    font-size: 10px;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 4px;
    margin-top: 4px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}