/**
 * UltraPC Checkout
 * Rediseño visual 2026
 */

/* =========================================================
   01. BASE GENERAL DEL CHECKOUT
   ========================================================= */

body.woocommerce-checkout {
    background: #f6f8fb;
}

body.woocommerce-checkout .site-content,
body.woocommerce-checkout .site-main {
    background: #f6f8fb;
}


/* =========================================================
   02. TARJETAS PRINCIPALES DEL FORMULARIO
   ========================================================= */

body.woocommerce-checkout .woocommerce-billing-fields,
body.woocommerce-checkout .woocommerce-shipping-fields,
body.woocommerce-checkout .woocommerce-additional-fields {
    background: #ffffff;
    border: 1px solid #e7ebf0;
    border-radius: 14px;
    padding: 28px 30px;
    margin-bottom: 24px;
    box-shadow: 0 4px 18px rgba(20, 40, 70, 0.05);
}


/* Títulos de cada bloque */
body.woocommerce-checkout .woocommerce-billing-fields > h3,
body.woocommerce-checkout .woocommerce-shipping-fields > h3,
body.woocommerce-checkout .woocommerce-additional-fields > h3 {
    margin: 0 0 24px;
    padding: 0 0 16px;
    border-bottom: 1px solid #edf0f4;

    font-size: 21px;
    font-weight: 700;
    line-height: 1.3;
    color: #1f2937;
}


/* Mejorar separación interna */
body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
body.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper {
    margin-top: 0;
}


/* Responsive básico de las tarjetas */
@media (max-width: 767px) {

    body.woocommerce-checkout .woocommerce-billing-fields,
    body.woocommerce-checkout .woocommerce-shipping-fields,
    body.woocommerce-checkout .woocommerce-additional-fields {
        padding: 20px 18px;
        border-radius: 12px;
        margin-bottom: 18px;
    }

    body.woocommerce-checkout .woocommerce-billing-fields > h3,
    body.woocommerce-checkout .woocommerce-shipping-fields > h3,
    body.woocommerce-checkout .woocommerce-additional-fields > h3 {
        font-size: 19px;
    }
}


/* =========================================================
   03. CAMPOS, SELECTS Y TEXTAREAS
   ========================================================= */

/* Etiquetas */
body.woocommerce-checkout .form-row label {
    display: block;
    margin-bottom: 7px;

    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;

    color: #374151;
}


/* Campos normales */
body.woocommerce-checkout .input-text,
body.woocommerce-checkout input[type="text"],
body.woocommerce-checkout input[type="email"],
body.woocommerce-checkout input[type="tel"],
body.woocommerce-checkout input[type="number"],
body.woocommerce-checkout input[type="password"],
body.woocommerce-checkout select,
body.woocommerce-checkout textarea {

    width: 100%;

    min-height: 48px;

    padding: 11px 14px;

    background: #ffffff;

    border: 1px solid #d8dee8;
    border-radius: 9px;

    color: #1f2937;

    font-size: 15px;
    line-height: 1.4;

    box-shadow: none;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        background-color 0.2s ease;
}


/* Textarea */
body.woocommerce-checkout textarea {
    min-height: 110px;
    resize: vertical;
}


/* Hover */
body.woocommerce-checkout .input-text:hover,
body.woocommerce-checkout input[type="text"]:hover,
body.woocommerce-checkout input[type="email"]:hover,
body.woocommerce-checkout input[type="tel"]:hover,
body.woocommerce-checkout select:hover,
body.woocommerce-checkout textarea:hover {
    border-color: #b7c2d0;
}


/* Campo activo */
body.woocommerce-checkout .input-text:focus,
body.woocommerce-checkout input[type="text"]:focus,
body.woocommerce-checkout input[type="email"]:focus,
body.woocommerce-checkout input[type="tel"]:focus,
body.woocommerce-checkout input[type="number"]:focus,
body.woocommerce-checkout input[type="password"]:focus,
body.woocommerce-checkout select:focus,
body.woocommerce-checkout textarea:focus {

    outline: none;

    border-color: #1473e6;

    box-shadow:
        0 0 0 3px rgba(20, 115, 230, 0.12);

    background: #ffffff;
}


/* Placeholder */
body.woocommerce-checkout input::placeholder,
body.woocommerce-checkout textarea::placeholder {
    color: #9ca3af;
    opacity: 1;
}


/* Separación de cada campo */
body.woocommerce-checkout .form-row {
    margin-bottom: 18px;
}


/* Campos obligatorios */
body.woocommerce-checkout .required {
    color: #dc2626;
    text-decoration: none;
}


/* =========================================================
   SELECT2 - Región / Comuna / campos WooCommerce
   ========================================================= */

body.woocommerce-checkout
.select2-container--default
.select2-selection--single {

    height: 48px;

    background: #ffffff;

    border: 1px solid #d8dee8;
    border-radius: 9px;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}


body.woocommerce-checkout
.select2-container--default
.select2-selection--single
.select2-selection__rendered {

    height: 46px;
    line-height: 46px;

    padding-left: 14px;
    padding-right: 36px;

    color: #1f2937;

    font-size: 15px;
}


body.woocommerce-checkout
.select2-container--default
.select2-selection--single
.select2-selection__arrow {

    height: 46px;
    right: 8px;
}


/* Select2 activo */
body.woocommerce-checkout
.select2-container--default.select2-container--focus
.select2-selection--single,

body.woocommerce-checkout
.select2-container--default.select2-container--open
.select2-selection--single {

    border-color: #1473e6;

    box-shadow:
        0 0 0 3px rgba(20, 115, 230, 0.12);
}


/* Dropdown Select2 */
body.woocommerce-checkout .select2-dropdown {

    border: 1px solid #d8dee8;

    border-radius: 9px;

    overflow: hidden;

    box-shadow:
        0 10px 30px rgba(20, 40, 70, 0.12);
}


/* Resultado seleccionado */
body.woocommerce-checkout
.select2-container--default
.select2-results__option--highlighted[aria-selected] {

    background: #1473e6;
}


/* =========================================================
   ESTADO DE ERROR
   ========================================================= */

body.woocommerce-checkout
.woocommerce-invalid
.input-text,

body.woocommerce-checkout
.woocommerce-invalid
.select2-selection {

    border-color: #dc2626 !important;

    box-shadow:
        0 0 0 3px rgba(220, 38, 38, 0.08);
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout .input-text,
    body.woocommerce-checkout input[type="text"],
    body.woocommerce-checkout input[type="email"],
    body.woocommerce-checkout input[type="tel"],
    body.woocommerce-checkout input[type="number"],
    body.woocommerce-checkout input[type="password"],
    body.woocommerce-checkout select,
    body.woocommerce-checkout textarea {

        font-size: 16px;
        min-height: 48px;
    }

}


/* =========================================================
   04. DISTRIBUCIÓN DE CAMPOS EN DOS COLUMNAS
   ========================================================= */

/*
 * WooCommerce utiliza:
 * .form-row-first
 * .form-row-last
 * .form-row-wide
 *
 * Aprovechamos esas clases sin modificar la lógica PHP.
 */

body.woocommerce-checkout
.woocommerce-billing-fields__field-wrapper,

body.woocommerce-checkout
.woocommerce-shipping-fields__field-wrapper {

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    column-gap: 20px;
    row-gap: 2px;

    width: 100%;
}


/* Eliminar floats y anchos antiguos del tema */
body.woocommerce-checkout
.woocommerce-billing-fields__field-wrapper > .form-row,

body.woocommerce-checkout
.woocommerce-shipping-fields__field-wrapper > .form-row {

    float: none !important;

    width: 100% !important;

    clear: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;
}


/* Los campos marcados como ancho completo ocupan ambas columnas */
body.woocommerce-checkout
.woocommerce-billing-fields__field-wrapper > .form-row-wide,

body.woocommerce-checkout
.woocommerce-shipping-fields__field-wrapper > .form-row-wide {

    grid-column: 1 / -1;
}


/* Evitar que Select2 desborde su columna */
body.woocommerce-checkout
.woocommerce-billing-fields__field-wrapper .select2-container,

body.woocommerce-checkout
.woocommerce-shipping-fields__field-wrapper .select2-container {

    width: 100% !important;
}


/* Campos internos siempre ocupan el ancho disponible */
body.woocommerce-checkout
.woocommerce-billing-fields__field-wrapper .woocommerce-input-wrapper,

body.woocommerce-checkout
.woocommerce-shipping-fields__field-wrapper .woocommerce-input-wrapper {

    display: block;
    width: 100%;
}


/* =========================================================
   TABLET / MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    .woocommerce-billing-fields__field-wrapper,

    body.woocommerce-checkout
    .woocommerce-shipping-fields__field-wrapper {

        grid-template-columns: 1fr;
        column-gap: 0;
    }


    body.woocommerce-checkout
    .woocommerce-billing-fields__field-wrapper > .form-row,

    body.woocommerce-checkout
    .woocommerce-shipping-fields__field-wrapper > .form-row {

        grid-column: 1 / -1;
    }

}


/* =========================================================
   05. RESUMEN DEL PEDIDO
   ========================================================= */

/* Título "Tu pedido" */
body.woocommerce-checkout #order_review_heading {
    margin: 0 0 14px;
    padding: 0;

    font-size: 22px;
    font-weight: 700;
    line-height: 1.3;

    color: #1f2937;
}


/* Tabla principal del resumen */
body.woocommerce-checkout
table.woocommerce-checkout-review-order-table {

    width: 100%;

    margin: 0 0 22px;

    background: #ffffff;

    border: 1px solid #e7ebf0;
    border-radius: 14px;

    border-collapse: separate;
    border-spacing: 0;

    overflow: hidden;

    box-shadow:
        0 4px 18px rgba(20, 40, 70, 0.05);
}


/* Celdas */
body.woocommerce-checkout
table.woocommerce-checkout-review-order-table th,

body.woocommerce-checkout
table.woocommerce-checkout-review-order-table td {

    padding: 16px 18px;

    border: 0;
    border-bottom: 1px solid #edf0f4;

    vertical-align: middle;

    font-size: 14px;
    line-height: 1.45;

    color: #374151;
}


/* Encabezados */
body.woocommerce-checkout
table.woocommerce-checkout-review-order-table thead th {

    background: #f9fafb;

    font-size: 13px;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.03em;

    color: #6b7280;
}


/* Columna de precio */
body.woocommerce-checkout
table.woocommerce-checkout-review-order-table .product-total,

body.woocommerce-checkout
table.woocommerce-checkout-review-order-table td:last-child,

body.woocommerce-checkout
table.woocommerce-checkout-review-order-table th:last-child {

    text-align: right;
}


/* Nombre del producto */
body.woocommerce-checkout
table.woocommerce-checkout-review-order-table
.product-name {

    font-weight: 600;

    color: #1f2937;
}


/* Cantidad x1, x2, etc. */
body.woocommerce-checkout
table.woocommerce-checkout-review-order-table
.product-quantity {

    font-weight: 500;

    color: #6b7280;
}


/* Subtotal / envío / comisiones */
body.woocommerce-checkout
table.woocommerce-checkout-review-order-table tfoot th {

    font-weight: 600;

    color: #4b5563;
}


/* TOTAL FINAL */
body.woocommerce-checkout
table.woocommerce-checkout-review-order-table
.order-total th,

body.woocommerce-checkout
table.woocommerce-checkout-review-order-table
.order-total td {

    padding-top: 20px;
    padding-bottom: 20px;

    background: #f4f8ff;

    border-bottom: 0;

    font-size: 17px;
    font-weight: 700;

    color: #111827;
}


/* Precio total */
body.woocommerce-checkout
table.woocommerce-checkout-review-order-table
.order-total .amount {

    font-size: 22px;
    font-weight: 800;

    color: #1473e6;
}


/* Última fila sin borde */
body.woocommerce-checkout
table.woocommerce-checkout-review-order-table
tr:last-child th,

body.woocommerce-checkout
table.woocommerce-checkout-review-order-table
tr:last-child td {

    border-bottom: 0;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout #order_review_heading {
        font-size: 20px;
    }

    body.woocommerce-checkout
    table.woocommerce-checkout-review-order-table th,

    body.woocommerce-checkout
    table.woocommerce-checkout-review-order-table td {

        padding: 14px 12px;
        font-size: 13px;
    }

    body.woocommerce-checkout
    table.woocommerce-checkout-review-order-table
    .order-total .amount {

        font-size: 19px;
    }

}


/* =========================================================
   06. MÉTODOS DE ENVÍO COMO TARJETAS
   ========================================================= */

body.woocommerce-checkout #shipping_method {
    display: flex;
    flex-direction: column;
    gap: 10px;

    margin: 10px 0 4px;
    padding: 0;

    list-style: none;
}


/* Tarjeta individual */
body.woocommerce-checkout #shipping_method > li {
    position: relative;

    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;

    column-gap: 12px;
    row-gap: 4px;

    width: 100%;

    margin: 0 !important;
    padding: 16px 18px !important;

    background: #ffffff;

    border: 1px solid #dfe5ec;
    border-radius: 11px;

    cursor: pointer;

    transition:
        border-color 0.2s ease,
        background-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease;
}


/* Hover */
body.woocommerce-checkout #shipping_method > li:hover {
    border-color: #aebed1;

    box-shadow:
        0 4px 14px rgba(20, 40, 70, 0.07);

    transform: translateY(-1px);
}


/* Tarjeta seleccionada */
body.woocommerce-checkout
#shipping_method > li:has(input.shipping_method:checked) {

    background: #f3f8ff;

    border-color: #1473e6;

    box-shadow:
        0 0 0 2px rgba(20, 115, 230, 0.08);
}


/* Radio */
body.woocommerce-checkout
#shipping_method input.shipping_method {

    grid-column: 1;
    grid-row: 1 / span 2;

    width: 18px;
    height: 18px;

    margin: 0 !important;

    accent-color: #1473e6;

    cursor: pointer;
}


/* Nombre del transporte */
body.woocommerce-checkout
#shipping_method label {

    grid-column: 2;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    width: 100%;

    margin: 0 !important;

    font-size: 14px;
    font-weight: 650;
    line-height: 1.4;

    color: #253044;

    cursor: pointer;
}


