/* ============================================================
   pk.css - Todo el CSS de Pikotin en un solo archivo (16 set 2026)
   Orden de bloques = el mismo orden en que cargaban los snippets de WPCode:
   CHECKOUT, GLOBAL, HEADER, CATALOGO, PRODUCTO, CARRITO.
   Se edita desde WordPress: Apariencia > Editor de archivos de temas > pk.css
   Los snippets CSS de WPCode quedan apagados como respaldo.
   ============================================================ */


/* ############################################################
   BLOQUE CHECKOUT  (antes snippet WPCode 26467)
   ############################################################ */

/* ===== PK · CHECKOUT · CSS =====
   Creado el 15 set 2026 al migrar del Personalizador las 250 reglas del checkout
   (mas la animacion pikotinShake). El 15 set 2026 se fusionaron las que repetian selector
   (20 casos) y quedaron 230. Se conservan los !important; y cualquier cambio en esta area
   se valida con compra de prueba (a domicilio y recojo en tienda).
   Regla: todo CSS del checkout va AQUI, no en el Personalizador. ===== */

/* ===== CSS QUE VIVIA EN SNIPPETS SUELTOS (consolidado 15 set 2026) =====
   Los 5 snippets CSS del checkout (24345, 24538, 24571, 24766, 26354) y el <style> del HTML 24952.
   Va ANTES de las reglas migradas del Personalizador porque asi cargaba originalmente.
   Los originales traian 5 llaves de cierre sobrantes; cada una anulaba la regla siguiente
   sin avisar. Esas reglas quedan aqui COMENTADAS para conservar el comportamiento real. ===== */

.woocommerce-cart .woocommerce-breadcrumb, .woocommerce-checkout .woocommerce-breadcrumb, .woocommerce-cart nav.woocommerce-breadcrumb, .woocommerce-checkout nav.woocommerce-breadcrumb, .woocommerce-cart .wd-breadcrumbs, .woocommerce-checkout .wd-breadcrumbs {
    display: none !important;
}

.pikotin-card-ubicacion .pikotin-ubigeo-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 0 0 6px;
}

.pikotin-card-ubicacion .pikotin-ubigeo-row > .form-row {
    flex: 1 1 0;
    min-width: 140px;
    width: auto;
    margin: 0;
    padding: 0;
    float: none;
}

.pikotin-card-ubicacion .pikotin-ubigeo-row .select2-container {
    width: 100% !important;
}

.pikotin-card-ubicacion .pikotin-ubigeo-row select {
    width: 100%;
}

.pikotin-card-ubicacion .pikotin-ubigeo-row > .form-row.woocommerce-validated::after, .pikotin-card-ubicacion .pikotin-ubigeo-row > .form-row::after {
    display: none !important;
    content: none !important;
}

#billing_departamento, #billing_provincia, #billing_distrito {
    font-size: 13px;
    padding-left: 10px;
}

@media (max-width:600px) {
    .pikotin-card-ubicacion .pikotin-ubigeo-row {
        flex-direction: column;
        gap: 10px;
    }
    .pikotin-card-ubicacion .pikotin-ubigeo-row > .form-row {
        flex: 1 1 100%;
    }
}

body.woocommerce-checkout .select2-dropdown {
    border: 1px solid #d8dbe0 !important;
    border-radius: 8px !important;
    box-shadow: 0 6px 20px rgba(19,35,91,0.12) !important;
    overflow: hidden;
}

body.woocommerce-checkout .select2-results__option {
    font-size: 14px !important;
    padding: 8px 14px !important;
    line-height: 1.3 !important;
}

body.woocommerce-checkout .select2-results__option--highlighted {
    background-color: #13235b !important;
    color: #fff !important;
}

body.woocommerce-checkout .select2-search__field {
    border-radius: 6px !important;
    height: 36px !important;
    font-size: 14px !important;
}

body.woocommerce-checkout .select2-search {
    height: auto;
    overflow: visible;
    padding: 0;
    margin: 0;
}

/* --- Fix parpadeo al abrir Provincia/Distrito (paso 2) ---
   Un fade-in muy corto en el desplegable enmascara el instante en que el JS
   ajusta la capitalizacion del texto, eliminando el flash. No altera el texto
   ni su capitalizacion final, solo suaviza la aparicion. */
@keyframes pikotinUbigeoFadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

#select2-billing_departamento-results, #select2-billing_provincia-results, #select2-billing_distrito-results {
    animation: pikotinUbigeoFadeIn 0.15s ease-out 1;
}

.pikotin-modo-tienda .pikotin-ubigeo-row {
    display: none !important;
}

/* Igualar separacion entre pasos (paso 3 Pago) */
@media (min-width: 769px) {
    form.checkout {
        position: relative !important;
        grid-template-columns: calc(100% - 394px) !important;
        grid-template-areas: "essential" "identbox" "paybox" !important;
        align-content: start !important;
        row-gap: 0 !important;
    }
    form.checkout .pikotin-rightcol {
        position: absolute !important;
        top: 0 !important;
        right: 0 !important;
        width: 370px !important;
    }
    body.woocommerce-checkout form.checkout #payment.woocommerce-checkout-payment {
        margin-top: 0 !important;
    }
}

#payment ul.payment_methods {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
    border: 0 !important;
    list-style: none !important;
    align-items: flex-start !important;
}

#payment ul.payment_methods > li.wc_payment_method {
    display: contents !important;
}

#payment ul.payment_methods > li.wc_payment_method > input.input-radio {
    position: absolute !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    pointer-events: none !important;
}

#payment ul.payment_methods > li.wc_payment_method > label {
    flex: 1 1 0 !important;
    min-width: 140px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    text-align: center !important;
    padding: 16px 14px !important;
    border: 1.5px solid #d9d9e3 !important;
    border-radius: 12px !important;
    background: #f6f6f8 !important;
    color: #444 !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    cursor: pointer !important;
    margin: 0 !important;
    min-height: 56px !important;
    transition: all .15s ease !important;
    box-sizing: border-box !important;
}

#payment ul.payment_methods > li.wc_payment_method > label img {
    max-height: 22px !important;
    width: auto !important;
}

#payment ul.payment_methods > li.wc_payment_method > .payment_box {
    flex: 1 1 100% !important;
    order: 10 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 6px 0 0 !important;
    padding: 16px 0 0 !important;
    background: transparent !important;
}

#payment ul.payment_methods > li.wc_payment_method > .payment_box::before {
    display: none !important;
}

#payment ul.payment_methods > li.wc_payment_method > input.input-radio:checked + label {
    border-color: #16205a !important;
    background: #16205a !important;
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(22,32,90,.18) !important;
}

.pikotin-trust {
    display: none !important;
}

.woocommerce-privacy-policy-text {
    display: none !important;
}

.woocommerce-terms-and-conditions-checkbox-text {
    font-size: 13px !important;
    color: #666666 !important;
    line-height: 1.5 !important;
}

body.woocommerce-checkout form.checkout .woocommerce-terms-and-conditions-checkbox-text a, .woocommerce-checkout .woocommerce-terms-and-conditions-checkbox-text a {
    color: #666666 !important;
    text-decoration: underline !important;
    transition: color .2s ease !important;
}

body.woocommerce-checkout form.checkout .woocommerce-terms-and-conditions-checkbox-text a:hover, .woocommerce-checkout .woocommerce-terms-and-conditions-checkbox-text a:hover {
    color: #000000 !important;
    text-decoration: underline !important;
}

#mp-checkout-custom-root .mp-checkout-custom-container {
    padding-top: 4px !important;
    padding-bottom: 25px !important;
}

.woocommerce-checkout-payment.pikotin-paso-abierto {
    padding-top: 6px !important;
}

#mp-checkout-custom-root .mp-checkout-custom-card-form {
    gap: 16px !important;
}

.woocommerce-terms-and-conditions-wrapper {
    border-top: none !important;
    padding-top: 0px !important;
    margin-top: 0px !important;
}

.woocommerce-checkout-payment p.form-row.validate-required {
    margin-top: 0px !important;
}

.wc_payment_methods, ul.payment_methods {
    margin-bottom: 4px !important;
}

#mp-checkout-custom-root .mp-checkout-custom-card-flags {
    display: flex !important;
    width: 305px !important;
    max-width: 100% !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0 0 18px !important;
    margin-left: -24px !important;
}

#mp-checkout-custom-root .mp-checkout-custom-card-flags img {
    box-sizing: border-box !important;
    width: 32px !important;
    height: 24px !important;
    object-fit: fill !important;
    border-width: 0.6px !important;
    border-style: solid !important;
    border-color: #222 !important;
    border-radius: 4px !important;
    padding: 2px !important;
    background: #fff !important;
}

#payment.woocommerce-checkout-payment.pikotin-paso-bloqueado ul.payment_methods {
    display: none !important;
}

body #payment ul.payment_methods > li.wc_payment_method.payment_method_woo-mercado-pago-yape > label {
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    padding-top: 4px !important;
    padding-bottom: 4px !important;
    align-items: center !important;
    overflow: hidden !important;
}

body #payment ul.payment_methods > li.wc_payment_method.payment_method_woo-mercado-pago-yape > label img {
    height: 40px !important;
    width: auto !important;
    max-height: 40px !important;
    max-width: none !important;
    object-fit: contain !important;
    margin-inline: 5px !important;
}

.mp-checkout-yape-terms-and-conditions {
    display: none !important;
}

#billing_boleta_field {
    display: none !important;
}

body.woocommerce-checkout .woocommerce-form-login-toggle, body.woocommerce-checkout .woocommerce-form-coupon-toggle, .woocommerce-checkout .woocommerce-form-login-toggle, .woocommerce-checkout .woocommerce-form-coupon-toggle, .woocommerce-form-login-toggle, .pikotin-checkout-login, .wd-checkout-login {
    display: none !important;
}

body.woocommerce-checkout .woocommerce-account-fields, body.woocommerce-checkout .create-account, .woocommerce-checkout .woocommerce-account-fields, .woocommerce-checkout .create-account, .woocommerce-account-fields p.create-account, #createaccount, p.create-account {
    display: none !important;
}

#payment .form-row.place-order, #payment .woocommerce-terms-and-conditions-wrapper, #payment .woocommerce-privacy-policy-text, #payment p.form-row.place-order {
    display: none !important;
}

/* Compactar tabla de totales en el resumen del pedido */
/* [15 set 2026] REGLA INACTIVA: en el snippet original iba justo despues de una llave de cierre sobrante,
   y el navegador la descartaba. Se conserva comentada para no cambiar nada; activar solo a proposito.
.pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.cart-subtotal th, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.cart-subtotal td, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals th, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals td, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr[class*="discount"] th, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr[class*="discount"] td, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.order-total th, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.order-total td {
    padding-top: 7px !important;
    padding-bottom: 7px !important;
    font-size: 13px !important;
}
*/

.pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.order-total th, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.order-total td {
    font-size: 15px !important;
    font-weight: 600 !important;
}

.pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr td .woocommerce-Price-amount {
    font-size: 13px !important;
    font-weight: 500 !important;
}

.pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.order-total td .woocommerce-Price-amount {
    font-size: 15px !important;
    font-weight: 700 !important;
}

/* Quitar líneas separadoras entre filas de totales y hacer más compacto */
/* [15 set 2026] REGLA INACTIVA: en el snippet original iba justo despues de una llave de cierre sobrante,
   y el navegador la descartaba. Se conserva comentada para no cambiar nada; activar solo a proposito.
.pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.cart-subtotal th, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.cart-subtotal td, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.cart-discount th, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.cart-discount td, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals th, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals td, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.order-total th, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.order-total td {
    border: none !important;
    border-top: none !important;
    border-bottom: none !important;
    padding-top: 4px !important;
    padding-bottom: 4px !important;
}
*/

.pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.cart-subtotal, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.pk-checkout-discount, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.order-total {
    border-bottom: none !important;
    border-top: none !important;
}

.pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.cart-subtotal th, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.cart-subtotal td, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.pk-checkout-discount th, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.pk-checkout-discount td, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals th, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals td {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
}

.pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.order-total th, .pikotin-rightcol .shop_table.woocommerce-checkout-review-order-table tr.order-total td {
    padding-top: 8px !important;
    padding-bottom: 4px !important;
}

.pikotin-card-ubicacion.pikotin-modo-tienda #billing_referencia_field {
    display: none !important;
}

html body.woocommerce-checkout .pikotin-rightcol #woocommerce-checkout-form-coupon.checkout_coupon.woocommerce-form-coupon {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
}

html body.woocommerce-checkout .pikotin-rightcol #woocommerce-checkout-form-coupon.checkout_coupon.woocommerce-form-coupon::before {
    content: "Cupón de descuento";
    flex: 0 0 100% !important;
    width: 100% !important;
    order: -1 !important;
    font-size: 14px !important;
    color: #333 !important;
    margin-bottom: 0px !important;
    line-height: 1.2 !important;
    font-weight: 400 !important;
}

html body.woocommerce-checkout .pikotin-rightcol #woocommerce-checkout-form-coupon.checkout_coupon.woocommerce-form-coupon .form-row {
    margin: 0 !important;
    padding: 0 !important;
}

html body.woocommerce-checkout .pikotin-rightcol #woocommerce-checkout-form-coupon.checkout_coupon.woocommerce-form-coupon .form-row-first {
    flex-grow: 1 !important;
    flex-shrink: 1 !important;
    flex-basis: 0 !important;
    margin: 0px 8px 0 0 !important;
    min-width: 0 !important;
}

html body.woocommerce-checkout .pikotin-rightcol #woocommerce-checkout-form-coupon.checkout_coupon.woocommerce-form-coupon .form-row-last {
    flex: 0 0 auto !important;
    margin-top: 0px !important;
}

html body.woocommerce-checkout .pikotin-rightcol #woocommerce-checkout-form-coupon.checkout_coupon.woocommerce-form-coupon input#coupon_code {
    width: 100% !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    line-height: 32px !important;
    border: 1px solid #d9d9d9 !important;
    border-radius: 8px !important;
    padding: 0 14px !important;
    font-size: 13px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    min-width: 0 !important;
}

html body.woocommerce-checkout .pikotin-rightcol #woocommerce-checkout-form-coupon.checkout_coupon.woocommerce-form-coupon button[name="apply_coupon"] {
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    line-height: 32px !important;
    background: #15205c !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 0 22px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: .5px !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

html body.woocommerce-checkout .woocommerce-checkout-review-order-table tr.cart-subtotal td, html body.woocommerce-checkout .woocommerce-checkout-review-order-table tr.cart-subtotal td .woocommerce-Price-amount, html body.woocommerce-checkout .woocommerce-checkout-review-order-table tr.cart-subtotal td .woocommerce-Price-amount bdi, html body.woocommerce-checkout .woocommerce-checkout-review-order-table tr.order-total td, html body.woocommerce-checkout .woocommerce-checkout-review-order-table tr.order-total td .woocommerce-Price-amount, html body.woocommerce-checkout .woocommerce-checkout-review-order-table tr.order-total td .woocommerce-Price-amount bdi, html body.woocommerce-checkout .woocommerce-checkout-review-order-table tr.order-total td strong {
    color: #1a1a1a !important;
}

/* ===== REGLAS MIGRADAS DEL PERSONALIZADOR (15 set 2026) ===== */

/* === Fix layout carrito: barra de pasos a todo el ancho y dos columnas estables (Claude) === */

/* === Ocultar footer en checkout para un proceso de compra mas limpio (Claude) === */
body.woocommerce-checkout .wd-footer, body.woocommerce-checkout .wd-prefooter {
    display: none !important;
}

/* === Estructura pago estilo Lumpet: tarjetas limpias en checkout (Claude) === */
body.woocommerce-checkout .checkout.woocommerce-checkout {
    align-items: flex-start !important;
}

body.woocommerce-checkout .woocommerce-billing-fields, body.woocommerce-checkout .woocommerce-shipping-fields, body.woocommerce-checkout .woocommerce-additional-fields, body.woocommerce-checkout .checkout-order-review {
    background: #ffffff !important;
    border: none !important;
    border-radius: 10px !important;
    padding: 26px 30px !important;
    margin-bottom: 20px !important;
    box-shadow: 0 5px 18px rgba(0,0,0,0.08) !important;
}

body.woocommerce-checkout .checkout-order-review::before, body.woocommerce-checkout .checkout-order-review::after {
    display: none !important;
}

body.woocommerce-checkout #customer_details h3, body.woocommerce-checkout #order_review_heading {
    font-size: 19px !important;
    font-weight: 600 !important;
    margin: 0 0 18px !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    color: #1f2a44 !important;
}

body.woocommerce-checkout #customer_details input.input-text, body.woocommerce-checkout #customer_details textarea, body.woocommerce-checkout #customer_details select, body.woocommerce-checkout #customer_details .select2-selection {
    border: 1px solid #d8dbe0 !important;
    border-radius: 8px !important;
    background: #fff !important;
    min-height: 46px !important;
}

body.woocommerce-checkout #place_order {
    width: 100% !important;
    border-radius: 10px !important;
    padding: 16px 20px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: .3px !important;
}

body.woocommerce-checkout #payment {
    background: transparent !important;
}

body.woocommerce-checkout #payment ul.payment_methods {
    border: none !important;
    padding: 0 !important;
    margin: 0 0 12px !important;
}

body.woocommerce-checkout .customer-details {
    grid-area: identbox;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0;
}

body.woocommerce-checkout .checkout-order-review {
    -webkit-mask: none !important;
    mask: none !important;
    display: contents !important;
}

body.woocommerce-checkout #order_review {
    position: sticky !important;
    top: 20px !important;
    display: contents !important;
}

body.woocommerce-checkout #order_review_heading {
    display: none !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order {
    display: contents !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order > .wd-table-wrapper {
    grid-area: review;
    width: auto !important;
    min-width: 0;
    background: #fff;
    border: 1px solid #eef0f4;
    border-radius: 12px;
    padding: 22px;
    box-shadow: 0 5px 18px rgba(0,0,0,0.08);
    position: sticky;
    top: 20px;
}

body.woocommerce-checkout #payment #place_order {
    width: 100% !important;
}

body.woocommerce-checkout #payment .form-row.place-order {
    padding: 0 !important;
}

/* =====================================================
   CHECKOUT – Vista móvil ~390px
   Apilar todas las secciones en una sola columna
   ===================================================== */
