.elementor-11 .elementor-element.elementor-element-ada46fa{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:40px;--margin-bottom:40px;--margin-left:0px;--margin-right:0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );text-transform:var( --e-global-typography-primary-text-transform );color:var( --e-global-color-primary );}.elementor-11 .elementor-element.elementor-element-32ecadec{--display:flex;}@media(min-width:481px){.elementor-11 .elementor-element.elementor-element-ada46fa{--content-width:1280px;}.elementor-11 .elementor-element.elementor-element-32ecadec{--content-width:1280px;}}/* Start custom CSS *//* ============================================================
   ESTULIN.MEDIA — WooCommerce Checkout Estilizado
   Paleta: #0a0a0a bg | #2E2E2E grafito | #FFD700 dorado
           #A4161A rojo | #FFFFFF blanco
   Tipografía: Montserrat (Google Fonts)
   Scope: /finalizar-compra/ (checkout estándar WooCommerce)
   ============================================================ */

/* --- GOOGLE FONTS IMPORT (si no está ya en el tema) --- */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap');

/* ============================================================
   1. CONTENEDOR GENERAL Y TIPOGRAFÍA BASE
   ============================================================ */

.woocommerce-checkout,
.woocommerce-checkout * {
    font-family: 'Montserrat', sans-serif !important;
    box-sizing: border-box;
}

/* Título de página */
.woocommerce-checkout h1.entry-title,
.woocommerce-checkout h1,
body.woocommerce-checkout .page-title {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #FFD700;
    text-align: center;
    font-size: clamp(1.6rem, 3vw, 2.4rem);
    margin-bottom: 2rem;
}

/* ============================================================
   2. SECCIONES / FIELDSETS
   ============================================================ */

.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-additional-fields {
    background: #141414;
    border: 1px solid #2E2E2E;
    border-radius: 4px;
    padding: 1.8rem 2rem;
    margin-bottom: 1.5rem;
}

/* Títulos de sección (h3) */
.woocommerce-checkout h3,
.woocommerce-checkout #order_review_heading {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 700;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: #FFD700;
    border-bottom: 1px solid #2E2E2E;
    padding-bottom: 0.75rem;
    margin-bottom: 1.5rem;
}

/* ============================================================
   3. CAMPOS DE FORMULARIO
   ============================================================ */

/* Labels */
.woocommerce-checkout .form-row label,
.woocommerce-checkout label {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #888;
    margin-bottom: 0.4rem;
    display: block;
}

/* Inputs y Textareas */
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout input[type="password"],
.woocommerce-checkout textarea {
    background: #1a1a1a !important;
    border: 1px solid #2E2E2E !important;
    border-radius: 3px !important;
    color: #FFFFFF !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 0.875rem !important;
    font-weight: 400 !important;
    padding: 0.75rem 1rem !important;
    width: 100% !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
    outline: none !important;
    -webkit-appearance: none;
}

.woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout input[type="text"]:focus,
.woocommerce-checkout input[type="email"]:focus,
.woocommerce-checkout input[type="tel"]:focus,
.woocommerce-checkout input[type="password"]:focus,
.woocommerce-checkout textarea:focus {
    border-color: #FFD700 !important;
    box-shadow: 0 0 0 2px rgba(255, 215, 0, 0.12) !important;
}

/* Selects */
.woocommerce-checkout .form-row select,
.woocommerce-checkout select {
    background: #1a1a1a !important;
    border: 1px solid #2E2E2E !important;
    border-radius: 3px !important;
    color: #FFFFFF !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 0.875rem !important;
    padding: 0.75rem 1rem !important;
    width: 100% !important;
    -webkit-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23FFD700' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 1rem center !important;
    cursor: pointer;
    transition: border-color 0.2s ease !important;
}

.woocommerce-checkout .form-row select:focus,
.woocommerce-checkout select:focus {
    border-color: #FFD700 !important;
    outline: none !important;
}

/* Select2 (WooCommerce usa Select2 para país/estado) */
.woocommerce-checkout .select2-container .select2-selection--single {
    background: #1a1a1a !important;
    border: 1px solid #2E2E2E !important;
    border-radius: 3px !important;
    height: 44px !important;
    display: flex;
    align-items: center;
}