/* Precio personalizado UltraPC */
body.woocommerce-checkout
#shipping_method .precio_ultrapc_by_h {

    flex: 0 0 auto;

    margin-left: auto;

    padding: 5px 10px;

    background: #eef5ff;

    border-radius: 7px;

    font-size: 14px;
    font-weight: 700;

    white-space: nowrap;

    color: #1473e6;
}


/* Tiempo estimado / descripción */
body.woocommerce-checkout
#shipping_method > li > p {

    grid-column: 2;

    margin: 0 !important;
    padding: 0 !important;

    line-height: 1.35;
}


body.woocommerce-checkout
#shipping_method > li > p small {

    display: block;

    font-size: 12px;
    font-weight: 400;

    color: #6b7280;
}


/* Evitar estilos antiguos del tema */
body.woocommerce-checkout
#shipping_method li::before,

body.woocommerce-checkout
#shipping_method li::after {

    display: none;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    #shipping_method > li {

        padding: 14px !important;

        grid-template-columns: 22px minmax(0, 1fr);
    }


    body.woocommerce-checkout
    #shipping_method label {

        font-size: 13px;
        gap: 8px;
    }


    body.woocommerce-checkout
    #shipping_method .precio_ultrapc_by_h {

        padding: 4px 7px;

        font-size: 13px;
    }

}


/* =========================================================
   07. MÉTODOS DE PAGO COMO TARJETAS
   ========================================================= */

/* Contenedor general */
body.woocommerce-checkout
#payment ul.payment_methods {

    display: flex;
    flex-direction: column;
    gap: 10px;

    margin: 0;
    padding: 0;

    border: 0;

    list-style: none;
}


/* Cada método de pago */
body.woocommerce-checkout
#payment ul.payment_methods > li.wc_payment_method {

    position: relative;

    margin: 0 !important;
    padding: 0 !important;

    background: #ffffff;

    border: 1px solid #dfe5ec;
    border-radius: 11px;

    overflow: hidden;

    transition:
        border-color 0.2s ease,
        background-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease;
}


/* Hover */
body.woocommerce-checkout
#payment ul.payment_methods > li.wc_payment_method:hover {

    border-color: #aebed1;

    box-shadow:
        0 4px 14px rgba(20, 40, 70, 0.07);

    transform: translateY(-1px);
}


/* Método seleccionado */
body.woocommerce-checkout
#payment ul.payment_methods > li.wc_payment_method:has(input[type="radio"]:checked) {

    background: #f7faff;

    border-color: #1473e6;

    box-shadow:
        0 0 0 2px rgba(20, 115, 230, 0.08);
}


/* Radio */
body.woocommerce-checkout
#payment ul.payment_methods
input[type="radio"] {

    width: 18px;
    height: 18px;

    margin: 0 12px 0 0 !important;

    vertical-align: middle;

    accent-color: #1473e6;

    cursor: pointer;
}


/* Línea principal del método */
body.woocommerce-checkout
#payment ul.payment_methods
li.wc_payment_method > label {

    display: flex;
    align-items: center;

    width: 100%;

    min-height: 58px;

    margin: 0 !important;
    padding: 14px 16px;

    font-size: 14px;
    font-weight: 650;
    line-height: 1.4;

    color: #253044;

    cursor: pointer;
}


/* Logos de los medios de pago */
body.woocommerce-checkout
#payment ul.payment_methods
li.wc_payment_method > label img {

    width: auto;
    max-width: 110px;
    max-height: 30px;

    margin-left: auto;

    object-fit: contain;
}


/* Caja de descripción del método seleccionado */
body.woocommerce-checkout
#payment .payment_box {

    position: relative;

    margin: 0 !important;
    padding: 14px 16px 16px 46px !important;

    background: #f7faff !important;

    border: 0 !important;
    border-top: 1px solid #e3edf9 !important;

    border-radius: 0 !important;

    font-size: 13px;
    line-height: 1.55;

    color: #5b6575;

    box-shadow: none !important;
}


/* Quitar triángulos antiguos que algunos temas agregan */
body.woocommerce-checkout
#payment .payment_box::before,

body.woocommerce-checkout
#payment .payment_box::after {

    display: none !important;
}


/* Texto dentro de descripción */
body.woocommerce-checkout
#payment .payment_box p {

    margin: 0 0 7px;

    font-size: 13px;
    line-height: 1.55;

    color: #5b6575;
}


body.woocommerce-checkout
#payment .payment_box p:last-child {

    margin-bottom: 0;
}


/* Links dentro de los métodos */
body.woocommerce-checkout
#payment .payment_box a {

    font-weight: 600;

    color: #1473e6;
}


/* Evitar fondos heredados del tema */
body.woocommerce-checkout
#payment {

    background: transparent;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    #payment ul.payment_methods
    li.wc_payment_method > label {

        min-height: 56px;

        padding: 13px 14px;

        font-size: 13px;
    }


    body.woocommerce-checkout
    #payment ul.payment_methods
    li.wc_payment_method > label img {

        max-width: 85px;
        max-height: 27px;
    }


    body.woocommerce-checkout
    #payment .payment_box {

        padding:
            13px
            14px
            14px
            44px !important;
    }

}


/* =========================================================
   08. BLOQUE FINAL DE PAGO Y BOTÓN REALIZAR PEDIDO
   ========================================================= */

/* Contenedor general de pago */
body.woocommerce-checkout #payment {

    margin-top: 22px;

    padding: 22px;

    background: #ffffff;

    border: 1px solid #e7ebf0;
    border-radius: 14px;

    box-shadow:
        0 4px 18px rgba(20, 40, 70, 0.05);
}


/* Separación después de los métodos de pago */
body.woocommerce-checkout
#payment .form-row.place-order {

    margin: 22px 0 0 !important;
    padding: 20px 0 0 !important;

    border-top: 1px solid #edf0f4;
}


/* Texto de privacidad / condiciones */
body.woocommerce-checkout
#payment .woocommerce-privacy-policy-text {

    margin-bottom: 16px;

    font-size: 12px;
    line-height: 1.6;

    color: #6b7280;
}


/* Links de privacidad */
body.woocommerce-checkout
#payment .woocommerce-privacy-policy-text a {

    color: #1473e6;
    font-weight: 600;
}


/* Términos y condiciones */
body.woocommerce-checkout
#payment .woocommerce-terms-and-conditions-wrapper {

    margin-bottom: 16px;
}


/* Fila del checkbox */
body.woocommerce-checkout
#payment .woocommerce-form__label-for-checkbox {

    display: flex;
    align-items: flex-start;

    gap: 9px;

    margin: 0;

    font-size: 13px;
    line-height: 1.5;

    color: #4b5563;
}


/* Checkbox */
body.woocommerce-checkout
#payment input[type="checkbox"] {

    width: 17px;
    height: 17px;

    margin: 2px 0 0 !important;

    flex: 0 0 auto;

    accent-color: #1473e6;
}


/* Links de términos */
body.woocommerce-checkout
#payment .woocommerce-terms-and-conditions-wrapper a {

    color: #1473e6;
    font-weight: 600;
}


/* =========================================================
   BOTÓN PRINCIPAL
   ========================================================= */

body.woocommerce-checkout #place_order {

    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;

    min-height: 56px;

    margin: 6px 0 0 !important;
    padding: 15px 24px !important;

    background: #1473e6 !important;

    border: 1px solid #1473e6 !important;
    border-radius: 10px !important;

    color: #ffffff !important;

    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.3;

    text-align: center;

    box-shadow:
        0 7px 18px rgba(20, 115, 230, 0.20);

    cursor: pointer;

    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.15s ease;
}


/* Hover */
body.woocommerce-checkout #place_order:hover {

    background: #0f65cf !important;
    border-color: #0f65cf !important;

    box-shadow:
        0 9px 22px rgba(20, 115, 230, 0.27);

    transform: translateY(-1px);
}


/* Presionado */
body.woocommerce-checkout #place_order:active {

    transform: translateY(0);

    box-shadow:
        0 4px 12px rgba(20, 115, 230, 0.20);
}


/* Focus accesible */
body.woocommerce-checkout #place_order:focus {

    outline: none;

    box-shadow:
        0 0 0 4px rgba(20, 115, 230, 0.17),
        0 7px 18px rgba(20, 115, 230, 0.20);
}


/* Estado deshabilitado */
body.woocommerce-checkout #place_order:disabled,
body.woocommerce-checkout #place_order.disabled {

    opacity: 0.55;

    cursor: not-allowed;

    transform: none;

    box-shadow: none;
}


/* Pequeño mensaje visual de seguridad */
body.woocommerce-checkout
#payment .place-order::after {

    content: "🔒 Pago procesado de forma segura";

    display: block;

    width: 100%;

    margin-top: 12px;

    text-align: center;

    font-size: 12px;
    font-weight: 500;

    color: #7b8492;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout #payment {

        padding: 17px;

        border-radius: 12px;
    }


    body.woocommerce-checkout #place_order {

        min-height: 54px;

        padding: 14px 18px !important;

        font-size: 15px !important;
    }


    body.woocommerce-checkout
    #payment .place-order::after {

        font-size: 11px;
    }

}


/* =========================================================
   09. ESTRUCTURA GENERAL DEL CHECKOUT
   WooCommerce + compatibilidad con Electro
   ========================================================= */


/* =========================================================
   ESCRITORIO
   ========================================================= */

@media (min-width: 992px) {

    /*
     * Estructura:
     *
     * avisos  | avisos
     * cliente | resumen
     */
    body.woocommerce-checkout
    form.checkout.woocommerce-checkout {

        display: grid !important;

        grid-template-columns:
            minmax(0, 1.65fr)
            minmax(360px, 0.85fr) !important;

        grid-template-areas:
            "update-notices update-notices"
            "checkout-errors checkout-errors"
            "customer review" !important;

        column-gap: 32px;
        row-gap: 0;

        align-items: start;

        width: 100%;
    }


    /* -----------------------------------------------------
       COLUMNA IZQUIERDA
       ----------------------------------------------------- */

    body.woocommerce-checkout
    form.checkout.woocommerce-checkout > #customer_details {

        grid-area: customer;

        float: none !important;

        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
    }


    body.woocommerce-checkout
    #customer_details > .col-1,

    body.woocommerce-checkout
    #customer_details > .col-2 {

        float: none !important;

        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
    }


    body.woocommerce-checkout
    #customer_details > .col-2 {

        margin-top: 24px !important;
    }


    /* -----------------------------------------------------
       AVISOS WOOCOMMERCE
       ----------------------------------------------------- */

    /*
     * WooCommerce puede mostrar simultáneamente:
     *
     * - avisos informativos / actualización AJAX
     * - errores de validación del checkout
     *
     * Cada grupo utiliza su propia fila del Grid.
     */

    body.woocommerce-checkout
    form.checkout
    > .woocommerce-NoticeGroup-updateOrderReview {

        grid-area: update-notices;

        position: relative;
        z-index: 1;

        float: none !important;

        width: 100% !important;
        max-width: none !important;

        margin: 0 0 16px !important;
    }


    body.woocommerce-checkout
    form.checkout
    > .woocommerce-NoticeGroup-checkout {

        grid-area: checkout-errors;

        position: relative;
        z-index: 1;

        float: none !important;

        width: 100% !important;
        max-width: none !important;

        margin: 0 0 20px !important;
    }


    /*
     * Formato común del contenido de los avisos.
     */
    body.woocommerce-checkout
    form.checkout.woocommerce-checkout
    > .woocommerce-NoticeGroup
    .woocommerce-info,

    body.woocommerce-checkout
    form.checkout.woocommerce-checkout
    > .woocommerce-NoticeGroup
    .woocommerce-message,

    body.woocommerce-checkout
    form.checkout.woocommerce-checkout
    > .woocommerce-NoticeGroup
    .woocommerce-error {

        width: 100%;

        margin: 0 !important;

        border-radius: 10px;

        box-sizing: border-box;
    }


    /* -----------------------------------------------------
       COLUMNA DERECHA
       Electro utiliza .order-review-wrapper
       ----------------------------------------------------- */

    body.woocommerce-checkout
    form.checkout.woocommerce-checkout
    > .order-review-wrapper {

        grid-area: review;

        float: none !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    body.woocommerce-checkout
    .order-review-wrapper #order_review {

        float: none !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        margin: 0 !important;
    }


    body.woocommerce-checkout
    .order-review-wrapper
    .woocommerce-checkout-review-order-table,

    body.woocommerce-checkout
    .order-review-wrapper #payment {

        width: 100% !important;
        max-width: none !important;
    }


    /*
     * Electro ya muestra "Su pedido" dentro de su wrapper.
     * Evitamos reservar espacio para el heading original.
     */
    body.woocommerce-checkout
    #order_review_heading {

        display: none !important;
    }

}


/* =========================================================
   TABLET Y MÓVIL
   ========================================================= */

@media (max-width: 991px) {

    body.woocommerce-checkout
    form.checkout.woocommerce-checkout {

        display: block !important;

        width: 100% !important;
        max-width: none !important;

        margin-left: 0 !important;
        margin-right: 0 !important;
    }


    /* Datos del cliente */
    body.woocommerce-checkout
    form.checkout.woocommerce-checkout
    > #customer_details {

        float: none !important;

        width: 100% !important;
        max-width: none !important;

        margin-left: 0 !important;
        margin-right: 0 !important;
    }


    body.woocommerce-checkout
    #customer_details > .col-1,

    body.woocommerce-checkout
    #customer_details > .col-2 {

        float: none !important;

        width: 100% !important;
        max-width: none !important;
    }


    /* Título del resumen */
    body.woocommerce-checkout
    #order_review_heading {

        margin-top: 28px !important;
    }


    /* Resumen */
    body.woocommerce-checkout
    form.checkout.woocommerce-checkout
    > #order_review {

        float: none !important;
        clear: both !important;

        width: 100% !important;
        max-width: none !important;

        margin-left: 0 !important;
        margin-right: 0 !important;
    }


    body.woocommerce-checkout
    #order_review
    .woocommerce-checkout-review-order-table,

    body.woocommerce-checkout
    #order_review
    #payment {

        width: 100% !important;
        max-width: none !important;
    }

}


/* =========================================================
   14. CUPÓN Y AVISOS INFORMATIVOS
   ========================================================= */

/* ---------------------------------------------------------
   CUPÓN
   --------------------------------------------------------- */

body.woocommerce-checkout
.woocommerce-form-coupon-toggle {

    margin-bottom: 18px;
}