@media (max-width: 768px) {
    body.woocommerce-checkout form.checkout {
        grid-template-columns: 1fr !important;
        grid-template-areas: "essential" "identbox" "paybox" "rightcol" "placeorder" !important;
        column-gap: 0 !important;
        row-gap: 16px !important;
        width: 100% !important;
    }
    body.woocommerce-checkout .customer-details {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
    body.woocommerce-checkout .pikotin-rightcol {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
    body.woocommerce-checkout #payment {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
    body.woocommerce-checkout .woocommerce-checkout-review-order > .wd-table-wrapper {
        position: static !important;
    }
    body.woocommerce-checkout .woocommerce-billing-fields .form-row, body.woocommerce-checkout .woocommerce-additional-fields .form-row {
        width: 100% !important;
        float: none !important;
    }
    body.woocommerce-checkout .input-text, body.woocommerce-checkout select, body.woocommerce-checkout textarea {
        font-size: 16px !important;
        min-height: 44px !important;
        padding: 10px 12px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    body.woocommerce-checkout label {
        font-size: 14px !important;
        margin-bottom: 4px !important;
        display: block !important;
    }
    body.woocommerce-checkout #place_order {
        width: 100% !important;
        min-height: 50px !important;
        font-size: 16px !important;
        padding: 14px 20px !important;
        box-sizing: border-box !important;
    }
    body.woocommerce-checkout .woocommerce-checkout-review-order-table {
        font-size: 14px !important;
    }
}

/* ===== Ocultar barra de pasos en checkout y subir contenido (sin hueco) ===== */

body.woocommerce-checkout .entry-content, body.woocommerce-checkout article.entry-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

body.woocommerce-checkout .wd-content-area {
    padding-top: 0 !important;
}

/* ===== Ocultar barra envio gratis en checkout ===== */
body.woocommerce-checkout .wd-shipping-progress-bar {
    display: none !important;
}

/* ===== Ocultar aviso informacion esencial en checkout ===== */
body.woocommerce-checkout .pikotin-essential {
    grid-area: essential;
    margin: 0 !important;
    display: none !important;
}

/* ===== Cupon a la derecha estilo Lumpet (requiere snippet JS de reubicacion) ===== */
body.woocommerce-checkout .woocommerce-form-coupon-toggle {
    margin-top: 0 !important;
    display: none !important;
}

/* el cupon (movido por JS al inicio del review-order) ocupa su propia celda derecha */
body.woocommerce-checkout form.checkout_coupon[data-moved] {
    grid-area: couponbox !important;
    display: flex !important;
    flex-wrap: wrap;
    align-items: flex-end;
    width: auto !important;
    min-width: 0;
    align-self: start;
    background: #fff;
    border: 1px solid #eef0f4;
    border-radius: 12px;
    box-shadow: 0 5px 18px rgba(0,0,0,0.08);
    padding: 18px 20px;
    margin: 0 !important;
}

body.woocommerce-checkout form.checkout_coupon[data-moved] .coupon-title {
    flex: 1 0 100%;
    font-size: 15px;
    font-weight: 600;
    color: #1f2a44;
    margin: 0 0 10px;
}

body.woocommerce-checkout form.checkout_coupon[data-moved] .form-row {
    margin: 0 !important;
    padding: 0 !important;
}

body.woocommerce-checkout form.checkout_coupon[data-moved] .form-row-first {
    flex: 1 1 0;
    min-width: 0;
}

body.woocommerce-checkout form.checkout_coupon[data-moved] .form-row-last {
    flex: 0 0 auto;
    margin-left: 8px !important;
}

body.woocommerce-checkout form.checkout_coupon[data-moved] .input-text {
    width: 100% !important;
    height: 42px;
    border-radius: 8px;
}

body.woocommerce-checkout form.checkout_coupon[data-moved] button {
    height: 42px;
    border-radius: 8px;
    white-space: nowrap;
}

/* ===== Pikotin - Resumen debajo del cupon (columna derecha apilada) ===== */
body.woocommerce-checkout form.checkout {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 370px;
    grid-template-areas: "essential essential" "identbox rightcol" "paybox rightcol";
    column-gap: 28px;
    row-gap: 22px;
    align-items: start;
}

body.woocommerce-checkout .pikotin-rightcol {
    grid-area: rightcol;
    align-self: start;
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 370px;
    max-width: 100%;
}

body.woocommerce-checkout .pikotin-rightcol .checkout_coupon, body.woocommerce-checkout .pikotin-rightcol .wd-table-wrapper {
    grid-area: auto;
    width: 100%;
    margin: 0;
}

/* ===== Pikotin - Visibilidad cupon en columna derecha ===== */
body.woocommerce-checkout .pikotin-rightcol .checkout_coupon {
    display: block !important;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 1px 3px rgba(0,0,0,.06);
}

body.woocommerce-checkout .woocommerce-form-coupon-toggle, body.woocommerce-checkout .checkout_coupon .showcoupon {
    display: none !important;
}

/* ===== Pikotin - Alinear facturacion con cupon (mismo nivel arriba) ===== */
body.woocommerce-checkout #customer_details .woocommerce-billing-fields {
    margin-top: 0 !important;
}

/* ===== Pikotin - Badge cupon aplicado + ocultar mensaje grande ===== */
body.woocommerce-checkout .pikotin-rightcol > .woocommerce-message {
    display: none !important;
}

body.woocommerce-checkout .pikotin-rightcol:has(.cart-discount) .checkout_coupon .form-row-last::after {
    content: "\2713 Cup\00f3n aplicado";
    display: inline-flex;
    align-items: center;
    background: #e7f7ed;
    color: #1a7f43;
    border: 1px solid #b7e4c7;
    border-radius: 6px;
    padding: 7px 12px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    letter-spacing: .2px;
}

/* ===== Pikotin - Estilo boton aplicar cupon (azul pikotin, redondeado, centrado) ===== */
body.woocommerce-checkout .checkout_coupon input[name="coupon_code"] {
    border-radius: 8px !important;
}

body.woocommerce-checkout .checkout_coupon .form-row-last {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center !important;
    margin-top: 14px !important;
}

body.woocommerce-checkout .checkout_coupon button.button {
    background-color: #111A51 !important;
    color: #fff !important;
    border-radius: 8px !important;
    border: none !important;
}

body.woocommerce-checkout .checkout_coupon button.button:hover {
    background-color: #E0A800 !important;
    color: #111A51 !important;
    border-color: #E0A800 !important;
}

/* === Estilo boton Realizar el pedido (navy + hover amarillo, igual a Aplicar cupon) === */
body.woocommerce-checkout #place_order, body.woocommerce-checkout button#place_order.button.alt {
    background-color: #111A51 !important;
    border-color: #111A51 !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    transition: background-color .2s ease, color .2s ease !important;
}

body.woocommerce-checkout #place_order:hover, body.woocommerce-checkout button#place_order.button.alt:hover {
    background-color: #E0A800 !important;
    border-color: #E0A800 !important;
    color: #111A51 !important;
}

/* === Color placeholder gris en Ingresa tu cupon === */
body.woocommerce-checkout #coupon_code::placeholder {
    color: #9aa0a6 !important;
    opacity: 1 !important;
}

body.woocommerce-checkout #coupon_code::-webkit-input-placeholder {
    color: #9aa0a6 !important;
    opacity: 1 !important;
}

body.woocommerce-checkout #coupon_code::-moz-placeholder {
    color: #9aa0a6 !important;
    opacity: 1 !important;
}

/* Cada grupo como tarjeta independiente */
body.woocommerce-checkout .pikotin-fieldcard {
    display: block;
    width: 100%;
    background: #ffffff;
    border: none;
    border-radius: 10px;
    box-shadow: 0 5px 18px rgba(0,0,0,.08);
    padding: 26px 30px 10px;
    margin: 0 0 28px 0;
    overflow: hidden;
}

body.woocommerce-checkout .pikotin-fieldcard::before {
    display: block;
    font-weight: 600;
    font-size: 15px;
    color: #111A51;
    margin-bottom: 16px;
}

body.woocommerce-checkout .pikotin-card-ubicacion::before {
    content: "Env\00EDo";
}

/* Campos first/last lado a lado dentro de cada tarjeta */
body.woocommerce-checkout .pikotin-fieldcard .form-row-first {
    float: left;
    width: 48%;
    margin-right: 4%;
}

body.woocommerce-checkout .pikotin-fieldcard .form-row-last {
    float: right;
    width: 48%;
}

/* === Ocultar titulo Facturacion y alinear tarjeta con cupon === */
body.woocommerce-checkout .woocommerce-billing-fields > h3 {
    display: none;
}

body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper {
    display: block;
    margin-top: 0;
}

/* === Orden campos tarjeta Identificacion (Boleta al final) === */
body.woocommerce-checkout .pikotin-card-personal {
    margin-top: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}

body.woocommerce-checkout .pikotin-card-personal::before {
    content: "Identificaci\00F3n";
    order: -1;
    width: 100%;
}

body.woocommerce-checkout .pikotin-card-personal > .form-row {
    order: 1;
}

body.woocommerce-checkout .pikotin-card-personal .form-row-first {
    width: 48%;
    margin-right: 4%;
    float: none;
}

body.woocommerce-checkout .pikotin-card-personal .form-row-last {
    width: 48%;
    float: none;
}

body.woocommerce-checkout .pikotin-card-personal .form-row-wide {
    width: 100%;
}

body.woocommerce-checkout .pikotin-card-personal #billing_boleta_field {
    width: 100%;
    margin: 6px 0 4px;
    padding-top: 14px;
    border-top: 1px solid #eef0f4;
    clear: both;
    order: 99;
}

/* === Ocultar tarjeta Informacion adicional (notas del pedido) === */
body.woocommerce-checkout .woocommerce-additional-fields {
    display: none !important;
}

/* === Numeracion de tarjetas checkout (circulo navy arriba-izquierda) === */
body.woocommerce-checkout .pikotin-card-personal, body.woocommerce-checkout .pikotin-card-ubicacion, body.woocommerce-checkout #payment.woocommerce-checkout-payment {
    position: relative !important;
}

/* circulo base comun (usa ::after que esta libre) */
body.woocommerce-checkout .pikotin-card-personal::after, body.woocommerce-checkout .pikotin-card-ubicacion::after, body.woocommerce-checkout #payment.woocommerce-checkout-payment::after {
    position: absolute;
    top: 26px;
    left: 30px;
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-radius: 50%;
    background: #111A51;
    color: #fff;
    text-align: center;
    font-weight: 700;
    font-size: 15px;
    z-index: 5;
    content: "";
}

/* numero por tarjeta */
body.woocommerce-checkout .pikotin-card-personal::after {
    content: "1";
}

body.woocommerce-checkout .pikotin-card-ubicacion::after {
    content: "2";
}

body.woocommerce-checkout #payment.woocommerce-checkout-payment::after {
    top: 24px;
    left: 24px;
    content: "3";
}

/* === Tipografia titulos de tarjetas checkout: Readex Pro + tamano mayor === */
body.woocommerce-checkout .pikotin-card-personal::before, body.woocommerce-checkout .pikotin-card-ubicacion::before, body.woocommerce-checkout #payment.woocommerce-checkout-payment::before {
    padding-left: 42px !important;
    font-family: "Readex Pro", Arial, Helvetica, sans-serif !important;
}

body.woocommerce-checkout .pikotin-card-personal::before, body.woocommerce-checkout .pikotin-card-ubicacion::before {
    font-size: 18px !important;
}

body.woocommerce-checkout #payment.woocommerce-checkout-payment::before {
    content: "Pago";
    display: block;
    font-size: 21px !important;
    font-weight: 600;
    color: #1f2a44;
    margin-bottom: 14px;
}

/* PIKOTIN-CHECKOUT-FIELDS start - reglas compactas checkout (42px / 14px) */
.pikotin-checkout-fields-guard {
    display: block;
}

body.woocommerce-checkout #customer_details .form-row input.input-text {
    min-height: 42px !important;
    height: 42px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
}

body.woocommerce-checkout #customer_details .form-row select {
    min-height: 42px !important;
    height: 42px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    font-size: 14px !important;
}

body.woocommerce-checkout #customer_details .form-row textarea {
    min-height: 70px !important;
    height: auto !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

body.woocommerce-checkout #customer_details .form-row .select2-selection--single {
    min-height: 42px !important;
    height: 42px !important;
}

body.woocommerce-checkout #customer_details .form-row .select2-selection--single .select2-selection__rendered {
    line-height: 42px !important;
}

body.woocommerce-checkout #customer_details .form-row .select2-selection--single .select2-selection__arrow {
    height: 40px !important;
}

body.woocommerce-checkout #customer_details .form-row {
    margin-bottom: 14px !important;
}

body.woocommerce-checkout #customer_details .form-row > label {
    margin-bottom: 6px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    font-family: "Be Vietnam Pro", sans-serif !important;
    line-height: 1.4 !important;
}

/* ===== PIKOTIN-CHECKOUT-VALIDATION (asterisco + check verde) ===== */
/* 1) Ocultar el asterisco rojo de los campos obligatorios en el checkout */
body.woocommerce-checkout #customer_details .form-row label .required, body.woocommerce-checkout #customer_details .form-row label abbr.required {
    display: none !important;
}

/* 2) Check verde dentro del recuadro cuando el campo es valido */
body.woocommerce-checkout #customer_details .form-row.validate-required {
    position: relative;
}

body.woocommerce-checkout #customer_details .form-row.validate-required.woocommerce-validated .input-text {
    padding-right: 38px !important;
    border-color: #46b450 !important;
}

body.woocommerce-checkout #customer_details .form-row.validate-required.woocommerce-validated::after {
    content: "";
    position: absolute;
    right: 14px;
    bottom: 14px;
    width: 18px;
    height: 18px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 18px 18px;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAyNCAyNCcgZmlsbD0nbm9uZScgc3Ryb2tlPScjNDZiNDUwJyBzdHJva2Utd2lkdGg9JzMnIHN0cm9rZS1saW5lY2FwPSdyb3VuZCcgc3Ryb2tlLWxpbmVqb2luPSdyb3VuZCc+PHBvbHlsaW5lIHBvaW50cz0nMjAgNiA5IDE3IDQgMTInLz48L3N2Zz4=");
    pointer-events: none;
    z-index: 2;
}

/* Marca de invalido: borde rojo suave (sin asterisco) */
body.woocommerce-checkout #customer_details .form-row.validate-required.woocommerce-invalid .input-text {
    border-color: #e2401c !important;
}

/* ===== /PIKOTIN-CHECKOUT-VALIDATION ===== */
/* ===== PIKOTIN-CHECKOUT-FACTURA (ocultar RUC/Razon Social por defecto) ===== */
/* El JS los muestra al marcar "Quiero factura". Esto evita el parpadeo inicial. */
body.woocommerce-checkout #billing_ruc_field, body.woocommerce-checkout #billing_razon_social_field {
    display: none;
}

/* ===== /PIKOTIN-CHECKOUT-FACTURA ===== */
/* PIKOTIN-FACTURA-ORDEN: ubicar los 4 campos debajo de Boleta (order:99) dentro de la tarjeta personal */
.pikotin-card-personal #billing_factura_ruc_field {
    order: 100;
}

.pikotin-card-personal #billing_ruc_field {
    order: 101;
}

.pikotin-card-personal #billing_razon_social_field {
    order: 102;
}

.pikotin-card-personal #billing_newsletter_optin_field {
    order: 103;
}

/* PIKOTIN-FACTURA-OCULTAR-OPCIONAL: quitar el texto (opcional) de las casillas factura y newsletter */
#billing_factura_ruc_field label .optional, #billing_newsletter_optin_field label .optional {
    display: none !important;
}

/* PIKOTIN-FACTURA-NEWSLETTER-JUNTOS: acercar la casilla newsletter a 'Requiero una factura' */
body.woocommerce-checkout #customer_details .pikotin-card-personal #billing_factura_ruc_field {
    margin-bottom: 4px !important;
}

body.woocommerce-checkout #customer_details .pikotin-card-personal #billing_newsletter_optin_field {
    margin-bottom: 4px !important;
}

/* PIKOTIN-DNI-SIN-SPINNER: quitar flechas (spinner) y alinear a la izquierda el Documento de Identidad */
body.woocommerce-checkout #customer_details #billing_dni_ce {
    text-align: left !important;
    padding-left: 15px !important;
}

#billing_dni_ce::-webkit-outer-spin-button, #billing_dni_ce::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

#billing_dni_ce {
    -moz-appearance: textfield;
    appearance: textfield;
}

/* ====== PIKOTIN-ENTREGA-TOGGLE (selector domicilio / recojo en tienda) ====== */
.pikotin-entrega-toggle {
    margin: 0 0 18px 0;
}

.pikotin-entrega-botones {
    display: flex;
    gap: 10px;
    width: 100%;
}

.pikotin-entrega-btn {
    flex: 1 1 50%;
    padding: 11px 12px;
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: .2px;
    text-align: center;
    cursor: pointer;
    background: #fff;
    color: #1f3b73;
    border: 1.5px solid #d4dae6;
    border-radius: 6px;
    transition: all .15s ease;
    text-transform: uppercase;
    line-height: 1.2;
}

.pikotin-entrega-btn.is-active {
    background: #1f3b73;
    color: #fff;
    border-color: #1f3b73;
}

.pikotin-entrega-btn:hover:not(.is-active) {
    border-color: #1f3b73;
    background: #f5f7fb;
}

.pikotin-tienda-info {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 14px;
    padding: 16px;
    border: 1px solid #e3e3e3;
    border-radius: 8px;
    background: #fff;
}

.pikotin-tienda-pin {
    flex: 0 0 auto;
    width: 22px;
    height: 28px;
    position: relative;
}

.pikotin-tienda-pin::before {
    content: '';
    position: absolute;
    top: 0;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50% 50% 50% 0;
    transform: rotate(-45deg);
    background: #1f1f1f;
}

.pikotin-tienda-pin::after {
    content: '';
    position: absolute;
    top: 5px;
    left: 8px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #fff;
}

.pikotin-tienda-textos {
    display: flex;
    flex-direction: column;
    line-height: 1.45;
}

.pikotin-tienda-textos strong {
    font-size: 15px;
    color: #1f1f1f;
    margin-bottom: 2px;
}

.pikotin-tienda-textos span {
    font-size: 13.5px;
    color: #6b6b6b;
}

/* En modo recojo en tienda, ocultar campos de direccion */
.pikotin-card-ubicacion.pikotin-modo-tienda #billing_state_field, .pikotin-card-ubicacion.pikotin-modo-tienda #billing_city_field, .pikotin-card-ubicacion.pikotin-modo-tienda #billing_address_1_field, .pikotin-card-ubicacion.pikotin-modo-tienda #billing_address_2_field {
    display: none !important;
}

/* Sin parpadeo: cuando la tarjeta esta en modo recojo, ocultar al instante por CSS todos los metodos salvo 'Recojo en tienda' */
body:has(.pikotin-card-ubicacion.pikotin-modo-tienda) .woocommerce-shipping-methods li {
    display: none !important;
}

body:has(.pikotin-card-ubicacion.pikotin-modo-tienda) .woocommerce-shipping-methods li:has(input[value="af_ship_rule:24466"]) {
    display: list-item !important;
}

/* ====== FIN PIKOTIN-ENTREGA-TOGGLE ====== */
/* PIKOTIN-OCULTAR-CHECK-VALIDACION (Departamento y Provincia/Distrito) */
#billing_state_field.woocommerce-validated::after, #billing_city_field.woocommerce-validated::after {
    display: none !important;
    content: none !important;
    background: none !important;
}

/* PIKOTIN-ACORDEON (pasos bloqueados / colapsados / resumen) */
.pikotin-card-personal, .pikotin-card-ubicacion, #payment.woocommerce-checkout-payment {
    position: relative;
    transition: opacity .2s ease;
}

.pikotin-paso-bloqueado > * {
    display: none !important;
}

.pikotin-paso-bloqueado::after {
    content: '🔒 Completa el paso anterior';
    display: block;
    font-size: 13px;
    color: #8a8a8a;
    padding: 6px 0 2px;
}

.pikotin-paso-colapsado > *:not(.pikotin-resumen) {
    display: none !important;
}

.pikotin-paso-colapsado {

}

.pikotin-continuar:hover {
    background: #1c3380;
}

.pikotin-paso-bloqueado .pikotin-continuar, .pikotin-paso-colapsado .pikotin-continuar {
    display: none !important;
}

.pikotin-resumen-row {
    font-size: 14px;
    color: #444;
    padding: 3px 0;
}

.pikotin-resumen-row span {
    color: #8a8a8a;
    display: inline-block;
    min-width: 104px;
}

.pikotin-editar {
    margin-top: 10px;
    background: transparent;
    color: #13235b;
    border: 1px solid #13235b;
    border-radius: 8px;
    padding: 7px 18px;
    font-weight: 600;
    font-size: 13px;
    cursor: pointer;
}

.pikotin-editar:hover {
    background: #13235b;
    color: #fff;
}

.pikotin-falta {
    animation: pikotinShake .4s;
    box-shadow: 0 0 0 2px #e74c3c inset;
}

@keyframes pikotinShake {
    0%,100% {
        transform: translateX(0);
    }
    25% {
        transform: translateX(-5px);
    }
    75% {
        transform: translateX(5px);
    }
}

/* PIKOTIN-ACORDEON-FIX (layout flex: boton y resumen a lo ancho y al final) */
.pikotin-continuar {
    display: inline-block;
    margin-top: 16px;
    background: #13235b;
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 12px 26px;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    transition: background .15s ease;
    order: 999 !important;
    flex: 0 0 100% !important;
    width: auto !important;
    align-self: flex-start;
}

.pikotin-resumen {
    display: block;
    padding: 6px 0 2px;
    order: 998 !important;
    flex: 0 0 100% !important;
    width: 100%;
}

.pikotin-card-personal .pikotin-continuar, .pikotin-card-ubicacion .pikotin-continuar {
    margin-right: auto;
}

/* PIKOTIN-ACORDEON-BLOQUEADO-NORMAL (paso bloqueado visible y sin transparencia; numero centrado) */
.pikotin-paso-bloqueado {
    opacity: 1 !important;
    pointer-events: none;
}