.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__rendered {
    color: #FFFFFF !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 0.875rem !important;
    line-height: 44px !important;
    padding-left: 1rem !important;
}

.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__arrow {
    height: 44px !important;
}

.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__arrow b {
    border-color: #FFD700 transparent transparent transparent !important;
}

.woocommerce-checkout .select2-container--open .select2-selection--single {
    border-color: #FFD700 !important;
}

/* Select2 Dropdown */
.select2-dropdown {
    background: #1a1a1a !important;
    border: 1px solid #FFD700 !important;
    border-radius: 3px !important;
}

.select2-results__option {
    color: #FFFFFF !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 0.85rem !important;
    padding: 0.6rem 1rem !important;
}

.select2-results__option--highlighted {
    background: #FFD700 !important;
    color: #0a0a0a !important;
}

.select2-search--dropdown .select2-search__field {
    background: #0a0a0a !important;
    border: 1px solid #2E2E2E !important;
    color: #FFFFFF !important;
    font-family: 'Montserrat', sans-serif !important;
}

/* ============================================================
   4. CAMPOS OPCIONALES Y SIMPLIFICACIÓN DE DIRECCIÓN
   ============================================================ */

/* Reducir peso visual del bloque de dirección:
   los campos opcionales se muestran más discretos */
.woocommerce-checkout .form-row.notes,
.woocommerce-checkout #billing_address_2_field,
.woocommerce-checkout #billing_company_field {
    opacity: 0.6;
    transition: opacity 0.2s ease;
}

.woocommerce-checkout .form-row.notes:focus-within,
.woocommerce-checkout #billing_address_2_field:focus-within,
.woocommerce-checkout #billing_company_field:focus-within {
    opacity: 1;
}

/* Ocultar el enlace "Añadir empresa" si no es necesario */
.woocommerce-checkout .woocommerce-form__label-for-checkbox.woocommerce-form-login__rememberme {
    color: #888;
    font-size: 0.8rem;
}

/* ============================================================
   5. CHECKBOX (guardar info, acepto términos)
   ============================================================ */

.woocommerce-checkout .form-row input[type="checkbox"] {
    width: 16px !important;
    height: 16px !important;
    accent-color: #FFD700;
    cursor: pointer;
    margin-right: 0.5rem;
    flex-shrink: 0;
}

.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper {
    color: #888;
    font-size: 0.8rem;
}

.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper a {
    color: #FFD700;
    text-decoration: none;
}

.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper a:hover {
    text-decoration: underline;
}

/* ============================================================
   6. RESUMEN DEL PEDIDO (ORDER REVIEW)
   ============================================================ */

.woocommerce-checkout #order_review {
    background: #141414;
    border: 1px solid #2E2E2E;
    border-radius: 4px;
    padding: 1.8rem 2rem;
}

/* Tabla de productos */
.woocommerce-checkout table.shop_table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1rem;
}

.woocommerce-checkout table.shop_table thead th {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: #555;
    border-bottom: 1px solid #2E2E2E;
    padding: 0 0 0.75rem 0;
}

.woocommerce-checkout table.shop_table tbody tr td {
    padding: 1rem 0;
    border-bottom: 1px solid #1e1e1e;
    color: #FFFFFF;
    font-size: 0.875rem;
    vertical-align: middle;
}

/* Nombre del producto */
.woocommerce-checkout table.shop_table tbody .cart_item .product-name {
    font-weight: 600;
    color: #FFFFFF;
}

/* Precio en la tabla */
.woocommerce-checkout table.shop_table tbody .cart_item .product-total {
    color: #FFD700;
    font-weight: 700;
    text-align: right;
}

/* Subtotal / Total rows */
.woocommerce-checkout table.shop_table tfoot tr th,
.woocommerce-checkout table.shop_table tfoot tr td {
    padding: 0.6rem 0;
    font-size: 0.85rem;
    border-top: 1px solid #2E2E2E;
}

.woocommerce-checkout table.shop_table tfoot tr th {
    color: #888;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.7rem;
    letter-spacing: 0.1em;
}

.woocommerce-checkout table.shop_table tfoot tr td {
    color: #FFFFFF;
    text-align: right;
}