body.woocommerce-checkout
.woocommerce-form-coupon-toggle
.woocommerce-info {

    position: relative;

    margin: 0 !important;
    padding: 15px 18px !important;

    background: #f4f8ff !important;

    border: 1px solid #d9e8fb !important;
    border-left: 4px solid #1473e6 !important;
    border-radius: 10px !important;

    color: #334155 !important;

    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;

    box-shadow:
        0 3px 12px rgba(20, 40, 70, 0.04);
}


/* Links del cupón */
body.woocommerce-checkout
.woocommerce-form-coupon-toggle
.woocommerce-info a {

    color: #1473e6 !important;

    font-weight: 700;

    text-decoration: none;
}


body.woocommerce-checkout
.woocommerce-form-coupon-toggle
.woocommerce-info a:hover {

    color: #0f65cf !important;

    text-decoration: underline;
}


/* ---------------------------------------------------------
   AVISOS GENERADOS DENTRO DEL CHECKOUT
   --------------------------------------------------------- */

body.woocommerce-checkout
form.checkout
> .woocommerce-NoticeGroup
.woocommerce-info {

    position: relative;

    margin: 0 !important;
    padding: 15px 18px !important;

    background: #eef6ff !important;

    border: 1px solid #d4e7fb !important;
    border-left: 4px solid #1473e6 !important;
    border-radius: 10px !important;

    color: #334155 !important;

    font-size: 13px;
    font-weight: 500;
    line-height: 1.55;

    box-shadow:
        0 3px 12px rgba(20, 40, 70, 0.04);
}


/* Links dentro de avisos */
body.woocommerce-checkout
form.checkout
> .woocommerce-NoticeGroup
.woocommerce-info a {

    color: #1473e6 !important;

    font-weight: 700;

    text-decoration: none;
}


body.woocommerce-checkout
form.checkout
> .woocommerce-NoticeGroup
.woocommerce-info a:hover {

    text-decoration: underline;
}


/* Eliminar estilos oscuros heredados de Electro */
body.woocommerce-checkout
.woocommerce-form-coupon-toggle
.woocommerce-info::before,

body.woocommerce-checkout
form.checkout
> .woocommerce-NoticeGroup
.woocommerce-info::before {

    color: #1473e6 !important;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    .woocommerce-form-coupon-toggle
    .woocommerce-info,

    body.woocommerce-checkout
    form.checkout
    > .woocommerce-NoticeGroup
    .woocommerce-info {

        padding: 13px 14px !important;

        font-size: 12px;
    }

}


/* =========================================================
   15. UNIFICAR VISUALMENTE DETALLES DE ENVÍO
   ========================================================= */

/*
 * Título principal de la segunda columna
 */
body.woocommerce-checkout
#customer_details > .col-2 > h3 {

    margin: 0 !important;

    padding: 22px 24px 16px;

    background: #ffffff;

    border: 1px solid #e7ebf0;
    border-bottom: 0;

    border-radius: 14px 14px 0 0;

    font-size: 21px;
    font-weight: 700;
    line-height: 1.3;

    color: #1f2937;

    box-shadow:
        0 4px 18px rgba(20, 40, 70, 0.05);
}


/* Línea azul decorativa del título */
body.woocommerce-checkout
#customer_details > .col-2 > h3::after {

    content: "";

    display: block;

    width: 65px;
    height: 2px;

    margin-top: 12px;

    background: #1473e6;

    border-radius: 99px;
}


/* ---------------------------------------------------------
   BLOQUE ¿ENVIAR A OTRA DIRECCIÓN?
   --------------------------------------------------------- */

body.woocommerce-checkout
#customer_details .woocommerce-shipping-fields {

    margin: 0 !important;

    padding: 16px 24px 22px !important;

    background: #ffffff;

    border: 1px solid #e7ebf0 !important;
    border-top: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
}


/* ---------------------------------------------------------
   HORARIO Y REFERENCIAS
   --------------------------------------------------------- */

body.woocommerce-checkout
#customer_details .woocommerce-additional-fields {

    margin: 0 0 24px !important;

    padding: 8px 24px 24px !important;

    background: #ffffff;

    border: 1px solid #e7ebf0 !important;
    border-top: 0 !important;

    border-radius: 0 0 14px 14px !important;

    box-shadow:
        0 8px 18px rgba(20, 40, 70, 0.05) !important;
}


/*
 * Línea divisoria muy suave entre envío y referencias
 */
body.woocommerce-checkout
#customer_details .woocommerce-additional-fields::before {

    content: "";

    display: block;

    width: 100%;

    margin: 0 0 20px;

    border-top: 1px solid #edf0f4;
}


/* Eliminar espacios heredados del tema */
body.woocommerce-checkout
#customer_details > .col-2 {

    margin-top: 24px !important;
}


body.woocommerce-checkout
#customer_details .woocommerce-shipping-fields h3 {

    margin-top: 0 !important;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    #customer_details > .col-2 > h3 {

        padding:
            19px
            18px
            14px;

        font-size: 19px;
    }


    body.woocommerce-checkout
    #customer_details .woocommerce-shipping-fields {

        padding:
            14px
            18px
            18px !important;
    }


    body.woocommerce-checkout
    #customer_details .woocommerce-additional-fields {

        padding:
            5px
            18px
            20px !important;
    }

}


/* =========================================================
   16. HEADER COMPACTO EXCLUSIVO DEL CHECKOUT
   ========================================================= */

/*
 * En checkout eliminamos navegación y elementos
 * que pueden distraer durante el proceso de compra.
 */

/* Barra superior */
body.woocommerce-checkout .top-bar {
    display: none !important;
}


/* Buscador */
body.woocommerce-checkout
#masthead .navbar-search {
    display: none !important;
}


/* Iconos de cuenta, favoritos, carrito, etc. */
body.woocommerce-checkout
#masthead .header-icons {
    display: none !important;
}


/* Navegación principal azul */
body.woocommerce-checkout
#masthead .electro-navbar-primary {
    display: none !important;
}


/* Breadcrumb */
body.woocommerce-checkout
.woocommerce-breadcrumb {
    display: none !important;
}


/* =========================================================
   CABECERA PRINCIPAL
   ========================================================= */

body.woocommerce-checkout
#masthead {

    min-height: 0 !important;
    height: auto !important;

    margin-bottom: 0 !important;

    background: #ffffff;

    border-bottom: 1px solid #e5eaf0;

    box-shadow:
        0 2px 10px rgba(20, 40, 70, 0.035);
}


/* Contenedor principal */
body.woocommerce-checkout
#masthead > .container {

    padding-top: 0 !important;
    padding-bottom: 0 !important;
}


/* Fila interna */
body.woocommerce-checkout
#masthead .masthead {

    display: flex !important;

    align-items: center;
    justify-content: center;

    min-height: 82px !important;
    height: 82px !important;

    margin: 0 !important;

    padding-top: 10px;
    padding-bottom: 10px;
}


/* Área del logo */
body.woocommerce-checkout
#masthead .header-logo-area {

    display: flex !important;

    align-items: center;
    justify-content: center !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* Logo */
body.woocommerce-checkout
#masthead .header-logo-area img {

    width: auto;

    max-width: 190px;
    max-height: 60px;

    object-fit: contain;
}


/* =========================================================
   ESPACIADO DEL CONTENIDO
   ========================================================= */

body.woocommerce-checkout
.site-content {
    padding-top: 0;
}


body.woocommerce-checkout
#content {
    padding-top: 22px;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    #masthead .masthead {

        min-height: 68px !important;
        height: 68px !important;

        padding-top: 8px;
        padding-bottom: 8px;
    }


    body.woocommerce-checkout
    #masthead .header-logo-area img {

        max-width: 155px;
        max-height: 48px;
    }


    body.woocommerce-checkout
    #content {

        padding-top: 14px;
    }

}


/* =========================================================
   18. BARRA DE PROGRESO DEL CHECKOUT
   Carrito → Datos → Pago → Confirmación
   ========================================================= */

body.woocommerce-checkout
.ultrapc-checkout-progress {

    position: relative;

    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    width: 100%;

    margin: 0 0 28px;
    padding: 0 10px;

    box-sizing: border-box;
}


/* Línea gris de fondo */
body.woocommerce-checkout
.ultrapc-checkout-progress::before {

    content: "";

    position: absolute;

    top: 20px;
    left: 12.5%;
    right: 12.5%;

    height: 2px;

    background: #dfe5ec;

    z-index: 0;
}


/* Línea azul hasta el paso actual */
body.woocommerce-checkout
.ultrapc-checkout-progress::after {

    content: "";

    position: absolute;

    top: 20px;
    left: 12.5%;

    width: 25%;

    height: 2px;

    background: #1473e6;

    z-index: 1;
}


/* Cada paso */
body.woocommerce-checkout
.ultrapc-checkout-step {

    position: relative;

    z-index: 2;

    display: flex;
    flex-direction: column;
    align-items: center;

    gap: 8px;

    text-align: center;

    color: #8a94a3;
}


/* Círculo */
body.woocommerce-checkout
.ultrapc-step-icon {

    display: flex;
    align-items: center;
    justify-content: center;

    width: 40px;
    height: 40px;

    background: #ffffff;

    border: 2px solid #d8dee8;
    border-radius: 50%;

    color: #8a94a3;

    font-size: 14px;
    font-weight: 700;
    line-height: 1;

    box-shadow:
        0 2px 8px rgba(20, 40, 70, 0.05);
}


/* Texto */
body.woocommerce-checkout
.ultrapc-step-label {

    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;

    color: #7b8492;
}


/* =========================================================
   PASO COMPLETADO
   ========================================================= */

body.woocommerce-checkout
.ultrapc-step-completed
.ultrapc-step-icon {

    background: #1473e6;

    border-color: #1473e6;

    color: #ffffff;
}


body.woocommerce-checkout
.ultrapc-step-completed
.ultrapc-step-label {

    color: #374151;
}


/* =========================================================
   PASO ACTUAL
   ========================================================= */

body.woocommerce-checkout
.ultrapc-step-active
.ultrapc-step-icon {

    background: #ffffff;

    border-color: #1473e6;

    color: #1473e6;

    box-shadow:
        0 0 0 4px rgba(20, 115, 230, 0.10);
}


body.woocommerce-checkout
.ultrapc-step-active
.ultrapc-step-label {

    color: #1473e6;

    font-weight: 700;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    .ultrapc-checkout-progress {

        margin-bottom: 22px;
        padding: 0;
    }


    body.woocommerce-checkout
    .ultrapc-checkout-progress::before,

    body.woocommerce-checkout
    .ultrapc-checkout-progress::after {

        top: 17px;
    }


    body.woocommerce-checkout
    .ultrapc-step-icon {

        width: 34px;
        height: 34px;

        font-size: 12px;
    }


    body.woocommerce-checkout
    .ultrapc-step-label {

        font-size: 11px;
    }

}


/* Pantallas móviles muy pequeñas */
@media (max-width: 420px) {

    body.woocommerce-checkout
    .ultrapc-step-label {

        font-size: 10px;
    }

}


/* =========================================================
   19. OCULTAR FOOTER TRADICIONAL EN CHECKOUT
   Luego utilizaremos un footer compacto exclusivo.
   ========================================================= */

/* Newsletter */
body.woocommerce-checkout
.footer-newsletter {

    display: none !important;
}


/* Footer completo de Electro */
body.woocommerce-checkout
#colophon.site-footer {

    display: none !important;
}



/* =========================================================
   20. FOOTER COMPACTO EXCLUSIVO DEL CHECKOUT
   ========================================================= */

body.woocommerce-checkout
.ultrapc-checkout-footer {

    width: 100%;

    margin: 38px auto 0;
    padding: 0;

    background: #ffffff;

    border: 1px solid #e5eaf0;
    border-radius: 14px;

    box-shadow:
        0 5px 18px rgba(20, 40, 70, 0.045);

    overflow: hidden;
}


/* =========================================================
   BLOQUES DE CONFIANZA
   ========================================================= */

body.woocommerce-checkout
.ultrapc-checkout-footer__items {

    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    width: 100%;
}


/* Cada bloque */
body.woocommerce-checkout
.ultrapc-checkout-footer__item {

    display: flex;
    align-items: flex-start;

    gap: 13px;

    min-width: 0;

    padding: 22px 24px;
}


/* Separadores */
body.woocommerce-checkout
.ultrapc-checkout-footer__item + .ultrapc-checkout-footer__item {

    border-left: 1px solid #edf0f4;
}


/* Iconos */
body.woocommerce-checkout
.ultrapc-checkout-footer__icon {

    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    background: #f2f7ff;

    border-radius: 10px;

    font-size: 20px;
    line-height: 1;

    color: #1473e6;
}


/* Contenido interno */
body.woocommerce-checkout
.ultrapc-checkout-footer__item > div {

    display: flex;
    flex-direction: column;

    min-width: 0;
}


/* Título */
body.woocommerce-checkout
.ultrapc-checkout-footer__item strong {

    margin-bottom: 4px;

    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;

    color: #1f2937;
}


/* Línea principal */
body.woocommerce-checkout
.ultrapc-checkout-footer__item span:not(.ultrapc-checkout-footer__icon) {

    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;

    color: #475569;
}


/* Texto secundario */
body.woocommerce-checkout
.ultrapc-checkout-footer__item small {

    margin-top: 3px;

    font-size: 11px;
    line-height: 1.45;

    color: #8a94a3;
}


/* =========================================================
   PARTE INFERIOR
   ========================================================= */

body.woocommerce-checkout
.ultrapc-checkout-footer__bottom {

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    padding: 15px 24px;

    background: #f8fafc;

    border-top: 1px solid #edf0f4;
}


/* Copyright */
body.woocommerce-checkout
.ultrapc-checkout-footer__copyright {

    font-size: 11px;
    font-weight: 500;

    color: #7b8492;
}


/* Links */
body.woocommerce-checkout
.ultrapc-checkout-footer__links {

    display: flex;
    align-items: center;

    gap: 20px;
}


body.woocommerce-checkout
.ultrapc-checkout-footer__links a {

    font-size: 11px;
    font-weight: 600;

    color: #556274;

    text-decoration: none;

    transition: color 0.2s ease;
}


