/* ============================================================
   UARTES — RESUMEN DE INSCRIPCIÓN
   WooCommerce Cart

   La plataforma opera con un solo producto por transacción.
   ============================================================ */


/* ============================================================
   01. VARIABLES
   ============================================================ */

body.uartes-cart-page {

    --uartes-cart-primary: #287b86;
    --uartes-cart-primary-dark: #226b75;

    --uartes-cart-text: #242424;
    --uartes-cart-muted: #70787a;

    --uartes-cart-border: #e1e4e5;
    --uartes-cart-border-hover: #c6ccce;

    --uartes-cart-bg: #f7f8f8;
    --uartes-cart-white: #ffffff;

    --uartes-cart-success: #237a5a;

    --uartes-cart-radius: 16px;
    --uartes-cart-field-radius: 9px;

    --uartes-cart-orange: #e67e22;
    --uartes-cart-orange-dark: #c86410;
    --uartes-cart-orange-soft: #fff3e8;
    --uartes-cart-orange-border: #f0c9a6;

}


/* ============================================================
   02. CABECERA
   ============================================================ */

body.uartes-cart-page
.entry-header {

    text-align: center;

}


body.uartes-cart-page
.entry-header
.uartes-cart-page-title {

    margin-bottom: 8px;

    color: #111;

    font-size:
        clamp(36px, 5vw, 56px);

    font-weight: 700;
    line-height: 1.08;

}


body.uartes-cart-page
.uartes-cart-page-subtitle {

    max-width: 620px;

    margin:
        0
        auto;

    color:
        var(--uartes-cart-muted);

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

}


/* ============================================================
   03. CONTENEDOR GENERAL
   ============================================================ */

body.uartes-cart-page
.entry-content > .woocommerce {

    width:
        min(1180px, calc(100vw - 48px));

    max-width: none;

    margin:
        0
        auto
        70px;

}


/* ============================================================
   04. LAYOUT PRINCIPAL
   ============================================================ */

body.uartes-cart-page
.uartes-cart-layout {

    display: grid;

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

    gap: 30px;

    align-items: start;

    width: 100%;

    /*
     * Respiración entre titular/subtítulo
     * y contenido.
     */
    margin-top: 36px;

}


/* ============================================================
   05. FORMULARIO DEL CARRITO
   ============================================================ */

body.uartes-cart-page
.woocommerce-cart-form {

    display: block;

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

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

}


/* ============================================================
   06. TABLA BASE
   WooCommerce table → contenedor estructural
   ============================================================ */

body.uartes-cart-page
.woocommerce-cart-form
table.woocommerce-cart-form__contents,

body.uartes-cart-page
.woocommerce-cart-form
table.shop_table.cart {

    display: block !important;

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

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

    background: transparent !important;

    border: 0 !important;

    border-collapse: collapse;

    box-sizing: border-box;

}


body.uartes-cart-page
.woocommerce-cart-form
table.woocommerce-cart-form__contents > thead,

body.uartes-cart-page
.woocommerce-cart-form
table.shop_table.cart > thead {

    display: none !important;

}


body.uartes-cart-page
.woocommerce-cart-form
table.woocommerce-cart-form__contents > tbody,

body.uartes-cart-page
.woocommerce-cart-form
table.shop_table.cart > tbody {

    display: block !important;

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

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

}


/* ============================================================
   07. CARD DEL PRODUCTO
   ============================================================ */

body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card {

    position: relative !important;

    display: grid !important;

    grid-template-columns:
        150px
        minmax(0, 1fr)
        150px !important;

    grid-template-areas:
        "image info price";

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

    align-items: center;

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

    min-height: 228px;

    margin: 0 !important;

    padding:
        24px
        28px !important;

    background:
        var(--uartes-cart-white) !important;

    border:
        1px solid
        var(--uartes-cart-border) !important;

    border-radius:
        var(--uartes-cart-radius) !important;

    box-shadow:
        0 12px 32px
        rgba(0, 0, 0, .045);

    box-sizing: border-box !important;

}


/* ============================================================
   08. RESET REAL DE CELDAS DEL THEME

   Neutraliza:
   td.product-name { width: 30%; }
   paddings, floats, etc.
   ============================================================ */

body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
> td {

    display: block !important;

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

    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;

    height: auto !important;

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

    background: transparent !important;

    border: 0 !important;

    vertical-align: middle !important;

    box-sizing: border-box !important;

}


/* ============================================================
   09. IMAGEN DEL CURSO
   ============================================================ */