/* Fila TOTAL destacada */
.woocommerce-checkout table.shop_table tfoot .order-total th,
.woocommerce-checkout table.shop_table tfoot .order-total td {
    font-weight: 700;
    font-size: 1rem;
    color: #FFD700;
    border-top: 1px solid #FFD700;
    padding-top: 1rem;
}

/* ============================================================
   7. CUPONES
   ============================================================ */

.woocommerce-checkout .woocommerce-form-coupon-toggle,
.woocommerce-checkout .checkout_coupon {
    background: #111;
    border: 1px solid #2E2E2E;
    border-radius: 3px;
    padding: 1rem 1.5rem;
    margin-bottom: 1rem;
}

.woocommerce-checkout .woocommerce-info {
    background: transparent;
    border-top: none;
    border-left: 2px solid #FFD700;
    color: #888;
    font-size: 0.8rem;
    padding: 0.5rem 1rem;
    margin-bottom: 1rem;
}

.woocommerce-checkout .woocommerce-info a {
    color: #FFD700;
    font-weight: 600;
    text-decoration: none;
}

/* ============================================================
   8. BOTÓN REALIZAR EL PEDIDO
   ============================================================ */

.woocommerce-checkout #place_order,
.woocommerce-checkout button[type="submit"]#place_order {
    background: #FFD700 !important;
    color: #0a0a0a !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 700 !important;
    font-size: 0.85rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.12em !important;
    border: none !important;
    border-radius: 3px !important;
    padding: 1rem 2rem !important;
    width: 100% !important;
    cursor: pointer !important;
    transition: background 0.2s ease, transform 0.1s ease, box-shadow 0.2s ease !important;
    box-shadow: 0 4px 20px rgba(255, 215, 0, 0.2) !important;
}

.woocommerce-checkout #place_order:hover {
    background: #e6c200 !important;
    box-shadow: 0 6px 28px rgba(255, 215, 0, 0.35) !important;
    transform: translateY(-1px) !important;
}

.woocommerce-checkout #place_order:active {
    transform: translateY(0) !important;
    box-shadow: 0 2px 10px rgba(255, 215, 0, 0.2) !important;
}

/* ============================================================
   9. MENSAJES DE ERROR Y VALIDACIÓN
   ============================================================ */

.woocommerce-checkout .woocommerce-error,
.woocommerce-checkout ul.woocommerce-error {
    background: rgba(164, 22, 26, 0.15) !important;
    border-left: 3px solid #A4161A !important;
    border-radius: 3px;
    color: #ff6b6b !important;
    list-style: none !important;
    padding: 1rem 1.25rem !important;
    margin-bottom: 1.5rem !important;
    font-size: 0.85rem;
}

.woocommerce-checkout .woocommerce-error li::before {
    content: '⚠ ';
    color: #A4161A;
}

/* Campos con error */
.woocommerce-checkout .form-row.woocommerce-invalid input,
.woocommerce-checkout .form-row.woocommerce-invalid select {
    border-color: #A4161A !important;
}

.woocommerce-checkout .form-row.woocommerce-invalid label {
    color: #ff6b6b !important;
}

/* Mensaje de "No hay métodos de pago disponibles" */
.woocommerce-checkout .woocommerce-no-payment-needed,
.woocommerce-checkout p.no-payment {
    color: #888;
    font-size: 0.85rem;
    text-align: center;
    padding: 1rem;
    border: 1px dashed #2E2E2E;
    border-radius: 3px;
}

/* Alert de pago no disponible (el que se ve en el screenshot) */
.woocommerce-checkout .payment_box,
.woocommerce-checkout #payment .woocommerce-info,
.woocommerce-checkout .wc-no-payment-needed-overlay {
    background: rgba(164, 22, 26, 0.1) !important;
    border: 1px solid rgba(164, 22, 26, 0.3) !important;
    border-radius: 3px;
    color: #ff9999 !important;
    font-size: 0.85rem;
    padding: 1rem 1.25rem;
}

/* ============================================================
   10. MÉTODOS DE PAGO (cuando Stripe esté activo)
   ============================================================ */

.woocommerce-checkout #payment {
    background: #141414;
    border: 1px solid #2E2E2E;
    border-radius: 4px;
    overflow: hidden;
    margin-top: 1.5rem;
}