body.woocommerce-checkout
.ultrapc-checkout-footer__links a:hover {

    color: #1473e6;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 991px) {

    body.woocommerce-checkout
    .ultrapc-checkout-footer__items {

        grid-template-columns: 1fr;
    }


    body.woocommerce-checkout
    .ultrapc-checkout-footer__item + .ultrapc-checkout-footer__item {

        border-left: 0;
        border-top: 1px solid #edf0f4;
    }

}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    .ultrapc-checkout-footer {

        margin-top: 26px;

        border-radius: 12px;
    }


    body.woocommerce-checkout
    .ultrapc-checkout-footer__item {

        padding: 17px 18px;

        gap: 11px;
    }


    body.woocommerce-checkout
    .ultrapc-checkout-footer__icon {

        flex-basis: 38px;

        width: 38px;
        height: 38px;

        font-size: 18px;
    }


    body.woocommerce-checkout
    .ultrapc-checkout-footer__bottom {

        flex-direction: column;

        align-items: flex-start;

        gap: 9px;

        padding: 14px 18px;
    }


    body.woocommerce-checkout
    .ultrapc-checkout-footer__links {

        flex-wrap: wrap;

        gap: 8px 16px;
    }

}


/* =========================================================
   21. HEADER MÓVIL COMPACTO DEL CHECKOUT
   ========================================================= */

@media (max-width: 991px) {

    /*
     * Elementos innecesarios durante el checkout móvil:
     * hamburguesa, iconos, buscador y navegación inferior.
     */
    body.woocommerce-checkout
    #masthead .mobile-header-v2
    .off-canvas-navigation-wrapper,

    body.woocommerce-checkout
    #masthead .mobile-header-v2
    .header-links,

    body.woocommerce-checkout
    #masthead .mobile-header-v2
    .handheld-header-links,

    body.woocommerce-checkout
    #masthead .mobile-header-v2
    .handheld-header-links .cart,

    body.woocommerce-checkout
    #masthead .mobile-header-v2
    .handheld-header-links .cart-items-count,

    body.woocommerce-checkout
    #masthead .mobile-header-v2
    .site-search,

    body.woocommerce-checkout
    #masthead .mobile-header-v2
    .mobile-handheld-department {

        display: none !important;
    }


    /* =====================================================
       CABECERA MÓVIL
       ===================================================== */

    body.woocommerce-checkout
    #masthead .mobile-header-v2 {

        min-height: 62px !important;
        height: 62px !important;

        background: #ffffff !important;

        border-bottom: 1px solid #e5eaf0;

        box-shadow:
            0 2px 10px rgba(20, 40, 70, 0.035);
    }


    body.woocommerce-checkout
    #masthead .mobile-header-v2-inner {

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;

        min-height: 62px !important;
        height: 62px !important;

        margin: 0 !important;

        padding: 8px 16px !important;
    }


    /* =====================================================
       LOGO
       ===================================================== */

    body.woocommerce-checkout
    #masthead .mobile-header-v2
    .header-logo {

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        float: none !important;

        width: 100% !important;
        max-width: none !important;

        margin: 0 auto !important;
        padding: 0 !important;
    }


    body.woocommerce-checkout
    #masthead .mobile-header-v2
    .header-logo a {

        display: flex;

        align-items: center;
        justify-content: center;

        margin: 0;
        padding: 0;
    }


    /*
     * Electro utiliza en móvil el logo blanco.
     * Lo convertimos visualmente al azul UltraPC.
     */
    body.woocommerce-checkout
    #masthead .mobile-header-v2
    .header-logo img.img-header-logo {

        display: block !important;

        width: auto !important;
        height: auto !important;

        max-width: 170px !important;
        max-height: 48px !important;

        margin: 0 auto !important;

        opacity: 1 !important;
        visibility: visible !important;

        filter:
            brightness(0)
            saturate(100%)
            invert(27%)
            sepia(98%)
            saturate(2600%)
            hue-rotate(200deg)
            brightness(88%)
            contrast(105%);
    }


    /*
     * Compatibilidad por si Electro cambia
     * la clase específica del logo.
     */
    body.woocommerce-checkout
    #masthead .mobile-header-v2
    .header-logo svg {

        display: block;

        width: auto !important;
        max-width: 170px !important;
        max-height: 48px !important;

        margin: 0 auto !important;
    }

}


/* =========================================================
   23. PULIDO FINAL SUPERIOR - CHECKOUT MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    /* Título principal */
    body.woocommerce-checkout
    .entry-title {

        margin-top: 14px !important;
        margin-bottom: 20px !important;

        font-size: 28px !important;
        line-height: 1.15 !important;

        text-align: center;
    }


    /* Barra de progreso */
    body.woocommerce-checkout
    .ultrapc-checkout-progress {

        margin-bottom: 20px !important;
    }


    /* Cupón */
    body.woocommerce-checkout
    .woocommerce-form-coupon-toggle {

        margin-bottom: 14px;
    }


    body.woocommerce-checkout
    .woocommerce-form-coupon-toggle
    .woocommerce-info {

        padding: 13px 14px !important;

        font-size: 13px !important;
        line-height: 1.45 !important;
    }


    /* Avisos del checkout */
    body.woocommerce-checkout
    form.checkout
    > .woocommerce-NoticeGroup {

        margin-bottom: 16px !important;
    }


    body.woocommerce-checkout
    form.checkout
    > .woocommerce-NoticeGroup
    .woocommerce-info {

        padding: 13px 14px !important;

        font-size: 12.5px !important;
        line-height: 1.5 !important;
    }

}


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

/* Contenedor general de errores */
body.woocommerce-checkout
.woocommerce-error {

    position: relative;

    margin: 0 0 20px !important;
    padding: 16px 18px 16px 48px !important;

    background: #fff5f5 !important;

    border: 1px solid #fecaca !important;
    border-left: 4px solid #dc2626 !important;
    border-radius: 10px !important;

    color: #991b1b !important;

    font-size: 13px;
    font-weight: 500;
    line-height: 1.55;

    list-style: none !important;

    box-shadow:
        0 4px 14px rgba(220, 38, 38, 0.06);
}


/* Icono de advertencia */
body.woocommerce-checkout
.woocommerce-error::before {

    content: "!";

    position: absolute;

    top: 15px;
    left: 16px;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 22px;
    height: 22px;

    margin: 0 !important;

    background: #dc2626;

    border-radius: 50%;

    color: #ffffff !important;

    font-size: 13px;
    font-weight: 800;
    line-height: 1;
}


/* Cada mensaje */
body.woocommerce-checkout
.woocommerce-error li {

    margin: 0 0 5px !important;
    padding: 0 !important;

    color: #991b1b !important;
}


body.woocommerce-checkout
.woocommerce-error li:last-child {

    margin-bottom: 0 !important;
}


/* Links dentro de errores */
body.woocommerce-checkout
.woocommerce-error a {

    color: #b91c1c !important;

    font-weight: 700;

    text-decoration: underline;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    .woocommerce-error {

        padding:
            14px
            14px
            14px
            44px !important;

        font-size: 12.5px;
    }


    body.woocommerce-checkout
    .woocommerce-error::before {

        top: 13px;
        left: 13px;

        width: 21px;
        height: 21px;
    }

}



/* =========================================================
   26. BARRA DE PROGRESO - 3 PASOS
   Carrito → Datos y Pago → Confirmación
   ========================================================= */

body.woocommerce-checkout
.ultrapc-checkout-progress {

    grid-template-columns: repeat(3, minmax(0, 1fr));
}


/* Línea completa entre el primer y último paso */
body.woocommerce-checkout
.ultrapc-checkout-progress::before {

    left: 16.666%;
    right: 16.666%;
}


/* Progreso actual: Carrito completado → Datos y Pago */
body.woocommerce-checkout
.ultrapc-checkout-progress::after {

    left: 16.666%;
    width: 33.334%;
}


/* Ajuste móvil */
@media (max-width: 767px) {

    body.woocommerce-checkout
    .ultrapc-checkout-progress::before {

        left: 16.666%;
        right: 16.666%;
    }


    body.woocommerce-checkout
    .ultrapc-checkout-progress::after {

        left: 16.666%;
        width: 33.334%;
    }

}


/* =========================================================
   27. TÍTULO "SU PEDIDO" INTEGRADO EN LA TARJETA
   ========================================================= */

/* Título superior de la tarjeta */
body.woocommerce-checkout
.order-review-wrapper
#order_review_heading_v2 {

    margin: 0 !important;
    padding: 22px 24px 16px !important;

    background: #ffffff;

    border: 1px solid #e7ebf0;
    border-bottom: 0;

    border-radius: 14px 14px 0 0;

    font-size: 21px;
    font-weight: 700;
    line-height: 1.3;

    color: #1f2937;

    box-shadow:
        0 4px 18px rgba(20, 40, 70, 0.05);
}


/* Línea azul decorativa */
body.woocommerce-checkout
.order-review-wrapper
#order_review_heading_v2::after {

    content: "";

    display: block;

    width: 65px;
    height: 2px;

    margin-top: 12px;

    background: #1473e6;

    border-radius: 99px;
}


/* Tabla unida visualmente al título */
body.woocommerce-checkout
.order-review-wrapper
table.woocommerce-checkout-review-order-table {

    margin-top: 0 !important;

    border-top: 0 !important;

    border-radius: 0 0 14px 14px !important;

    box-shadow:
        0 8px 18px rgba(20, 40, 70, 0.05);
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    .order-review-wrapper
    #order_review_heading_v2 {

        padding: 18px 18px 14px !important;

        font-size: 19px;
    }

}


/* =========================================================
   28. CENTRADO DE TEXTO EN MÉTODOS DE ENVÍO
   ========================================================= */

body.woocommerce-checkout
#shipping_method label {

    position: relative;

    justify-content: center !important;

    text-align: center;

    padding-left: 8px;
    padding-right: 8px;
}


/* Precio fijo a la derecha sin desplazar el nombre */
body.woocommerce-checkout
#shipping_method .precio_ultrapc_by_h {

    position: absolute;

    top: 50%;
    right: 0;

    transform: translateY(-50%);

    margin-left: 0 !important;

    white-space: nowrap;
}


/* Dar un poco más de aire cuando existe precio */
body.woocommerce-checkout
#shipping_method label:has(.precio_ultrapc_by_h) {

    padding-right: 78px;
    padding-left: 12px;
}


/* Móvil */
@media (max-width: 767px) {

    body.woocommerce-checkout
    #shipping_method label:has(.precio_ultrapc_by_h) {

        padding-right: 68px;
    }

}


/* =========================================================
   29. ALINEACIÓN FINAL DE MÉTODOS DE ENVÍO
   Radio | Nombre | Precio
   ========================================================= */

body.woocommerce-checkout
#shipping_method label {

    position: static !important;

    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;

    align-items: center !important;

    gap: 12px;

    width: 100%;

    padding: 0 !important;

    text-align: center !important;
}


/* El precio vuelve al flujo normal */
body.woocommerce-checkout
#shipping_method .precio_ultrapc_by_h {

    position: static !important;

    top: auto !important;
    right: auto !important;

    transform: none !important;

    margin: 0 !important;

    align-self: center;

    white-space: nowrap;
}


/* Eliminar el padding que agregamos anteriormente */
body.woocommerce-checkout
#shipping_method label:has(.precio_ultrapc_by_h) {

    padding-left: 0 !important;
    padding-right: 0 !important;
}


/* Un poco más de separación entre radio y contenido */
body.woocommerce-checkout
#shipping_method > li {

    column-gap: 14px !important;
}


/* =========================================================
   30. TÉRMINOS Y CONDICIONES - CORRECCIÓN DE ALINEACIÓN
   ========================================================= */

body.woocommerce-checkout
#payment .woocommerce-terms-and-conditions-wrapper
.woocommerce-form__label-for-checkbox {

    display: flex !important;
    align-items: flex-start !important;

    width: 100% !important;

    gap: 10px !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible !important;
}


/* Checkbox */
body.woocommerce-checkout
#payment .woocommerce-terms-and-conditions-wrapper
.woocommerce-form__label-for-checkbox
input[type="checkbox"] {

    position: static !important;

    flex: 0 0 17px !important;

    width: 17px !important;
    height: 17px !important;

    margin: 2px 0 0 0 !important;
    padding: 0 !important;

    transform: none !important;

    float: none !important;
}


/* Texto "He leído y estoy de acuerdo..." */
body.woocommerce-checkout
#payment
.woocommerce-terms-and-conditions-checkbox-text {

    position: static !important;

    display: block !important;

    flex: 1 1 auto !important;

    min-width: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    text-indent: 0 !important;

    white-space: normal !important;
    overflow: visible !important;

    font-size: 13px;
    line-height: 1.5;

    color: #4b5563;
}


/* Links dentro del texto */
body.woocommerce-checkout
#payment
.woocommerce-terms-and-conditions-checkbox-text a {

    display: inline !important;

    margin: 0 !important;
    padding: 0 !important;

    white-space: normal !important;
}


/* Asterisco obligatorio */
body.woocommerce-checkout
#payment
.woocommerce-form__label-for-checkbox
.required {

    position: static !important;

    flex: 0 0 auto;

    margin-left: 4px !important;

    color: #dc2626 !important;
}


/* Móvil */
@media (max-width: 767px) {

    body.woocommerce-checkout
    #payment
    .woocommerce-terms-and-conditions-checkbox-text {

        font-size: 12px;
        line-height: 1.5;
    }

}


/* =========================================================
   31. FORMULARIO DE CUPÓN DESPLEGABLE
   ========================================================= */

body.woocommerce-checkout
form.checkout_coupon {

    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;

    gap: 10px;

    width: 100% !important;

    margin: -4px 0 20px !important;
    padding: 16px !important;

    background: #ffffff;

    border: 1px solid #dce6f2;
    border-radius: 12px;

    box-shadow:
        0 5px 16px rgba(20, 40, 70, 0.05);

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}


/* Sutil realce cuando estamos escribiendo */
body.woocommerce-checkout
form.checkout_coupon:focus-within {

    border-color: #b7d5f8;

    box-shadow:
        0 5px 18px rgba(20, 115, 230, 0.08);
}


/* Eliminar anchos/floats antiguos de WooCommerce */
/*
 * Distribución horizontal sin modificar el display
 * del formulario. WooCommerce conserva el control
 * total de apertura y cierre.
 */

body.woocommerce-checkout
form.checkout_coupon .form-row-first {

    float: left !important;

    width: calc(100% - 160px) !important;

    margin: 0 10px 0 0 !important;
    padding: 0 !important;
}