body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-thumbnail {

    grid-area: image !important;

    display: block !important;

    width: 150px !important;
    min-width: 150px !important;
    max-width: 150px !important;

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

}


body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-thumbnail > a {

    display: block !important;

    width: 150px !important;
    height: 180px;

    margin: 0 !important;

}


body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-thumbnail img {

    display: block !important;

    width: 150px !important;
    min-width: 150px !important;
    max-width: 150px !important;

    height: 180px !important;

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

    object-fit: cover;
    object-position: center;

    border-radius: 12px;

}


/* ============================================================
   10. INFORMACIÓN DEL CURSO
   ============================================================ */

body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-name {

    grid-area: info !important;

    display: block !important;

    align-self: center;

    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;

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

}


/* ------------------------------------------------------------
   EYEBROW
   ------------------------------------------------------------ */

body.uartes-cart-page
.uartes-cart-product-eyebrow {

    display: block;

    margin:
        0
        0
        8px;

    color:
        var(--uartes-cart-primary);

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

    text-transform: uppercase;

    letter-spacing: .07em;

}


/* ------------------------------------------------------------
   NOMBRE DEL CURSO
   ------------------------------------------------------------ */

body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-name > a {

    display: block !important;

    width: auto !important;
    max-width: 520px;

    margin: 0 !important;

    color:
        var(--uartes-cart-text) !important;

    font-size: 19px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;

    text-decoration: none !important;

    word-break: normal;
    overflow-wrap: break-word;

}


body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-name > a:hover {

    color:
        var(--uartes-cart-primary) !important;

}


/* ============================================================
   11. PRECIO
   ============================================================ */

body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-price {

    grid-area: price !important;

    display: flex !important;

    flex-direction: column;

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

    width: 150px !important;
    min-width: 150px !important;
    max-width: 150px !important;

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

    text-align: right;

}


/* ------------------------------------------------------------
   LABEL PRECIO
   ------------------------------------------------------------ */

body.uartes-cart-page
.uartes-cart-price-label {

    display: block;

    margin:
        0
        0
        6px;

    color:
        var(--uartes-cart-muted);

    font-size: 10px;
    font-weight: 700;
    line-height: 1.2;

    white-space: nowrap;

    text-transform: uppercase;

    letter-spacing: .06em;

}


/* ------------------------------------------------------------
   MONTO
   ------------------------------------------------------------ */

body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-price
.woocommerce-Price-amount {

    display: block;

    color:
        var(--uartes-cart-text);

    font-size: 26px !important;
    font-weight: 800;
    line-height: 1.1;

    white-space: nowrap;

}


/* ------------------------------------------------------------
   REGULAR + SALE
   Preparado para preventa
   ------------------------------------------------------------ */

body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-price del {

    display: block;

    margin:
        0
        0
        4px;

    color:
        var(--uartes-cart-muted);

    font-size: 13px;

    opacity: .7;

}


body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-price ins {

    display: block;

    margin: 0;
    padding: 0;

    background: transparent;

    color:
        var(--uartes-cart-primary);

    text-decoration: none;

}


/* ============================================================
   12. CANTIDAD Y SUBTOTAL
   No se utilizan en este flujo
   ============================================================ */

body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-quantity,

body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-subtotal {

    display: none !important;

    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;

    height: 0 !important;

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

    overflow: hidden !important;

}


/* ============================================================
   13. ELIMINAR INSCRIPCIÓN
   ============================================================ */

body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-remove {

    position: absolute !important;

    z-index: 5;

    top: 16px !important;
    right: 16px !important;

    display: block !important;

    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;

    height: 32px !important;

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

}


body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-remove
a.remove {

    display: flex !important;

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

    width: 32px !important;
    min-width: 32px !important;

    height: 32px !important;

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

    background:
        #f7f8f8 !important;

    border:
        1px solid
        #e0e3e4 !important;

    border-radius: 50%;

    color:
        #72797b !important;

    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: 1 !important;

    text-align: center;
    text-decoration: none !important;

    box-sizing: border-box;

    transition:
        background .18s ease,
        border-color .18s ease,
        color .18s ease;

}


/*
 * Shopkeeper añade su propio icono
 * mediante pseudo-elementos.
 * Conservamos únicamente la × del HTML.
 */

body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-remove
a.remove::before,

body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-remove
a.remove::after {

    content: none !important;

    display: none !important;

}


body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
tr.uartes-cart-product-card
td.product-remove
a.remove:hover {

    background:
        #fff4f4 !important;

    border-color:
        #e9bcbc !important;

    color:
        #b84343 !important;

}