.woocommerce-checkout #payment ul.payment_methods {
    list-style: none;
    padding: 1rem 1.5rem;
    margin: 0;
    border-bottom: 1px solid #2E2E2E;
}

.woocommerce-checkout #payment ul.payment_methods li {
    padding: 0.75rem 0;
    border-bottom: 1px solid #1e1e1e;
    color: #FFFFFF;
    font-size: 0.875rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.woocommerce-checkout #payment ul.payment_methods li:last-child {
    border-bottom: none;
}

.woocommerce-checkout #payment ul.payment_methods li label {
    color: #FFFFFF !important;
    font-size: 0.875rem !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-weight: 500 !important;
    cursor: pointer;
}

.woocommerce-checkout #payment ul.payment_methods li input[type="radio"] {
    accent-color: #FFD700;
    width: 16px;
    height: 16px;
}

.woocommerce-checkout #payment .payment_box {
    background: #111 !important;
    border: none !important;
    padding: 1rem 1.5rem !important;
    color: #888 !important;
    font-size: 0.85rem !important;
}

/* Stripe card element */
.woocommerce-checkout .StripeElement {
    background: #1a1a1a !important;
    border: 1px solid #2E2E2E !important;
    border-radius: 3px !important;
    padding: 0.75rem 1rem !important;
    transition: border-color 0.2s ease !important;
}

.woocommerce-checkout .StripeElement--focus {
    border-color: #FFD700 !important;
}

/* Div de aceptación de pago / botón wrap */
.woocommerce-checkout #payment .place-order {
    padding: 1.5rem;
}

/* ============================================================
   11. ENLACE "VOLVER AL CARRITO"
   ============================================================ */

.woocommerce-checkout .return-to-shop a,
.woocommerce-checkout a.showcoupon,
.woocommerce-checkout .woocommerce-checkout-login a {
    color: #FFD700;
    text-decoration: none;
    font-size: 0.8rem;
    font-weight: 600;
    transition: color 0.2s ease;
}

.woocommerce-checkout .return-to-shop a:hover,
.woocommerce-checkout a.showcoupon:hover {
    color: #e6c200;
}

/* ============================================================
   12. NOTA DEL PEDIDO
   ============================================================ */

.woocommerce-checkout #order_comments {
    min-height: 80px;
    resize: vertical;
}

/* ============================================================
   13. SPINNER / LOADING
   ============================================================ */

.woocommerce-checkout .blockUI.blockOverlay {
    background: rgba(10, 10, 10, 0.7) !important;
}

.woocommerce-checkout .blockUI.blockOverlay::before {
    border-top-color: #FFD700 !important;
}


/* ============================================================
   14. LAYOUT DOS COLUMNAS  (bloque único consolidado)
   ============================================================
   Estructura real del form:
     form.woocommerce-checkout
       ├── #customer_details.col2-set   (columna izquierda)
       ├── h3#order_review_heading       (columna derecha, arriba)
       └── #order_review                 (columna derecha, abajo)

   SOLUCIÓN AL ESPACIO FANTASMA:
   El truco está en NO usar dos filas explícitas en la columna
   derecha. Si la fila del #order_review es "1fr" o cualquier cosa
   estirable, el grid la expande para igualar la altura de
   #customer_details (que es más alto) y aparece un hueco entre el
   heading y la tabla.

   Para evitarlo: filas con "auto" (nunca 1fr) + align-self:start.
   Así cada fila toma solo la altura de su contenido y el espacio
   sobrante queda al final de la columna, no entre los bloques.
   ============================================================ */

/* Reset de floats y clearfix de WooCommerce */
.woocommerce-checkout form.woocommerce-checkout::before,
.woocommerce-checkout form.woocommerce-checkout::after {
    display: none !important;
}

/* Grid principal — DEFINICIÓN ÚNICA */
.woocommerce-checkout form.woocommerce-checkout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 460px) !important;
    grid-template-rows: auto auto !important;          /* NUNCA 1fr */
    grid-template-areas:
        "left right-heading"
        "left right-review" !important;
    gap: 0 2rem !important;
    align-items: start !important;
    align-content: start !important;                   /* filas pegadas arriba */
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    float: none !important;
}

/* Columna izquierda */
.woocommerce-checkout form.woocommerce-checkout > #customer_details {
    grid-area: left !important;
    align-self: start !important;
    float: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