body.woocommerce-checkout .pikotin-card-personal.pikotin-paso-bloqueado::after, body.woocommerce-checkout .pikotin-card-ubicacion.pikotin-paso-bloqueado::after, body.woocommerce-checkout #payment.woocommerce-checkout-payment.pikotin-paso-bloqueado::after {
    padding: 0 !important;
    line-height: 30px !important;
}

/* PIKOTIN-ACORDEON-ESPACIADO (reducir espacio vertical entre pasos del checkout) */
body.woocommerce-checkout .pikotin-card-personal, body.woocommerce-checkout .pikotin-card-ubicacion {
    margin-bottom: 20px !important;
}

body.woocommerce-checkout .woocommerce-billing-fields {
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin-top: 0;
    padding-top: 0;
    margin-bottom: 0 !important;
}

body.woocommerce-checkout #payment.woocommerce-checkout-payment {
    grid-area: paybox;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0;
    box-sizing: border-box;
    background: #fff;
    border: 1px solid #eef0f4;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 5px 18px rgba(0,0,0,0.08);
    padding-top: 20px !important;
    margin-top: -22px !important;
}

/* PIKOTIN-ACORDEON-EDITAR-RESUMEN (boton editar arriba-derecha y resumen mas uniforme) */
body.woocommerce-checkout .pikotin-paso-colapsado {
    position: relative !important;
}

body.woocommerce-checkout .pikotin-resumen-row {
    font-size: 13px !important;
    line-height: 1.5 !important;
}

/* PIKOTIN-ACORDEON-EDITAR-ICONO (boton editar como icono de lapiz) */
body.woocommerce-checkout .pikotin-paso-colapsado .pikotin-editar {
    position: absolute !important;
    top: 24px !important;
    right: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0 !important;
    width: 30px !important;
    height: 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    border-radius: 0 !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.woocommerce-checkout .pikotin-paso-colapsado .pikotin-editar::before {
    content: "\f044" !important;
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    font-size: 14px !important;
    line-height: 1 !important;
    display: inline-block !important;
}

body.woocommerce-checkout .pikotin-paso-colapsado .pikotin-editar, body.woocommerce-checkout .pikotin-paso-colapsado .pikotin-editar::before {
    color: #1d2a5b !important;
    transition: color .2s ease !important;
}

body.woocommerce-checkout .pikotin-paso-colapsado .pikotin-editar:hover, body.woocommerce-checkout .pikotin-paso-colapsado .pikotin-editar:hover::before, body.woocommerce-checkout .pikotin-paso-colapsado .pikotin-editar:focus, body.woocommerce-checkout .pikotin-paso-colapsado .pikotin-editar:focus::before {
    color: #6b7280 !important;
    background: transparent !important;
}

/* PIKOTIN-CONTINUAR-HOVER-GRIS (hover del boton continuar en gris) */
body.woocommerce-checkout .pikotin-continuar:hover, body.woocommerce-checkout .pikotin-continuar:focus {
    background: #6b7280 !important;
    border-color: #6b7280 !important;
    color: #fff !important;
}

/* PIKOTIN-CONTINUAR-PASO2-ANCHO (boton continuar del paso 2 a lo ancho como el paso 1) */
body.woocommerce-checkout .pikotin-card-ubicacion .pikotin-continuar {
    display: block !important;
    width: 100% !important;
    flex: 0 0 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* PIKOTIN-CONTINUAR-PASO-BLOQUEADO (ocultar boton continuar cuando el paso esta bloqueado/inactivo) */
body.woocommerce-checkout .pikotin-card-ubicacion.pikotin-paso-bloqueado .pikotin-continuar {
    display: none !important;
}

/* 8. Ocultar admin bar en checkout */
.woocommerce-checkout #wpadminbar {
    display: none !important;
}

/* === Ocultar botón flotante de WhatsApp solo en checkout === */
.woocommerce-checkout .wa__btn_popup, .woocommerce-checkout .wa__popup_chat_box {
    display: none !important;
}

/* === Reducir espacio blanco entre header y contenido en checkout === */
.woocommerce-checkout main.wd-content-layout {
    padding-top: 15px !important;
}

/* === Ocultar 'Ya eres cliente?' y 'Crear una cuenta?' en checkout === */
.woocommerce-checkout .woocommerce-form-login-toggle, .woocommerce-checkout .woocommerce-form-coupon-toggle, .woocommerce-checkout .woocommerce-account-fields, .woocommerce-checkout #createaccount, .woocommerce-checkout .create-account {
    display: none !important;
}

/* === IDENTIFICACION: 2 columnas en mobile para Nombre/Apellidos y DNI/Telefono === */
@media (max-width: 767px) {
    /* Card con grid de 2 columnas estrictamente iguales */
    .woocommerce-checkout .pikotin-card-personal {
        padding-left: 16px !important;
        padding-right: 16px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 10px !important;
        align-items: start !important;
    }
    /* Titulo "Identificacion" (::before): span 2 columnas y padding suficiente para el circulo ::after */
    /* ::after es position:absolute left:30px width:30px -> llega a 60px. Usamos 64px de padding */
    .woocommerce-checkout .pikotin-card-personal::before {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        padding-left: 64px !important;
    }
    /* El circulo "1" (::after) es position:absolute, se posiciona relativo al card */
    .woocommerce-checkout .pikotin-card-personal::after {
        position: absolute !important;
        top: 26px !important;
        left: 14px !important;
    }
    /* Correo y wide: span 2 columnas */
    .woocommerce-checkout .pikotin-card-personal .form-row-wide, .woocommerce-checkout .pikotin-card-personal .pikotin-continuar {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        float: none !important;
        margin: 0 !important;
        min-width: 0 !important;
    }
    /* Nombre y DNI: columna izquierda */
    .woocommerce-checkout .pikotin-card-personal .form-row-first {
        grid-column: 1 !important;
        width: 100% !important;
        float: none !important;
        margin: 0 !important;
        min-width: 0 !important;
    }
    /* Apellidos y Telefono: columna derecha */
    .woocommerce-checkout .pikotin-card-personal .form-row-last {
        grid-column: 2 !important;
        width: 100% !important;
        float: none !important;
        margin: 0 !important;
        min-width: 0 !important;
    }
    /* Inputs de texto: full width, excluir checkboxes */
    .woocommerce-checkout .pikotin-card-personal .form-row input:not([type="checkbox"]):not([type="radio"]), .woocommerce-checkout .pikotin-card-personal .form-row select {
        width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }
    /* Checkboxes: restaurar tamaño natural */
    .woocommerce-checkout .pikotin-card-personal .form-row input[type="checkbox"], .woocommerce-checkout .pikotin-card-personal .form-row input[type="radio"] {
        width: auto !important;
        min-width: 0 !important;
        display: inline-block !important;
        vertical-align: middle !important;
    }
    /* Labels: espaciado uniforme */
    .woocommerce-checkout .pikotin-card-personal .form-row label {
        font-size: 13px !important;
        display: block !important;
        line-height: 1.3 !important;
        margin-bottom: 4px !important;
    }
    /* Reemplazar "Documento de Identidad" por "DNI" */
    #billing_dni_ce_field label {
        position: relative !important;
        overflow: hidden !important;
        white-space: nowrap !important;
        color: transparent !important;
        height: 18px !important;
        max-height: 18px !important;
        display: block !important;
    }
    #billing_dni_ce_field label abbr {
        visibility: hidden !important;
    }
    #billing_dni_ce_field label::before {
        content: "DNI *" !important;
        position: absolute !important;
        left: 0 !important;
        top: 0 !important;
        color: #3d3d3d !important;
        font-size: 13px !important;
        line-height: 1.3 !important;
        font-weight: 400 !important;
        white-space: nowrap !important;
    }
}

/* === PASO 2 (Envio) y PASO 3 (Pago): fix del titulo con circulo en mobile === */
@media (max-width: 767px) {
    /* ---- PASO 2: card-ubicacion ---- */
    /* Reducir padding lateral igual que paso 1 */
    .woocommerce-checkout .pikotin-card-ubicacion {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
    /* Titulo "Envio" full-width con espacio para el circulo */
    .woocommerce-checkout .pikotin-card-ubicacion::before {
        width: 100% !important;
        padding-left: 64px !important;
    }
    /* Circulo "2": reposicionar al nuevo padding izquierdo */
    .woocommerce-checkout .pikotin-card-ubicacion::after {
        position: absolute !important;
        top: 26px !important;
        left: 14px !important;
    }
    /* ---- PASO 3: payment ---- */
    /* Reducir padding lateral */
    .woocommerce-checkout #payment.woocommerce-checkout-payment {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
    /* Titulo "Pago" full-width con espacio para el circulo */
    .woocommerce-checkout #payment.woocommerce-checkout-payment::before {
        width: 100% !important;
        padding-left: 64px !important;
    }
    /* Circulo "3": el payment tiene padding original 24px -> left:24px, lo movemos a 14px */
    .woocommerce-checkout #payment.woocommerce-checkout-payment::after {
        position: absolute !important;
        top: 24px !important;
        left: 14px !important;
    }
}

/* === PAGO: botones Tarjeta y Yape mismo alto y ancho === */
@media (max-width: 767px) {
    /* Ambos labels: misma altura, flex row para Yape */
    body #payment ul.payment_methods > li.wc_payment_method > label, body #payment ul.payment_methods > li.wc_payment_method.payment_method_woo-mercado-pago-yape > label, .woocommerce-checkout ul.wc_payment_methods .payment_method_woo-mercado-pago-custom > label, .woocommerce-checkout ul.wc_payment_methods .payment_method_woo-mercado-pago-yape > label {
        min-height: 56px !important;
        height: 56px !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        box-sizing: border-box !important;
        padding: 10px 12px !important;
    }
    /* Tarjeta: sin icono, texto centrado en columna */
    .woocommerce-checkout ul.wc_payment_methods .payment_method_woo-mercado-pago-custom > label {
        font-size: 13px !important;
        line-height: 1.3 !important;
        flex-direction: column !important;
        text-align: center !important;
        justify-content: center !important;
        align-items: center !important;
    }
    /* Ocultar el icono de tarjeta */
    .woocommerce-checkout ul.wc_payment_methods .payment_method_woo-mercado-pago-custom > label img {
        display: none !important;
    }
}

/* === Boton REALIZAR EL PEDIDO al final en mobile === */
@media (max-width: 768px) {
    body.woocommerce-checkout .place-order[data-moved="1"] {
        grid-area: placeorder !important;
        display: block !important;
        padding: 16px !important;
        background: #fff;
        border-radius: 12px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    }
}

/* === Resumen paso 1: label y valor en misma linea en mobile === */
@media (max-width: 768px) {
    .pikotin-resumen-row {
        display: flex !important;
        align-items: baseline !important;
        gap: 6px !important;
    }
    .pikotin-resumen-row span {
        min-width: 80px !important;
        flex-shrink: 0 !important;
    }
}

/* === Ocultar terminos dentro de #payment (paso 3) en mobile - solo mostrar al final === */
@media (max-width: 768px) {
    #payment .woocommerce-terms-and-conditions-wrapper {
        display: none !important;
    }
    /* Cuando .place-order es movido fuera de #payment, mostrar los terminos */
    .place-order[data-moved="1"] .woocommerce-terms-and-conditions-wrapper {
        display: block !important;
    }
}

/* === Terminos y condiciones: gris, letra pequeña, sin subrayado === */
.woocommerce-terms-and-conditions-wrapper, .woocommerce-terms-and-conditions-wrapper label, .woocommerce-terms-and-conditions-wrapper p, .woocommerce-terms-and-conditions-wrapper span {
    color: #888888 !important;
    font-size: 11px !important;
}

.woocommerce-terms-and-conditions-wrapper a {
    color: #888888 !important;
    text-decoration: none !important;
    font-size: 11px !important;
}

.woocommerce-terms-and-conditions-wrapper a:hover {
    text-decoration: underline !important;
}

/* === Fix: ocultar boton 'Continuar' del paso 2 (Envio) cuando ya esta colapsado - SOLO MOVIL === */
@media (max-width: 767px) {
    body.woocommerce-checkout .pikotin-card-ubicacion.pikotin-paso-colapsado .pikotin-continuar {
        display: none !important;
    }
}

/* === Fix orden boton 'Continuar' paso 2 (Envio): siempre al final, despues de Direccion/Referencias - SOLO MOVIL === */
@media (max-width: 767px) {
    body.woocommerce-checkout .pikotin-card-ubicacion.pikotin-paso-abierto {
        display: flex !important;
        flex-direction: column !important;
    }
    body.woocommerce-checkout .pikotin-card-ubicacion.pikotin-paso-abierto > * {
        order: 1;
    }
    body.woocommerce-checkout .pikotin-card-ubicacion.pikotin-paso-abierto .pikotin-entrega-toggle {
        order: 0;
    }
    body.woocommerce-checkout .pikotin-card-ubicacion.pikotin-paso-abierto .pikotin-ubigeo-row {
        order: 1;
    }
    body.woocommerce-checkout .pikotin-card-ubicacion.pikotin-paso-abierto #billing_country_field {
        order: 2;
    }
    body.woocommerce-checkout .pikotin-card-ubicacion.pikotin-paso-abierto #billing_state_field {
        order: 3;
    }
    body.woocommerce-checkout .pikotin-card-ubicacion.pikotin-paso-abierto #billing_city_field {
        order: 4;
    }
    body.woocommerce-checkout .pikotin-card-ubicacion.pikotin-paso-abierto #billing_address_1_field {
        order: 5;
    }
    body.woocommerce-checkout .pikotin-card-ubicacion.pikotin-paso-abierto #billing_address_2_field {
        order: 6;
    }
    body.woocommerce-checkout .pikotin-card-ubicacion.pikotin-paso-abierto .pikotin-continuar {
        order: 99 !important;
    }
}

/* === FIX: Mostrar boton "Realizar el pedido" en checkout === */
#payment .form-row.place-order {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-top: 20px !important;
}

#payment .form-row.place-order #place_order {
    width: 100% !important;
}

/* Evitar boton duplicado en movil: ocultar el original cuando WooCommerce usa su boton personalizado */
form.has-custom-place-order-button #payment .form-row.place-order #place_order {
    display: none !important;
}

/* Mostrar el boton solo cuando el paso de Pago esta activo (no antes) */
#payment.pikotin-paso-bloqueado .form-row.place-order {
    display: none !important;
}

/* === Boton "Realizar el pedido" como barra fija inferior, solo celular y paso 3 (Pago activo) === */
@media (max-width: 768px) {
    /* Barra fija al fondo, de borde a borde */
    #payment.pikotin-paso-abierto .form-row.place-order {
        position: fixed !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 4px 0 0 0 !important;
        box-sizing: border-box !important;
        z-index: 99999 !important;
        background: #fff !important;
        box-shadow: 0 -2px 10px rgba(0,0,0,0.15) !important;
    }
    /* Checkbox de terminos compacto dentro de la barra */
    #payment.pikotin-paso-abierto .form-row.place-order .woocommerce-terms-and-conditions-wrapper {
        padding: 14px 12px 8px 12px !important;
        margin: 0 !important;
        font-size: 12px !important;
        line-height: 1.3 !important;
        max-height: none !important;
    }
    /* Ocultar sellos de confianza dentro de la barra fija para que sea compacta */
    #payment.pikotin-paso-abierto .form-row.place-order .pikotin-trust {
        display: none !important;
    }
    /* Boton de borde a borde, sin esquinas redondeadas */
    body.woocommerce-checkout #payment.pikotin-paso-abierto .form-row.place-order #place_order {
        width: 100% !important;
        border-radius: 0 !important;
        margin: 0 !important;
        padding: 16px 20px !important;
    }
    /* Espacio al final para que la barra fija no tape el resumen (Subtotal/Envio/Total) */
    form.checkout.woocommerce-checkout {
        padding-bottom: 100px !important;
    }
    .pikotin-rightcol {
        padding-bottom: 100px !important;
    }
}

/* === Boton deshabilitado en gris hasta aceptar terminos; azul #111A51 al habilitarse === */
body.woocommerce-checkout button#place_order.button.alt:disabled, body.woocommerce-checkout button#place_order.button.alt[disabled] {
    background: #c4c4c4 !important;
    background-color: #c4c4c4 !important;
    border-color: #c4c4c4 !important;
    color: #ffffff !important;
    cursor: not-allowed !important;
}

body.woocommerce-checkout button#place_order.button.alt:not(:disabled) {
    background: #111A51 !important;
    background-color: #111A51 !important;
    border-color: #111A51 !important;
    color: #ffffff !important;
    cursor: pointer !important;
}

/* Boton "Realizar el pedido": gris cuando esta deshabilitado, azul #111A51 cuando esta activo */
#place_order:disabled, #place_order[disabled] {
    background: #c4c4c4 !important;
    border-color: #c4c4c4 !important;
    color: #ffffff !important;
    cursor: not-allowed !important;
    opacity: 1 !important;
}

#place_order:not(:disabled) {
    background: #111A51 !important;
    border-color: #111A51 !important;
    color: #ffffff !important;
    cursor: pointer !important;
}

/* === FIX: mostrar checkbox de Terminos y Condiciones en el paso 3 (mayor especificidad para ganar a la regla anti-duplicados) === */
body.woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper, body.woocommerce-checkout .woocommerce-checkout-payment .woocommerce-terms-and-conditions-wrapper {
    display: block !important;
}

/* === FIX: ocultar boton CONTINUAR del paso Envio cuando ya esta colapsado (escritorio) === */
body.woocommerce-checkout .pikotin-card-ubicacion.pikotin-paso-colapsado .pikotin-continuar, body.woocommerce-checkout .pikotin-card-personal.pikotin-paso-colapsado .pikotin-continuar {
    display: none !important;
}

/* Pikotin - Apartamento sin titulo + placeholders grises */
#billing_address_2_field > label {
    display: none !important;
}

#billing_address_1::placeholder, #billing_address_2::placeholder, #billing_referencia::placeholder {
    color: #9a9a9a !important;
    opacity: 1 !important;
    font-weight: 400 !important;
}

/* Pikotin - Orden fijo campos paso 2 (PC y movil) */
.pikotin-card-ubicacion {
    display: flex !important;
    flex-direction: column !important;
}

.pikotin-card-ubicacion > * {
    order: 10;
}

.pikotin-card-ubicacion > .pikotin-entrega-toggle {
    order: 1 !important;
}

.pikotin-card-ubicacion > .pikotin-ubigeo-row {
    order: 2 !important;
}

.pikotin-card-ubicacion > #billing_country_field {
    order: 3 !important;
}

.pikotin-card-ubicacion > #billing_state_field {
    order: 4 !important;
}

.pikotin-card-ubicacion > #billing_city_field {
    order: 5 !important;
}

.pikotin-card-ubicacion > #billing_address_1_field {
    order: 6 !important;
}

.pikotin-card-ubicacion > #billing_address_2_field {
    order: 7 !important;
}

.pikotin-card-ubicacion > #billing_referencia_field {
    order: 8 !important;
}

.pikotin-card-ubicacion > .pikotin-continuar {
    order: 20 !important;
}

.pikotin-card-ubicacion > .pikotin-resumen {
    order: 21 !important;
}

/* Pikotin - Envio: monto en negro */
tr.woocommerce-shipping-totals.shipping .woocommerce-Price-amount, tr.woocommerce-shipping-totals.shipping td, tr.woocommerce-shipping-totals.shipping label {
    color: #000000 !important;
}

/* ----- Ajuste 15 set 2026 tras la migracion -----
   En celular, la etiqueta del metodo Yape perdia su relleno (10px 12px) frente a una regla
   mas especifica que viene de otro snippet del checkout (la del bloque de Mercado Pago).
   Antes ganaba esta porque el Personalizador cargaba al final. Se repone con un punto mas de
   especificidad (html) porque la rival carga despues de este snippet. Al consolidar los snippets del checkout, unificar. */
@media (max-width: 767px) {
    html body #payment ul.payment_methods > li.wc_payment_method.payment_method_woo-mercado-pago-yape > label {
        padding: 10px 12px !important;
    }
}


/* ############################################################
   BLOQUE GLOBAL  (antes snippet WPCode 26464)
   ############################################################ */