/* ============================================================
   14. FILA ACTIONS
   ============================================================ */

body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody > tr:not(.cart_item) {

    display: block !important;

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

    margin:
        20px
        0
        0 !important;

    padding: 0 !important;

}


body.uartes-cart-page
.woocommerce-cart-form
.shop_table.cart
tbody
td.actions {

    display: block !important;

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

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

    background: transparent !important;

    border: 0 !important;

}


/* ============================================================
   15. BENEFICIO INSTITUCIONAL
   Override específico para Shopkeeper

   IMPORTANTE:
   .woocommerce-cart es clase DEL BODY.
   Por eso aquí usamos:
   body.uartes-cart-page.woocommerce-cart
   sin espacio.
   ============================================================ */

body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card {

    position: relative !important;

    display: grid !important;

    grid-template-columns:
        minmax(0, 1fr)
        175px !important;

    grid-template-areas:
        "header header"
        "input button"
        "help help" !important;

    column-gap: 12px !important;
    row-gap: 16px !important;

    float: none !important;

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

    margin: 0 !important;

    /*
     * Supera el padding !important de Shopkeeper.
     */
    padding:
        26px
        28px !important;

    background:
        #f8faf9 !important;

    border:
        1px solid
        #dce5e3 !important;

    border-radius:
        var(--uartes-cart-radius) !important;

    box-sizing: border-box !important;

}

/* ============================================================
   BENEFICIO INSTITUCIONAL — ACENTO NARANJA
   ============================================================ */

body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card {

    background:
        linear-gradient(
            180deg,
            #fcfdfd 0%,
            #f8faf9 72%,
            #fffaf5 100%
        ) !important;

}


body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card::after {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            var(--uartes-cart-primary) 0%,
            var(--uartes-cart-orange) 100%
        );

    border-radius:
        var(--uartes-cart-radius)
        var(--uartes-cart-radius)
        0
        0;

}


    /* icono del beneficio */
    body.uartes-cart-page.woocommerce-cart
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr
    td.actions
    .coupon.uartes-benefit-card::before {

        background:
            rgba(230, 126, 34, .12) !important;

        color:
            var(--uartes-cart-orange-dark) !important;

    }


    /* título del bloque */
    body.uartes-cart-page.woocommerce-cart
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr
    td.actions
    .coupon.uartes-benefit-card
    .uartes-benefit-header__content h2 {

        color:
            #1f1f1f !important;

    }


    /* link whatsapp */
    body.uartes-cart-page.woocommerce-cart
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr
    td.actions
    .coupon.uartes-benefit-card
    .uartes-benefit-help a {

        color:
            var(--uartes-cart-orange-dark) !important;

    }


    body.uartes-cart-page.woocommerce-cart
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr
    td.actions
    .coupon.uartes-benefit-card
    .uartes-benefit-help a:hover {

        color:
            #9f4700 !important;

    }


/* ============================================================
   16. ICONO NATIVO SHOPKEEPER
   ============================================================ */

body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card::before {

    /*
     * NO redefinimos content ni font-family.
     *
     * Shopkeeper conserva:
     * content: "P";
     * font-family: Shopkeeper-Icon-Font;
     */

    position: absolute !important;

    top: 26px !important;
    left: 28px !important;

    display: flex !important;

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

    width: 42px !important;
    height: 42px !important;

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

    background:
        rgba(40, 123, 134, .08) !important;

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

    color:
        var(--uartes-cart-primary) !important;

    font-size: 21px !important;
    line-height: 1 !important;

    text-align: center !important;

    box-sizing: border-box !important;

}


/* ============================================================
   17. HEADER BENEFICIO
   ============================================================ */

body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card
.uartes-benefit-header {

    grid-area: header !important;

    display: block !important;

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

    min-height: 42px;

    margin: 0 !important;

    /*
     * Reservamos espacio para el icono.
     */
    padding:
        0
        0
        0
        56px !important;

    box-sizing: border-box !important;

    text-align: left !important;

}


body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card
.uartes-benefit-header__content {

    display: block !important;

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

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

    text-align: left !important;

}


body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card
.uartes-benefit-header__content h2 {

    margin:
        1px
        0
        5px !important;

    padding: 0 !important;

    color:
        var(--uartes-cart-text) !important;

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

    text-align: left !important;

    text-transform: none !important;

}


body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card
.uartes-benefit-header__content p {

    max-width: 650px !important;

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

    color:
        var(--uartes-cart-muted) !important;

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

    text-align: left !important;

}