body.woocommerce-checkout
form.checkout_coupon .form-row-last {

    float: right !important;

    width: 150px !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* Campo del código */
body.woocommerce-checkout
form.checkout_coupon
input.input-text {

    width: 100% !important;
    height: 48px !important;

    margin: 0 !important;
    padding: 0 15px !important;

    background: #f9fbfd;

    border: 1px solid #d8e1ec !important;
    border-radius: 9px !important;

    color: #253044;

    font-size: 14px;
    font-weight: 500;

    box-shadow: none !important;
}


/* Placeholder */
body.woocommerce-checkout
form.checkout_coupon
input.input-text::placeholder {

    color: #9aa4b2;
}


/* Campo activo */
body.woocommerce-checkout
form.checkout_coupon
input.input-text:focus {

    background: #ffffff;

    border-color: #1473e6 !important;

    box-shadow:
        0 0 0 3px rgba(20, 115, 230, 0.10) !important;

    outline: none;
}


/* Botón Aplicar cupón */
body.woocommerce-checkout
form.checkout_coupon
button.button {

    display: flex;
    align-items: center;
    justify-content: center;

    width: 100% !important;
    min-width: 0;
    height: 48px;

    margin: 0 !important;
    padding: 0 22px !important;

    background: #1473e6 !important;

    border: 1px solid #1473e6 !important;
    border-radius: 9px !important;

    color: #ffffff !important;

    font-size: 14px;
    font-weight: 700;

    box-shadow:
        0 5px 14px rgba(20, 115, 230, 0.16);

    transition:
        background-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.15s ease;
}


/* Hover */
body.woocommerce-checkout
form.checkout_coupon
button.button:hover {

    background: #0f65cf !important;
    border-color: #0f65cf !important;

    box-shadow:
        0 7px 17px rgba(20, 115, 230, 0.22);

    transform: translateY(-1px);
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    form.checkout_coupon {

        padding: 13px !important;

        margin-bottom: 16px !important;
    }


    body.woocommerce-checkout
    form.checkout_coupon .form-row-first,

    body.woocommerce-checkout
    form.checkout_coupon .form-row-last {

        float: none !important;

        width: 100% !important;

        margin: 0 !important;
    }


    body.woocommerce-checkout
    form.checkout_coupon .form-row-last {

        margin-top: 10px !important;
    }


    body.woocommerce-checkout
    form.checkout_coupon
    button.button {

        width: 100% !important;

        height: 46px;
    }

}


/* =========================================================
   34. REFINAMIENTO VISUAL Y ORDEN DEL FORMULARIO
   ========================================================= */

/* Grilla más limpia para facturación y envío */
body.woocommerce-checkout
#customer_details .woocommerce-billing-fields__field-wrapper,

body.woocommerce-checkout
#customer_details .woocommerce-shipping-fields__field-wrapper {

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    column-gap: 22px;
    row-gap: 18px;
}


/* Cada campo dentro de la grilla */
body.woocommerce-checkout
#customer_details .woocommerce-billing-fields__field-wrapper > .form-row,

body.woocommerce-checkout
#customer_details .woocommerce-shipping-fields__field-wrapper > .form-row {

    float: none !important;
    width: auto !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* Campos que deben ocupar el ancho completo */
body.woocommerce-checkout
#billing_address_1_field,

body.woocommerce-checkout
#billing_additional_como-supo_field,

body.woocommerce-checkout
#shipping_address_1_field,

body.woocommerce-checkout
#order_comments_field {

    grid-column: 1 / -1 !important;
}


/* Etiquetas */
body.woocommerce-checkout
#customer_details label {

    display: block;

    margin-bottom: 8px;

    color: #253044;

    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
}


/* Inputs / selects / textarea: más rectos y limpios */
body.woocommerce-checkout
#customer_details input.input-text,

body.woocommerce-checkout
#customer_details select,

body.woocommerce-checkout
#customer_details textarea {

    width: 100% !important;

    background: #ffffff !important;

    border: 1px solid #d8e1ec !important;
    border-radius: 10px !important;

    color: #253044;

    font-size: 15px;
    font-weight: 500;

    box-shadow: none !important;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        background-color 0.2s ease;
}


/* Alturas */
body.woocommerce-checkout
#customer_details input.input-text,

body.woocommerce-checkout
#customer_details select {

    height: 52px !important;
    padding: 0 16px !important;
}


body.woocommerce-checkout
#customer_details textarea {

    min-height: 112px !important;
    padding: 14px 16px !important;

    border-radius: 16px !important;

    resize: vertical;
}


/* Estado focus */
body.woocommerce-checkout
#customer_details input.input-text:focus,

body.woocommerce-checkout
#customer_details select:focus,

body.woocommerce-checkout
#customer_details textarea:focus {

    background: #ffffff !important;

    border-color: #1473e6 !important;

    box-shadow:
        0 0 0 3px rgba(20, 115, 230, 0.10) !important;

    outline: none !important;
}


/* Selects con aire más parecido a la propuesta */
body.woocommerce-checkout
#customer_details select {

    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    background-image:
        linear-gradient(45deg, transparent 50%, #7b8794 50%),
        linear-gradient(135deg, #7b8794 50%, transparent 50%);
    background-position:
        calc(100% - 18px) calc(50% - 2px),
        calc(100% - 13px) calc(50% - 2px);
    background-size: 5px 5px, 5px 5px;
    background-repeat: no-repeat;

    padding-right: 34px !important;
}


/* Descripciones / textos auxiliares */
body.woocommerce-checkout
#customer_details .woocommerce-input-wrapper small,

body.woocommerce-checkout
#customer_details .description,

body.woocommerce-checkout
#customer_details p small {

    display: block;

    margin-top: 8px;

    color: #8b96a5;

    font-size: 13px;
    line-height: 1.55;
}


/* Checkboxes de la parte superior más ordenados */
body.woocommerce-checkout
#customer_details .form-row label.checkbox {

    display: flex !important;
    align-items: center;
    gap: 10px;

    margin-bottom: 0;
}


body.woocommerce-checkout
#customer_details input[type="checkbox"] {

    margin: 0 !important;
}


/* Un poco más de limpieza en los bloques */
body.woocommerce-checkout
.woocommerce-billing-fields,

body.woocommerce-checkout
.woocommerce-shipping-fields {

    margin-top: 2px;
}


/* Móvil */
@media (max-width: 767px) {

    body.woocommerce-checkout
    #customer_details .woocommerce-billing-fields__field-wrapper,

    body.woocommerce-checkout
    #customer_details .woocommerce-shipping-fields__field-wrapper {

        grid-template-columns: 1fr;
        row-gap: 16px;
    }


    body.woocommerce-checkout
    #billing_address_1_field,

    body.woocommerce-checkout
    #billing_additional_como-supo_field,

    body.woocommerce-checkout
    #shipping_address_1_field,

    body.woocommerce-checkout
    #order_comments_field {

        grid-column: auto !important;
    }


    body.woocommerce-checkout
    #customer_details input.input-text,

    body.woocommerce-checkout
    #customer_details select {

        height: 50px !important;
    }

}


/* =========================================================
   35. ENCABEZADO MODERNO - DATOS DE FACTURACIÓN
   ========================================================= */

/* Título principal */
body.woocommerce-checkout
.woocommerce-billing-fields > h3 {

    position: relative;

    display: grid !important;
    grid-template-columns: 40px minmax(0, 1fr);
    grid-template-rows: auto auto;

    column-gap: 12px;
    row-gap: 3px;

    align-items: center;

    margin: 0 0 16px !important;
    padding: 0 0 18px !important;

    border-bottom: 1px solid #edf0f4 !important;

    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.3;

    color: #1f2937;
}


/* Número de sección */
body.woocommerce-checkout
.woocommerce-billing-fields > h3::before {

    content: "1";

    grid-column: 1;
    grid-row: 1 / 3;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 36px;
    height: 36px;

    margin: 0;

    background: #eef5ff;

    border-radius: 50%;

    color: #1473e6;

    font-size: 15px;
    font-weight: 800;
    line-height: 1;

    box-shadow:
        0 2px 8px rgba(20, 115, 230, 0.08);
}


/*
 * Reutilizamos el ::after que antes era la línea azul
 * para colocar un subtítulo más útil.
 */
body.woocommerce-checkout
.woocommerce-billing-fields > h3::after {

    content: "Ingresa tu información para la boleta o factura.";

    grid-column: 2;
    grid-row: 2;

    display: block;

    width: auto;
    height: auto;

    margin: 0;

    background: none;

    border-radius: 0;

    color: #8a94a3;

    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
}


/* =========================================================
   ENLACE EDITAR DATOS DE MI CUENTA
   ========================================================= */

body.woocommerce-checkout
#div_boton_editar_datos_facturacion {

    margin: 0 0 22px !important;
    padding: 0 !important;
}


body.woocommerce-checkout
#div_boton_editar_datos_facturacion
.cont_boton_editar_datos_facturacion {

    margin: 0 !important;
    padding: 0 !important;
}


/* Convertir el enlace en una acción secundaria discreta */
body.woocommerce-checkout
#div_boton_editar_datos_facturacion
.boton_editar_datos_facturacion {

    display: inline-flex;
    align-items: center;

    min-height: 34px;

    padding: 7px 11px;

    background: #f5f9ff;

    border: 1px solid #dbeafe;
    border-radius: 7px;

    color: #1473e6 !important;

    font-size: 12px;
    font-weight: 600;
    line-height: 1.35;

    text-decoration: none !important;

    transition:
        background-color 0.2s ease,
        border-color 0.2s ease;
}


body.woocommerce-checkout
#div_boton_editar_datos_facturacion
.boton_editar_datos_facturacion:hover {

    background: #edf5ff;

    border-color: #bfd8f8;

    color: #0f65cf !important;
}


/* =========================================================
   FACTURA ELECTRÓNICA
   ========================================================= */

body.woocommerce-checkout
.woocommerce-billing-fields
#billing_necesito_factura_field,

body.woocommerce-checkout
.woocommerce-billing-fields
.form-row:has(input[type="checkbox"]) {

    margin-bottom: 24px !important;
}


/* Móvil */
@media (max-width: 767px) {

    body.woocommerce-checkout
    .woocommerce-billing-fields > h3 {

        grid-template-columns: 36px minmax(0, 1fr);

        column-gap: 10px;

        font-size: 18px !important;
    }


    body.woocommerce-checkout
    .woocommerce-billing-fields > h3::before {

        width: 32px;
        height: 32px;

        font-size: 14px;
    }


    body.woocommerce-checkout
    .woocommerce-billing-fields > h3::after {

        font-size: 11px;
    }

}


/* =========================================================
   36. PULIDO DEL ENLACE "EDITAR DATOS"
   ========================================================= */

body.woocommerce-checkout
#div_boton_editar_datos_facturacion {

    margin: 0 0 20px !important;
}


body.woocommerce-checkout
#div_boton_editar_datos_facturacion
.boton_editar_datos_facturacion {

    min-height: 0;

    padding: 4px 0 !important;

    background: transparent !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    font-size: 12px;
    font-weight: 600;

    color: #1473e6 !important;
}


body.woocommerce-checkout
#div_boton_editar_datos_facturacion
.boton_editar_datos_facturacion::before {

    content: "✎";

    display: inline-block;

    margin-right: 6px;

    font-size: 12px;
}


body.woocommerce-checkout
#div_boton_editar_datos_facturacion
.boton_editar_datos_facturacion:hover {

    background: transparent !important;

    color: #0f65cf !important;

    text-decoration: underline !important;
}


/* =========================================================
   37. ORDEN DIRECCIÓN / BLUE EXPRESS / TELÉFONO
   ========================================================= */

/* Dirección siempre a todo el ancho */
body.woocommerce-checkout
#billing_address_1_field {

    grid-column: 1 / -1 !important;
}


/* Nota de Blue Express debajo de Dirección */
body.woocommerce-checkout
#texto_punto_bluex {

    grid-column: 1 / -1 !important;

    width: 100% !important;

    margin: -8px 0 2px !important;
    padding: 0 !important;

    color: #7b8794;

    font-size: 12px;
    font-weight: 400;
    line-height: 1.55;
}


/* Link "Encuentre AQUÍ Su Punto Blue Express" */
body.woocommerce-checkout
#texto_punto_bluex a {

    color: #1473e6 !important;

    font-weight: 600;

    text-decoration: none;
}


body.woocommerce-checkout
#texto_punto_bluex a:hover {

    text-decoration: underline;
}


/* Teléfono: columna izquierda */
body.woocommerce-checkout
#billing_phone_field {

    grid-column: 1 !important;

    width: 100% !important;
}


/* Primera compra: columna derecha */
body.woocommerce-checkout
#billing_fisrt_time_field {

    grid-column: 2 !important;

    width: 100% !important;
}


/* ¿Cómo supo de nosotros? vuelve a ancho completo */
body.woocommerce-checkout
#billing_additional_como-supo_field {

    grid-column: 1 / -1 !important;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    #billing_address_1_field,

    body.woocommerce-checkout
    #texto_punto_bluex,

    body.woocommerce-checkout
    #billing_phone_field,

    body.woocommerce-checkout
    #billing_fisrt_time_field,

    body.woocommerce-checkout
    #billing_additional_como-supo_field {

        grid-column: 1 !important;
    }


    body.woocommerce-checkout
    #texto_punto_bluex {

        margin-top: -5px !important;

        font-size: 11.5px;
    }

}


/* =========================================================
   38. ENCABEZADO MODERNO - DETALLES DE ENVÍO
   ========================================================= */

body.woocommerce-checkout
#customer_details > .col-2 > h3 {

    position: relative;

    display: grid !important;
    grid-template-columns: 40px minmax(0, 1fr);
    grid-template-rows: auto auto;

    column-gap: 12px;
    row-gap: 3px;

    align-items: center;

    margin: 0 !important;
    padding: 22px 24px 18px !important;

    background: #ffffff;

    border: 1px solid #e7ebf0 !important;
    border-bottom: 0 !important;

    border-radius: 14px 14px 0 0;

    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.3;

    color: #1f2937;
}


/* Número 2 */
body.woocommerce-checkout
#customer_details > .col-2 > h3::before {

    content: "2";

    grid-column: 1;
    grid-row: 1 / 3;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 36px;
    height: 36px;

    margin: 0;

    background: #eef5ff;

    border-radius: 50%;

    color: #1473e6;

    font-size: 15px;
    font-weight: 800;
    line-height: 1;

    box-shadow:
        0 2px 8px rgba(20, 115, 230, 0.08);
}