/* ===== PK · GLOBAL · CSS =====
   Creado el 15 set 2026 al migrar del Personalizador las 39 reglas que no pertenecen a un area:
   variables de color, overflow horizontal, boton flotante de WhatsApp, tipografia en celular,
   ajustes del home (slider, flechas, titulos de secciones), footer y blog.
   Mismo orden en que estaban; en un segundo paso se fusionan repetidas.
   Regla: lo que no sea de carrito, producto, catalogo, header o checkout va AQUI. ===== */

.wd-copyrights {
    padding: 6px;
}
.blog-design-masonry.has-post-thumbnail .wd-post-date {
    display: none;
}
.wa__btn_popup {
    z-index: 100;
}

@media (max-width: 767px) {
    .wa__btn_popup_txt {
        display: none !important;
    }
    h1.elementor-heading-title {
        font-size: 26px !important;
        line-height: 1.2 !important;
    }
    h2.elementor-heading-title {
        font-size: 22px !important;
        line-height: 1.25 !important;
    }
    .woodmart-title-container.title {
        font-size: 24px !important;
        line-height: 1.25 !important;
    }
    /* Barra promocional superior (marquee) - texto un poco mas chico para que se lea mejor */
    .wd-marquee .wd-marquee-item {

    }
    /* Banda Delivery Gratis - que escale al ancho del movil sin recortarse */
    .elementor-element-b1000ce img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }
    /* === Pagina de categoria/busqueda: aprovechar todo el ancho y centrar tarjetas === */
    .wd-content-layout.content-layout-wrapper {
        display: block !important;
    }
    .wd-content-layout .wd-content-area {
        width: 100% !important;
        max-width: 100% !important;
    }
    body {
        overflow-x: hidden;
    }
}
/* === Cambiar azul claro (#111A51) por azul principal de marca (#111A51) === */
:root {
    --wd-primary-color: #111A51;
}
/* PIKOTIN-CHECKOUT-ANCHO (fijar ancho del checkout en 1100px centrado, solo esta pagina) */
body.page-id-11 main.wd-content-layout.container {
    max-width: 1100px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

@media (max-width: 767px) {
    .elementor-element-fb33703 ss3-force-full-width, .elementor-element-fb33703 .n2-section-smartslider, .elementor-element-fb33703 [id^="n2-ss-"] {
        background-color: #16225c !important;
    }
    .elementor-element-fb33703 .n2-ss-align, .elementor-element-fb33703 #n2-ss-2-align, .n2-section-smartslider, .n2-padding {
        overflow: hidden !important;
        max-width: 100vw !important;
    }
    div#n2-ss-2 {
        max-width: 100vw !important;
        overflow: hidden !important;
    }
    div#n2-ss-2 .n2-ss-slider-wrapper-inside {
        overflow: hidden !important;
        max-width: 100% !important;
    }
}
/* === Fix: Eliminar espacio en blanco entre header y SmartSlider === */
:root {
    --wd-top-bar-h: 0px !important;
}
/* === Fix: Titulo MARCAS - alineacion izquierda y tamaño reducido === */
.elementor-element-d3236d8 .elementor-heading-title, .elementor-element-d3236d8 h2 {
    text-align: left !important;
    font-size: 22px !important;
}
/* === Fix: Flechas del carousel de marcas - tamaño reducido y color #111A51 === */
.elementor-element-afcac9d .wd-arrow-inner {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    background-color: #111A51 !important;
}
.elementor-element-afcac9d .wd-btn-arrow {
    width: 32px !important;
    height: 32px !important;
}
.elementor-element-afcac9d .wd-arrow-inner svg, .elementor-element-afcac9d .wd-arrow-inner i {
    font-size: 14px !important;
    width: 14px !important;
    height: 14px !important;
}
/* === FIX: Evitar deformación al hacer zoom out en el navegador === */
/* Causa raiz: las secciones de ancho completo del tema usan
   left: calc(50% - 50vw...) mezclando % (del padre) con vw (viewport),
   lo que se descalibra al cambiar el zoom. Lo reemplazamos por margin negativo estable. */
[class*="wd-section-stretch"] {
    position: relative !important;
    width: 100vw !important;
    max-width: 100vw !important;
    left: 50% !important;
    right: auto !important;
    margin-left: -50vw !important;
    margin-right: 0 !important;
}
ss3-force-full-width, SS3-FORCE-FULL-WIDTH {
    max-width: 100vw !important;
    overflow: hidden !important;
}
.n2-section-smartslider, #n2-ss-2-align, .n2-padding {
    max-width: 100vw !important;
    overflow: hidden !important;
}
html, body {
    overflow-x: hidden !important;
}
.wd-page-wrapper {
    overflow-x: clip !important;
}
/* === FIN FIX ZOOM === */
/* === Ocultar textos de seccion Productos para mascotas === */
/* Oculta solo los textos, NO las imagenes de Mundo Cachorros/Gatitos/Senior */
/* Titulo: Productos para mascotas | Pikotin */
/* Subtitulo: Productos para cachorros */
/* Subtitulo: Productos para gatitos */
.elementor-element-13ec32d, .elementor-element-82a2006, .elementor-element-8f685a0, .elementor-element-3b510d1 {
    /* Subtitulo: Productos para senior */ display: none !important;
}

@media (max-width: 767px) {
    /* ---------------------------------------------------------
   * 3. SLIDER PRINCIPAL – Ancho completo (eliminar padding lateral)
   *    La sección 0792a10 no tiene wd-section-stretch, por lo que
   *    queda dentro del .container con padding 0 15px.
   *    Forzamos ancho completo y ocultamos overflow para el slide.
   * --------------------------------------------------------- */
    .elementor-element-0792a10 {
        width: 100vw !important;
        max-width: 100vw !important;
        margin-left: calc(-1 * (100vw - 100%) / 2) !important;
        overflow: hidden !important;
    }
    /* ---------------------------------------------------------
   * 4. BOTÓN WHATSAPP – Tamaño y centrado corregido
   *    El plugin fija .wa__btn_popup_icon en 56x56px.
   *    Reducimos TANTO el contenedor (.wa__btn_popup)
   *    COMO el círculo verde (.wa__btn_popup_icon) a 46px,
   *    y ajustamos el background-size del logo (SVG teléfono).
   * --------------------------------------------------------- */
    /* Contenedor exterior */
    .wa__btn_popup {
        width: 46px !important;
        height: 46px !important;
        min-width: 46px !important;
        overflow: hidden !important;
        bottom: 20px !important;
        right: 16px !important;
        border-radius: 50% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    /* Círculo verde — igualar al contenedor */
    .wa__btn_popup .wa__btn_popup_icon {
        width: 46px !important;
        height: 46px !important;
        min-width: 46px !important;
        min-height: 46px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: relative !important;
        flex-shrink: 0 !important;
    }
    /* Ícono SVG del teléfono — centrado y tamaño proporcional */
    .wa__btn_popup .wa__btn_popup_icon::before {
        background-size: 26px !important;
        background-position: center center !important;
        width: 100% !important;
        height: 100% !important;
        top: 0 !important;
        left: 0 !important;
    }
    /* Ícono X (cierre) — también centrado */
    .wa__btn_popup .wa__btn_popup_icon::after {
        background-size: 12px !important;
        background-position: center center !important;
        width: 100% !important;
        height: 100% !important;
        top: 0 !important;
        left: 0 !important;
    }
    /* Chat box: evitar que tape el contenido con el scroll */
    .wa__popup_chat_box {
        bottom: 76px !important;
        right: 10px !important;
        max-width: calc(100vw - 32px) !important;
        width: 320px !important;
    }
    /* ---------------------------------------------------------
   * 5. TÍTULO "Las mejores marcas" – Reducir font-size
   *    22px + texto largo produce 3 líneas. Con 17px queda en 2.
   * --------------------------------------------------------- */
    .elementor-element-d3236d8 .elementor-heading-title {
        font-size: 17px !important;
        line-height: 1.35 !important;
    }
    /* ---------------------------------------------------------
   * 9. SECCIÓN CATEGORÍAS (c6dae8a) – Gap entre imágenes
   *    Los 3 banners (Cachorros, Gatitos, Senior) tienen
   *    margen excesivo. Lo ajustamos a 6px entre ellos.
   * --------------------------------------------------------- */
    .elementor-element-c6dae8a .elementor-widget-image {
        margin-bottom: 6px !important;
    }
}
/* === /* === Blog posts vertical gap === */
.page-id-20816 .wd-posts.wd-masonry article.wd-post {
    margin-bottom: 20px !important;
}
.page-id-20816 .wd-posts.wd-masonry article.wd-post .article-inner {
    margin-left: 10px !important;
    margin-right: 10px !important;
}


/* ############################################################
   BLOQUE HEADER  (antes snippet WPCode 26461)
   ############################################################ */

/* ===== PK · HEADER · CSS =====
   Creado el 15 set 2026 al migrar del Personalizador las 82 reglas de la cabecera (fusionadas a 80):
   barra superior con video, menu, buscador, logo, header en celular, menu lateral movil
   y la cabecera especial del checkout. Van en el mismo orden en que estaban y con sus
   !important; en un segundo paso se fusionan repetidas y se quitan los que sobren.
   Regla: todo CSS de la cabecera va AQUI, no en el Personalizador. ===== */
/* === Ocultar corazon de lista de deseos en el header === */
.wd-header-wishlist {
    display: none !important;
}

/* === Mega menú categorías - estilo Pikotin === */
/* Títulos de columna: Readex Pro, menos grueso, azul de marca */
#menu-main-menu-left .menu-mega-dropdown .wd-sub-menu li.wd-col > a.woodmart-nav-link {
    font-family: "Readex Pro", Arial, sans-serif !important;
    font-weight: 500 !important;
    color: #111A51 !important;
}

/* Subcategorías: Be Vietnam Pro, ligeramente más pequeñas */
#menu-main-menu-left .menu-mega-dropdown ul.sub-sub-menu > li > a.woodmart-nav-link {
    font-family: "Be Vietnam Pro", Arial, sans-serif !important;
    font-size: 14px !important;
}

/* Hover de subcategorías: azul de marca */
#menu-main-menu-left .menu-mega-dropdown ul.sub-sub-menu > li > a.woodmart-nav-link:hover {
    color: #E0A800 !important;
}

/* ===== Pikotin - Boton lupa navy (busqueda header) ===== */
html body .searchsubmit, html body button.searchsubmit, html body .wd-search-button button, html body .wd-search-full button {
    background-color: #111A51 !important;
}

html body .searchsubmit:hover, html body button.searchsubmit:hover {
    background-color: #0c1340 !important;
}

/* === Franja superior con video banner (proporcion 2560x66) === */
:root, .whb-header {
    --wd-top-bar-h: calc(100vw * 66 / 2560);
    --wd-top-bar-sm-h: calc(100vw * 66 / 2560);
}

.whb-header .whb-top-bar.whb-row, .whb-header .whb-top-bar .whb-top-bar-inner, .whb-top-bar .container, .whb-top-bar .whb-col-left {
    height: calc(100vw * 66 / 2560) !important;
    max-height: none !important;
    min-height: 0 !important;
    align-items: stretch !important;
}

.whb-top-bar .container, .whb-top-bar .whb-column, .whb-top-bar .whb-col-left, .whb-top-bar .wd-header-html, .whb-top-bar .elementor-20903, .whb-top-bar .elementor-element-50ac7e8 {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

.whb-top-bar .elementor-element-1d80add, .whb-top-bar .elementor-element-1d80add .elementor-widget-container {
    width: 100% !important;
    height: calc(100vw * 66 / 2560) !important;
    padding: 0 !important;
    margin: 0 !important;
}

.whb-top-bar .e-hosted-video {
    aspect-ratio: 2560 / 66 !important;
    height: calc(100vw * 66 / 2560) !important;
    width: 100% !important;
    padding: 0 !important;
}

.whb-header .whb-top-bar .elementor-element-1d80add video, .whb-top-bar video {
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
}

/* === Color item Ofertas (amarillo #F9BB28) === */
.whb-header li.menu-item-21181 > a, .whb-header li.menu-item-21181 > a span {
    color: #F9BB28 !important;
}

/* === Ajustes menu derecho (PikotinesFelices + items) === */
/* Ocultar texto #PikotinesFelices */
.whb-header-bottom .whb-col-right .wd-header-text {
    display: none !important;
}

/* Items nuevos (Farmacia, Antipulgas, Suplementos, Peluqueria): blanco normal, hover dorado como Perros/Gatos */
.whb-header li.menu-item-24593 > a, .whb-header li.menu-item-24593 > a span, .whb-header li.menu-item-24594 > a, .whb-header li.menu-item-24594 > a span, .whb-header li.menu-item-24595 > a, .whb-header li.menu-item-24595 > a span, .whb-header li.menu-item-24596 > a, .whb-header li.menu-item-24596 > a span {
    color: #ffffff !important;
}

.whb-header li.menu-item-24593:hover > a, .whb-header li.menu-item-24593:hover > a span, .whb-header li.menu-item-24594:hover > a, .whb-header li.menu-item-24594:hover > a span, .whb-header li.menu-item-24595:hover > a, .whb-header li.menu-item-24595:hover > a span, .whb-header li.menu-item-24596:hover > a, .whb-header li.menu-item-24596:hover > a span {
    color: #FFC80C !important;
}

/* === Tamano de fuente menu derecho igual al menu principal (17px) === */
.whb-header ul.wd-nav-secondary > li > a, .whb-header ul.wd-nav-secondary > li > a span {
    font-size: 17px !important;
    line-height: 20.4px !important;
    font-weight: 400 !important;
}

@media (max-width: 767px) {
    /* Ocultar franja amarilla superior */
    .whb-top-bar {
        display: none !important;
    }
    /* Logo centrado en el header móvil */
    .whb-general-header .container {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    .whb-main-header .whb-mobile-left {
        flex: 1 1 0;
        min-width: 0;
        justify-content: flex-start;
    }
    .whb-main-header .whb-mobile-right {
        flex: 1 1 0;
        min-width: 0;
        justify-content: flex-end;
    }
    .whb-main-header .whb-mobile-center {
        flex: 0 0 auto;
        text-align: center;
    }
    .whb-main-header .whb-mobile-center .site-logo img {
        max-width: 150px !important;
        height: auto;
        width: auto;
    }
}

/* Ocultar barra superior (top bar) en todos los dispositivos - alta especificidad */
.whb-header .whb-row.whb-top-bar, body .whb-top-bar {
    display: none !important;
}

@media (max-width: 767px) {
    /* Contenedor al 80% centrado */
    body .whb-header-bottom .container, body .whb-row.whb-header-bottom > .container {
        max-width: 80% !important;
        width: 80% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    body .whb-header-bottom-inner {
        background-color: #111a51 !important;
        padding: 6px 12px !important;
    }
    /* Sobreescribir variables con selector de mayor especificidad que el tema */
    body body .whb-j3z0gisw1vkpgjlodbdz .searchform.woodmart-ajax-search, body body .wd-header-search-form-mobile .searchform.woodmart-ajax-search {
        --wd-form-height: 36px;
        --wd-search-btn-w: 32px;
    }
    /* Estilos fisicos con !important - no dependen de variables */
    body .whb-j3z0gisw1vkpgjlodbdz .searchform.woodmart-ajax-search, body .wd-header-search-form-mobile .searchform.woodmart-ajax-search {
        background: #ffffff !important;
        border-radius: 10px !important;
        overflow: hidden !important;
        width: 100% !important;
        height: 36px !important;
        max-height: 36px !important;
        min-height: 36px !important;
        border: none !important;
        box-shadow: none !important;
        position: relative !important;
    }
    body .whb-j3z0gisw1vkpgjlodbdz .searchform.woodmart-ajax-search input.s, body .wd-header-search-form-mobile .searchform.woodmart-ajax-search input.s {
        background: transparent !important;
        border: none !important;
        padding: 0 40px 0 12px !important;
        margin: 0 !important;
        height: 36px !important;
        width: 100% !important;
        font-size: 14px !important;
        color: #333 !important;
        line-height: 36px !important;
        box-sizing: border-box !important;
    }
    /* Boton: position absolute desde el tema, solo controlamos tamaño e inset */
    body .whb-j3z0gisw1vkpgjlodbdz .searchform.woodmart-ajax-search button.searchsubmit, body .wd-header-search-form-mobile .searchform.woodmart-ajax-search button.searchsubmit {
        background-color: #111a51 !important;
        border-radius: 7px !important;
        width: 30px !important;
        min-width: 30px !important;
        top: 3px !important;
        bottom: 3px !important;
        right: 3px !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        cursor: pointer !important;
    }
    /* Icono lupa: 14px fijo con !important */
    body .whb-j3z0gisw1vkpgjlodbdz .searchform.woodmart-ajax-search button.searchsubmit::after, body .wd-header-search-form-mobile .searchform.woodmart-ajax-search button.searchsubmit::after {
        font-size: 14px !important;
        color: #ffffff !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        line-height: 1 !important;
        margin: 0 !important;
    }
}

/* =====================================================
   CHECKOUT - Header limpio (estilo minimalista)
   ===================================================== */
/* 1. Ocultar menú de navegación */
.woocommerce-checkout .whb-header-bottom {
    display: none !important;
}

/* 2. Ocultar búsqueda y iconos derecha */
.woocommerce-checkout .whb-general-header .whb-col-center, .woocommerce-checkout .whb-general-header .whb-col-right, .woocommerce-checkout .whb-general-header .whb-space-element {
    display: none !important;
}

/* 3. Fondo azul y altura del header */
.woocommerce-checkout .whb-general-header {
    background-color: #111A51 !important;
    border-bottom: none !important;
}

/* 4. Layout de 3 columnas: izq | centro | der */
.woocommerce-checkout .whb-general-header .whb-general-header-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 65px !important;
}

.woocommerce-checkout .whb-general-header .whb-col-left .site-logo {
    display: none !important;
}

.woocommerce-checkout .whb-general-header .whb-col-left::after {
    content: "\2190 SEGUIR COMPRANDO" !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    cursor: pointer !important;
}

/* 6. Logo centrado - usar ::before del inner para mostrar imagen */
.woocommerce-checkout .whb-general-header .whb-general-header-inner::before {
    content: "" !important;
    display: block !important;
    background-image: url('https://pikotin.pe/wp-content/uploads/2026/06/pikotin-logo-slogan.png') !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    background-position: center !important;
    width: 140px !important;
    height: 75px !important;
    flex-shrink: 0 !important;
    order: 2 !important;
}

/* Ocultar los íconos reales de cuenta/carrito/wishlist */
.woocommerce-checkout .whb-general-header .whb-col-right > div {
    display: none !important;
}

/* "¿Te ayudamos?" label */
.woocommerce-checkout .whb-general-header .whb-col-right::before {
    content: "\00BFTe ayudamos?" !important;
    color: rgba(255,255,255,0.85) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    letter-spacing: 0.5px !important;
    text-transform: none !important;
    white-space: nowrap !important;
    display: block !important;
    text-align: right !important;
}

/* Número de WhatsApp con logo */
.woocommerce-checkout .whb-general-header .whb-col-right::after {
    display: none !important;
}

/* Quitar el ::after del inner que teniamos antes */
.woocommerce-checkout .whb-general-header .whb-general-header-inner::after {
    display: none !important;
    content: "" !important;
}

.woocommerce-checkout.admin-bar html, .admin-bar.woocommerce-checkout body {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* === Alinear margenes del header checkout con el contenido === */
.woocommerce-checkout .whb-general-header .container {
    max-width: 1100px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    box-sizing: border-box !important;
}

/* === Hover color en 'SEGUIR COMPRANDO' del checkout === */
.woocommerce-checkout .whb-general-header .whb-col-left {
    flex: 1 !important;
    justify-content: flex-start !important;
    order: 1 !important;
    cursor: pointer !important;
}

.woocommerce-checkout .whb-general-header .whb-col-left:hover::after {
    color: #D99A00 !important;
}

/* === Cursor pointer en 'Te Ayudamos' del checkout === */
.woocommerce-checkout .whb-general-header .whb-col-right {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    justify-content: center !important;
    flex: 1 !important;
    order: 3 !important;
    gap: 2px !important;
    cursor: pointer !important;
}

@media (max-width: 767px) {
    /* ---------------------------------------------------------
   * 1. HEADER – Eliminar hueco vacío entre barra de búsqueda y slider
   *    El JS sticky del tema asigna padding-top = altura total del header (161px).
   *    El contenido real es 71px (logo row) + 50px (search row) = 121px.
   *    Corregimos el padding para eliminar los ~40px de espacio muerto.
   * --------------------------------------------------------- */
    .whb-header {
        padding-top: 121px !important;
    }
    /* ---------------------------------------------------------
   * 2. BARRA DE BÚSQUEDA – Ampliar de ~67% a ~95% del viewport
   *    El contenedor tenía max-width: 80% pero la cadena de
   *    wrappers lo reducía a ~261px (67%). Ahora usamos 95%.
   * --------------------------------------------------------- */
    body .whb-header-bottom .container, body .whb-row.whb-header-bottom > .container {
        max-width: 95% !important;
        width: 95% !important;
    }
    /* ---------------------------------------------------------
   * 10. SEARCH INNER – Padding vertical para mayor altura táctil
   * --------------------------------------------------------- */
    .whb-header-bottom-inner {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
    /* Ocultar columnas mobile redundantes en checkout (el logo ya aparece centrado como elemento absoluto) */
    .woocommerce-checkout .whb-general-header .whb-mobile-center, .woocommerce-checkout .whb-general-header .whb-mobile-left, .woocommerce-checkout .whb-general-header .whb-mobile-right {
        display: none !important;
    }
    /* Asegurar que el inner tenga posicion relativa para el logo absoluto */
    .woocommerce-checkout .whb-general-header-inner {
        position: relative !important;
        min-height: 70px !important;
    }
    /* Hacer que el bloque Te ayudamos no crezca innecesariamente */
    .woocommerce-checkout .whb-general-header .whb-col-right {
        flex: 0 0 auto !important;
        max-width: 140px !important;
    }
    .woocommerce-checkout .whb-general-header #pk-ayuda-wa {
        gap: 2px !important;
    }
    /* Texto "Te ayudamos?" */
    .woocommerce-checkout .whb-general-header #pk-ayuda-wa > span:first-child {
        font-size: 11px !important;
        line-height: 1.2 !important;
    }
    /* Fila con icono WA + numero */
    .woocommerce-checkout .whb-general-header #pk-ayuda-wa > span:last-child {
        font-size: 13px !important;
        gap: 3px !important;
    }
    /* Icono de WhatsApp */
    .woocommerce-checkout .whb-general-header #pk-ayuda-wa > span:last-child > span:first-child {
        font-size: 13px !important;
        width: 15px !important;
        height: 15px !important;
    }
    /* Numero de telefono */
    .woocommerce-checkout .whb-general-header #pk-ayuda-wa > span:last-child > span:last-child {
        font-size: 13px !important;
    }
}