/* ============================================================
   18. LABEL NATIVO WOOCOMMERCE
   ============================================================ */

body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card
label.screen-reader-text {

    position: absolute !important;

    width: 1px !important;
    height: 1px !important;

    margin: -1px !important;
    padding: 0 !important;

    overflow: hidden !important;

    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;

    white-space: nowrap !important;

    border: 0 !important;

}


/* ============================================================
   19. INPUT BENEFICIO
   ============================================================ */

body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card
#coupon_code {

    grid-area: input !important;

    display: block !important;

    float: none !important;

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

    height: 52px !important;

    margin: 0 !important;

    padding:
        0
        16px !important;

    background:
        #fff !important;

    border:
        1px solid
        #d8ddde !important;

    border-radius:
        9px !important;

    outline: 0 !important;

    color:
        var(--uartes-cart-text) !important;

    font-family: inherit !important;

    font-size: 13px !important;
    font-weight: 400 !important;

    line-height: normal !important;

    box-shadow: none !important;

    box-sizing: border-box !important;

    transition:
        border-color .18s ease,
        box-shadow .18s ease;

}


body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card
#coupon_code::placeholder {

    color:
        #969d9f !important;

    opacity: 1 !important;

}


body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card
#coupon_code:hover {

    border-color:
        var(--uartes-cart-border-hover) !important;

}


body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card
#coupon_code:focus {

    border-color:
        var(--uartes-cart-primary) !important;

    box-shadow:
        0 0 0 3px
        rgba(40, 123, 134, .09) !important;

}


/* ============================================================
   20. BOTÓN APLICAR BENEFICIO
   ============================================================ */

body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card
button[name="apply_coupon"] {

    grid-area: button !important;

    display: flex !important;

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

    float: none !important;

    width: 175px !important;
    min-width: 175px !important;
    max-width: 175px !important;

    height: 52px !important;

    margin: 0 !important;

    padding:
        0
        18px !important;

    background:
        var(--uartes-cart-primary) !important;

    border:
        1px solid
        var(--uartes-cart-primary) !important;

    border-radius:
        9px !important;

    color:
        #fff !important;

    font-family: inherit !important;

    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;

    white-space: nowrap !important;

    text-align: center !important;
    text-transform: none !important;

    box-shadow: none !important;

    box-sizing: border-box !important;

    cursor: pointer;

    transition:
        background .18s ease,
        border-color .18s ease,
        transform .18s ease;

}


body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card
button[name="apply_coupon"]:hover {

    background:
        var(--uartes-cart-primary-dark) !important;

    border-color:
        var(--uartes-cart-primary-dark) !important;

    color:
        #fff !important;

    transform:
        translateY(-1px);

}


/* ============================================================
   21. AYUDA / WHATSAPP
   ============================================================ */

body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card
.uartes-benefit-help {

    grid-area: help !important;

    display: flex !important;

    flex-direction: row !important;

    align-items: center !important;

    gap: 6px !important;

    width: 100% !important;

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

    color:
        var(--uartes-cart-muted) !important;

    font-size: 11px !important;
    line-height: 1.4 !important;

    text-align: left !important;

}


body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card
.uartes-benefit-help span {

    display: inline !important;

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

}


body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card
.uartes-benefit-help a {

    display: inline-flex !important;

    align-items: center !important;

    gap: 4px !important;

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

    color:
        var(--uartes-cart-primary) !important;

    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;

    text-decoration: none !important;

    white-space: nowrap;

}


body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card
.uartes-benefit-help a:hover {

    color:
        var(--uartes-cart-primary-dark) !important;

    text-decoration: underline !important;

}


/* ------------------------------------------------------------
   SVG DE LA FLECHA
   Evita dimensiones gigantes heredadas.
   ------------------------------------------------------------ */

body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card
.uartes-benefit-help
a svg {

    display: block !important;

    flex:
        0 0
        14px !important;

    width: 14px !important;
    min-width: 14px !important;
    max-width: 14px !important;

    height: 14px !important;
    min-height: 14px !important;
    max-height: 14px !important;

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

}


/* ============================================================
   22. ACTUALIZAR CARRITO
   ============================================================ */

body.uartes-cart-page
.uartes-update-cart-hidden {

    display: none !important;

}


/* ============================================================
   23. COLLATERALS
   Quitamos fondo heredado + efecto “hoja arrancada”
   ============================================================ */

body.uartes-cart-page.woocommerce-cart
.cart-collaterals {

    display: block !important;

    float: none !important;

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

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

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;

}