/* Sustituimos la línea azul anterior por un subtítulo */
body.woocommerce-checkout
#customer_details > .col-2 > h3::after {

    content: "Configura los datos y referencias para la entrega.";

    grid-column: 2;
    grid-row: 2;

    display: block;

    width: auto;
    height: auto;

    margin: 0;

    background: none;

    color: #8a94a3;

    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
}


/* Móvil */
@media (max-width: 767px) {

    body.woocommerce-checkout
    #customer_details > .col-2 > h3 {

        grid-template-columns: 36px minmax(0, 1fr);

        column-gap: 10px;

        padding:
            18px
            18px
            15px !important;

        font-size: 18px !important;
    }


    body.woocommerce-checkout
    #customer_details > .col-2 > h3::before {

        width: 32px;
        height: 32px;

        font-size: 14px;
    }


    body.woocommerce-checkout
    #customer_details > .col-2 > h3::after {

        font-size: 11px;
    }

}


/* =========================================================
   39. PULIDO INTERNO - DETALLES DE ENVÍO
   ========================================================= */

/* Bloque "Enviar a una dirección diferente" */
body.woocommerce-checkout
#customer_details .woocommerce-shipping-fields {

    min-height: 0 !important;

    padding:
        14px
        24px
        18px !important;

    margin: 0 !important;
}


/* El h3 interno de WooCommerce contiene el checkbox */
body.woocommerce-checkout
#customer_details
.woocommerce-shipping-fields
#ship-to-different-address {

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;

    border: 0 !important;

    box-shadow: none !important;

    font-size: 13px !important;
    line-height: 1.4;
}


/* Label del checkbox */
body.woocommerce-checkout
#customer_details
#ship-to-different-address
label {

    display: inline-flex !important;

    align-items: center !important;

    gap: 9px !important;

    margin: 0 !important;
    padding: 0 !important;

    cursor: pointer;
}


/* Checkbox */
body.woocommerce-checkout
#customer_details
#ship-to-different-address
input[type="checkbox"] {

    position: static !important;

    flex: 0 0 17px;

    width: 17px !important;
    height: 17px !important;

    margin: 0 !important;

    transform: none !important;
}


/* =========================================================
   HORARIO Y REFERENCIAS
   ========================================================= */

body.woocommerce-checkout
#customer_details
.woocommerce-additional-fields {

    padding:
        18px
        24px
        24px !important;
}


/* Línea divisoria */
body.woocommerce-checkout
#customer_details
.woocommerce-additional-fields::before {

    margin:
        0
        0
        20px !important;
}


/* Campo de referencias */
body.woocommerce-checkout
#order_comments_field {

    margin: 0 !important;
}


/* Textarea */
body.woocommerce-checkout
#order_comments_field textarea {

    min-height: 105px !important;

    border-radius: 10px !important;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    #customer_details .woocommerce-shipping-fields {

        padding:
            13px
            18px
            16px !important;
    }


    body.woocommerce-checkout
    #customer_details
    .woocommerce-additional-fields {

        padding:
            16px
            18px
            20px !important;
    }

}


/* =========================================================
   40. ENCABEZADO MODERNO - MÉTODO DE PAGO
   ========================================================= */

body.woocommerce-checkout
#payment {

    position: relative;

    padding-top: 88px !important;
}


/* Círculo número 3 */
body.woocommerce-checkout
#payment::before {

    content: "3";

    position: absolute;

    top: 22px;
    left: 22px;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 36px;
    height: 36px;

    margin: 0;

    background: #eef5ff;

    border-radius: 50%;

    color: #1473e6;

    font-size: 15px;
    font-weight: 800;
    line-height: 1;

    box-shadow:
        0 2px 8px rgba(20, 115, 230, 0.08);

    z-index: 2;
}


/* Título */
body.woocommerce-checkout
#payment
ul.payment_methods::before {

    content: "Método de pago";

    position: absolute;

    top: 22px;
    left: 74px;
    right: 22px;

    display: block;

    color: #1f2937;

    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;

    text-align: left;

    pointer-events: none;
}


/* Subtítulo */
body.woocommerce-checkout
#payment
ul.payment_methods::after {

    content: "Elige cómo quieres pagar tu pedido.";

    position: absolute;

    top: 49px;
    left: 74px;
    right: 22px;

    display: block;

    color: #8a94a3;

    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;

    text-align: left;

    pointer-events: none;
}


/* Línea divisoria debajo del encabezado */
body.woocommerce-checkout
#payment
ul.payment_methods {

    padding-top: 18px !important;

    border-top: 1px solid #edf0f4 !important;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    #payment {

        padding-top: 82px !important;
    }


    body.woocommerce-checkout
    #payment::before {

        top: 18px;
        left: 18px;

        width: 32px;
        height: 32px;

        font-size: 14px;
    }


    body.woocommerce-checkout
    #payment
    ul.payment_methods::before {

        top: 18px;
        left: 62px;
        right: 18px;

        font-size: 18px;
    }


    body.woocommerce-checkout
    #payment
    ul.payment_methods::after {

        top: 43px;
        left: 62px;
        right: 18px;

        font-size: 11px;
    }

}


/* =========================================================
   41. INFORMACIÓN DE ENTREGA / DESPACHO
   ========================================================= */

/* Fila completa */
body.woocommerce-checkout
.woocommerce-checkout-review-order-table
tr.msg-shipping td {

    padding: 14px 16px !important;

    background: #f7faff !important;

    border-bottom: 1px solid #e5edf7 !important;

    text-align: left !important;
}


/* Caja informativa */
body.woocommerce-checkout
.mensaje_despacho_checkout {

    position: relative;

    width: 100%;

    margin: 0 !important;
    padding: 42px 14px 14px 14px !important;

    background: #f7faff;

    border: 1px solid #dbeafe;
    border-radius: 10px;

    color: #526174;

    box-sizing: border-box;
}


/* Título */
body.woocommerce-checkout
.mensaje_despacho_checkout::before {

    content: "Información de entrega";

    position: absolute;

    top: 13px;
    left: 14px;

    padding-left: 25px;

    color: #1f2937;

    font-size: 13px;
    font-weight: 700;
    line-height: 1.3;
}


/* Icono */
body.woocommerce-checkout
.mensaje_despacho_checkout::after {

    content: "🚚";

    position: absolute;

    top: 11px;
    left: 14px;

    font-size: 15px;
    line-height: 1;
}


/* Texto */
body.woocommerce-checkout
.mensaje_despacho_checkout p {

    margin: 0 !important;
    padding: 0 !important;

    color: #657286 !important;

    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.65 !important;

    text-align: left !important;

    white-space: normal;
}


/* Evitar fondos/espacios heredados */
body.woocommerce-checkout
tr.msg-shipping {

    background: transparent !important;
}


/* Móvil */
@media (max-width: 767px) {

    body.woocommerce-checkout
    .woocommerce-checkout-review-order-table
    tr.msg-shipping td {

        padding: 12px !important;
    }


    body.woocommerce-checkout
    .mensaje_despacho_checkout {

        padding:
            40px
            12px
            12px !important;
    }


    body.woocommerce-checkout
    .mensaje_despacho_checkout::before {

        left: 12px;
        font-size: 12px;
    }


    body.woocommerce-checkout
    .mensaje_despacho_checkout::after {

        left: 12px;
    }


    body.woocommerce-checkout
    .mensaje_despacho_checkout p {

        font-size: 11.5px !important;
        line-height: 1.6 !important;
    }

}


/* =========================================================
   42. CABECERA FINAL DEL CHECKOUT
   Logo completamente dentro del blanco + título corporativo
   ========================================================= */

/* Área blanca del logo */
body.woocommerce-checkout
#masthead {

    background: #ffffff !important;

    border-bottom: 1px solid #e7ebf0 !important;
}


/* Dar más aire al logo */
body.woocommerce-checkout
#masthead .masthead {

    min-height: 105px !important;
    height: 105px !important;

    padding-top: 12px !important;
    padding-bottom: 16px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}


/* Logo centrado */
body.woocommerce-checkout
#masthead .header-logo-area {

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    height: 100% !important;
}


/* Imagen del logo */
body.woocommerce-checkout
#masthead .header-logo-area img {

    display: block;

    width: auto !important;

    max-width: 280px !important;
    max-height: 82px !important;

    margin: 0 auto !important;
}


/* =========================================================
   TÍTULO FINALIZAR COMPRA
   ========================================================= */

body.woocommerce-checkout
.entry-title {

    position: relative;

    margin: 22px 0 34px !important;
    padding: 0 0 14px !important;

    color: #003ACA !important;

    font-size: 34px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;

    letter-spacing: -0.5px;

    text-align: center !important;

    text-transform: uppercase;
}


/* Línea decorativa debajo del título */
body.woocommerce-checkout
.entry-title::after {

    content: "";

    position: absolute;

    bottom: 0;
    left: 50%;

    width: 64px;
    height: 3px;

    background: #003ACA;

    border-radius: 99px;

    transform: translateX(-50%);
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    #masthead .mobile-header-v2,

    body.woocommerce-checkout
    #masthead .mobile-header-v2-inner {

        min-height: 72px !important;
        height: 72px !important;
    }


    body.woocommerce-checkout
    .entry-title {

        margin:
            18px
            0
            26px !important;

        padding-bottom: 11px !important;

        font-size: 27px !important;

        letter-spacing: -0.3px;
    }


    body.woocommerce-checkout
    .entry-title::after {

        width: 52px;
        height: 3px;
    }

}


/* =========================================================
   43. PEDIDO RECIBIDO - CONFIRMACIÓN Y RESUMEN SUPERIOR
   ========================================================= */

/*
 * Todo queda limitado a la pantalla final del pedido.
 */
body.woocommerce-checkout
.woocommerce-order {

    width: 100%;

    color: #253044;
}


/* =========================================================
   MENSAJE PRINCIPAL DE ÉXITO
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order
.woocommerce-thankyou-order-received {

    position: relative;

    max-width: 690px;

    margin: 0 auto 22px !important;
    padding: 62px 24px 20px !important;

    background: #ffffff;

    border: 1px solid #e5eaf0;
    border-radius: 14px;

    color: #1f2937;

    font-size: 15px;
    font-weight: 600;
    line-height: 1.5;

    text-align: center;

    box-shadow:
        0 5px 18px rgba(20, 40, 70, 0.05);
}


/* Círculo de confirmación */
body.woocommerce-checkout
.woocommerce-order
.woocommerce-thankyou-order-received::before {

    content: "✓";

    position: absolute;

    top: 16px;
    left: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    background: #eaf7ef;

    border: 1px solid #cdebd8;
    border-radius: 50%;

    color: #22a35a;

    font-size: 18px;
    font-weight: 800;

    transform: translateX(-50%);
}


/* =========================================================
   RESUMEN DEL PEDIDO
   Número / Fecha / Email / Total / Método
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order
.woocommerce-order-overview {

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 0;

    max-width: 690px;

    margin: 0 auto 28px !important;
    padding: 0 !important;

    background: #ffffff;

    border: 1px solid #e5eaf0;
    border-radius: 14px;

    list-style: none !important;

    overflow: hidden;

    box-shadow:
        0 5px 18px rgba(20, 40, 70, 0.05);
}


/* Cada dato */
body.woocommerce-checkout
.woocommerce-order
.woocommerce-order-overview li {

    float: none !important;

    width: auto !important;

    margin: 0 !important;
    padding: 16px 18px !important;

    border: 0 !important;
    border-bottom: 1px solid #edf0f4 !important;

    color: #7b8794;

    font-size: 11px;
    font-weight: 600;
    line-height: 1.4;

    text-transform: uppercase;
}


/* Divisor entre columnas */
body.woocommerce-checkout
.woocommerce-order
.woocommerce-order-overview li:nth-child(even) {

    border-left: 1px solid #edf0f4 !important;
}


/* Valor */
body.woocommerce-checkout
.woocommerce-order
.woocommerce-order-overview li strong {

    display: block;

    margin-top: 5px;

    color: #1f2937;

    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;

    text-transform: none;
}


/* Total más visible */
body.woocommerce-checkout
.woocommerce-order
.woocommerce-order-overview
.woocommerce-order-overview__total strong {

    color: #003ACA;

    font-size: 18px;
    font-weight: 800;
}


/*
 * Si hay una cantidad impar de elementos,
 * el último usa todo el ancho.
 */
body.woocommerce-checkout
.woocommerce-order
.woocommerce-order-overview li:last-child:nth-child(odd) {

    grid-column: 1 / -1;

    border-left: 0 !important;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    .woocommerce-order
    .woocommerce-thankyou-order-received {

        margin-bottom: 16px !important;

        padding:
            58px
            18px
            18px !important;

        font-size: 14px;
    }


    body.woocommerce-checkout
    .woocommerce-order
    .woocommerce-order-overview {

        grid-template-columns: 1fr;

        margin-bottom: 20px !important;
    }


    body.woocommerce-checkout
    .woocommerce-order
    .woocommerce-order-overview li {

        padding:
            13px
            15px !important;

        border-left: 0 !important;
    }


    body.woocommerce-checkout
    .woocommerce-order
    .woocommerce-order-overview li:nth-child(even) {

        border-left: 0 !important;
    }

}


/* =========================================================
   44. PEDIDO RECIBIDO - AVISO DE APROBACIÓN
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order
> p:not([class]) {

    position: relative;

    max-width: 690px;

    margin: 0 auto 30px !important;
    padding: 52px 20px 18px 58px !important;

    background: #f4f8ff;

    border: 1px solid #d9e8fb;
    border-left: 4px solid #1473e6;
    border-radius: 12px;

    color: #536174;

    font-size: 13px;
    font-weight: 500;
    line-height: 1.65;

    text-align: left !important;

    box-shadow:
        0 4px 14px rgba(20, 40, 70, 0.04);
}


/* Título del aviso */
body.woocommerce-checkout
.woocommerce-order
> p:not([class])::before {

    content: "Pedido pendiente de aprobación";

    position: absolute;

    top: 16px;
    left: 58px;
    right: 18px;

    color: #1f2937;

    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
}