/* === Ocultar Lista de Deseos del menú lateral móvil === */
.mobile-nav .menu-item-wishlist {
    display: none !important;
}

/* === Menú lateral móvil: texto en negro === */
.mobile-nav.wd-side-hidden-nav .woodmart-nav-link, .mobile-nav.wd-side-hidden-nav .woodmart-nav-link span, .mobile-nav.wd-side-hidden-nav .wd-nav-mobile a, .mobile-nav.wd-side-hidden-nav .wd-nav-mobile .woodmart-nav-link {
    color: #000000 !important;
}

/* === Menú lateral móvil: ocultar "Mi cuenta" === */
.mobile-nav.wd-side-hidden-nav .menu-item-account {
    display: none !important;
}

/* === Menú lateral móvil: igualar tamaño de fuente de Ofertas === */
.mobile-nav.wd-side-hidden-nav .menu-item-24877 > a.woodmart-nav-link, .mobile-nav.wd-side-hidden-nav .menu-item-24877 > a.woodmart-nav-link span {
    font-size: 13px !important;
}

/* === Menú lateral móvil: fondo azul en categoría padre cuando está desplegada === */
.mobile-nav.wd-side-hidden-nav .item-level-0.opener-page > a.woodmart-nav-link, .mobile-nav.wd-side-hidden-nav .item-level-0:has(.wd-nav-opener.wd-active) > a.woodmart-nav-link {
    background-color: #111A51 !important;
    color: #ffffff !important;
}

.mobile-nav.wd-side-hidden-nav .item-level-0.opener-page > a.woodmart-nav-link span, .mobile-nav.wd-side-hidden-nav .item-level-0:has(.wd-nav-opener.wd-active) > a.woodmart-nav-link span, .mobile-nav.wd-side-hidden-nav .item-level-0.opener-page > a.woodmart-nav-link .nav-link-text, .mobile-nav.wd-side-hidden-nav .item-level-0:has(.wd-nav-opener.wd-active) > a.woodmart-nav-link .nav-link-text {
    color: #ffffff !important;
}

/* === Flechita del desplegable: mismo fondo que la categoría activa === */
.mobile-nav.wd-side-hidden-nav .item-level-0:has(.wd-nav-opener.wd-active) .wd-nav-opener.wd-active, .mobile-nav.wd-side-hidden-nav .item-level-0.opener-page .wd-nav-opener.wd-active {
    background-color: #111A51 !important;
}

/* === Subcategorías del menú móvil: sangría + fondo para distinguirlas === */
.mobile-nav.wd-side-hidden-nav .wd-sub-menu {
    background-color: #f7f7f7 !important;
}

.mobile-nav.wd-side-hidden-nav .wd-sub-menu > .menu-item > a.woodmart-nav-link {
    padding-left: 32px !important;
}

/* === Subcategorías nivel 1: sangría + fondo gris para distinguirlas === */
.mobile-nav.wd-side-hidden-nav .item-level-0 > .wd-sub-menu {
    background-color: #f7f7f7 !important;
}

.mobile-nav.wd-side-hidden-nav .item-level-0 > .wd-sub-menu > li > a.woodmart-nav-link {
    padding-left: 32px !important;
}

/* === Corrección desplegables de subcategorías (nivel 1 y 2) === */
/* Nivel 1 activo (ej: Alimentos expandido): fondo gris, texto negro, sin color primario */
.mobile-nav.wd-side-hidden-nav .item-level-1.opener-page > a.woodmart-nav-link, .mobile-nav.wd-side-hidden-nav .item-level-1:has(.wd-nav-opener.wd-active) > a.woodmart-nav-link {
    background-color: #ebebeb !important;
    color: #000000 !important;
}

.mobile-nav.wd-side-hidden-nav .item-level-1.opener-page > a.woodmart-nav-link .nav-link-text, .mobile-nav.wd-side-hidden-nav .item-level-1:has(.wd-nav-opener.wd-active) > a.woodmart-nav-link .nav-link-text {
    color: #000000 !important;
}

/* Flechita nivel 1 activa: mismo gris oscuro que fondo */
.mobile-nav.wd-side-hidden-nav .item-level-1:has(.wd-nav-opener.wd-active) .wd-nav-opener.wd-active, .mobile-nav.wd-side-hidden-nav .item-level-1.opener-page .wd-nav-opener.wd-active {
    background-color: #ebebeb !important;
    color: #000000 !important;
}

/* Sub-subcategorías (nivel 2): fondo más oscuro y sangría mayor */
.mobile-nav.wd-side-hidden-nav .item-level-1 > .wd-sub-menu {
    background-color: #e0e0e0 !important;
}

.mobile-nav.wd-side-hidden-nav .item-level-2 > a.woodmart-nav-link {
    padding-left: 44px !important;
    color: #000000 !important;
}

/* === Fondo sub-subcategorías (nivel 2) ul.sub-sub-menu === */
.mobile-nav.wd-side-hidden-nav .sub-sub-menu {
    background-color: #e0e0e0 !important;
}

/* Forzar color negro en todos los links de subcategorías de nivel 1 y 2 */
.mobile-nav.wd-side-hidden-nav .wd-sub-menu li a.woodmart-nav-link, .mobile-nav.wd-side-hidden-nav .sub-sub-menu li a.woodmart-nav-link, .mobile-nav.wd-side-hidden-nav .wd-sub-menu li a.woodmart-nav-link .nav-link-text, .mobile-nav.wd-side-hidden-nav .sub-sub-menu li a.woodmart-nav-link .nav-link-text {
    color: #000000 !important;
}

/* === Tamaño de texto subcategorías nivel 1 y 2 === */
.mobile-nav.wd-side-hidden-nav .item-level-1 > a.woodmart-nav-link, .mobile-nav.wd-side-hidden-nav .item-level-1 > a.woodmart-nav-link span {
    font-size: 13px !important;
}

.mobile-nav.wd-side-hidden-nav .item-level-2 > a.woodmart-nav-link, .mobile-nav.wd-side-hidden-nav .item-level-2 > a.woodmart-nav-link span {
    font-size: 13px !important;
}

/* === Ancho barra lateral móvil: 85% del ancho de pantalla === */
.mobile-nav.wd-side-hidden-nav {
    width: 85vw !important;
    max-width: 400px !important;
}

/* [15 set 2026] La cabecera y la barra de envio del drawer se movieron al snippet
   de WPCode "PK · CARRITO · CSS". No volver a escribirlos aqui. */
/* === Igualar tamaño fuente "Otras mascotas" en menú principal === */
#menu-item-25131 > a.woodmart-nav-link {
    font-size: 17px !important;
}


/* ############################################################
   BLOQUE CATÁLOGO  (antes snippet WPCode 26365)
   ############################################################ */

/* ==========================================================
   PK · CATALOGO · CSS
   Consolidado el 12 sep 2026. Reemplaza a los snippets: 24802, 24950, 26084, 26087
   Regla: todo el CSS de esta area va AQUI. No crear snippets sueltos.
   ========================================================== */

/* ---- #24802 · Fix - Eliminar hueco blanco superior header sticky ---- */
/* Header sticky Pikotin: header fijo al hacer scroll, sin hueco blanco superior. Restaura el comportamiento nativo de Woodmart anulando una regla del Personalizador que forzaba position:relative */
.whb-header.whb-sticky-prepared .whb-main-header { position: absolute !important; }
.whb-header.whb-sticked .whb-main-header { position: fixed !important; }
/* Checkout: el header no es sticky aqui, eliminar el padding superior que crea el hueco blanco */
.woocommerce-checkout .whb-header.whb-sticky-prepared { padding-top: 0 !important; }
.woocommerce-checkout .whb-header.whb-sticky-prepared .whb-main-header { position: relative !important; }
/* Home: eliminar la franja blanca de 40px entre el header y el primer banner */
.home .wd-content-layout.content-layout-wrapper { padding-top: 0 !important; }

/* ---- #24950 · Main Nav - White color + Hover Gold ---- */
/* Main nav items - white color, gold hover */
.item-level-0 > a.woodmart-nav-link,
.item-level-0 > a.woodmart-nav-link span {
    color: #ffffff !important;
}
.item-level-0 > a.woodmart-nav-link:hover,
.item-level-0:hover > a.woodmart-nav-link,
.item-level-0 > a.woodmart-nav-link:hover span,
.item-level-0:hover > a.woodmart-nav-link span {
    color: #F9BB28 !important;
}

/* Ofertas - bright yellow, same size */
.menu-item-24877 > a.woodmart-nav-link {
    font-size: 17px !important;
    color: #FFD700 !important;
}

/* Descuentazos y Liquidaciones - negro con hover dorado */
.menu-item-24590 > a,
.menu-item-24591 > a {
    color: #000000 !important;
}
.menu-item-24590:hover > a,
.menu-item-24591:hover > a {
    color: #F9BB28 !important;
}

/* ---- #26084 · Barra busqueda sticky en movil ---- */
@media (max-width: 767px){
  .whb-header.whb-sticked .whb-header-bottom.whb-not-sticky-row{
    display: flex !important;
  }
}