/*
 * Shopkeeper mete decoración arriba/abajo
 * con ::before y ::after.
 * Aquí la mandamos respetuosamente al exilio.
 */

body.uartes-cart-page.woocommerce-cart
.cart-collaterals::before,

body.uartes-cart-page.woocommerce-cart
.cart-collaterals::after {

    content: none !important;

    display: none !important;

    background: none !important;

    width: 0 !important;
    height: 0 !important;

}


/* ============================================================
   24. RESUMEN LATERAL
   ============================================================ */

body.uartes-cart-page
.cart-collaterals
.cart_totals.uartes-cart-summary {

    position: sticky;

    top: 28px;

    float: none !important;

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

    margin: 0 !important;

    padding:
        26px
        24px !important;

    overflow: hidden;

    background:
        var(--uartes-cart-white) !important;

    border:
        1px solid
        var(--uartes-cart-border) !important;

    border-radius:
        var(--uartes-cart-radius) !important;

    box-shadow:
        0 14px 38px
        rgba(0, 0, 0, .06);

    box-sizing: border-box;

}


/* ------------------------------------------------------------
   ACENTO SUPERIOR
   ------------------------------------------------------------ */

body.uartes-cart-page
.cart-collaterals
.cart_totals.uartes-cart-summary::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 5px;

    background:
        var(--uartes-cart-primary);

    border-radius:
        var(--uartes-cart-radius)
        var(--uartes-cart-radius)
        0
        0;

}


/* ============================================================
   25. TÍTULO RESUMEN
   ============================================================ */

body.uartes-cart-page
.uartes-cart-summary > h2 {

    margin:
        0
        0
        18px !important;

    padding: 0 !important;

    background:
        transparent !important;

    border: 0 !important;

    color:
        var(--uartes-cart-text);

    font-size: 20px !important;
    font-weight: 700 !important;

    text-transform: none !important;

}


/* ============================================================
   26. TABLA RESUMEN
   ============================================================ */

body.uartes-cart-page
.uartes-cart-summary
table.shop_table {

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

    margin:
        0
        0
        20px !important;

    padding: 0 !important;

    background:
        transparent !important;

    border: 0 !important;

    border-collapse: collapse;

}


body.uartes-cart-page
.uartes-cart-summary
table.shop_table
tr {

    border-bottom:
        1px solid
        #e6e8e9;

}


body.uartes-cart-page
.uartes-cart-summary
table.shop_table
th,

body.uartes-cart-page
.uartes-cart-summary
table.shop_table
td {

    width: auto !important;

    margin: 0 !important;

    padding:
        15px
        0 !important;

    background:
        transparent !important;

    border: 0 !important;

    color:
        var(--uartes-cart-text);

    font-size: 12px;

}


body.uartes-cart-page
.uartes-cart-summary
table.shop_table
th {

    font-weight: 700;

    text-align: left;

}


body.uartes-cart-page
.uartes-cart-summary
table.shop_table
td {

    font-weight: 600;

    text-align: right;

}


/* ============================================================
   BENEFICIO APLICADO — VALOR
   ============================================================ */

body.uartes-cart-page
.uartes-cart-summary
.uartes-benefit-applied-row
td {

    padding:
        16px
        12px
        16px
        8px !important;

    background:
        var(--uartes-cart-orange-soft) !important;

    vertical-align:
        middle !important;

    text-align:
        right !important;

}


/* -$8,00 como una sola unidad */

body.uartes-cart-page
.uartes-benefit-discount-value {

    display: block;

    margin: 0;

    color:
        var(--uartes-cart-orange-dark);

    font-size: 13px;
    font-weight: 800;
    line-height: 1.2;

    white-space: nowrap;

}


body.uartes-cart-page
.uartes-benefit-discount-value
.woocommerce-Price-amount {

    display: inline !important;

    margin: 0 !important;

    color:
        inherit !important;

    font-size:
        inherit !important;

    font-weight:
        inherit !important;

}


/* ============================================================
   BOTÓN ELIMINAR BENEFICIO
   ============================================================ */

body.uartes-cart-page
.uartes-cart-summary
.uartes-benefit-applied-row
.woocommerce-remove-coupon {

    position: static !important;

    display: inline-flex !important;

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

    width: 26px !important;
    height: 26px !important;

    margin:
        7px
        0
        0
        auto !important;

    padding: 0 !important;

    background:
        rgba(200, 100, 16, .07) !important;

    border:
        1px solid
        rgba(200, 100, 16, .18) !important;

    border-radius:
        50% !important;

    color:
        var(--uartes-cart-orange-dark) !important;

    text-decoration:
        none !important;

    box-shadow:
        none !important;

    transition:
        background .18s ease,
        color .18s ease,
        border-color .18s ease;

}