/* Heading "Tu pedido" — columna derecha, fila 1 */
.woocommerce-checkout form.woocommerce-checkout > #order_review_heading {
    grid-area: right-heading !important;
    align-self: start !important;
    margin: 0 !important;
    padding: 1.25rem 1.5rem !important;
    background: #141414 !important;
    border: 1px solid #2E2E2E !important;
    border-bottom: none !important;
    border-radius: 4px 4px 0 0 !important;
    font-size: 0.75rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.15em !important;
    color: #FFD700 !important;
    font-weight: 700 !important;
}

/* Resumen + pago — columna derecha, fila 2 */
.woocommerce-checkout form.woocommerce-checkout > #order_review {
    grid-area: right-review !important;
    align-self: start !important;            /* CLAVE: no se estira */
    float: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 1rem 1.5rem 1.5rem !important;
    background: #141414 !important;
    border: 1px solid #2E2E2E !important;
    border-top: none !important;
    border-radius: 0 0 4px 4px !important;
}

/* Anular margen superior de la tabla dentro de order_review */
.woocommerce-checkout #order_review > *:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.woocommerce-checkout #order_review > table.shop_table {
    margin: 0 !important;
}

/* #customer_details: apilar .col-1 y .col-2 verticalmente */
.woocommerce-checkout #customer_details {
    display: block !important;
    width: 100% !important;
}

.woocommerce-checkout #customer_details::before,
.woocommerce-checkout #customer_details::after {
    display: none !important;
}

.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 {
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    margin-bottom: 1.5rem !important;
}

/* "Información adicional" misma estética que facturación */
.woocommerce-checkout .woocommerce-additional-fields {
    background: #141414 !important;
    border: 1px solid #2E2E2E !important;
    border-radius: 4px !important;
    padding: 1.8rem 2rem !important;
}

/* El iframe de Stripe no debe forzar ancho mayor al contenedor */
.woocommerce-checkout #wc-stripe-card-element,
.woocommerce-checkout #wc-stripe-card-element iframe {
    max-width: 100% !important;
    min-width: 0 !important;
}

/* ============================================================
   15. RESPONSIVE — una columna por debajo de 900px
   ============================================================ */

@media (max-width: 900px) {
    .woocommerce-checkout form.woocommerce-checkout {
        grid-template-columns: 1fr !important;
        grid-template-rows: auto !important;
        grid-template-areas:
            "left"
            "right-heading"
            "right-review" !important;
        gap: 1rem 0 !important;
    }

    .woocommerce-checkout form.woocommerce-checkout > #customer_details,
    .woocommerce-checkout form.woocommerce-checkout > #order_review_heading,
    .woocommerce-checkout form.woocommerce-checkout > #order_review {
        grid-column: 1 !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        position: static !important;
    }

    .woocommerce-checkout .woocommerce-billing-fields,
    .woocommerce-checkout .woocommerce-additional-fields {
        padding: 1.25rem 1rem !important;
    }

    .woocommerce-checkout .form-row-first,
    .woocommerce-checkout .form-row-last {
        width: 100% !important;
        float: none !important;
        margin-right: 0 !important;
    }

    .woocommerce-checkout #place_order {
        font-size: 0.8rem !important;
        padding: 0.9rem 1.5rem !important;
    }
}

/* ============================================================
   16. AJUSTES FINALES (iconos, avisos, tabla, links)
   ============================================================ */

/* --- Iconos rotos de WooCommerce en los avisos superiores --- */
/* Hello Elementor no carga la fuente de iconos de WC, así que el
   pseudoelemento sale como cuadradito/carácter azul. Lo ocultamos. */
.woocommerce-checkout .woocommerce-info::before,
.woocommerce-checkout .woocommerce-message::before,
.woocommerce-checkout .woocommerce-error::before,
.woocommerce-checkout .woocommerce-form-login-toggle::before,
.woocommerce-checkout .woocommerce-form-coupon-toggle::before {
    display: none !important;
}

/* Avisos superiores (cliente y cupón) con estética de marca */
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info,
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
    background: #141414 !important;
    border: 1px solid #2E2E2E !important;
    border-left: 3px solid #FFD700 !important;
    border-radius: 3px !important;
    color: #ccc !important;
    padding: 1rem 1.25rem !important;
    margin-bottom: 1rem !important;
    font-size: 0.85rem !important;
}