/* Icono informativo */
body.woocommerce-checkout
.woocommerce-order
> p:not([class])::after {

    content: "i";

    position: absolute;

    top: 15px;
    left: 18px;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 26px;
    height: 26px;

    background: #1473e6;

    border-radius: 50%;

    color: #ffffff;

    font-size: 14px;
    font-weight: 800;
    font-style: normal;
    line-height: 1;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    .woocommerce-order
    > p:not([class]) {

        margin-bottom: 22px !important;

        padding:
            50px
            16px
            16px
            52px !important;

        font-size: 12px;
        line-height: 1.6;
    }


    body.woocommerce-checkout
    .woocommerce-order
    > p:not([class])::before {

        left: 52px;

        font-size: 13px;
    }


    body.woocommerce-checkout
    .woocommerce-order
    > p:not([class])::after {

        left: 16px;

        width: 24px;
        height: 24px;

        font-size: 13px;
    }

}


/* =========================================================
   45. PEDIDO RECIBIDO - DETALLES DEL PEDIDO
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order-details {

    max-width: 690px;

    margin: 0 auto 28px !important;
    padding: 0 !important;

    background: #ffffff;

    border: 1px solid #e5eaf0;
    border-radius: 14px;

    overflow: hidden;

    box-shadow:
        0 5px 18px rgba(20, 40, 70, 0.05);
}


/* =========================================================
   TÍTULO
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order-details
.woocommerce-order-details__title {

    position: relative;

    margin: 0 !important;
    padding: 22px 24px 18px 72px !important;

    background: #ffffff;

    border-bottom: 1px solid #edf0f4;

    color: #1f2937;

    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.3;
}


/* Número de sección */
body.woocommerce-checkout
.woocommerce-order-details
.woocommerce-order-details__title::before {

    content: "1";

    position: absolute;

    top: 17px;
    left: 24px;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 36px;
    height: 36px;

    background: #eef5ff;

    border-radius: 50%;

    color: #1473e6;

    font-size: 15px;
    font-weight: 800;

    box-shadow:
        0 2px 8px rgba(20, 115, 230, 0.08);
}


/* Subtítulo */
body.woocommerce-checkout
.woocommerce-order-details
.woocommerce-order-details__title::after {

    content: "Resumen de productos, despacho y total de tu compra.";

    display: block;

    margin-top: 3px;

    color: #8a94a3;

    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
}


/* =========================================================
   TABLA
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details {

    width: 100% !important;

    margin: 0 !important;

    border: 0 !important;
    border-collapse: collapse !important;

    background: #ffffff;
}


/* Encabezados */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details thead th {

    padding: 14px 18px !important;

    background: #f8fafc;

    border: 0 !important;
    border-bottom: 1px solid #e9edf2 !important;

    color: #6b7280;

    font-size: 11px;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.03em;
}


/* Celdas */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details td,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details tbody th,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details tfoot th {

    padding: 14px 18px !important;

    border: 0 !important;
    border-bottom: 1px solid #edf0f4 !important;

    color: #374151;

    font-size: 13px;
    line-height: 1.45;

    vertical-align: middle;
}


/* Nombre del producto */
body.woocommerce-checkout
.woocommerce-order-details
.woocommerce-table__product-name {

    font-weight: 600;

    color: #1f2937;
}


/* Columna de totales */
body.woocommerce-checkout
.woocommerce-order-details
.woocommerce-table__product-total,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details td:last-child,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details th:last-child {

    text-align: right;
}


/* Subtotales / envío / nota */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details tfoot th {

    font-weight: 600;

    color: #4b5563;
}


/* Valores del pie */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details tfoot td {

    padding: 14px 18px !important;

    border: 0 !important;
    border-bottom: 1px solid #edf0f4 !important;

    font-weight: 600;

    color: #1f2937;
}


/* =========================================================
   TOTAL FINAL
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:last-of-type th,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:last-of-type td {

    background: #f4f8ff;

    font-size: 15px;
    font-weight: 700;
}


/* Valores monetarios importantes */
body.woocommerce-checkout
.woocommerce-order-details
.amount {

    font-weight: 700;
}


/* =========================================================
   BOTONES / ACCIONES
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order-details
a.button,

body.woocommerce-checkout
.woocommerce-order-details
button.button {

    min-height: 38px;

    padding: 9px 16px !important;

    background: #f4f6f8 !important;

    border: 1px solid #e2e7ed !important;
    border-radius: 8px !important;

    color: #374151 !important;

    font-size: 12px;
    font-weight: 600;

    box-shadow: none !important;
}


body.woocommerce-checkout
.woocommerce-order-details
a.button:hover,

body.woocommerce-checkout
.woocommerce-order-details
button.button:hover {

    background: #e9edf2 !important;

    border-color: #d7dde5 !important;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    .woocommerce-order-details
    .woocommerce-order-details__title {

        padding:
            18px
            16px
            16px
            60px !important;

        font-size: 18px !important;
    }


    body.woocommerce-checkout
    .woocommerce-order-details
    .woocommerce-order-details__title::before {

        top: 15px;
        left: 16px;

        width: 32px;
        height: 32px;

        font-size: 14px;
    }


    body.woocommerce-checkout
    .woocommerce-order-details
    .woocommerce-order-details__title::after {

        font-size: 11px;
    }


    body.woocommerce-checkout
    .woocommerce-order-details
    table.woocommerce-table--order-details th,

    body.woocommerce-checkout
    .woocommerce-order-details
    table.woocommerce-table--order-details td {

        padding:
            12px
            11px !important;

        font-size: 12px;
    }

}


/* =========================================================
   46. CORRECCIÓN ENCABEZADO - DETALLES DEL PEDIDO
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order-details
.woocommerce-order-details__title {

    position: relative !important;

    display: block !important;

    min-height: 78px;

    margin: 0 !important;

    padding:
        18px
        24px
        16px
        72px !important;

    background: #ffffff !important;

    border: 0 !important;
    border-bottom: 1px solid #edf0f4 !important;

    color: #1f2937 !important;

    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;

    text-align: left !important;

    overflow: visible !important;
}


/* Número 1 */
body.woocommerce-checkout
.woocommerce-order-details
.woocommerce-order-details__title::before {

    content: "1";

    position: absolute !important;

    top: 17px !important;
    left: 24px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 36px !important;
    height: 36px !important;

    margin: 0 !important;
    padding: 0 !important;

    background: #eef5ff !important;

    border: 0 !important;
    border-radius: 50% !important;

    color: #1473e6 !important;

    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1 !important;

    transform: none !important;
}


/* Subtítulo */
body.woocommerce-checkout
.woocommerce-order-details
.woocommerce-order-details__title::after {

    content: "Resumen de productos, despacho y total de tu compra.";

    position: static !important;

    display: block !important;

    width: auto !important;
    height: auto !important;

    margin: 4px 0 0 !important;
    padding: 0 !important;

    background: transparent !important;

    border: 0 !important;
    border-radius: 0 !important;

    color: #8a94a3 !important;

    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;

    text-align: left !important;

    transform: none !important;
}


/* Móvil */
@media (max-width: 767px) {

    body.woocommerce-checkout
    .woocommerce-order-details
    .woocommerce-order-details__title {

        min-height: 72px;

        padding:
            16px
            16px
            14px
            60px !important;

        font-size: 18px !important;
    }


    body.woocommerce-checkout
    .woocommerce-order-details
    .woocommerce-order-details__title::before {

        top: 15px !important;
        left: 16px !important;

        width: 32px !important;
        height: 32px !important;

        font-size: 14px !important;
    }


    body.woocommerce-checkout
    .woocommerce-order-details
    .woocommerce-order-details__title::after {

        font-size: 11px !important;
    }

}


/* =========================================================
   47. PEDIDO RECIBIDO - TOTAL, NOTA Y ACCIONES
   ========================================================= */

/* Total final destacado */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:has(th:first-child:nth-last-child(n+1)) {
    transition: background-color 0.2s ease;
}


/* Fila que contiene "Total:" */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:has(th:first-child) th {
    vertical-align: middle;
}