body.uartes-cart-page
.uartes-cart-summary
.uartes-benefit-applied-row
.woocommerce-remove-coupon svg {

    display: block !important;

    width: 13px !important;
    height: 13px !important;

    margin: 0 !important;

}


body.uartes-cart-page
.uartes-cart-summary
.uartes-benefit-applied-row
.woocommerce-remove-coupon:hover {

    background:
        rgba(200, 100, 16, .14) !important;

    border-color:
        rgba(200, 100, 16, .32) !important;

    color:
        #9f4700 !important;

}


/* Shopkeeper no mete nada adicional */

body.uartes-cart-page
.uartes-cart-summary
.uartes-benefit-applied-row
.woocommerce-remove-coupon::before,

body.uartes-cart-page
.uartes-cart-summary
.uartes-benefit-applied-row
.woocommerce-remove-coupon::after {

    content: none !important;

    display: none !important;

}


/* ------------------------------------------------------------
   BADGE DEL CÓDIGO
   ------------------------------------------------------------ */

body.uartes-cart-page
.uartes-benefit-code {

    display: inline-flex !important;

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

    margin-top:
        8px !important;

    padding:
        5px
        10px !important;

    background:
        #fff3e8 !important;

    border:
        1px solid
        #f0c9a6 !important;

    border-radius:
        999px !important;

    color:
        var(--uartes-cart-orange-dark) !important;

    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;

    text-transform: uppercase !important;

    letter-spacing: .06em !important;

}


/* ------------------------------------------------------------
   TOTAL FINAL
   Siempre negro
   ------------------------------------------------------------ */

body.uartes-cart-page
.uartes-cart-summary
.order-total
.woocommerce-Price-amount {

    color:
        #111 !important;

}

/* ============================================================
   28. TOTAL
   ============================================================ */

body.uartes-cart-page
.uartes-cart-summary
.order-total {

    border-bottom:
        0 !important;

}


body.uartes-cart-page
.uartes-cart-summary
.order-total th,

body.uartes-cart-page
.uartes-cart-summary
.order-total td {

    padding-top:
        20px !important;

    color:
        #111;

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

}


body.uartes-cart-page
.uartes-cart-summary
.order-total
.woocommerce-Price-amount {

    font-size: 24px;

    white-space: nowrap;

    color:
        var(--uartes-cart-orange-dark);

}

/* ============================================================
   29. CTA
   ============================================================ */

body.uartes-cart-page
.wc-proceed-to-checkout {

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

}


body.uartes-cart-page
.uartes-cart-checkout-button {

    display: flex !important;

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

    gap: 9px;

    width: 100% !important;

    min-height: 52px;

    margin: 0 !important;

    padding:
        13px
        18px !important;

    background:
        var(--uartes-cart-primary) !important;

    border:
        1px solid
        var(--uartes-cart-primary) !important;

    border-radius:
        8px !important;

    color:
        #fff !important;

    font-size: 12px !important;
    font-weight: 700 !important;

    line-height: 1.3;

    text-align: center;
    text-decoration: none !important;

    text-transform: none !important;

    box-sizing: border-box;

    box-shadow:
        0 8px 20px
        rgba(40, 123, 134, .18);

    transition:
        background .18s ease,
        transform .18s ease,
        box-shadow .18s ease;

}


body.uartes-cart-page
.uartes-cart-checkout-button:hover {

    background:
        var(--uartes-cart-primary-dark) !important;

    color:
        #fff !important;

    transform:
        translateY(-1px);

    box-shadow:
        0 10px 24px
        rgba(40, 123, 134, .24);

}


body.uartes-cart-page
.uartes-cart-checkout-button svg {

    display: block;

    flex:
        0 0
        18px;

    width: 18px;
    height: 18px;

}


/* ============================================================
   30. VOLVER A CURSOS
   ============================================================ */

body.uartes-cart-page
.uartes-continue-courses {

    width: 100%;

    margin:
        20px
        0
        0;

    text-align: left;

}


body.uartes-cart-page
.uartes-continue-courses
a.button {

    display: inline-flex;

    align-items: center;

    padding: 0 !important;

    background:
        transparent !important;

    border:
        0 !important;

    color:
        var(--uartes-cart-muted) !important;

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

    text-transform: none !important;

    box-shadow:
        none !important;

}