.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info a,
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info a {
    color: #FFD700 !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info a:hover,
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info a:hover {
    color: #e6c200 !important;
    text-decoration: underline !important;
}


/* --- Tabla de resumen sin líneas, más limpia --- */
.woocommerce-checkout table.shop_table,
.woocommerce-checkout table.shop_table thead,
.woocommerce-checkout table.shop_table tbody,
.woocommerce-checkout table.shop_table tfoot,
.woocommerce-checkout table.shop_table tr,
.woocommerce-checkout table.shop_table th,
.woocommerce-checkout table.shop_table td {
    border: none !important;
    border-bottom: none !important;
    border-top: none !important;
}

/* Eliminar cabecera (Producto / Subtotal) — redundante */
.woocommerce-checkout table.shop_table thead {
    display: none !important;
}

/* Filas de producto: simples, sin bordes, con respiración */
.woocommerce-checkout table.shop_table tbody .cart_item td {
    padding: 0.6rem 0 !important;
    background: transparent !important;
    font-size: 0.9rem !important;
}

.woocommerce-checkout table.shop_table tbody .cart_item .product-name {
    color: #FFFFFF !important;
    font-weight: 500 !important;
}

.woocommerce-checkout table.shop_table tbody .cart_item .product-name strong.product-quantity {
    color: #888 !important;
    font-weight: 400 !important;
    margin-left: 0.3rem !important;
}

.woocommerce-checkout table.shop_table tbody .cart_item .product-total {
    color: #FFFFFF !important;
    font-weight: 600 !important;
    text-align: right !important;
    white-space: nowrap !important;
}

/* Separador sutil entre items y subtotales */
.woocommerce-checkout table.shop_table tfoot tr:first-child th,
.woocommerce-checkout table.shop_table tfoot tr:first-child td {
    border-top: 1px solid #2E2E2E !important;
    padding-top: 1rem !important;
}

/* Subtotal */
.woocommerce-checkout table.shop_table tfoot .cart-subtotal th,
.woocommerce-checkout table.shop_table tfoot .cart-subtotal td {
    padding: 0.5rem 0 !important;
    font-size: 0.8rem !important;
    background: transparent !important;
}

.woocommerce-checkout table.shop_table tfoot .cart-subtotal th {
    color: #888 !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
}

.woocommerce-checkout table.shop_table tfoot .cart-subtotal td {
    color: #ccc !important;
    text-align: right !important;
}

/* Total destacado pero sin línea superior dorada chillona */
.woocommerce-checkout table.shop_table tfoot .order-total th,
.woocommerce-checkout table.shop_table tfoot .order-total td {
    padding: 0.85rem 0 0.5rem 0 !important;
    font-size: 1rem !important;
    background: transparent !important;
    border-top: none !important;
}

.woocommerce-checkout table.shop_table tfoot .order-total th {
    color: #FFD700 !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    font-size: 0.8rem !important;
}

.woocommerce-checkout table.shop_table tfoot .order-total td {
    color: #FFD700 !important;
    font-weight: 700 !important;
    text-align: right !important;
    font-size: 1.1rem !important;
}

/* --- Links de política de privacidad en amarillo --- */
.woocommerce-checkout .woocommerce-privacy-policy-text a,
.woocommerce-checkout .woocommerce-privacy-policy-text a:visited,
.woocommerce-checkout a.woocommerce-privacy-policy-link {
    color: #FFD700 !important;
    text-decoration: none !important;
    font-weight: 600 !important;
}

.woocommerce-checkout .woocommerce-privacy-policy-text a:hover,
.woocommerce-checkout a.woocommerce-privacy-policy-link:hover {
    color: #e6c200 !important;
    text-decoration: underline !important;
}

/* También los links rojos dentro de los consentimientos legales */
.woocommerce-checkout .estulin-consent-text a,
.woocommerce-checkout .estulin-consent-text a:visited {
    color: #FFD700 !important;
    text-decoration: none !important;
    font-weight: 600 !important;
}

.woocommerce-checkout .estulin-consent-text a:hover {
    color: #e6c200 !important;
    text-decoration: underline !important;
}

/* ============================================================
   20. STRIPE — Woo Stripe Payment (Payment Plugins)
   ============================================================ */

/* Anular la clase 'stripe-small' que el plugin añade y rompe el layout */
.woocommerce-checkout #payment ul.payment_methods.stripe-small {
    /* No se puede quitar la clase desde CSS, pero sí su efecto */
}