/* ---- #26087 · Diseno barra busqueda movil (pildora + lupa circular) ---- */
@media (max-width: 767px){
  .wd-header-search-form-mobile .searchform{ position:relative; }
  .wd-header-search-form-mobile .searchform input.s{
    background:#fff !important;
    color:#333 !important;
    border:none !important;
    border-radius:10px !important;
    height:40px !important;
    padding:0 52px 0 16px !important;
    box-shadow:none !important;
  }
  .wd-header-search-form-mobile .searchform input.s::placeholder{ color:#8a8a8a !important; }
  .wd-header-search-form-mobile .searchform .wd-clear-search{ display:none !important; }
  .wd-header-search-form-mobile .searchform .searchsubmit{
    position:absolute !important;
    right:5px !important; top:50% !important;
    transform:translateY(-50%) !important;
    width:32px !important; height:32px !important; min-width:32px !important;
    border-radius:8px !important;
    background:#111a51 !important;
    display:flex !important; align-items:center !important; justify-content:center !important;
    padding:0 !important;
  }
  .wd-header-search-form-mobile .searchform .searchsubmit svg,
  .wd-header-search-form-mobile .searchform .searchsubmit path{
    stroke:#fff !important; fill:#fff !important; color:#fff !important;
  }
}


/* ===== FLECHAS DE CARRUSEL — 14 set 2026 =====
   Tras Woodmart 8.5.7 las flechas quedaron encima de la primera y la ultima tarjeta,
   tapando el nombre del producto. Se sacan fuera del carrusel.
   El max() las deja a 50px afuera cuando hay margen y, cuando no lo hay, las pega al
   borde de la ventana sin provocar barra horizontal.
   OJO: hay que repetir el selector con :hover y :focus. El tema tiene una regla propia
   para el estado hover que devuelve la flecha a right:0; sin el :hover aqui, la flecha
   salta 50px al pasar el mouse, se sale de debajo del cursor, vuelve, y parpadea sin parar.
   Tampoco tocar top ni transform: el tema los recalcula en cada slide. */
body .wd-products-element .wd-carousel-inner .wd-nav-arrows.wd-pos-sep .wd-btn-arrow.wd-prev,
body .wd-products-element .wd-carousel-inner .wd-nav-arrows.wd-pos-sep .wd-btn-arrow.wd-prev:hover,
body .wd-products-element .wd-carousel-inner .wd-nav-arrows.wd-pos-sep .wd-btn-arrow.wd-prev:focus{
  inset-inline-start: max(-50px, calc(50% - 50vw + 10px)) !important;
  left: max(-50px, calc(50% - 50vw + 10px)) !important;
  right: auto !important;
}
body .wd-products-element .wd-carousel-inner .wd-nav-arrows.wd-pos-sep .wd-btn-arrow.wd-next,
body .wd-products-element .wd-carousel-inner .wd-nav-arrows.wd-pos-sep .wd-btn-arrow.wd-next:hover,
body .wd-products-element .wd-carousel-inner .wd-nav-arrows.wd-pos-sep .wd-btn-arrow.wd-next:focus{
  inset-inline-end: max(-50px, calc(50% - 50vw + 10px)) !important;
  right: max(-50px, calc(50% - 50vw + 10px)) !important;
  left: auto !important;
}

/* ===== BOTON AGREGAR AL CARRITO: que no se corte el texto — 14 set 2026 =====
   La etiqueta visible no es el texto del enlace (que dice "Anadir al carrito"): el span
   .wd-action-text va con font-size:0 y la palabra sale de un ::after con content,
   definido en el CSS del Personalizador. Ese span trae white-space:nowrap y
   overflow:hidden, asi que en tarjetas angostas el texto se recortaba sin puntos
   suspensivos y quedaba "AGREGAR AL CAR". Se deja que baje de linea, con interlineado
   ajustado para que el boton no crezca de mas, y se afina el padding lateral. */
.wd-product .wd-action-text{
  white-space: normal !important;
  overflow: visible !important;
  /* OJO: el line-height va en px, no sin unidad. Este span tiene font-size:0
     (el texto visible sale del ::after), asi que un 1.25 se multiplica por 0 y
     queda en 0. Con line-height 0 las dos lineas se apilan hacia abajo desde un
     punto sin altura y el texto se ve pegado arriba dentro del boton. */
  /* 17px no es un numero al azar: el boton tiene 42px de alto minimo y 8px de
     relleno vertical, o sea 34px utiles. Dos lineas de 17px suman exactamente 34
     y el texto queda centrado. Con menos, sobra hueco abajo y el texto se ve
     pegado arriba; con mas, el boton crece. */
  line-height: 17px !important;
}
.wd-product .wd-add-btn a,
.wd-product .add-to-cart-loop{
  padding-left: 10px !important;
  padding-right: 10px !important;
}

/* 15 set 2026 Boton AGREGAR: el texto lo pone PK CATALOGO PHP; aqui se anula el pseudo del Personalizador para que no salga duplicado */
html body .wd-product .add_to_cart_button span::after,
html body .product-grid-item .add_to_cart_button span::after {
  content: none !important;
}

/* ----- TEXTO DEL BOTON DE LAS TARJETAS (15 set 2026) -----
   Texto real = "Agregar" (lo pone PK · CATALOGO · PHP).
   Escritorio: se le anade " al carrito" con un ::after. Celular: solo "Agregar".
   Hay DOS reglas ajenas que ponen font-size:0 a los span del boton:
     1) el CSS del Personalizador  ->  .wd-product .add_to_cart_button span
     2) Elementor, plantilla del catalogo (post-6592.css, elemento fe1ef9b)
   La de Elementor tiene 4 clases, por eso aqui la clase del boton va repetida:
   es la unica forma de ganarle sin tocar Elementor. Al limpiar el Personalizador
   y la plantilla, este bloque se puede simplificar.
   Para volver a mayusculas: quitar el text-transform:none. */
html body .wd-product .add_to_cart_button.add_to_cart_button.add_to_cart_button,
html body .wd-product .add-to-cart-loop.add-to-cart-loop.add-to-cart-loop {
    text-transform: none !important;
}
html body .wd-product .add_to_cart_button.add_to_cart_button.add_to_cart_button span.wd-action-text,
html body .wd-product .add-to-cart-loop.add-to-cart-loop.add-to-cart-loop span.wd-action-text {
    font-size: 11px !important;
    line-height: 1.2 !important;
}
html body .wd-product .add_to_cart_button.add_to_cart_button.add_to_cart_button span.wd-action-text::after,
html body .wd-product .add-to-cart-loop.add-to-cart-loop.add-to-cart-loop span.wd-action-text::after {
    content: none !important;
}
@media (min-width: 769px) {
    html body .wd-product .add_to_cart_button.add_to_cart_button.add_to_cart_button span.wd-action-text::after,
    html body .wd-product .add-to-cart-loop.add-to-cart-loop.add-to-cart-loop span.wd-action-text::after {
        content: " al carrito" !important;
        font-size: 11px !important;
        line-height: 1.2 !important;
        position: static !important;
        width: auto !important;
        display: inline !important;
        color: inherit !important;
    }
    html body .wd-product .add_to_cart_button.add_to_cart_button.add_to_cart_button,
    html body .wd-product .add-to-cart-loop.add-to-cart-loop.add-to-cart-loop {
        width: auto !important;
        min-width: 150px !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
    }
}

/* ===== BOTON DE LAS TARJETAS DE PRODUCTO (migrado del Personalizador, 15 set 2026) =====
   Venian 22 reglas repartidas por todo el Personalizador. Aqui quedan 13.
   Se borraron 9 que ya no pintaban nada:
     - font-size:0 al span y los tres ::after que escribian "Agregar al carrito" / "Agregar"
       (el boton ya lleva texto real; ver bloque "TEXTO DEL BOTON" mas arriba),
     - el fondo azul #111A51 y su hover (los pisaban el gris y luego el amarillo),
     - el gris #6b7280, fusionado con el amarillo que es el que gana.
   Los !important se conservan: la plantilla de Elementor del catalogo (post-6592) pelea por
   estos mismos elementos y hoy no se puede prescindir de ellos. ===== */

/* Contenedor del boton pegado abajo de la tarjeta */
.product-grid-item .product-element-bottom .wd-add-btn,
.wd-product .product-element-bottom .wd-add-btn {
    margin-top: auto !important;
}

/* Forma del boton */
.wd-product .wd-buttons .add_to_cart_button,
.wd-product .product-element-bottom .add_to_cart_button,
.wd-product a.add_to_cart_button {
    font-size: 11px !important;
    border-radius: 50px !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
}

/* Sin el icono/animacion de Woodmart al pasar el mouse */
.wd-product .add-to-cart-loop::before,
.wd-product .add-to-cart-loop:hover::before {
    content: none !important;
    display: none !important;
    opacity: 0 !important;
    transform: translateY(100%) !important;
}
.wd-product .add-to-cart-loop:hover span,
.wd-product .add_to_cart_button:hover span {
    transform: none !important;
    opacity: 1 !important;
    translate: none !important;
}

/* Colores: amarillo de marca, texto oscuro, hover mostaza (una sola vez) */
body .products .product .button.add_to_cart_button:not(.wd-pikotin-agotado),
body .products .product .button.product_type_variable:not(.wd-pikotin-agotado),
body .products .product .wd-add-btn > a:not(.wd-pikotin-agotado) {
    background-color: #F9BB28 !important;
    background: #F9BB28 !important;
    border-color: #F9BB28 !important;
    color: #111111 !important;
}
body .products .product .button.add_to_cart_button:not(.wd-pikotin-agotado):hover,
body .products .product .button.product_type_variable:not(.wd-pikotin-agotado):hover,
body .products .product .wd-add-btn > a:not(.wd-pikotin-agotado):hover {
    background-color: #D99A00 !important;
    background: #D99A00 !important;
    border-color: #D99A00 !important;
    color: #111111 !important;
}
body .products .product .button.add_to_cart_button:not(.wd-pikotin-agotado) span,
body .products .product .button.product_type_variable:not(.wd-pikotin-agotado) span,
body .products .product .wd-add-btn > a:not(.wd-pikotin-agotado) span,
body .products .product .button.add_to_cart_button:not(.wd-pikotin-agotado):hover span,
body .products .product .button.product_type_variable:not(.wd-pikotin-agotado):hover span,
body .products .product .wd-add-btn > a:not(.wd-pikotin-agotado):hover span {
    color: #111111 !important;
}

/* Boton de producto agotado (gris, sin accion) */
body .wd-product .button.wd-pikotin-agotado,
body .product-grid-item .button.wd-pikotin-agotado {
    background-color: #e6e6e6 !important;
    color: #000000 !important;
    border: 0 !important;
    border-radius: 50px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 36px !important;
    min-height: 40px !important;
    padding: 0 18px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-align: center !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
}
body .wd-product .button.wd-pikotin-agotado:hover,
body .product-grid-item .button.wd-pikotin-agotado:hover {
    background-color: #e6e6e6 !important;
    color: #000000 !important;
}

/* Celular */
@media (max-width: 767px) {
    .product-grid-item a.add_to_cart_button {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
    .products .product-grid-item .wd-add-btn {
        margin-top: auto !important;
        padding-top: 8px !important;
    }
    .wd-carousel-item .add_to_cart_button,
    .wd-carousel-item .wd-add-btn a.button {
        font-size: 13px !important;
        letter-spacing: 0.3px !important;
    }
    .elementor-element-98c223e .wd-add-btn,
    .elementor-element-98c223e .wd-add-btn a.button {
        height: 42px !important;
        min-height: 42px !important;
    }
}

/* ===== RESTO DEL CATALOGO (migrado del Personalizador, 15 set 2026) =====
   Venian 81 reglas; quedan 75 tras fusionar las que repetian selector (6 casos)
   y quitar un selector duplicado dentro de una lista. Se conservan los !important:
   la plantilla de Elementor del catalogo (post-6592) pelea por estos elementos. ===== */

/* Boton 'Cargar mas': menos redondeado + hover con fondo gris */
.products-footer a.wd-load-more, .wd-loop-footer a.wd-load-more, body a.wd-products-load-more.btn {
    --btn-brd-color: #000000 !important;
    --btn-brd-width: 2px !important;
    border: 2px solid #000000 !important;
    --btn-brd-radius: 8px !important;
    border-radius: 8px !important;
}

.products-footer a.wd-load-more:hover, .wd-loop-footer a.wd-load-more:hover, body a.wd-products-load-more.btn:hover {
    background-color: #e0e0e0 !important;
    background: #e0e0e0 !important;
}

/* === Formato global de tarjetas de producto (igual a Productos mas vendidos) === */
.wd-product, .product-grid-item {
    --wd-brd-radius: 12px;
}

.product-grid-item .product-element-bottom, .wd-product .product-element-bottom {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    text-align: center;
}

.wd-product .wd-entities-title, .product-grid-item .wd-entities-title {
    text-align: center;
}

.wd-product .price, .product-grid-item .price {
    text-align: center;
    display: block;
    width: 100%;
}

.wd-product .wd-product-cats, .product-grid-item .wd-product-cats {
    text-align: center;
    width: 100%;
}

.wd-product .wd-buttons, .product-grid-item .wd-buttons {
    text-align: center;
    justify-content: center;
}

.product-grid-item .product-image-link img, .wd-product img {
    border-radius: 8px;
}

.wd-product .product-element-top, .wd-product .product-image-link, .wd-product .product-wrapper {
    background: #fff !important;
}

.wd-product .product-image-link img {
    background: #fff !important;
}

.product-grid-item, .wd-product {
    border: 1px solid rgba(0,0,0,0.25);
    border-radius: 12px;
    overflow: hidden;
    padding: 10px 10px 16px;
    background: #fff !important;
    transition: transform .25s, box-shadow .25s;
    box-shadow: rgba(0,0,0,0.06) 0px 3px 8px, rgba(0,0,0,0.04) 0px 1px 2px !important;
}

.product-grid-item:hover, .wd-product:hover {
    transform: translateY(-3px);
    box-shadow: rgba(0,0,0,0.1) 0px 6px 14px, rgba(0,0,0,0.06) 0px 2px 4px !important;
}

.wd-product .price, .wd-product .price ins, .wd-product .price .woocommerce-Price-amount, .wd-product .price bdi {
    font-size: 19px !important;
    font-weight: 700 !important;
    color: #1A1A1A !important;
}

.wd-product .price del, .wd-product .price del .woocommerce-Price-amount {
    opacity: 1;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #999999 !important;
}

.wd-product .wd-product-cats, .wd-product .wd-product-cats a {
    letter-spacing: 0.2px;
    font-weight: 400 !important;
    color: #888888 !important;
}

.wd-product .wd-product-cats a:hover {
    color: #555555 !important;
}

/* PIKOTIN-GAP: mas separacion entre productos del catalogo (no home) */
body.woocommerce-page:not(.home) .wd-content-area .products.wd-products, body.archive.woocommerce:not(.home) .wd-content-area .products.wd-products, body.post-type-archive-product:not(.home) .wd-content-area .products.wd-products, body.tax-product_cat:not(.home) .wd-content-area .products.wd-products {
    column-gap: 24px !important;
    row-gap: 30px !important;
}

/* PIKOTIN-PRICE-SLIDER: barra de rango de precio estilo Pikotin (no home) */
body:not(.home) .widget_price_filter .price_slider {
    height: 3px !important;
    background: #d8d8d8 !important;
    border-radius: 3px !important;
    border: 0 !important;
    margin-bottom: 1.1em !important;
}

body:not(.home) .widget_price_filter .price_slider .ui-slider-range {
    background: #6b7280 !important;
    height: 3px !important;
    border-radius: 3px !important;
    border: 0 !important;
}

body:not(.home) .widget_price_filter .price_slider .ui-slider-handle {
    width: 12px !important;
    height: 12px !important;
    border-radius: 50% !important;
    background: #6b7280 !important;
    border: 2px solid #fff !important;
    box-shadow: 0 0 3px rgba(0,0,0,0.30) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin: 0 0 0 -6px !important;
    cursor: pointer !important;
}

body:not(.home) .widget_price_filter .price_slider .ui-slider-handle:before, body:not(.home) .widget_price_filter .price_slider .ui-slider-handle:after {
    display: none !important;
}

/* texto dinamico del precio mas pequeno */
body:not(.home) .widget_price_filter .price_slider_amount .price_label {
    font-size: 13px !important;
}

/* PIKOTIN-FILTER-BTN: boton Filtrar cilindrico, centrado, azul oscuro -> amarillo hover */
body:not(.home) .widget_price_filter .price_slider_amount {
    font-size: 13px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

body:not(.home) .widget_price_filter .price_slider_amount .button {
    background-color: #111A51 !important;
    color: #fff !important;
    border-radius: 50px !important;
    padding: 9px 28px !important;
    border: 0 !important;
    display: inline-block !important;
    margin: 0 auto !important;
    float: none !important;
    text-align: center !important;
    transition: background-color .2s ease, color .2s ease !important;
}

body:not(.home) .widget_price_filter .price_slider_amount .button:hover {
    background-color: #6b7280 !important;
    color: #111A51 !important;
}

/* PIKOTIN-PRICE-ALWAYS: el filtro de rango de precio siempre visible (nunca colapsado) */
body:not(.home) .wd-sidebar .wd-widget.widget_price_filter.wd-pk-collapsed > *, body:not(.home) .wd-sidebar .widget_price_filter.wd-pk-collapsed > * {
    display: block !important;
}

/* ocultar la flechita del acordeon en el filtro de precio (siempre abierto) */
body:not(.home) .wd-sidebar .widget_price_filter > .widget-title:after {
    display: none !important;
}

body:not(.home) .wd-sidebar .widget_price_filter > .widget-title {
    cursor: default !important;
}

/* PIKOTIN-PESO-CHIPS: chips de pesos disponibles en tarjetas de productos variables (catalogo, no home) */
body .pk-peso-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    justify-content: center;
    margin: 6px 0 2px;
}

body .pk-peso-chips .pk-chip {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    padding: 5px 9px;
    border-radius: 50px;
    background-color: #f0f0f0;
    color: #555555;
    border: 1px solid #e0e0e0;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease;
    user-select: none;
}

body .pk-peso-chips .pk-chip:hover {
    border-color: #111A51;
}

body .pk-peso-chips .pk-chip-active, body .pk-peso-chips .pk-chip-active:hover {
    background-color: #FFC030;
    color: #111A51;
    border-color: #FFC030;
}

body .pk-peso-chips .pk-chip-disabled, body .pk-peso-chips .pk-chip-disabled:hover {
    background-color: #eeeeee;
    color: #bbbbbb;
    border-color: #e6e6e6;
    cursor: not-allowed;
    text-decoration: line-through;
    opacity: .8;
}

/* PIKOTIN-HIDE-CATS: ocultar la categoria debajo del nombre en las tarjetas de producto (catalogo, no home) */
body .products .product .wd-product-cats {
    display: none !important;
}

/* PIKOTIN-PRICE-ALIGN: tarjeta compacta, precios alineados, nombre mas pequeno (catalogo, no home) */
body .products .product .wd-entities-title, body .products .product .wd-entities-title a {
    font-size: 15px !important;
    line-height: 20px !important;
}

body .products .product .price {
    font-weight: 600 !important;
    margin-top: 2px !important;
    margin-bottom: 4px !important;
    min-height: auto !important;
}

body .products .product .pk-peso-chips {
    min-height: 22px !important;
    margin-top: 2px !important;
    margin-bottom: 4px !important;
}

/* reservar el mismo espacio del area de chips en tarjetas SIN chips para alinear el boton */
body .products .product .product-element-bottom .price:not(:has(~ .pk-peso-chips)) {
    margin-bottom: 22px !important;
}

/* PIKOTIN-TITLE-LEFT: nombre del producto centrado (todas las lineas) (catalogo + home) */
body .products .product .wd-entities-title {
    margin-bottom: 2px !important;
    min-height: 36px !important;
    text-align: center !important;
}

body .products .product .wd-entities-title a {
    display: inline !important;
    text-align: center !important;
}

@media (max-width: 767px) {
    .wd-products.wd-carousel-container .wd-carousel {
        --wd-col-sm: 1 !important;
    }
    /* Carrusel productos mobile: flechas sobre las tarjetas, sin margen lateral */
    .wd-products.wd-carousel-container {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }
    .wd-products.wd-carousel-container .wd-carousel.wd-grid {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    .wd-products.wd-carousel-container .wd-carousel-item {
        width: 100% !important;
    }
    .wd-products.wd-carousel-container .wd-btn-arrow.wd-prev {
        left: 0 !important;
        right: auto !important;
    }
    .wd-products.wd-carousel-container .wd-btn-arrow.wd-next {
        right: 0 !important;
        left: auto !important;
    }
    .wd-products.wd-carousel-container .wd-btn-arrow {
        opacity: 1 !important;
        visibility: visible !important;
        z-index: 20 !important;
        background: transparent !important;
        box-shadow: none !important;
        border: none !important;
    }
    .wd-products.wd-carousel-container .wd-entities-title, .products .wd-entities-title {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }
    .products.wd-products.wd-grid-g {
        gap: 16px 12px !important;
        align-items: stretch !important;
    }
    .products .product-grid-item {
        padding-left: 5px !important;
        padding-right: 5px !important;
    }
    /* === Estilo tipo Superpet: alturas fijas para que precio y boton AGREGAR queden perfectamente alineados === */
    .products .product-grid-item .product-wrapper {
        display: flex !important;
        flex-direction: column !important;
        height: 100% !important;
    }
    /* Imagen: altura fija, imagen completa centrada (la holgura se absorbe aqui, no como hueco antes del boton) */
    .products .product-grid-item .product-element-top {
        height: 150px !important;
        flex: 0 0 auto !important;
    }
    .products .product-grid-item .product-element-top .product-image-link, .products .product-grid-item .product-element-top img {
        height: 150px !important;
        width: 100% !important;
        object-fit: contain !important;
    }
    /* Bloque inferior crece para empujar el boton al fondo */
    .products .product-grid-item .product-element-bottom {
        display: flex !important;
        flex-direction: column !important;
        flex: 1 1 auto !important;
    }
    /* Titulo: reserva fija de 2 lineas (igual en todas las tarjetas) */
    .wd-content-area .products .wd-entities-title {
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        height: 2.7em !important;
        min-height: 2.7em !important;
        line-height: 1.35 !important;
        word-break: normal !important;
        overflow-wrap: anywhere !important;
        font-size: 14px !important;
        margin-bottom: 6px !important;
    }
    /* Precio (incluye rango de dos precios) centrado */
    .products .wd-product .price {
        text-align: center !important;
        width: 100% !important;
        display: block !important;
    }
    /* Chips de peso: alto reservado para que las tarjetas sin chips alineen igual */
    .products .pk-peso-chips {
        justify-content: center !important;
        min-height: 28px !important;
        margin-top: 6px !important;
    }
    .products .pk-chip {
        transition: background-color .15s ease, color .15s ease;
    }
    .products .pk-chip:hover {
        background-color: #ffc030 !important;
        color: #111a51 !important;
        border-color: #ffc030 !important;
    }
}

/* === Ocultar vista rapida y lista de deseos en tarjetas de producto === */
.wd-product .wd-quick-view-icon, .wd-product .quick-view, .wd-product .wd-wishlist-btn, .wd-product .wd-wishlist-icon, .product-grid-item .wd-quick-view-icon, .product-grid-item .wd-wishlist-btn {
    display: none !important;
}

.woocommerce-breadcrumb a, .wd-breadcrumbs a, nav.breadcrumbs a, .load-more-label, .wd-load-more-btn, .cart-item-link, .woocommerce-mini-cart .woocommerce-Price-amount, .widget_shopping_cart .woocommerce-Price-amount {
    color: #111A51 !important;
}

/* === Boton 'Cargar mas productos': bordes redondeados y borde negro === */
.wd-products-load-more.btn, a.wd-load-more, .wd-loop-footer .wd-load-more {
    border-color: #000000 !important;
}

/* Refuerzo: variables del boton 'Cargar mas' para borde redondeado y negro */
.wd-products-load-more.btn, .wd-products-load-more.wd-load-more, a.wd-load-more.btn {
    --btn-brd-color: #000000;
    --btn-brd-width: 2px;
    border: 2px solid #000000 !important;
}

/* === Fix definitivo boton 'Cargar mas': mayor especificidad que el theme === */
.products-footer a.wd-load-more, .wd-loop-footer a.wd-load-more, .products-footer .wd-products-load-more.wd-load-more.btn, body .wd-products-load-more.btn.wd-load-more {
    --btn-brd-color: #000000 !important;
    --btn-brd-width: 2px !important;
    border: 2px solid #000000 !important;
}

@media (max-width: 767px) {
    /* Carrusel: flechas sobre la imagen, no el título */
    .wd-products-element .wd-nav-arrows .wd-btn-arrow {
        top: 75px;
    }
    /* ---------------------------------------------------------
   * 7. PRECIO en tarjetas de producto – Ajustar tamaño
   *    19px es un poco grande para cards en carrusel de 1 item.
   *    17px mantiene legibilidad con mejor balance visual.
   * --------------------------------------------------------- */
    .wd-carousel-item .wrap-price .price, .wd-carousel-item .price {
        font-size: 17px !important;
    }
}

/* Pikotin - Ocultar breadcrumb en tienda, categorias y busqueda */
body.woocommerce .wd-breadcrumbs, body.post-type-archive-product .wd-breadcrumbs, body.tax-product_cat .wd-breadcrumbs, body.search .wd-breadcrumbs, body.search-results .wd-breadcrumbs, body.woocommerce nav.woocommerce-breadcrumb, body.post-type-archive-product nav.woocommerce-breadcrumb, body.tax-product_cat nav.woocommerce-breadcrumb, body.search nav.woocommerce-breadcrumb, body.search-results nav.woocommerce-breadcrumb {
    display: none !important;
}

/* Pikotin - Ocultar chips de filtros activos en resultados de busqueda */
.wd-active-filters, .widget_layered_nav_filters {
    display: none !important;
}

/* Pikotin - Tamano del texto de resultados de busqueda */
.woocommerce-result-count, .woocommerce-result-count strong {
    font-size: 12px !important;
}

/* Pikotin - Quitar negrita del selector de ordenamiento en busqueda */
.woocommerce-ordering, .woocommerce-ordering select.orderby, .wd-dropdown-results {
    font-weight: 400 !important;
}

/* Pikotin - Tamano del selector de ordenamiento en busqueda */
.woocommerce-ordering select.orderby, .wd-dropdown-results {
    font-size: 14px !important;
}

/* Pikotin - Flecha del desplegable de ordenamiento en busqueda */
.woocommerce-ordering select.orderby {
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding-right: 22px !important;
    background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%3E%3C%2Fpolyline%3E%3C%2Fsvg%3E') !important;
    background-repeat: no-repeat !important;
    background-position: right center !important;
    background-size: auto 18px !important;
}

@media (hover: hover) and (pointer: fine) {
    .wd-product.product-grid-item {
        transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease, transform .15s ease !important;
    }
    .wd-product.product-grid-item:hover {
        border-color: #111A51 !important;
        background-color: rgba(17,26,81,0.03) !important;
        box-shadow: 0 0 0 1px rgba(17,26,81,0.35) !important;
        transform: translateY(-1px) !important;
        cursor: pointer;
    }
}

/* ===== LAYOUT DE CATALOGO, SIDEBAR DE FILTROS, TITULO DE PAGINA Y ETIQUETAS (migrado del Personalizador, 15 set 2026) =====
   16 reglas sueltas que estaban fuera de su area. Mismo orden, sin cambios. ===== */
/* === Ancho ampliado catalogo (tienda/categorias, NO home) === */
body.woocommerce-page:not(.home) .wd-content-layout, body.archive.woocommerce:not(.home) .wd-content-layout, body.post-type-archive-product:not(.home) .wd-content-layout, body.tax-product_cat:not(.home) .wd-content-layout {
    max-width: 1400px !important;
}
/* PIKOTIN-SIDEBAR: ancho fijo filtros ~250px (no home) */
body.woocommerce-page:not(.home) .wd-content-layout, body.archive.woocommerce:not(.home) .wd-content-layout, body.post-type-archive-product:not(.home) .wd-content-layout, body.tax-product_cat:not(.home) .wd-content-layout {
    grid-template-columns: 250px 1fr !important;
}
body.woocommerce-page:not(.home) .wd-content-layout .wd-sidebar.wd-grid-col, body.archive.woocommerce:not(.home) .wd-content-layout .wd-sidebar.wd-grid-col, body.post-type-archive-product:not(.home) .wd-content-layout .wd-sidebar.wd-grid-col, body.tax-product_cat:not(.home) .wd-content-layout .wd-sidebar.wd-grid-col {
    grid-column: auto / span 1 !important;
    width: 250px !important;
    max-width: 250px !important;
}
body.woocommerce-page:not(.home) .wd-content-layout .wd-content-area.wd-grid-col, body.archive.woocommerce:not(.home) .wd-content-layout .wd-content-area.wd-grid-col, body.post-type-archive-product:not(.home) .wd-content-layout .wd-content-area.wd-grid-col, body.tax-product_cat:not(.home) .wd-content-layout .wd-content-area.wd-grid-col {
    grid-column: auto / span 1 !important;
}
/* PIKOTIN-FILTER-STYLE: formato filtros estilo Gopet (no home) */
body.woocommerce-page:not(.home) .wd-sidebar .wd-widget, body.archive.woocommerce:not(.home) .wd-sidebar .wd-widget, body.post-type-archive-product:not(.home) .wd-sidebar .wd-widget, body.tax-product_cat:not(.home) .wd-sidebar .wd-widget {
    border-bottom: 1px solid #e6e6e6 !important;
    padding: 0 !important;
    margin: 0 !important;
}
body.woocommerce-page:not(.home) .wd-sidebar .wd-widget > .widget-title, body.archive.woocommerce:not(.home) .wd-sidebar .wd-widget > .widget-title, body.post-type-archive-product:not(.home) .wd-sidebar .wd-widget > .widget-title, body.tax-product_cat:not(.home) .wd-sidebar .wd-widget > .widget-title {
    color: #000000 !important;
    font-weight: 600 !important;
    text-transform: none !important;
    font-size: 16px !important;
    margin: 0 !important;
    padding: 16px 0 !important;
    cursor: pointer !important;
    position: relative !important;
    display: block !important;
}
/* flecha chevron a la derecha */
body.woocommerce-page:not(.home) .wd-sidebar .wd-widget > .widget-title, body.archive.woocommerce:not(.home) .wd-sidebar .wd-widget > .widget-title, body.post-type-archive-product:not(.home) .wd-sidebar .wd-widget > .widget-title, body.tax-product_cat:not(.home) .wd-sidebar .wd-widget > .widget-title {
    padding-right: 24px !important;
}
body.woocommerce-page:not(.home) .wd-sidebar .wd-widget > .widget-title::after, body.archive.woocommerce:not(.home) .wd-sidebar .wd-widget > .widget-title::after, body.post-type-archive-product:not(.home) .wd-sidebar .wd-widget > .widget-title::after, body.tax-product_cat:not(.home) .wd-sidebar .wd-widget > .widget-title::after {
    content: '' !important;
    position: absolute !important;
    right: 4px !important;
    top: 50% !important;
    width: 8px !important;
    height: 8px !important;
    border-right: 2px solid #000 !important;
    border-bottom: 2px solid #000 !important;
    transform: translateY(-70%) rotate(45deg) !important;
    transition: transform .2s ease !important;
}
/* estado colapsado: oculta el cuerpo del widget */
body.woocommerce-page:not(.home) .wd-sidebar .wd-widget.wd-pk-collapsed > *:not(.widget-title), body.archive.woocommerce:not(.home) .wd-sidebar .wd-widget.wd-pk-collapsed > *:not(.widget-title), body.post-type-archive-product:not(.home) .wd-sidebar .wd-widget.wd-pk-collapsed > *:not(.widget-title), body.tax-product_cat:not(.home) .wd-sidebar .wd-widget.wd-pk-collapsed > *:not(.widget-title) {
    display: none !important;
}
/* flecha apuntando arriba cuando esta abierto */
body.woocommerce-page:not(.home) .wd-sidebar .wd-widget:not(.wd-pk-collapsed) > .widget-title::after, body.archive.woocommerce:not(.home) .wd-sidebar .wd-widget:not(.wd-pk-collapsed) > .widget-title::after, body.post-type-archive-product:not(.home) .wd-sidebar .wd-widget:not(.wd-pk-collapsed) > .widget-title::after, body.tax-product_cat:not(.home) .wd-sidebar .wd-widget:not(.wd-pk-collapsed) > .widget-title::after {
    transform: translateY(-30%) rotate(225deg) !important;
}
/* espacio inferior del cuerpo del widget */
body.woocommerce-page:not(.home) .wd-sidebar .wd-widget > *:not(.widget-title), body.archive.woocommerce:not(.home) .wd-sidebar .wd-widget > *:not(.widget-title), body.post-type-archive-product:not(.home) .wd-sidebar .wd-widget > *:not(.widget-title), body.tax-product_cat:not(.home) .wd-sidebar .wd-widget > *:not(.widget-title) {
    margin-bottom: 14px !important;
}
/* PIKOTIN-FILTER-ALIGN: letra mas grande titulos (no home) */
body.woocommerce-page:not(.home) .wd-sidebar .wd-widget > .widget-title, body.archive.woocommerce:not(.home) .wd-sidebar .wd-widget > .widget-title, body.post-type-archive-product:not(.home) .wd-sidebar .wd-widget > .widget-title, body.tax-product_cat:not(.home) .wd-sidebar .wd-widget > .widget-title {
    font-size: 18px !important;
}

@media (max-width: 768px) {
    .product-labels {
        max-width: 70% !important;
    }
    .product-label {
        white-space: nowrap !important;
        word-break: normal !important;
        font-size: 13px !important;
        padding: 5px 10px !important;
        min-width: auto !important;
        line-height: 1.2 !important;
    }
}
/* === Badge de descuento: color rojo para mayor impacto y urgencia === */
.product-label.onsale {
    background-color: #E63946 !important;
    border-radius: 6px !important;
}
/* Pikotin - Ocultar titulo en tienda, categorias y busqueda */
body.woocommerce .wd-page-title, body.post-type-archive-product .wd-page-title, body.tax-product_cat .wd-page-title, body.search .wd-page-title, body.search-results .wd-page-title {
    display: none !important;
}


/* ############################################################
   BLOQUE PRODUCTO  (antes snippet WPCode 26364)
   ############################################################ */

/* ==========================================================
   PK · PRODUCTO · CSS
   Consolidado el 12 sep 2026. Reemplaza a los snippets: 24318, 24369, 24933, 25220, 26358, 26359, 26362
   Regla: todo el CSS de esta area va AQUI. No crear snippets sueltos.
   ========================================================== */

/* ---- #24318 · Pikotin - Ficha producto (sin Plin + WhatsApp secundario + Yape texto) ---- */
/* Tarea 4D: ocultar el icono de Plin (ultimo) de la imagen combinada de medios de pago */
img.wp-image-16102 {
    clip-path: inset(0 17.1% 0 0);
    width: 158px !important;
    max-width: none !important;
}

/* Tarea 6: boton WhatsApp como secundario (transparente, borde verde) debajo de Anadir al carrito */
.single-product div.product form.cart a.button.whatmsgd,
.single-product a.button.whatmsgd {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 1px solid #25976C !important;
    color: #25976C !important;
    text-transform: none !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    width: 100% !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 16px !important;
    margin-top: 10px;
}
.single-product a.button.whatmsgd:hover {
    background: #25976C !important;
    color: #fff !important;
}

/* Tarea 4E (ficha): texto 'Yape al instante' bajo los iconos de pago */
.pikotin-yape-line {
    text-align: center;
    color: #1E8E4E;
    font-size: 13px;
    font-weight: 700;
    margin-top: 8px;
}

/* Tarea 7: reemplazar texto del carrito bajo FINALIZAR COMPRA */
.wc-proceed-to-checkout::after {
    content: "Elige Delivery o Recojo en tienda en el siguiente paso. El delivery se calcula seg\00fan tu distrito (gratis desde S/90)." !important;
}

/* ===== Tarea 5: Drawer / mini-carrito lateral ===== */
/* 5B: jerarquia de botones - Finalizar arriba (primario azul), Ver carrito abajo (secundario) */
.cart-widget-side .woocommerce-mini-cart__buttons.buttons {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.cart-widget-side .woocommerce-mini-cart__buttons a.button.checkout {
    order: 1;
    background: #1C49C2 !important;
    background-color: #1C49C2 !important;
    color: #fff !important;
    width: 100%;
    border: none !important;
    font-weight: 700;
}
.cart-widget-side .woocommerce-mini-cart__buttons a.button.btn-cart {
    order: 2;
    background: transparent !important;
    background-color: transparent !important;
    color: #1C49C2 !important;
    border: 1px solid #1C49C2 !important;
    width: 100%;
    font-weight: 600;
}
/* 5D: subtotal navy negrita */
.cart-widget-side .woocommerce-mini-cart__total,
.cart-widget-side .woocommerce-mini-cart__total .amount {
    color: #111A51 !important;
    font-weight: 800 !important;
}
/* 5C: fila de confianza bajo los botones */
.pikotin-drawer-trust {
    text-align: center;
    margin-top: 10px;
    color: #5A5A5A;
    font-size: 12px;
    line-height: 1.5;
}
.pikotin-drawer-trust .pikotin-drawer-icons {
    font-weight: 600;
    letter-spacing: .5px;
    margin-bottom: 4px;
    color: #111A51;
}
/* 5E: link seguir comprando */
.pikotin-seguir {
    display: block;
    text-align: center;
    margin-top: 10px;
    color: #5A5A5A;
    font-size: 13px;
    text-decoration: none;
}

/* ---- #24369 · Pikotin - Rec 5 CSS bloque "Te puede interesar" ---- */
/* Pikotin - Rec 5: estilo del bloque "Te puede interesar" en el carrito */
.pikotin-cross-sells {
    margin-top: 40px;
    padding-top: 28px;
    border-top: 1px solid #e6e6e6;
    clear: both;
}
.pikotin-cross-sells .pikotin-cross-title {
    font-size: 22px;
    font-weight: 700;
    color: #1a2151;
    margin: 0 0 20px;
    text-align: left;
}
.pikotin-cross-sells .wd-products-element,
.pikotin-cross-sells ul.products {
    margin-bottom: 0;
}
.pikotin-cross-sells .button.add_to_cart_button {
	    white-space: nowrap;
	    padding-left: 10px;
	    padding-right: 10px;
	
}

/* ---- #24933 · Pikotin - Precio tachado centrado y más grueso ---- */
/* Pikotin - Precio tachado: centrado y mas grueso */

/* Quitar tachado nativo del DEL */
.price del,
.product-element-bottom .price del,
.summary .price del,
.woocommerce-variation-price del {
    text-decoration: none !important;
    position: relative;
    display: inline-block;
}

/* Raya centrada con top calculado */
.price del::after,
.product-element-bottom .price del::after,
.summary .price del::after,
.woocommerce-variation-price del::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 52%;
    transform: translateY(-50%);
    height: 2px;
    background-color: currentColor;
}
/* Pikotin - Badge de descuento: tamanio reducido */
span.onsale.product-label,
.product-labels .onsale {
    font-size: 13px !important;
    padding: 5px 10px !important;
    line-height: 1.3 !important;
}

/* Pikotin - Quantity + precio en carrito lateral: misma linea, tamanio reducido */

/* Cart-info: flex row para poner quantity y precio en la misma linea */
.woocommerce-mini-cart-item .cart-info,
.mini_cart_item .cart-info {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 6px 10px !important;
}

/* Titulo del producto: ocupa toda la linea */
.woocommerce-mini-cart-item .cart-info .wd-entities-title,
.mini_cart_item .cart-info .wd-entities-title {
    width: 100% !important;
    flex: 0 0 100% !important;
}

/* Quantity selector: bloque pegado mas pequeno */
.woocommerce-mini-cart-item .quantity,
.mini_cart_item .quantity {
    border: 1.5px solid rgba(0,0,0,0.18) !important;
    border-radius: 6px !important;
    overflow: hidden !important;
    gap: 0 !important;
    background: transparent !important;
    display: inline-flex !important;
    align-items: center !important;
    flex-shrink: 0;
}

/* Boton menos (-) */
.woocommerce-mini-cart-item .quantity input.minus,
.mini_cart_item .quantity input.minus {
    border: none !important;
    border-right: 1.5px solid rgba(0,0,0,0.18) !important;
    border-radius: 0 !important;
    background: #f2f2f2 !important;
    width: 24px !important;
    height: 24px !important;
    padding: 0 !important;
    font-size: 13px !important;
    cursor: pointer;
}

/* Input numero central */
.woocommerce-mini-cart-item .quantity input.qty,
.mini_cart_item .quantity input.qty {
    border: none !important;
    border-radius: 0 !important;
    background: #fff !important;
    width: 30px !important;
    height: 24px !important;
    text-align: center !important;
    font-size: 12px !important;
    padding: 0 !important;
}

/* Boton mas (+) */
.woocommerce-mini-cart-item .quantity input.plus,
.mini_cart_item .quantity input.plus {
    border: none !important;
    border-left: 1.5px solid rgba(0,0,0,0.18) !important;
    border-radius: 0 !important;
    background: #f2f2f2 !important;
    width: 24px !important;
    height: 24px !important;
    padding: 0 !important;
    font-size: 13px !important;
    cursor: pointer;
}

/* Precio al costado: misma altura que el quantity */
.woocommerce-mini-cart-item .cart-info > span.quantity,
.mini_cart_item .cart-info > span.quantity {
    font-size: 13px !important;
    line-height: 24px !important;
    margin: 0 !important;
}

/* ---- #25220 · Pikotin - Chips de peso centrados en tarjetas ---- */
/* Centrar chips de peso en tarjetas de producto */
body .wrap-price .pk-peso-chips {
  width: 100% !important;
  justify-content: center !important;
}

/* ---- #26358 · Pikotin - Carruseles de productos: tarjetas de igual altura ---- */
/* Empareja la altura de las tarjetas en los carruseles de productos.
   Aplica en celular Y en escritorio (14 set 2026, a pedido de Andre; antes
   estaba encerrado en @media max-width 768px y por eso en escritorio no valia).
   Sin esto, los productos con presentaciones (3Kg / 15Kg) quedan 49 px mas altos
   que los simples, porque llevan la fila de chips, y los botones AGREGAR no coinciden. */
.wd-carousel { align-items: stretch !important; }

.wd-carousel-item {
  display: flex !important;
  height: auto !important;
}

.wd-carousel-item > .wd-product {
  display: flex !important;
  flex-direction: column;
  width: 100%;
}

.wd-product > .wd-product-wrapper {
  display: flex !important;
  flex-direction: column;
  flex: 1 1 auto;
  height: 100%;
}

.wd-product .product-element-bottom {
  display: flex !important;
  flex-direction: column;
  flex: 1 1 auto;
}

.wd-product .product-element-bottom .wd-add-btn,
.wd-product .product-element-bottom > form,
.wd-product .product-element-bottom .wd-bottom-actions {
  margin-top: auto !important;
}

/* ---- #26359 · Pikotin - Celular: nombre de producto 14px y 3 lineas ---- */
/* Solo en celular: el nombre del producto baja a 14 px y puede ocupar
   3 lineas en vez de 2, para que no se corte el peso ni la presentacion.
   El selector va con .wd-products .wd-product h3 porque hay otra regla
   del sitio que fija 15 px con !important. */
@media (max-width: 768px) {
  body .wd-products .wd-product h3.wd-entities-title,
  body .wd-products .wd-product h3.wd-entities-title a {
    font-size: 14px !important;
    line-height: 19px !important;
  }

  body .wd-products .wd-product h3.wd-entities-title {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
    line-clamp: 3 !important;
    height: auto !important;
    max-height: none !important;
    min-height: 57px !important;
    overflow: hidden !important;
  }
}

/* ---- #26362 · Pikotin - Ficha de producto: mostrar ruta (breadcrumb) corta ---- */
/* Pikotin - Ficha de producto: mostrar la ruta (breadcrumb)
   Personalizar > CSS adicional oculta el breadcrumb con body.woocommerce,
   clase que tambien lleva la ficha de producto. Aqui se vuelve a mostrar
   SOLO en la ficha de producto, en version corta:
   Inicio / Categoria madre / Categoria final  (sin el nombre del producto) */

html body.single-product .wd-breadcrumbs,
html body.single-product nav.woocommerce-breadcrumb {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  font-size: 13px;
  line-height: 1.4;
  padding: 6px 0 2px;
}

/* deja solo los 3 primeros niveles visibles */
html body.single-product .wd-breadcrumbs > *:nth-child(n+5) { display: none !important; }

/* vuelve a mostrar la categoria final (la de mas abajo) */
html body.single-product .wd-breadcrumbs > *:nth-last-child(3) { display: inline-block !important; }

/* quita el separador que queda suelto antes del nombre del producto */
html body.single-product .wd-breadcrumbs > *:nth-last-child(2) { display: none !important; }

/* oculta el nombre del producto (ya esta como titulo abajo) */
html body.single-product .wd-breadcrumbs > .wd-last { display: none !important; }

/* ---- 12 sep 2026 · Ficha: quitar el badge de descuento sobre la foto ----
   El porcentaje y el ahorro ahora van junto al precio (ver "PK · PRODUCTO · PHP").
   El badge se mantiene en listados y carruseles, que es donde sirve. */
html body.single-product .product-image-summary .product-labels,
html body.single-product .woocommerce-product-gallery .product-labels { display: none !important; }

/* ---- 12 sep 2026 · Ficha: bloque de ahorro junto al precio ---- */
.pk-ahorro { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 2px 0 14px; line-height: 1.2; }
.pk-ahorro:empty { display: none; }
.pk-ahorro .pk-ahorro-pct { background: #e02b2b; color: #fff; font-weight: 700; font-size: 13px; padding: 3px 8px; border-radius: 4px; }
.pk-ahorro .pk-ahorro-txt { color: #1b6b45; font-weight: 600; font-size: 14px; }
.pk-ahorro .pk-ahorro-txt .woocommerce-Price-amount { color: inherit; font-weight: 700; }

/* ===== FICHA DE PRODUCTO (migrado del Personalizador, 15 set 2026) =====
   50 reglas que vivian en el Personalizador. Se quitaron los !important:
   al cargar desde aqui ya van despues del tema. Si alguna se pierde,
   se le devuelve el !important SOLO a esa linea y se anota por que.
   Se fusionaron las dos reglas repetidas de .wd-after-add-to-cart.
   DEUDA: el stock "Disponible/Agotado" se pinta con CSS (font-size:0 + ::after).
   Deberia ser texto real desde PHP; queda anotado para cuando toquemos PRODUCTO · PHP. ===== */

/* === Ocultar logo de marca en fichas de producto === */
.single-product .wd-product-brands { display: none !important; }

/* === Ancho de fichas de producto a 1400px (como SuperPet) === */
.single-product .container { max-width: 1400px; }

/* === Breadcrumb arriba, ancho completo, izquierda y letra pequena === */
.single-product .product-image-summary-inner { position: relative; padding-top: 40px; }
.single-product .summary .single-breadcrumbs-wrapper { position: absolute; top: 0; left: 0; right: 0; width: 100%; margin: 0; }
.single-product .wd-breadcrumbs.woocommerce-breadcrumb {  justify-content: flex-start; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* === Reducir tamano del titulo del producto === */
.single-product .product_title { font-size: 24px; line-height: 1.3; }

/* === Descripcion corta: tamano, interlineado y reparto de lineas === */
.single-product .woocommerce-product-details__short-description, .single-product .woocommerce-product-details__short-description li, .single-product .woocommerce-product-details__short-description p { font-size: 14px; line-height: 1.6; text-align: left; text-wrap: pretty; overflow-wrap: break-word; word-break: normal; }
.single-product .woocommerce-product-details__short-description li { margin-bottom: 8px; }

/* === Precio en azul navy de la marca === */
.single-product .summary .price, .single-product .summary .price ins, .single-product .summary .price .woocommerce-Price-amount { color: #111A51; }

/* === Boton anadir al carrito: navy con hover mostaza === */
.single-product .single_add_to_cart_button.button { background-color: #111A51; border-color: #111A51; color: #fff; transition: background-color .2s ease, color .2s ease; }
.single-product .single_add_to_cart_button.button:hover, .single-product .single_add_to_cart_button.button:focus { background-color: #F9BB28; border-color: #F9BB28; color: #111A51; }

/* === Ocultar boton de WhatsApp en ficha de producto === */
.single-product .summary a.whatmsgd { display: none !important; }

/* === Ocultar WhatsApp (mayor especificidad) === */
.single-product div.product form.cart a.button.whatmsgd, .single-product .summary a.button.whatmsgd { display: none !important; }

/* ===== PIKOTIN PRODUCT TWEAKS - Claude ===== */
/* Selector de cantidad mas grande y estetico */
.single-product div.product form.cart {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: nowrap;
}
.product .quantity,
.single-product div.product form.cart .quantity {
  width: 130px;
  height: 38px;
  flex: 0 0 130px;
  display: flex;
  align-items: stretch;
  border: 1px solid rgba(0,0,0,0.15);
  border-radius: 6px;
  overflow: hidden;
}
.product .quantity .minus,
.product .quantity .plus {
  width: 38px;
  height: 100%;
  font-size: 18px;
  line-height: 1;
  border: none;
  background: #f5f5f5;
  color: #111a51;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.product .quantity .minus:hover,
.product .quantity .plus:hover {
  background: #ececec;
}
.product .quantity input.qty {
  width: 54px !important;
  height: 100% !important;
  font-size: 16px !important;
  text-align: center !important;
  border: none !important;
  border-left: 1px solid rgba(0,0,0,0.12) !important;
  border-right: 1px solid rgba(0,0,0,0.12) !important;
  background: #fff !important;
  -moz-appearance: textfield !important;
}
.product .quantity input.qty::-webkit-outer-spin-button,
.product .quantity input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}
/* Boton anadir al carrito ocupa el ancho restante */
.single-product div.product form.cart .single_add_to_cart_button {
  flex: 1 1 auto !important;
  height: 45px !important;
  padding: 0 30px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Ocultar Anadir a la lista de deseos y Condiciones de envio */
.summary .wd-wishlist-btn { display: none !important; }
.wd-button-wrapper a.wd-open-popup { display: none !important; }

/* Reordenar columna del resumen: boton -> linea -> pago -> SKU */
.summary-inner.wd-set-mb {
  display: flex;
  flex-direction: column;
}
.summary-inner.wd-set-mb > * { order: 0; }
.summary-inner.wd-set-mb > form.cart { order: 1; }
.summary-inner.wd-set-mb > .wd-after-add-to-cart {
    order: 2;
    border-top: 0.8px solid rgba(0,0,0,0.12);
    padding-top: 18px;
    margin-top: 18px;
}
.summary-inner.wd-set-mb > .product_meta { order: 3; border-top: none; padding-top: 0; margin-top: 0; }

/* Recuadro de medios de pago: gris, 500px, centrado, achicado */
.elementor-element-ab86a3c {
  width: 100%;
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
  background: #ececec;
  padding: 8px 16px;
  border-radius: 8px;
  margin-top: 0;
  position: relative;
}
/* Linea separadora a TODO el ancho de la columna (en el contenedor) */
.elementor-element-ab86a3c::before { display: none !important; content: none; }
/* (regla duplicada del mismo selector, fusionada arriba) */
/* Ocultar el titulo grande del recuadro */
.elementor-element-ab86a3c .elementor-element-7cd9919 { display: none !important; }
/* Logos + texto Yape en una sola fila centrada */
.elementor-element-ab86a3c .elementor-element-7125649 .elementor-widget-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: nowrap;
}
.elementor-element-ab86a3c .elementor-element-7125649 img {
  width: 130px;
  height: auto;
  margin: 0;
  flex: 0 0 auto;
}
.elementor-element-ab86a3c .pikotin-yape-line {
  font-size: 13px;
  margin: 0;
  white-space: nowrap;
}

/* Ocultar categoria y SKU discreto */
.product_meta .posted_in { display: none !important; }
.product_meta .sku_wrapper {  color: #888; }
.product_meta .sku_wrapper .sku { color: #888; }
/* ===== FIN PIKOTIN PRODUCT TWEAKS ===== */


/* ===== PIKOTIN VARIABLE & STOCK - Claude ===== */
/* Stock: mostrar solo Disponible / Agotado (sin numero) */
.single-product .product .stock { font-size: 0; }
.single-product .product .stock::before { font-size: 16px; }
.single-product .product .stock::after { font-size: 16px; font-weight: 600; }
.single-product .product .stock.in-stock::after { content: "Disponible"; }
.single-product .product .stock.out-of-stock::after { content: "Agotado"; }

/* Productos variables: ordenar layout (selector de peso arriba, boton ancho) */
.single-product div.product form.variations_form.cart { display: block; }
.single-product div.product form.variations_form.cart .variations {
  display: block;
  width: 100%;
  margin-bottom: 14px;
}
.single-product div.product form.variations_form.cart .single_variation_wrap {
  display: block;
  width: 100%;
}
.single-product div.product form.cart .woocommerce-variation-add-to-cart {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: nowrap;
  width: 100%;
}
.single-product div.product form.cart .woocommerce-variation-add-to-cart .single_add_to_cart_button {
  flex: 1 1 auto !important;
  height: 45px !important;
  padding: 0 30px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.single-product div.product form.cart .single_variation { margin-bottom: 8px; }

/* Contador oculto (stock = 1): no mostrar caja vacia */
.single-product div.product form.cart .quantity.hidden { display: none !important; }

/* Ocultar etiqueta del producto (igual que la categoria) */
.product_meta .tagged_as { display: none !important; }

/* Nota 15 set 2026: estas tres reglas necesitaron conservar el !important —
   sin el, Woodmart recupera la altura del campo de cantidad y el ancho del boton.
   Las demas 47 reglas de la ficha funcionan sin el. */

/* Nota 15 set 2026: las reglas que OCULTAN elementos de la ficha (WhatsApp, lista de deseos,
   marca, categoria, etiqueta) tambien necesitan !important: sin el, Woodmart los vuelve a mostrar
   y el boton de comprar pierde su ancho. */

/* ===== LAYOUT DE FICHA Y SWATCHES (migrado del Personalizador, 15 set 2026) =====
   3 reglas sueltas que estaban fuera de su area. Mismo orden, sin cambios. ===== */
/* PIKOTIN-PRODUCT-CENTER: centrar el contenido en paginas de producto individual (no home) */
body.single-product .wd-content-layout.content-layout-wrapper {
    margin-left: auto !important;
    margin-right: auto !important;
}
/* === Botones de peso (swatches) redondeados === */
.wd-swatch.wd-text {
    border-radius: 8px !important;
    border: 1.3px solid rgba(0, 0, 0, 0.35) !important;
    padding: 2px 4px !important;
}
.wd-swatch.wd-text.wd-active {
    border-radius: 8px !important;
    border: 1.3px solid rgb(36, 36, 36) !important;
}


/* ############################################################
   BLOQUE CARRITO  (antes snippet WPCode 24323)
   ############################################################ */

/* ===== PK · CARRITO · CSS ===== 
   Fusion 15 set 2026: une los antiguos 24323 (botones y resumen del drawer)
   y 24325 (override amarillo del boton FINALIZAR).
   Los dos quedan apagados, no borrados. Respaldo: wpcode-respaldo-98-snippets-2026-09-15.json
   Regla: todo CSS del carrito/drawer va AQUI, no en el Personalizador. ===== */

/* Pikotin - Drawer: botones redondeados + FINALIZAR COMPRA amarillo + descuento */
.cart-widget-side .woocommerce-mini-cart__buttons a.button,
.cart-widget-side .woocommerce-mini-cart__buttons a.checkout,
.cart-widget-side .woocommerce-mini-cart__buttons a.btn-cart {
    border-radius: 10px !important;
}
.cart-widget-side .woocommerce-mini-cart__buttons a.checkout {
    background-color: #F9BB28 !important;
    background-image: none !important;
    border: 1px solid #F9BB28 !important;
    color: #111111 !important;
    transition: background-color .2s ease, border-color .2s ease;
}
.cart-widget-side .woocommerce-mini-cart__buttons a.checkout:hover,
.cart-widget-side .woocommerce-mini-cart__buttons a.checkout:focus {
    background-color: #E0A91E !important;
    border-color: #E0A91E !important;
    color: #111111 !important;
}
.cart-widget-side .pk-drawer-was {
    display: block; font-size: 12px; color: #5A5A5A; margin: 2px 0 1px; line-height: 1.3;
}
.cart-widget-side .pk-drawer-was del { color: #9A9A9A; text-decoration: line-through; margin-right: 4px; }
.cart-widget-side .pk-drawer-was del .amount { color: #9A9A9A; }
.cart-widget-side .pk-drawer-discount-badge {
    display: inline-block; background: #E53935; color: #fff; font-size: 9px; font-weight: 700;
    line-height: 1; padding: 1px 4px; border-radius: 6px; vertical-align: middle;
}
/* Ahorro total en el drawer */
.cart-widget-side .pk-drawer-total-saving {
    margin: 6px 0 4px;
    font-size: 12px;
    color: #2e7d32;
    text-align: center;
    background: #f1faf3;
    border-radius: 6px;
    padding: 5px 8px;
}
.cart-widget-side .pk-drawer-total-saving strong {
    color: #1b5e20;
}


/* === Layout carrito: precio + tachado en misma fila, contador debajo === */

/* cart-info: flex ROW - alta especificidad con html body */
html body .cart-widget-side .woocommerce-mini-cart-item .cart-info,
html body .cart-widget-side .mini_cart_item .cart-info {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 0 !important;
    column-gap: 5px !important;
    row-gap: 3px !important;
}

/* Titulo: fila completa */
html body .cart-widget-side .woocommerce-mini-cart-item .cart-info .wd-entities-title,
html body .cart-widget-side .mini_cart_item .cart-info .wd-entities-title {
    width: 100% !important;
    order: 1 !important;
    margin-bottom: 1px !important;
}

/* Precio actual: order 2 */
html body .cart-widget-side .woocommerce-mini-cart-item .cart-info > span.quantity,
html body .cart-widget-side .mini_cart_item .cart-info > span.quantity {
    order: 2 !important;
    flex: 0 0 auto !important;
    border: none !important;
    outline: none !important;
    padding: 0 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    color: #999999 !important;
    display: inline-flex !important;
    align-items: center !important;
}

/* Monto del precio */
html body .cart-widget-side .woocommerce-mini-cart-item .cart-info > span.quantity .woocommerce-Price-amount,
html body .cart-widget-side .mini_cart_item .cart-info > span.quantity .woocommerce-Price-amount {
    color: #111a51 !important;
    font-weight: 700 !important;
}

/* pk-drawer-was: al costado del precio (order 3) */
html body .cart-widget-side .pk-drawer-was {
    order: 3 !important;
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
    margin: 0 !important;
    font-size: 0 !important;
    line-height: 1 !important;
}

/* Precio tachado */
html body .cart-widget-side .pk-drawer-was del {
    font-size: 11px !important;
    color: #9A9A9A !important;
    text-decoration: line-through !important;
}
html body .cart-widget-side .pk-drawer-was del .amount {
    font-size: 11px !important;
    color: #9A9A9A !important;
}

/* Badge */
html body .cart-widget-side .pk-drawer-discount-badge {
    font-size: 9px !important;
    display: inline-block !important;
    background: #E53935 !important;
    color: #fff !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    padding: 2px 4px !important;
    border-radius: 6px !important;
}

/* Salto de linea antes del contador usando ::after */
html body .cart-widget-side .woocommerce-mini-cart-item .cart-info::after,
html body .cart-widget-side .mini_cart_item .cart-info::after {
    content: "" !important;
    display: block !important;
    flex-basis: 100% !important;
    height: 0 !important;
    order: 4 !important;
}

/* Contador: ancho natural, debajo de la fila de precios */
html body .cart-widget-side .woocommerce-mini-cart-item .cart-info div.quantity,
html body .cart-widget-side .mini_cart_item .cart-info div.quantity {
    order: 5 !important;
    flex: 0 0 auto !important;
    margin-top: 2px !important;
}


/* Botón eliminar: ícono de tachito en lugar de X */
html body .cart-widget-side .woocommerce-mini-cart-item a.remove_from_cart_button::after,
html body .cart-widget-side .mini_cart_item a.remove_from_cart_button::after {
    content: "\f182" !important;
    font-family: dashicons !important;
    font-size: 14px !important;
    color: #111111 !important;
    display: inline-block !important;
}

html body .cart-widget-side .woocommerce-mini-cart-item a.remove_from_cart_button:hover::after,
html body .cart-widget-side .mini_cart_item a.remove_from_cart_button:hover::after {
    color: #E53935 !important;
}

/* Remover el ::before que agregamos antes */
html body .cart-widget-side .woocommerce-mini-cart-item a.remove_from_cart_button::before,
html body .cart-widget-side .mini_cart_item a.remove_from_cart_button::before {
    content: none !important;
    display: none !important;
}

/* Restaurar posicionamiento absoluto de Woodmart */
html body .cart-widget-side .woocommerce-mini-cart-item a.remove_from_cart_button,
html body .cart-widget-side .mini_cart_item a.remove_from_cart_button {
    position: absolute !important;
    display: block !important;
    font-size: 0 !important;
    color: transparent !important;
    width: 20px !important;
    height: 20px !important;
}

/* ===== DRAWER: Bloque Subtotal / Descuentos / Total ===== */
.cart-widget-side .pk-drawer-summary-block {
    margin: 8px 15px 10px 15px;
    padding: 0;
}

.cart-widget-side .pk-summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 0;
    font-size: 14px;
    color: #333;
}

.cart-widget-side .pk-summary-label {
    font-weight: 400;
}

.cart-widget-side .pk-summary-value {
    font-weight: 600;
}

/* Descuentos: valor en rojo */
.cart-widget-side .pk-desc-value {
    color: #E53935 !important;
}

/* TOTAL: caja verde */
.cart-widget-side .pk-summary-total.pk-has-discount {
    background: none;
    border: none;
    border-radius: 0;
    padding: 5px 0;
    margin-top: 0;
    font-size: 15px;
}

.cart-widget-side .pk-summary-total.pk-has-discount .pk-summary-label {
    font-weight: 700;
    color: #111111;
}

.cart-widget-side .pk-summary-total.pk-has-discount .pk-summary-value {
    font-weight: 700;
    color: #111111;
    font-size: 16px;
}

/* TOTAL sin descuento: estilo normal tipo subtotal */
.cart-widget-side .pk-summary-total:not(.pk-has-discount) .pk-summary-label {
    font-weight: 700;
}

.cart-widget-side .pk-summary-total:not(.pk-has-discount) .pk-summary-value {
    font-weight: 700;
}

/* Ocultar elementos originales reemplazados por pk-drawer-summary-block */
.cart-widget-side .pk-drawer-total-saving,
.cart-widget-side .shopping-cart-widget-footer > strong,
.cart-widget-side .shopping-cart-widget-footer > span.woocommerce-Price-amount {
    display: none !important;
}

/* ===== DRAWER: Ocultar elementos debajo de FINALIZAR COMPRA ===== */
/* Ocultar VER CARRITO */
.cart-widget-side .woocommerce-mini-cart__buttons a.btn-cart {
    display: none !important;
}

/* Ocultar barra de progreso de envío gratis */
.cart-widget-side .wd-progress-bar {
    display: none !important;
}

/* Ocultar bloque de confianza (envío gratis desde S/90) */
.cart-widget-side .pikotin-drawer-trust {
    display: none !important;
}

/* Ocultar link Seguir comprando */
.cart-widget-side .pikotin-seguir {
    display: none !important;
}

/* Texto de envío debajo de FINALIZAR COMPRA */
.cart-widget-side .pk-shipping-note {
    display: block;
    text-align: center;
    font-size: 11px;
    color: #999;
    margin-top: 6px;
    margin-bottom: 4px;
}
/* Ancho del drawer: 440px */
.cart-widget-side {
    width: 440px !important;
}

/* Ocultar texto "Cerrar" del drawer — solo la X */
.cart-widget-side .close-side-widget a,
.wd-side-hidden .close-side-widget a {
    font-size: 0 !important;
    color: transparent !important;
}
.cart-widget-side .close-side-widget a::before,
.wd-side-hidden .close-side-widget a::before {
    font-size: 16px !important;
    color: #333 !important;
}


/* ===== Pikotin - Barra de envío gratis ===== */
.pk-free-shipping-bar {
  padding: 10px 15px 8px;
  background: #fff;
  border-bottom: 1px solid #f0f0f0;
}
.pk-free-shipping-bar .pk-fsb-message {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  color: #333;
  margin-bottom: 7px;
  font-weight: 500;
}
.pk-free-shipping-bar .pk-fsb-icon {
  font-size: 17px;
  flex-shrink: 0;
}
.pk-free-shipping-bar .pk-fsb-amount {
  color: #111A51;
  font-weight: 700;
  font-size: 15px;
}
.pk-free-shipping-bar .pk-fsb-track {
  height: 11px;
  background: #e0e0e0;
  border-radius: 10px;
  overflow: hidden;
}
.pk-free-shipping-bar .pk-fsb-fill {
  height: 100%;
  background: #F9BB28;
  border-radius: 10px;
  transition: width 0.5s ease;
  min-width: 3px;
}
.pk-free-shipping-bar.pk-fsb-complete .pk-fsb-message {
  color: #1a7c3e;
  font-weight: 600;
}

/* ----- Bloque 2: override de especificidad que venia del snippet 24325 (15 set 2026) ----- */
/* Pikotin - Override: boton FINALIZAR COMPRA del drawer en amarillo */
html body .cart-widget-side .woocommerce-mini-cart__buttons a.button.checkout {
    background-color: #F9BB28 !important;
    background-image: none !important;
    border: 1px solid #F9BB28 !important;
    color: #111111 !important;
    border-radius: 10px !important;
    transition: background-color .2s ease, border-color .2s ease;
}
html body .cart-widget-side .woocommerce-mini-cart__buttons a.button.checkout:hover,
html body .cart-widget-side .woocommerce-mini-cart__buttons a.button.checkout:focus {
    background-color: #E0A91E !important;
    border-color: #E0A91E !important;
    color: #111111 !important;
}
html body .cart-widget-side .woocommerce-mini-cart__buttons a.button.btn-cart {
    border-radius: 10px !important;
}

/* ===== CABECERA Y BARRA DE ENVIO DEL DRAWER (migrado del Personalizador, 15 set 2026) =====
   Venia de 12 bloques del Personalizador, de los cuales la cabecera estaba escrita
   DOS veces (una version quedaba muerta salvo por justify-content). Aqui va una sola vez,
   con los valores que de verdad se aplicaban, y sin !important: al vivir en este snippet
   ya carga despues del tema y no los necesita.
   Si algo vuelve al estilo de Woodmart, el !important se agrega solo a esa linea. ===== */
.cart-widget-side.wd-side-hidden {
    width: min(85vw, 440px);
}
.cart-widget-side .wd-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    padding: 6px 0 6px 12px;
    min-height: unset;
}
.cart-widget-side .wd-heading .title {
    font-size: 13px;
    font-weight: 600;
}
.cart-widget-side .wd-heading .close-side-widget {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    padding: 0 8px;
    font-size: 13px;
}
.cart-widget-side .wd-heading .close-side-widget a,
.cart-widget-side .wd-heading .close-side-widget a::before {
    /* el !important si hace falta: otra regla del Personalizador pone 0 y esconde la palabra "Cerrar" */
    font-size: 13px !important;
}
.cart-widget-side .wd-heading .wd-cross-icon::before,
.cart-widget-side .wd-heading .wd-cross-icon::after {
    width: 13px;
    height: 1.5px;
}
.cart-widget-side .pk-fsb-message {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 6px;
    font-size: 15px;
}
.cart-widget-side .pk-fsb-message span,
.cart-widget-side .pk-fsb-message strong {
    font-size: 15px;
}

/* ===== PAGINA DEL CARRITO: ANCHO DEL FORMULARIO Y DEL RESUMEN (migrado del Personalizador, 15 set 2026) =====
   2 reglas sueltas que estaban fuera de su area. Mismo orden, sin cambios. ===== */
.cart-content-wrapper > .woocommerce-cart-form {
    flex: 1 1 0 !important;
    min-width: 0 !important;
}
.cart-content-wrapper > .cart_totals {
    flex: 0 0 360px !important;
    max-width: 360px !important;
}