body.uartes-cart-page
.uartes-continue-courses
a.button:hover {

    color:
        var(--uartes-cart-primary) !important;

}


/* ============================================================
   31. NOTIFICACIONES WOOCOMMERCE
   ============================================================ */

body.uartes-cart-page
.woocommerce-notices-wrapper:not(:empty) {

    margin-bottom: 20px;

}


body.uartes-cart-page
.woocommerce-message,

body.uartes-cart-page
.woocommerce-info,

body.uartes-cart-page
.woocommerce-error {

    border-radius: 10px;

}


/* ============================================================
   32. TABLET — LAYOUT
   ============================================================ */

@media (max-width: 900px) {

    body.uartes-cart-page
    .uartes-cart-layout {

        grid-template-columns:
            1fr;

    }


    body.uartes-cart-page
    .cart-collaterals
    .cart_totals.uartes-cart-summary {

        position: static;

    }

}


/* ============================================================
   33. TABLET — PRODUCTO
   ============================================================ */

@media (max-width: 760px) {

    body.uartes-cart-page
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr.uartes-cart-product-card {

        grid-template-columns:
            120px
            minmax(0, 1fr) !important;

        grid-template-areas:
            "image info"
            "image price";

        gap:
            8px
            20px;

        min-height: 0;

        padding:
            20px !important;

    }


    body.uartes-cart-page
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr.uartes-cart-product-card
    td.product-thumbnail {

        width: 120px !important;
        min-width: 120px !important;
        max-width: 120px !important;

    }


    body.uartes-cart-page
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr.uartes-cart-product-card
    td.product-thumbnail > a {

        width: 120px !important;
        height: 150px;

    }


    body.uartes-cart-page
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr.uartes-cart-product-card
    td.product-thumbnail img {

        width: 120px !important;
        min-width: 120px !important;
        max-width: 120px !important;

        height: 150px !important;

    }


    body.uartes-cart-page
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr.uartes-cart-product-card
    td.product-price {

        align-items: flex-start;

        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;

        text-align: left;

    }


    body.uartes-cart-page
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr.uartes-cart-product-card
    td.product-price
    .woocommerce-Price-amount {

        font-size:
            22px !important;

    }

}


/* ============================================================
   34. RESPONSIVE — BENEFICIO
   ============================================================ */

@media (max-width: 650px) {

    body.uartes-cart-page.woocommerce-cart
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr
    td.actions
    .coupon.uartes-benefit-card {

        grid-template-columns:
            1fr !important;

        grid-template-areas:
            "header"
            "input"
            "button"
            "help" !important;

        row-gap: 14px !important;

        padding:
            22px
            20px !important;

    }


    body.uartes-cart-page.woocommerce-cart
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr
    td.actions
    .coupon.uartes-benefit-card::before {

        top: 22px !important;
        left: 20px !important;

    }


    body.uartes-cart-page.woocommerce-cart
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr
    td.actions
    .coupon.uartes-benefit-card
    button[name="apply_coupon"] {

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

    }


    body.uartes-cart-page.woocommerce-cart
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr
    td.actions
    .coupon.uartes-benefit-card
    .uartes-benefit-help {

        flex-direction:
            column !important;

        align-items:
            flex-start !important;

        gap: 4px !important;

    }

}


/* ============================================================
   35. MOBILE GENERAL
   ============================================================ */

@media (max-width: 600px) {

    body.uartes-cart-page
    .entry-content > .woocommerce {

        width:
            calc(100vw - 28px);

    }


    body.uartes-cart-page
    .uartes-cart-page-title {

        font-size: 34px;

    }


    body.uartes-cart-page
    .uartes-cart-layout {

        margin-top: 28px;

    }


    body.uartes-cart-page
    .cart-collaterals
    .cart_totals.uartes-cart-summary {

        padding:
            24px
            18px !important;

    }

}


/* ============================================================
   36. MOBILE — PRODUCTO
   ============================================================ */

