/* ============================================================ AFIKO — Estilos de marca para WooCommerce Carrito, checkout, "Mi cuenta" y avisos. Se apoya en los estilos nativos de WooCommerce (que ya cargan). ============================================================ */ /* OJO: WooCommerce añade la clase .woocommerce al entero, así que NO se le pone ancho/padding aquí (rompería toda la página). El contenedor lo aportan las plantillas del tema. */ /* Títulos */ .woocommerce h1, .woocommerce h2, .woocommerce h3 { font-family: var(--sans); color: var(--color-text); } .woocommerce .cart_totals h2, .woocommerce-checkout h3 { font-weight: 700; } /* ── Botones Afiko ────────────────────────────────────── */ .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit, .woocommerce .button.alt, .woocommerce-cart .wc-proceed-to-checkout a.checkout-button, .woocommerce #place_order { background: var(--color-primary-hover) !important; color: #fff !important; border: none !important; border-radius: var(--radius-pill) !important; font-family: var(--sans) !important; font-weight: 600 !important; font-size: 15px !important; padding: 13px 26px !important; text-transform: none !important; box-shadow: 0 4px 14px rgba(200,136,42,.28); transition: background .2s ease, transform .2s ease; } .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover, .woocommerce .button.alt:hover, .woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover, .woocommerce #place_order:hover { background: #A87020 !important; transform: translateY(-1px); } /* Botón secundario (actualizar carrito, aplicar cupón) */ .woocommerce button[name="update_cart"], .woocommerce .button[name="apply_coupon"] { background: var(--color-white) !important; color: var(--color-text) !important; border: 1.5px solid var(--color-border-strong) !important; box-shadow: none; } /* ── Precios ───────────────────────────────────────────── */ .woocommerce .price, .woocommerce .amount, .woocommerce .order-total .amount { color: var(--color-text); font-weight: 700; } .woocommerce .cart-subtotal .amount, .woocommerce .order-total .amount { color: var(--color-primary-hover); } /* ── Tablas (carrito, pedido) ──────────────────────────── */ .woocommerce table.shop_table { border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; border-collapse: separate; } .woocommerce table.shop_table th { background: var(--color-surface); color: var(--color-text); font-weight: 700; } .woocommerce table.shop_table td, .woocommerce table.shop_table th { border-top: 1px solid var(--color-border); padding: 14px 16px; } .woocommerce .cart img, .woocommerce-cart .product-thumbnail img { border-radius: var(--radius-md); } /* ── Formularios (checkout, cuenta) ───────────────────── */ .woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce .select2-container--default .select2-selection--single, .woocommerce-page input[type="text"], .woocommerce-page input[type="email"], .woocommerce-page input[type="tel"], .woocommerce-page input[type="password"], .woocommerce-page textarea, .woocommerce-page select { border: 1.5px solid var(--color-border) !important; border-radius: var(--radius-md) !important; padding: 12px 14px !important; color: var(--color-text); background: var(--color-white); } .woocommerce form .form-row input.input-text:focus, .woocommerce-page input:focus, .woocommerce-page textarea:focus { outline: none; border-color: var(--color-primary) !important; box-shadow: 0 0 0 3px rgba(238,172,92,.18); } .woocommerce-checkout #payment { background: var(--color-surface); border-radius: var(--radius-lg); border: 1px solid var(--color-border); } .woocommerce-checkout #payment ul.payment_methods { border-bottom: 1px solid var(--color-border); } /* ── Avisos (mensajes de WooCommerce) ─────────────────── */ .woocommerce-message, .woocommerce-info, .woocommerce-error { border-radius: var(--radius-md); border-top-color: var(--color-primary) !important; background: var(--color-surface); } .woocommerce-message { border-top-color: var(--color-accent) !important; } .woocommerce-error { border-top-color: var(--color-error) !important; } /* ── Mi cuenta ────────────────────────────────────────── */ .woocommerce-account .woocommerce-MyAccount-navigation ul { border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; } .woocommerce-account .woocommerce-MyAccount-navigation li { border-bottom: 1px solid var(--color-border); } .woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { background: var(--color-primary-light); color: var(--color-primary-hover); } /* Cupones / notas */ .woocommerce .cart .actions .coupon .input-text { border-radius: var(--radius-pill) !important; } /* ── Carrito sin imágenes de producto (se deformaban) ── */ .woocommerce-cart table.cart .product-thumbnail, .woocommerce-cart table.cart th.product-thumbnail { display: none; }