/* Contenedor del método Stripe */
.woocommerce-checkout #payment ul.payment_methods li.payment_method_stripe_cc {
    display: block !important;
    padding: 0 !important;
    border: 1px solid #2E2E2E !important;
    border-radius: 4px !important;
    background: #141414 !important;
    margin-bottom: 1rem !important;
    overflow: hidden !important;
}

/* Cabecera: "Tarjetas de crédito/débito" + iconos */
.woocommerce-checkout #payment ul.payment_methods li.payment_method_stripe_cc > label {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 1rem !important;
    padding: 1rem 1.25rem !important;
    margin: 0 !important;
    background: #1a1a1a !important;
    border-bottom: 1px solid #2E2E2E !important;
    color: #FFFFFF !important;
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Ocultar input radio (solo hay un método, no hace falta) */
.woocommerce-checkout #payment ul.payment_methods li.payment_method_stripe_cc input.input-radio {
    display: none !important;
}

/* Contenedor de iconos VISA/Mastercard/Amex/Discover */
.woocommerce-checkout .wc-stripe-card-icons-container {
    display: flex !important;
    align-items: center !important;
    gap: 0.4rem !important;
    flex-shrink: 0 !important;
}

.woocommerce-checkout .wc-stripe-card-icon {
    height: 22px !important;
    width: auto !important;
    border-radius: 3px !important;
    display: block !important;
}

/* Caja del método de pago (contiene iframe Stripe) */
.woocommerce-checkout #payment .payment_box.payment_method_stripe_cc {
    display: block !important;
    background: #141414 !important;
    border: none !important;
    padding: 1.25rem !important;
    margin: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    color: #ccc !important;
}

/* Eliminar la flecha/triángulo que WooCommerce añade arriba del payment_box */
.woocommerce-checkout #payment .payment_box::before {
    display: none !important;
}

/* Contenedor del iframe de Stripe */
.woocommerce-checkout .wc-stripe_cc-container,
.woocommerce-checkout .wc-stripe-gateway-container,
.woocommerce-checkout .wc-stripe_cc-new-method-container {
    display: block !important;
    width: 100% !important;
    background: transparent !important;
}

/* El iframe propiamente dicho — forzar ancho completo */
.woocommerce-checkout #wc-stripe-card-element,
.woocommerce-checkout .StripeElement {
    display: block !important;
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}

.woocommerce-checkout #wc-stripe-card-element iframe,
.woocommerce-checkout .StripeElement iframe {
    width: 100% !important;
    min-width: 100% !important;
}

/* Checkbox "Guardar la tarjeta" */
.woocommerce-checkout .wc-stripe-save-source {
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    margin-top: 1rem !important;
    padding-top: 1rem !important;
    border-top: 1px solid #2E2E2E !important;
}

.woocommerce-checkout .wc-stripe-save-source .checkbox {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
}

.woocommerce-checkout .wc-stripe-save-source input[type="checkbox"] {
    width: 16px !important;
    height: 16px !important;
    accent-color: #FFD700 !important;
    margin: 0 !important;
    cursor: pointer !important;
}

.woocommerce-checkout .wc-stripe-save-source .save-source-label {
    color: #ccc !important;
    font-size: 0.85rem !important;
    margin: 0 !important;
    cursor: pointer !important;
}

.woocommerce-checkout .wc-stripe-save-source .save-source-checkbox {
    display: none !important;
}

/* Texto "Al suscribirte..." legal de Stripe */
.woocommerce-checkout .payment_method_stripe_cc .wc-stripe-cc-form-fields-terms,
.woocommerce-checkout .payment_method_stripe_cc p:has(+ .wc-stripe-save-source) {
    color: #888 !important;
    font-size: 0.75rem !important;
    line-height: 1.4 !important;
    margin: 1rem 0 0 0 !important;
}

/* ============================================================/* End custom CSS */