@media (max-width: 520px) {

    body.uartes-cart-page
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr.uartes-cart-product-card {

        grid-template-columns:
            88px
            minmax(0, 1fr) !important;

        grid-template-areas:
            "image info"
            "price price";

        gap:
            16px
            14px;

        padding:
            18px !important;

    }


    /* imagen */

    body.uartes-cart-page
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr.uartes-cart-product-card
    td.product-thumbnail {

        width: 88px !important;
        min-width: 88px !important;
        max-width: 88px !important;

    }


    body.uartes-cart-page
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr.uartes-cart-product-card
    td.product-thumbnail > a {

        width: 88px !important;
        height: 110px;

    }


    body.uartes-cart-page
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr.uartes-cart-product-card
    td.product-thumbnail img {

        width: 88px !important;
        min-width: 88px !important;
        max-width: 88px !important;

        height: 110px !important;

        border-radius: 9px;

    }


    /* nombre */

    body.uartes-cart-page
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr.uartes-cart-product-card
    td.product-name {

        padding-right:
            28px !important;

    }


    body.uartes-cart-page
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr.uartes-cart-product-card
    td.product-name > a {

        font-size:
            14px !important;

        line-height:
            1.4 !important;

    }


    /* precio */

    body.uartes-cart-page
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr.uartes-cart-product-card
    td.product-price {

        align-items:
            flex-start;

        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;

        padding-top:
            14px !important;

        border-top:
            1px solid
            #e7eaeb !important;

        text-align: left;

    }


    body.uartes-cart-page
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr.uartes-cart-product-card
    td.product-price
    .woocommerce-Price-amount {

        font-size:
            21px !important;

    }


    /* eliminar */

    body.uartes-cart-page
    .woocommerce-cart-form
    .shop_table.cart
    tbody
    tr.uartes-cart-product-card
    td.product-remove {

        top:
            12px !important;

        right:
            12px !important;

    }

}


/* ============================================================
   AJUSTES FINALES — BENEFICIO / RESUMEN
   ============================================================ */


/* ------------------------------------------------------------
   1) Quitar la línea superior en degradé
   del bloque "Beneficio institucional"
   ------------------------------------------------------------ */

body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card::after {

    content: none !important;
    display: none !important;
    background: none !important;

}


/* ------------------------------------------------------------
   2) Mantener el bloque beneficio limpio,
   sin barra naranja/teal arriba
   ------------------------------------------------------------ */

body.uartes-cart-page.woocommerce-cart
.woocommerce-cart-form
.shop_table.cart
tbody
tr
td.actions
.coupon.uartes-benefit-card {

    background:
        #f8faf9 !important;

}


/* ------------------------------------------------------------
   3) Fila "Beneficio aplicado"
   Ordenar monto + link eliminar
   ------------------------------------------------------------ */

body.uartes-cart-page
.uartes-cart-summary
.uartes-benefit-applied-row td {

    display: flex !important;

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

    gap: 10px !important;

    text-align: right !important;

    white-space: nowrap;

}


/* el monto del descuento */
body.uartes-cart-page
.uartes-cart-summary
.uartes-benefit-applied-row td .woocommerce-Price-amount {

    color:
        var(--uartes-cart-orange-dark) !important;

    font-weight: 800 !important;

}


/* link eliminar */
body.uartes-cart-page
.uartes-cart-summary
.uartes-benefit-applied-row td .woocommerce-remove-coupon {

    display: inline-flex !important;

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

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

    background: transparent !important;
    border: 0 !important;

    color:
        var(--uartes-cart-orange-dark) !important;

    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;

    text-decoration: underline !important;

    white-space: nowrap;

    box-shadow: none !important;

    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;

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

}


/* hover eliminar */
body.uartes-cart-page
.uartes-cart-summary
.uartes-benefit-applied-row td .woocommerce-remove-coupon:hover {

    background: transparent !important;

    color: #9f4700 !important;

}


/* por si el theme le mete pseudo-elementos raros */
body.uartes-cart-page
.uartes-cart-summary
.uartes-benefit-applied-row td .woocommerce-remove-coupon::before,

body.uartes-cart-page
.uartes-cart-summary
.uartes-benefit-applied-row td .woocommerce-remove-coupon::after {

    content: none !important;
    display: none !important;

}


/* ------------------------------------------------------------
   4) Badge PREVENTA
   ------------------------------------------------------------ */

body.uartes-cart-page
.uartes-benefit-code {

    display: flex !important;
	width: fit-content;

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

    margin-top: 8px !important;

    padding:
        5px
        10px !important;

    background:
        #fff3e8 !important;

    border:
        1px solid
        #f0c9a6 !important;

    border-radius: 999px !important;

    color:
        var(--uartes-cart-orange-dark) !important;

    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;

    text-transform: uppercase !important;
    letter-spacing: .06em !important;

    white-space: nowrap;

}


/* ------------------------------------------------------------
   5) TOTAL FINAL EN NEGRO
   ------------------------------------------------------------ */

body.uartes-cart-page
.uartes-cart-summary
.order-total .woocommerce-Price-amount {

    color: #111 !important;

}