/* Detectar específicamente el total de WooCommerce */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-last-child(3) {

    background: #f4f8ff;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-last-child(3) th,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-last-child(3) td {

    padding-top: 17px !important;
    padding-bottom: 17px !important;

    font-size: 15px;
    font-weight: 700;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-last-child(3) td {

    color: #003ACA;

    font-size: 19px;
    font-weight: 800;
}


/* =========================================================
   NOTA DEL PEDIDO
   ========================================================= */

/* Penúltima fila: Nota */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-last-child(2) {

    background: #fafbfd;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-last-child(2) th,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-last-child(2) td {

    color: #657286;

    font-size: 12px;
    font-weight: 500;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-last-child(2) td {

    font-weight: 600;

    text-align: right;
}


/* =========================================================
   ACCIONES
   ========================================================= */

/* Última fila */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:last-child {

    background: #f8fafc;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:last-child th,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:last-child td {

    padding-top: 14px !important;
    padding-bottom: 14px !important;

    border-bottom: 0 !important;
}


/* Botón Cancelar más limpio */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:last-child
.button {

    min-height: 36px;

    padding: 8px 14px !important;

    background: #fff7f7 !important;

    border: 1px solid #fecaca !important;
    border-radius: 8px !important;

    color: #b42318 !important;

    font-size: 12px;
    font-weight: 600;

    box-shadow: none !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:last-child
.button:hover {

    background: #fff0f0 !important;

    border-color: #fca5a5 !important;

    color: #991b1b !important;
}


/* Móvil */
@media (max-width: 767px) {

    body.woocommerce-checkout
    .woocommerce-order-details
    table.woocommerce-table--order-details
    tfoot tr:nth-last-child(3) td {

        font-size: 17px;
    }

}


/* =========================================================
   48. CORRECCIÓN FINAL - TOTAL / ENVÍO / NOTA / ACCIONES
   Orden real del TFOOT:
   1 Acciones
   2 Subtotal
   3 Envío
   4 Total
   5 Nota
   ========================================================= */


/* =========================================================
   RESTABLECER FILAS NORMALES
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr {

    background: #ffffff !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr th,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr td {

    font-size: 13px !important;
    font-weight: 600 !important;

    color: #374151 !important;

    padding: 14px 18px !important;

    border-bottom: 1px solid #edf0f4 !important;
}


/* =========================================================
   SUBTOTAL
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(2) td {

    font-size: 15px !important;
    font-weight: 700 !important;

    color: #1f2937 !important;
}


/* =========================================================
   ENVÍO
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(3) {

    background: #ffffff !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(3) th,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(3) td {

    font-size: 13px !important;
    font-weight: 600 !important;

    color: #374151 !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(3) td {

    text-align: right !important;
}


/* El precio del envío ya no debe verse gigante */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(3) .amount {

    font-size: 15px !important;
    font-weight: 700 !important;

    color: #1f2937 !important;
}


/* =========================================================
   TOTAL FINAL
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(4) {

    background: #f4f8ff !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(4) th,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(4) td {

    padding-top: 18px !important;
    padding-bottom: 18px !important;

    font-size: 15px !important;
    font-weight: 700 !important;

    color: #1f2937 !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(4) td {

    font-size: 20px !important;
    font-weight: 800 !important;

    color: #003ACA !important;

    text-align: right !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(4) .amount {

    font-size: 20px !important;
    font-weight: 800 !important;

    color: #003ACA !important;
}


/* =========================================================
   NOTA
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(5) {

    background: #fafbfd !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(5) th,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(5) td {

    color: #657286 !important;

    font-size: 12px !important;
    font-weight: 500 !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(5) td {

    text-align: right !important;
}


/* =========================================================
   ACCIONES
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(1) {

    background: #f8fafc !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(1) th,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(1) td {

    padding-top: 14px !important;
    padding-bottom: 14px !important;
}


/* Botón Cancelar */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(1)
.button {

    min-height: 36px;

    padding: 8px 14px !important;

    background: #fff7f7 !important;

    border: 1px solid #fecaca !important;
    border-radius: 8px !important;

    color: #b42318 !important;

    font-size: 12px;
    font-weight: 600;

    box-shadow: none !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr:nth-child(1)
.button:hover {

    background: #fff0f0 !important;

    border-color: #fca5a5 !important;

    color: #991b1b !important;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    .woocommerce-order-details
    table.woocommerce-table--order-details
    tfoot tr:nth-child(4) td,

    body.woocommerce-checkout
    .woocommerce-order-details
    table.woocommerce-table--order-details
    tfoot tr:nth-child(4) .amount {

        font-size: 18px !important;
    }

}


/* =========================================================
   49. PEDIDO RECIBIDO - CORRECCIÓN DEFINITIVA DE TOTALES
   La tabla posee DOS TFOOT:
   1° = Acciones
   2° = Subtotal / Envío / Total / Nota
   ========================================================= */


/* ---------------------------------------------------------
   RESTABLECER TODAS LAS FILAS DEL PIE
   --------------------------------------------------------- */

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot tr {

    background: #ffffff !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot th,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot td {

    padding: 14px 18px !important;

    border-bottom: 1px solid #edf0f4 !important;

    color: #374151 !important;

    font-size: 13px !important;
    font-weight: 600 !important;

    vertical-align: middle;
}


/* Evitar que estilos anteriores agranden precios */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot .precio_ultrapc_by_h {

    color: inherit !important;

    font-size: inherit !important;
    font-weight: inherit !important;
}


/* =========================================================
   PRIMER TFOOT = ACCIONES
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:first-of-type tr {

    background: #f8fafc !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:first-of-type th,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:first-of-type td {

    padding-top: 14px !important;
    padding-bottom: 14px !important;
}


/* Botón Cancelar */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:first-of-type .button {

    min-height: 36px;

    padding: 8px 14px !important;

    background: #fff7f7 !important;

    border: 1px solid #fecaca !important;
    border-radius: 8px !important;

    color: #b42318 !important;

    font-size: 12px !important;
    font-weight: 600 !important;

    box-shadow: none !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:first-of-type .button:hover {

    background: #fff0f0 !important;

    border-color: #fca5a5 !important;

    color: #991b1b !important;
}


/* =========================================================
   ÚLTIMO TFOOT = RESUMEN ECONÓMICO
   ========================================================= */


/* SUBTOTAL */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:last-of-type tr:nth-child(1) td {

    color: #1f2937 !important;

    font-size: 15px !important;
    font-weight: 700 !important;
}


/* ENVÍO */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:last-of-type tr:nth-child(2) {

    background: #ffffff !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:last-of-type tr:nth-child(2) th,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:last-of-type tr:nth-child(2) td {

    color: #374151 !important;

    font-size: 13px !important;
    font-weight: 600 !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:last-of-type tr:nth-child(2)
.precio_ultrapc_by_h {

    color: #1f2937 !important;

    font-size: 15px !important;
    font-weight: 700 !important;
}


/* =========================================================
   TOTAL
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:last-of-type tr:nth-child(3) {

    background: #f4f8ff !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:last-of-type tr:nth-child(3) th {

    color: #1f2937 !important;

    font-size: 15px !important;
    font-weight: 700 !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:last-of-type tr:nth-child(3) td {

    color: #003ACA !important;

    font-size: 20px !important;
    font-weight: 800 !important;

    text-align: right !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:last-of-type tr:nth-child(3)
.precio_ultrapc_by_h {

    color: #003ACA !important;

    font-size: 20px !important;
    font-weight: 800 !important;
}


/* =========================================================
   NOTA
   ========================================================= */

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:last-of-type tr:nth-child(4) {

    background: #fafbfd !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:last-of-type tr:nth-child(4) th,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:last-of-type tr:nth-child(4) td {

    color: #657286 !important;

    font-size: 12px !important;
    font-weight: 500 !important;
}


body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:last-of-type tr:nth-child(4) td {

    text-align: right !important;
}


/* Última fila sin borde inferior */
body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:last-of-type tr:last-child th,

body.woocommerce-checkout
.woocommerce-order-details
table.woocommerce-table--order-details
tfoot:last-of-type tr:last-child td {

    border-bottom: 0 !important;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    .woocommerce-order-details
    table.woocommerce-table--order-details
    tfoot:last-of-type tr:nth-child(3) td,

    body.woocommerce-checkout
    .woocommerce-order-details
    table.woocommerce-table--order-details
    tfoot:last-of-type tr:nth-child(3)
    .precio_ultrapc_by_h {

        font-size: 18px !important;
    }

}


/* =========================================================
   50. PEDIDO RECIBIDO - DIRECCIONES
   ========================================================= */

body.woocommerce-checkout
.woocommerce-customer-details {

    max-width: 690px;

    margin: 0 auto 30px !important;
}


/* Contenedor de las dos tarjetas */
body.woocommerce-checkout
.woocommerce-customer-details
.woocommerce-columns {

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 18px;

    margin: 0 !important;
}


/* Cada dirección */
body.woocommerce-checkout
.woocommerce-customer-details
.woocommerce-column {

    float: none !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    background: #ffffff;

    border: 1px solid #e5eaf0;
    border-radius: 14px;

    overflow: hidden;

    box-shadow:
        0 5px 18px rgba(20, 40, 70, 0.05);
}


/* =========================================================
   TÍTULOS
   ========================================================= */

body.woocommerce-checkout
.woocommerce-customer-details
.woocommerce-column > h2 {

    position: relative;

    display: block !important;

    min-height: 78px;

    margin: 0 !important;

    padding:
        18px
        18px
        15px
        64px !important;

    background: #ffffff !important;

    border: 0 !important;
    border-bottom: 1px solid #edf0f4 !important;

    color: #1f2937 !important;

    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;

    text-align: left !important;
}


/* Eliminar decoraciones heredadas */
body.woocommerce-checkout
.woocommerce-customer-details
.woocommerce-column > h2::after {

    position: static !important;

    display: block !important;

    width: auto !important;
    height: auto !important;

    margin: 3px 0 0 !important;

    background: transparent !important;

    border: 0 !important;

    color: #8a94a3;

    font-size: 11px;
    font-weight: 400;
    line-height: 1.4;

    transform: none !important;
}


/* =========================================================
   FACTURACIÓN = 2
   ========================================================= */

body.woocommerce-checkout
.woocommerce-column--billing-address > h2::before {

    content: "2";

    position: absolute;

    top: 17px;
    left: 18px;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    background: #eef5ff;

    border-radius: 50%;

    color: #1473e6;

    font-size: 14px;
    font-weight: 800;
    line-height: 1;

    box-shadow:
        0 2px 8px rgba(20, 115, 230, 0.08);
}


body.woocommerce-checkout
.woocommerce-column--billing-address > h2::after {

    content: "Datos asociados al comprador.";
}


/* =========================================================
   ENVÍO = 3
   ========================================================= */

body.woocommerce-checkout
.woocommerce-column--shipping-address > h2::before {

    content: "3";

    position: absolute;

    top: 17px;
    left: 18px;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    background: #eef5ff;

    border-radius: 50%;

    color: #1473e6;

    font-size: 14px;
    font-weight: 800;
    line-height: 1;

    box-shadow:
        0 2px 8px rgba(20, 115, 230, 0.08);
}


body.woocommerce-checkout
.woocommerce-column--shipping-address > h2::after {

    content: "Lugar indicado para la entrega.";
}


/* =========================================================
   CONTENIDO DE LA DIRECCIÓN
   ========================================================= */

body.woocommerce-checkout
.woocommerce-customer-details
.woocommerce-column address {

    margin: 0 !important;

    padding: 20px !important;

    background: #ffffff !important;

    border: 0 !important;

    color: #536174;

    font-size: 12px;
    font-style: normal !important;
    font-weight: 500;
    line-height: 1.75;
}


/* Datos destacados como email/teléfono */
body.woocommerce-checkout
.woocommerce-customer-details
.woocommerce-column address p {

    margin: 6px 0 0 !important;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    .woocommerce-customer-details
    .woocommerce-columns {

        grid-template-columns: 1fr;

        gap: 14px;
    }


    body.woocommerce-checkout
    .woocommerce-customer-details
    .woocommerce-column > h2 {

        min-height: 72px;

        padding:
            16px
            16px
            14px
            58px !important;

        font-size: 16px !important;
    }


    body.woocommerce-checkout
    .woocommerce-column--billing-address > h2::before,

    body.woocommerce-checkout
    .woocommerce-column--shipping-address > h2::before {

        top: 15px;
        left: 15px;

        width: 32px;
        height: 32px;

        font-size: 13px;
    }


    body.woocommerce-checkout
    .woocommerce-customer-details
    .woocommerce-column address {

        padding: 17px !important;

        font-size: 11.5px;
    }

}


/* =========================================================
   51. SU PEDIDO - CABECERA Y TOTAL EN BLANCO
   ========================================================= */

/*
 * Cabecera PRODUCTO / SUBTOTAL
 */
body.woocommerce-checkout
#order_review
.woocommerce-checkout-review-order-table thead,

body.woocommerce-checkout
#order_review
.woocommerce-checkout-review-order-table thead tr,

body.woocommerce-checkout
#order_review
.woocommerce-checkout-review-order-table thead th {

    background: #ffffff !important;
    background-color: #ffffff !important;
}


/*
 * Fila TOTAL
 */
body.woocommerce-checkout
#order_review
.woocommerce-checkout-review-order-table
tr.order-total,

body.woocommerce-checkout
#order_review
.woocommerce-checkout-review-order-table
tr.order-total th,

body.woocommerce-checkout
#order_review
.woocommerce-checkout-review-order-table
tr.order-total td {

    background: #ffffff !important;
    background-color: #ffffff !important;
}


/*
 * Mantener solamente una separación suave.
 */
body.woocommerce-checkout
#order_review
.woocommerce-checkout-review-order-table thead th {

    border-bottom: 1px solid #e7ebf0 !important;
}


body.woocommerce-checkout
#order_review
.woocommerce-checkout-review-order-table
tr.order-total th,

body.woocommerce-checkout
#order_review
.woocommerce-checkout-review-order-table
tr.order-total td {

    border-top: 1px solid #e7ebf0 !important;
}


/* =========================================================
   52. ELIMINAR SUBRAYADOS EN TÍTULOS DEL CHECKOUT
   ========================================================= */

/* Detalles de Facturación - subtítulo */
body.woocommerce-checkout
.woocommerce-billing-fields > h3::after {

    text-decoration: none !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
}


/* Detalles de envío - subtítulo */
body.woocommerce-checkout
#customer_details > .col-2 > h3::after {

    text-decoration: none !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
}


/* Su pedido - eliminar línea azul decorativa */
body.woocommerce-checkout
.order-review-wrapper
#order_review_heading_v2::after {

    content: none !important;
    display: none !important;
}


/* Refuerzo por estilos heredados del tema */
body.woocommerce-checkout
.woocommerce-billing-fields > h3,

body.woocommerce-checkout
#customer_details > .col-2 > h3,

body.woocommerce-checkout
.order-review-wrapper
#order_review_heading_v2 {

    text-decoration: none !important;
}


/* =========================================================
   53. ELIMINAR SUBTÍTULOS GRISES DE LAS SECCIONES
   ========================================================= */

/* 1. Detalles de Facturación */
body.woocommerce-checkout
.woocommerce-billing-fields > h3::after {

    content: none !important;
    display: none !important;
}


body.woocommerce-checkout
.woocommerce-billing-fields > h3 {

    grid-template-rows: auto !important;

    padding-bottom: 16px !important;
}


/* 2. Detalles de envío */
body.woocommerce-checkout
#customer_details > .col-2 > h3::after {

    content: none !important;
    display: none !important;
}


body.woocommerce-checkout
#customer_details > .col-2 > h3 {

    grid-template-rows: auto !important;

    padding-bottom: 16px !important;
}


/* 3. Método de pago */
body.woocommerce-checkout
#payment
ul.payment_methods::after {

    content: none !important;
    display: none !important;
}


/* Reducir el espacio reservado para el encabezado de pago */
body.woocommerce-checkout
#payment {

    padding-top: 72px !important;
}


body.woocommerce-checkout
#payment
ul.payment_methods::before {

    top: 24px !important;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    body.woocommerce-checkout
    #payment {

        padding-top: 66px !important;
    }


    body.woocommerce-checkout
    #payment
    ul.payment_methods::before {

        top: 20px !important;
    }

}


/* =========================================================
   54. PUNTO BLUE - BOTÓN DESPLEGABLE
   ========================================================= */

body.woocommerce-checkout
.ultrapc-punto-blue-toggle {

    appearance: none !important;
    -webkit-appearance: none !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    gap: 8px !important;

    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;

    margin: 8px 0 0 !important;
    padding: 8px 12px !important;

    background: #f5f9ff !important;

    border: 1px solid #dbeafe !important;
    border-radius: 8px !important;

    color: #1473e6 !important;

    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;

    text-align: left !important;
    text-transform: none !important;

    box-shadow: none !important;

    cursor: pointer;

    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease !important;
}


/* Hover */
body.woocommerce-checkout
.ultrapc-punto-blue-toggle:hover {

    background: #edf5ff !important;

    border-color: #bfd8f8 !important;

    color: #0f65cf !important;

    box-shadow: none !important;

    transform: none !important;
}


/* Estado abierto */
body.woocommerce-checkout
.ultrapc-punto-blue-toggle[aria-expanded="true"] {

    background: #eef6ff !important;

    border-color: #b7d5f8 !important;

    color: #0f65cf !important;
}


/* Flecha */
body.woocommerce-checkout
.ultrapc-punto-blue-icon {

    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 16px;
    height: 16px;

    color: #1473e6;

    font-size: 14px;
    font-weight: 700;
    line-height: 1;
}


/* =========================================================
   INFORMACIÓN DESPLEGADA
   ========================================================= */

body.woocommerce-checkout
#texto_punto_bluex {

    width: 100% !important;

    margin: 10px 0 2px !important;
    padding: 12px 14px !important;

    background: #f8fbff;

    border: 1px solid #e0ebf8;
    border-left: 3px solid #1473e6;
    border-radius: 8px;

    color: #718096 !important;

    font-size: 11.5px !important;
    line-height: 1.55 !important;

    box-sizing: border-box;
}


/* Respetar estado oculto */
body.woocommerce-checkout
#texto_punto_bluex[hidden] {

    display: none !important;
}


/* Enlace Punto Blue */
body.woocommerce-checkout
#texto_punto_bluex a {

    color: #1473e6 !important;

    font-weight: 600 !important;

    text-decoration: none !important;
}


body.woocommerce-checkout
#texto_punto_bluex a:hover {

    text-decoration: underline !important;
}


/* Móvil */
@media (max-width: 767px) {

    body.woocommerce-checkout
    .ultrapc-punto-blue-toggle {

        padding: 8px 10px !important;

        font-size: 11.5px !important;
    }


    body.woocommerce-checkout
    #texto_punto_bluex {

        padding: 11px 12px !important;

        font-size: 11px !important;
    }

}


/* =========================================================
   55. PUNTO BLUE - ELIMINAR FLECHAS / SÍMBOLOS
   ========================================================= */

body.woocommerce-checkout
.ultrapc-punto-blue-icon {

    display: none !important;
}


/* Ya no necesitamos separación para el icono */
body.woocommerce-checkout
.ultrapc-punto-blue-toggle {

    gap: 0 !important;
}



/* =========================================================
   56. COMPACTAR CABECERA DE FACTURACIÓN
   ========================================================= */

/* Menos espacio debajo de "Editar datos..." */
body.woocommerce-checkout
#div_boton_editar_datos_facturacion {

    margin: 0 0 8px !important;
    padding: 0 !important;
}


body.woocommerce-checkout
#div_boton_editar_datos_facturacion
.cont_boton_editar_datos_facturacion {

    margin: 0 !important;
    padding: 0 !important;
}


/* Acercar el checkbox de Factura Electrónica */
body.woocommerce-checkout
.woocommerce-billing-fields
.form-row:has(input[type="checkbox"]) {

    margin-top: 4px !important;
    margin-bottom: 14px !important;
}


/* Reducir espacio vertical general en esa zona */
body.woocommerce-checkout
.woocommerce-billing-fields__field-wrapper {

    row-gap: 14px !important;
}



/* =========================================================
   57. COMPACTAR AÚN MÁS CABECERA DE FACTURACIÓN
   ========================================================= */

body.woocommerce-checkout
#div_boton_editar_datos_facturacion {

    margin-bottom: 2px !important;
}


body.woocommerce-checkout
.woocommerce-billing-fields
.form-row:has(input[type="checkbox"]) {

    margin-top: 0 !important;
    margin-bottom: 10px !important;
}


/* Reducir aire extra antes del primer campo real */
body.woocommerce-checkout
.woocommerce-billing-fields__field-wrapper {

    row-gap: 12px !important;
}