/*
Theme Name: MundoSteam
Theme URI: https://mundosteam.shop/
Author: MundoSteam
Author URI: https://mundosteam.shop/
Description: MundoSteam theme - Rediseño de Mi Cuenta, login, registro y dashboard.
Version: 6.2.0
Requires at least: 5.0
Tested up to: 6.7
Requires PHP: 7.4
License: MIT License
License URI: https://github.com/bootscore/bootscore/blob/main/LICENSE
Text Domain: bootscore
Tags: featured-images, threaded-comments, translation-ready

Use this theme to make something cool, have fun, and share what you've learned with others.

MundoSteam theme is based on Underscores https://underscores.me/, (C) 2012-2024 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
*/

/* 
All style editing is done via /assets/scss/_bootscore-custom.scss
*/


:root{
    --color: #304FFE;
    --bs-wc-price-sale: var(--color);
    --bs-link-color-rgb: 48,79,254;
    --color-primary-light: #03A9F4;
    --color-button-hover: #6200EA;
    --color-very-light: #b7b7b7;
    --color-light: #a8a8a8;
    --color-medium-light: #6d6d6d;
    --color-medium: #3d3d3d;
    --color-medium-dark: #323232;
    --color-dark: #272727;
    --color-very-dark: #1d1d1d;
    --color-ultra-dark: #101010;
    --fire-gradient: linear-gradient(10deg, var(--color-primary-light), transparent) var(--color);
    --fire-gradient-hover: linear-gradient(190deg, #ff2020, #ff8000);
}

:root {
    --joinchat-ico: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M3.516 3.516c4.686-4.686 12.284-4.686 16.97 0s4.686 12.283 0 16.97a12 12 0 0 1-13.754 2.299l-5.814.735a.392.392 0 0 1-.438-.44l.748-5.788A12 12 0 0 1 3.517 3.517zm3.61 17.043.3.158a9.85 9.85 0 0 0 11.534-1.758c3.843-3.843 3.843-10.074 0-13.918s-10.075-3.843-13.918 0a9.85 9.85 0 0 0-1.747 11.554l.16.303-.51 3.942a.196.196 0 0 0 .219.22zm6.534-7.003-.933 1.164a9.84 9.84 0 0 1-3.497-3.495l1.166-.933a.79.79 0 0 0 .23-.94L9.561 6.96a.79.79 0 0 0-.924-.445l-2.023.524a.797.797 0 0 0-.588.88 11.754 11.754 0 0 0 10.005 10.005.797.797 0 0 0 .88-.587l.525-2.023a.79.79 0 0 0-.445-.923L14.6 13.327a.79.79 0 0 0-.94.23z'/%3E%3C/svg%3E");
    --joinchat-font: -apple-system,blinkmacsystemfont,"Segoe UI",roboto,oxygen-sans,ubuntu,cantarell,"Helvetica Neue",sans-serif;
}



body {
    font-family: "Barlow", sans-serif;
    font-optical-sizing: auto;
    background: var(--color-dark);
    color: #fff;
    word-break: normal
}

a{
    text-decoration: none;
}

/* Logo */
.site-branding img{
    width: 150px;
    transition: all .3s ease;
}
.site-branding:hover img {
    filter: brightness(1.15);
    transform: scale(1.04);
}

/* Header bottom glow line - uses border, full width guaranteed */
#masthead {
    border-bottom: 1px solid transparent;
    transition: border-color .3s ease;
}
.to-fixed#masthead,
#masthead.to-fixed,
.to-fixed #masthead {
    border-bottom-color: rgba(14,165,233,.2);
}

/* Header action buttons */
.header-actions .btn {
    border: 0;
    color: #fff;
    transition: all .25s ease;
    border-radius: 12px;
}
.header-actions .btn:hover {
    color: #38bdf8;
    background: rgba(14,165,233,.1);
}
.header-actions .btn:focus {
    box-shadow: none;
}
/* Account button */
.header-actions .account-toggler {
    display: flex;
    align-items: center;
    justify-content: center;
}
.header-actions .account-toggler svg,
.header-actions .account-toggler i {
    color: #fff;
    transition: color .25s ease;
}
.header-actions .account-toggler:hover svg,
.header-actions .account-toggler:hover i {
    color: #38bdf8;
}
/* Search toggler hover */
.header-actions .cont-search-toggler:hover .dgwt-wcas-ico-magnifier path {
    fill: #38bdf8;
}
/* Hide search input bg ONLY in collapsed icon mode (not when expanded/active) */
.dgwt-wcas-layout-icon:not(.dgwt-wcas-active):not(.dgwt-wcas-search-focused) .dgwt-wcas-search-input {
    background: transparent;
    border: none;
    box-shadow: none;
}
/* Expanded/active search bar styling */
.dgwt-wcas-active .dgwt-wcas-search-input,
.dgwt-wcas-search-focused .dgwt-wcas-search-input,
.dgwt-wcas-search-wrapp:not(.dgwt-wcas-layout-icon) .dgwt-wcas-search-input,
.dgwt-wcas-layout-icon-open .dgwt-wcas-search-input {
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%) !important;
    border: 1.5px solid rgba(56,189,248,.3) !important;
    box-shadow: 0 0 20px rgba(14,165,233,.1), 0 8px 32px rgba(0,0,0,.4) !important;
    border-radius: 16px !important;
    color: #fff !important;
}
.dgwt-wcas-search-input::placeholder {
    color: rgba(255,255,255,.35);
}
.dgwt-wcas-search-input:focus {
    outline: none;
    border-color: rgba(56,189,248,.5);
    box-shadow: 0 0 20px rgba(14,165,233,.15), 0 8px 32px rgba(0,0,0,.3);
}
/* Search icon colors */
.dgwt-wcas-layout-icon .dgwt-wcas-ico-magnifier path,
.js-dgwt-wcas-layout-icon .dgwt-wcas-ico-magnifier path {
    fill: #fff;
    transition: fill .25s ease;
}
.cont-search-toggler:hover .dgwt-wcas-ico-magnifier path,
.dgwt-wcas-layout-icon:hover .dgwt-wcas-ico-magnifier path {
    fill: #38bdf8;
}
/* Search suggestions dropdown */
.dgwt-wcas-suggestions-wrapp {
    background: rgba(13,17,35,.97) !important;
    border: 1px solid rgba(56,189,248,.12) !important;
    border-radius: 12px !important;
    backdrop-filter: blur(20px) !important;
    box-shadow: 0 12px 40px rgba(0,0,0,.4) !important;
    overflow: hidden !important;
}

/* Smoother scroll blur */
.to-fixed .filtro-blur  {
    backdrop-filter: blur(60px) saturate(100%);
    -webkit-backdrop-filter: blur(60px) saturate(100%);
    background-color: rgba(0,0,0,.55);
    content: "";
    height: 100%;
    left: 0;
    opacity: 1;
    position: absolute;
    top: -1px;
    transition: .3s ease;
    visibility: visible;
    width: 100%;
    z-index: 0
}

/* 25/09/2026: los :not() van encadenados y no en lista (:not(.a, .b)). Chrome/WebView menor a 88 y
   Samsung Internet menor a 15 no entienden la lista y tiran la regla ENTERA, #masthead > nav incluido:
   el nav quedaba con z-index auto debajo del velo .filtro-blur y el logo y los iconos del header se
   veian apagados arriba y desaparecian al bajar. Mismo efecto en los navegadores de hoy (la especificidad
   sube de (1,1,1) a (1,2,1), pero los hijos que llevan otro z-index lo reciben con !important
   (.menu-mobile) o con #page #masthead > .offcanvas (2,1,0), asi que no cambia ningun valor). */
#masthead > nav, #masthead > div:not(.filtro-blur):not(.offcanvas-backdrop){
    z-index: 1001
}

/* 25/09/2026: header fijo en iOS 12 o menos (iPhone 5s/6/6 Plus). Ese Safari solo conoce
   position:-webkit-sticky; con el sticky de Bootstrap (.sticky-top, sin prefijo) el #masthead quedaba
   static y el velo .filtro-blur tomaba el alto de la pantalla, oscureciendo /tienda/ y /carrito/.
   Va dentro de @supports not: en los navegadores que ya entienden sticky no aplica nada. */
@supports not (position: sticky) {
    .sticky-top{
        position: -webkit-sticky;
    }
}

#page #masthead > .offcanvas{
    z-index: 1041;
    top: 0 !important;
}
.logged-in.admin-bar #page #masthead > .offcanvas{
    top: var(--wp-admin--admin-bar--height, 32px) !important;
}



#menu-top-menu{
    display: flex;
    justify-content: center;
    gap: 1.5rem
}

#menu-top-menu li a{
    text-shadow: 1px 1px 0px black;
    font-weight: 400;
}


#menu-footer-menu li a,
#menu-top-menu li a{
    color: #fff;
    opacity: .8;
    font-size: 15px;
}

#menu-footer-menu li a:hover,
#menu-top-menu li a:hover{
    color: #fff;
    opacity: 1
}

#bootscore-navbar, #bootscore-navbar-m{
    justify-content: center
}
#bootscore-navbar li a, #bootscore-navbar-m li a{
    font-family: "Space Grotesk", sans-serif;
    font-optical-sizing: auto;
    display: flex;
    align-items: center;
    column-gap: 10px;
    color: #fff;
    --bs-navbar-nav-link-padding-x: 1.25rem;
    border-radius: 99999px
}

/* Suscripciones custom star icon - reset to match other FA icons */
#menu-item-152524 i.fa-solid.fa-medal{
    font-size: 0 !important;
    width: 22px !important;
    height: 22px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    vertical-align: middle !important;
    margin-right: 2px !important;
    position: relative !important;
    top: -1px !important;
    background-image: none !important;
}
#menu-item-152524 i.fa-solid.fa-medal::before{
    content: "" !important;
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    background-image: none !important;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2L15.09 8.26L22 9.27L17 14.14L18.18 21.02L12 17.77L5.82 21.02L7 14.14L2 9.27L8.91 8.26L12 2z'/%3E%3C/svg%3E") !important;
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2L15.09 8.26L22 9.27L17 14.14L18.18 21.02L12 17.77L5.82 21.02L7 14.14L2 9.27L8.91 8.26L12 2z'/%3E%3C/svg%3E") !important;
    -webkit-mask-size: contain !important;
    mask-size: contain !important;
    -webkit-mask-repeat: no-repeat !important;
    mask-repeat: no-repeat !important;
    background-color: currentColor !important;
}

#bootscore-navbar li a:hover, #bootscore-navbar-m li a:hover{
    background-color: rgba(255,255,255,.15)
}

#bootscore-navbar li.current-menu-item a, #bootscore-navbar-m li.current-menu-item a{
    background: var(--fire-gradient)
}

#bootscore-navbar li:before, #bootscore-navbar-m li:before{
    content: "";
}

.navbar-expand-lg .offcanvas .offcanvas-body {
    flex-direction: column;
    align-items: center
}

#nav-main > .container-fluid{
    align-items: normal
}

#nav-main{
    --bs-navbar-padding-y: 0
}

.main-nav{
    position: absolute;
    backdrop-filter: blur(60px) saturate(100%);
    -webkit-backdrop-filter: blur(60px) saturate(100%);
    background-color: transparent;
    border-radius: 99999px;
    bottom: 0;
    transform: translateY(50%);
    transition: all .15s linear;
}


.top-nav, .main-nav{
    transition: all .2s linear;
}


.page-banner{
    position: relative;
}

/* ============================================ */
/* MENÚ DE PLATAFORMAS - SOLO PC */
/* ============================================ */
@media (min-width: 993px) {
/* Menú de plataformas mejorado */
.main-nav,
.main-nav-p-2,
#bootscore-navbar .navbar-nav {
    background: linear-gradient(135deg, rgba(15,20,35,.85) 0%, rgba(17,26,46,.9) 50%, rgba(13,30,55,.85) 100%);
    border-radius: 50px;
    padding: 8px 15px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        0 0 20px rgba(14,165,233,.04);
    border: 1px solid rgba(56,189,248,.1);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px); /* 25/09/2026: Safari 17 o menos solo entiende el prefijado */
}
/* Items del menú */
.main-nav .nav-item .nav-link,
.main-nav-p-2 .nav-item .nav-link {
    color: #ffffff;
    padding: 12px 20px;
    border-radius: 30px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 8px;
    position: relative;
    overflow: hidden;
}
/* Efecto hover GENERAL - Azul del sitio */
.main-nav .nav-item .nav-link:hover,
.main-nav-p-2 .nav-item .nav-link:hover {
    background: linear-gradient(135deg, #0ea5e9 0%, #38bdf8 100%);
    transform: translateY(-2px);
    box-shadow: 0 5px 20px rgba(14, 165, 233, 0.4);
}
/* Item ACTIVO - Azul del sitio */
.main-nav .nav-item.active .nav-link,
.main-nav .nav-item .nav-link.active,
.main-nav-p-2 .nav-item.active .nav-link,
.main-nav-p-2 .nav-item .nav-link.active {
    background: linear-gradient(135deg, #0ea5e9 0%, #38bdf8 100%) !important;
    box-shadow: 0 4px 15px rgba(14, 165, 233, 0.5) !important;
}
/* Íconos */
.main-nav .nav-link i,
.main-nav .nav-link svg,
.main-nav-p-2 .nav-link i {
    font-size: 1.1em;
    transition: transform 0.3s ease;
}
.main-nav .nav-link:hover i,
.main-nav .nav-link:hover svg {
    transform: scale(1.2);
}
/* ===== COLORES POR PLATAFORMA AL HOVER =====
   Menu order (sin PlayStation): Steam, Microsoft, Suscripciones, Xbox.
   Targeting via class (fa-steam/fa-windows/fa-star/fa-xbox) so el orden no importa. */

/* Steam (azul ex-PlayStation, aprovechando que PS fue removido) */
.main-nav .nav-item.fa-steam .nav-link:hover {
    background: linear-gradient(135deg, #003087 0%, #0070d1 100%);
    box-shadow: 0 5px 20px rgba(0, 112, 209, 0.5);
}
/* Microsoft (naranja Microsoft brand) */
.main-nav .nav-item.fa-windows .nav-link:hover,
.main-nav .nav-item.fa-microsoft .nav-link:hover {
    background: linear-gradient(135deg, #f25022 0%, #ff6b3d 100%);
    box-shadow: 0 5px 20px rgba(242, 80, 34, 0.5);
}
/* Suscripciones (morado estrella) */
.main-nav .nav-item.fa-star .nav-link:hover {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    box-shadow: 0 5px 20px rgba(102, 126, 234, 0.5);
}
/* Xbox (verde Xbox brand) */
.main-nav .nav-item.fa-xbox .nav-link:hover {
    background: linear-gradient(135deg, #107c10 0%, #52b043 100%);
    box-shadow: 0 5px 20px rgba(16, 124, 16, 0.5);
}
/* Animación de brillo */
.main-nav .nav-link::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: left 0.5s ease;
}
.main-nav .nav-link:hover::before {
    left: 100%;
}
}

/* ============================================ */
/* MENÚ SUPERIOR MEJORADO - SOLO PC */
/* ============================================ */
@media (min-width: 993px) {
/* Contenedor del menú superior */
#menu-top-menu,
.menu-top-menu-container,
.top-nav-widget,
ul#menu-top-menu {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0;
    margin: 0;
    list-style: none;
}
/* Items del menú */
#menu-top-menu .menu-item,
#menu-top-menu > li {
    margin: 0;
    padding: 0;
}
/* Links del menú */
#menu-top-menu .menu-item a,
#menu-top-menu > li > a {
    display: inline-flex;
    align-items: center;
    padding: 10px 18px;
    color: #E2E8F0;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 25px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
    background: transparent;
    border: 1px solid transparent;
}
/* Efecto hover */
#menu-top-menu .menu-item a:hover,
#menu-top-menu > li > a:hover {
    color: #FFFFFF;
    background: linear-gradient(135deg, rgba(14, 165, 233, 0.15), rgba(15, 52, 96, 0.2));
    border-color: rgba(14, 165, 233, 0.3);
    transform: translateY(-2px);
    box-shadow: 0 5px 20px rgba(14, 165, 233, 0.2);
}
/* Item activo / página actual */
#menu-top-menu .menu-item.current-menu-item a,
#menu-top-menu .menu-item.current_page_item a,
#menu-top-menu > li.current-menu-item > a,
#menu-top-menu > li.current_page_item > a {
    color: #FFFFFF;
    background: linear-gradient(135deg, #0ea5e9 0%, #38bdf8 100%);
    border-color: transparent;
    box-shadow: 0 4px 15px rgba(14, 165, 233, 0.4);
}
/* Efecto de brillo al hover */
#menu-top-menu .menu-item a::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15), transparent);
    transition: left 0.5s ease;
}
#menu-top-menu .menu-item a:hover::before {
    left: 100%;
}
}



.page-banner img{
    max-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px));
    object-fit: cover;
    width: 100%
}

.page-banner:after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 60px;
    background: #0B1120; /* navy del sistema: en paginas sin banner el triangulo se funde con el fondo */
    clip-path: polygon(0 0, 100% 100%, 0% 100%);
}

.woocommerce .woocommerce-content > div.product{
    margin-top: -300px;
}


.solid a i{
    font-family: "Font Awesome 6 Free";
    font-weight: 900
}

.header-actions .btn{
    border: 0;
    color: #fff
}

.bootscore-footer{
    background-color: var(--color-ultra-dark)
}

.border-top{
    --bs-border-color: var(--color-dark)
}



.woo-products-products .woo-products-product-badges{
    text-align: right!important;
}

/* La etiqueta de descuento se comia el click en la franja de arriba de la
   tarjeta. El contenedor que la sostiene lo posiciona el plugin
   (widgets-grid.css) con position:absolute + left:0 + right:0, asi que mide
   el ANCHO ENTERO de la tarjeta -medido: 307x39px sobre una etiqueta
   visible de 51x23- y ademas queda FUERA del <a> del producto. Resultado:
   los primeros 39px de toda tarjeta en oferta no llevaban a ningun lado.
   Adentro no hay nada clickeable (un solo div con el texto), asi que se lo
   vuelve transparente al puntero y el click cae en el enlace de la imagen,
   que esta justo debajo. */
.woo-products-product-badges,
.woo-products-products .woo-products-product-badges{
    pointer-events: none;
}

.yith-add-to-wishlist-button-block{
   
}

.yith-add-to-wishlist-button-block .yith-wcwl-add-to-wishlist-button__label{ 
   
}


.woo-products-product-thumbnail, 
.woo-products-products__inner-box{
    overflow:visible!important;
}


.woo-products-product-thumbnail .yith-wcwl-add-to-wishlist{

    position: absolute;
  
    top: 0;
    left: 10px;

}

.woo-products-product-thumbnail:hover .yith-wcwl-add-to-wishlist{
    display: block;
}

.woo-products-product-thumbnail .yith-wcwl-wishlistaddedbrowse span.feedback{
    display: none
}


.yith-wcwl-add-to-wishlist .yith-wcwl-add-button{
    align-items: normal;
    margin-bottom: 1.5rem
}

.wishlist_table.modern_grid li .add-to-cart-container a.button{
    border-color: var(--color);
    background: var(--fire-gradient);
    color: #fff;
    border-radius: 45px
}

.wishlist_table.modern_grid li .add-to-cart-container a.button:hover{
    background-color: var(--fire-gradient-hover);
}

.wishlist_table.modern_grid li .item-details table.item-details-table td.label{
    display: none
}

.wishlist_table.modern_grid li .item-details .product-remove a{
    color: var(--bs-danger)
}

.wishlist_table.modern_grid li .item-details .product-remove {
    position: absolute;
    bottom: 25px;
    right: 0;
    color: var(--bs-red);
}


.wishlist_table.modern_grid li .item-details h3,
.wishlist_table.images_grid li .item-details h3,
.wishlist_table.mobile li .item-details h3,
.woocommerce .card .woocommerce-loop-product__title,
.wc-block-components-product-name,
.woo-products-product-title a,
.wc-block-product-template h3 a{
    color: #fff;
    font-size: 15px;
    font-weight: 300;
    text-align: left;
}

.woocommerce .card a.woocommerce-LoopProduct-link.woocommerce-loop-product__link,
.woo-products-products .woo-products-products__inner-box,
.wc-block-product-template li{
    display: flex;
    flex-wrap: wrap;
    flex-direction: unset;
}

.woocommerce .card a.woocommerce-LoopProduct-link.woocommerce-loop-product__link{
    flex-wrap: nowrap
}


.woo-products-products__thumb-wrap,
.wc-block-components-product-image{
    flex: 0 0 auto;
    width: 100%;
}

.woo-products-products .woo-products-product-title{
    font-size: 15px
}


.woocommerce .card .woocommerce-loop-product__title,
.woo-products-product-title,
.wc-block-product-template .wp-block-post-title{
    flex: 1;
    padding-right: 0.5rem;
    text-align: left !important;
    line-height: 1.3
}


.woo-products-product-price,
.wp-block-woocommerce-product-price{
    flex:  0 0 auto;
    width: auto;
}

.woo-products-product-price del,
.woo-products-product-price ins,
.wp-block-woocommerce-product-price del,
.wp-block-woocommerce-product-price ins{
    display: block;
}


.woocommerce-Price-amount,
.wp-block-woocommerce-product-price bdi{
    font-size: 16px;
    font-weight: 500;
    position: relative;
    top: 3px
}


.wc-block-components-main table.wc-block-cart-items{
    border-radius: 20px;
    background-color: var(--color-medium-dark)!important
}

.wc-block-cart-items .wc-block-cart-items__header-image{
    padding-top: 1rem!important;
    padding-left: 1rem!important;
}

.wp-block-woocommerce-cart-order-summary-block{
    background-color: transparent;
    padding: 0;
    border-radius: 0
}


.woocommerce div.product form.cart .button,
.wp-block-woocommerce-checkout-actions-block .wc-block-checkout__actions_row .wc-block-components-checkout-place-order-button,
.wc-block-cart .wc-block-cart__submit-container .wc-block-cart__submit-button{
    background: #0D6EFD;
    box-shadow: none
}

.woocommerce div.product form.cart .button:hover,
.wp-block-woocommerce-checkout-actions-block .wc-block-checkout__actions_row .wc-block-components-checkout-place-order-button:hover,
.wc-block-cart .wc-block-cart__submit-container .wc-block-cart__submit-button:hover{
    background: #0b5ed7;
    filter: none
}


.wp-block-woocommerce-checkout-actions-block .wc-block-checkout__actions_row .wc-block-components-checkout-place-order-button{
    border-radius: 99px
}


#add_payment_method #payment div.payment_box, .woocommerce-cart #payment div.payment_box{
    background-color: var(--color-medium);
    color: #fff;
}
#add_payment_method #payment div.payment_box::before,
.woocommerce-cart #payment div.payment_box::before{
    border-bottom-color: var(--color-medium);
}
.woocommerce-checkout #payment{
    background-color: transparent;
}
.woocommerce-checkout #payment div.payment_box{
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 12px;
    color: rgba(255,255,255,.7);
    font-size: 13px;
}
.woocommerce-checkout #payment div.payment_box::before{
    border-bottom-color: rgba(255,255,255,.08);
}
.woocommerce-checkout .barra-descuento-wrapper{
    display: none !important;
}

/* ══════════════════════════════════════════════════════
   CHECKOUT PAGE — Rediseño completo
   ══════════════════════════════════════════════════════ */

/* --- Headings --- */
/* 25/09/2026: el h3:has() va en una regla aparte. En una lista, un navegador sin :has() (iOS 15.3 o menos,
   Chrome menor a 105) tira la regla entera y se llevaba puestos los titulos de "Tu pedido" y facturacion.
   Mismas declaraciones en las dos reglas: en los navegadores de hoy no cambia nada. */
.woocommerce-checkout h3#order_review_heading,
.woocommerce-checkout .woocommerce-billing-fields > h3 {
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    letter-spacing: .5px;
    margin-bottom: 1rem;
}
.woocommerce-checkout h3:has(+ #customer_details) {
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    letter-spacing: .5px;
    margin-bottom: 1rem;
}

/* --- Checkout inputs (scoped to checkout only) --- */
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row input.input-text{
    background: rgba(255,255,255,.04) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 10px !important;
    color: #fff !important;
    box-shadow: none !important;
    height: 3.125em;
    padding: 1em .75em;
    font-size: .95em;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.woocommerce-checkout .form-row textarea:focus,
.woocommerce-checkout .form-row select:focus,
.woocommerce-checkout .form-row input.input-text:focus{
    border-color: rgba(56,189,248,.35) !important;
    box-shadow: 0 0 0 3px rgba(56,189,248,.08), 0 0 16px rgba(56,189,248,.06) !important;
    outline: none;
}
.woocommerce-checkout .form-row label{
    color: rgba(255,255,255,.5) !important;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .8px;
    margin-bottom: 4px;
}
.woocommerce-checkout .form-row label .required{
    color: #38bdf8;
}
.woocommerce-checkout .select2-container--default .select2-selection--single{
    background: rgba(255,255,255,.04) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 10px !important;
    height: 3.125em;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered{
    color: #fff;
    line-height: 3.125em;
    padding-left: .75em;
}
/* --- Select2 closed state (box) --- */
.woocommerce-checkout .select2-container--default .select2-selection--single{
    background: rgba(255,255,255,.04) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 10px !important;
    height: 3.125em;
    display: flex;
    align-items: center;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered{
    color: #fff;
    line-height: 1;
    padding-left: .75em;
    padding-right: 2.5em;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow{
    height: 100%;
    right: 10px;
    display: flex;
    align-items: center;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow b{
    border: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E") !important;
    background-size: 16px 16px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    width: 16px !important;
    height: 16px !important;
}

/* --- Select2 dropdown (renders outside checkout container) --- */
.select2-container--default .select2-dropdown{
    background: #0d1117 !important;
    border: 1px solid rgba(56,189,248,.12) !important;
    border-radius: 12px !important;
    box-shadow: 0 12px 36px rgba(0,0,0,.5) !important;
    overflow: hidden;
}
.select2-container--default .select2-search--dropdown{
    padding: 10px;
    background: #0d1117;
}
.select2-container--default .select2-search--dropdown .select2-search__field{
    background: rgba(255,255,255,.06) !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    border-radius: 8px !important;
    color: #fff !important;
    padding: .6em .75em;
}
.select2-container--default .select2-results{
    background: #0d1117 !important;
}
.select2-container--default .select2-results > .select2-results__options{
    background: #0d1117 !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.1) transparent;
}
.select2-container--default .select2-results__option{
    background: #0d1117 !important;
    color: rgba(255,255,255,.75) !important;
    padding: 10px 14px;
    font-size: 14px;
    transition: background .15s ease;
}
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted{
    background: rgba(56,189,248,.15) !important;
    color: #fff !important;
}
.select2-container--default .select2-results__option[aria-selected=true],
.select2-container--default .select2-results__option[data-selected=true]{
    background: rgba(56,189,248,.25) !important;
    color: #fff !important;
}

/* --- Order review table --- */
.woocommerce-checkout #order_review .shop_table{
    border: 0;
    border-collapse: collapse;
}
.woocommerce-checkout #order_review .shop_table thead th{
    background: rgba(0,0,0,.25);
    color: rgba(255,255,255,.5);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    padding: 12px 16px;
    border-bottom: 1px solid rgba(255,255,255,.06);
}
.woocommerce-checkout #order_review .shop_table td,
.woocommerce-checkout #order_review .shop_table th{
    border-color: rgba(255,255,255,.06);
    padding: 12px 16px;
    color: #fff;
}
.woocommerce-checkout #order_review .shop_table .product-name{
    color: rgba(255,255,255,.85);
    font-weight: 500;
}
.woocommerce-checkout #order_review .shop_table .product-total,
.woocommerce-checkout #order_review .shop_table .product-total .amount{
    color: #fff;
    font-weight: 600;
}
.woocommerce-checkout #order_review .shop_table tfoot th{
    color: rgba(255,255,255,.6);
    font-weight: 600;
    border-top: 1px solid rgba(255,255,255,.06);
}
.woocommerce-checkout #order_review .shop_table tfoot td{
    border-top: 1px solid rgba(255,255,255,.06);
}
.woocommerce-checkout #order_review .shop_table tfoot .order-total th,
.woocommerce-checkout #order_review .shop_table tfoot .order-total td{
    border-top: 1px solid rgba(56,189,248,.12);
    padding-top: 16px;
}
.woocommerce-checkout #order_review .shop_table tfoot .order-total td .amount{
    color: #38bdf8;
    font-size: 1.3em;
    font-weight: 700;
}
.woocommerce-checkout #order_review .shop_table tfoot .order-total th{
    color: #fff;
    font-weight: 700;
    font-size: 1em;
}

/* --- Checkout product thumbnail --- */
.woocommerce-checkout .checkout-product-thumbnail img{
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.06);
}

/* --- Payment methods --- */
.woocommerce-checkout #payment ul.payment_methods{
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
    padding-bottom: 12px;
}
.woocommerce-checkout #payment ul.payment_methods li{
    padding: 8px 0;
}
.woocommerce-checkout #payment ul.payment_methods li label{
    color: rgba(255,255,255,.85);
    font-weight: 500;
    cursor: pointer;
}
.woocommerce-checkout #payment ul.payment_methods li img{
    filter: brightness(1.1);
}

/* AstroPay gateway — Visa + Mastercard logos rendered by
   woocommerce_gateway_icon (see functions.php). Sized to 22px to match the
   Modo/QR icon exactly. The label is already display:flex with gap:10px, so
   no margin-left is needed — the flex gap handles the separation from the
   title, just like the sibling QR icon. */
.woocommerce-checkout #payment ul.payment_methods li .ms-pm-cards{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    vertical-align: middle;
}
.woocommerce-checkout #payment ul.payment_methods li .ms-pm-cards img{
    height: 22px;
    width: auto;
    max-width: none;
    max-height: 22px;
    filter: none;
    display: block;
    box-shadow: none;
    background: transparent;
    margin: 0;
    padding: 0;
    image-rendering: -webkit-optimize-contrast;
}

/* --- Place order button --- */
.woocommerce-checkout #place_order{
    background: linear-gradient(135deg, #0369a1, #0284c7) !important;
    border: none !important;
    border-radius: 12px !important;
    color: #fff !important;
    font-weight: 700 !important;
    font-size: 17px;
    height: 56px;
    letter-spacing: .5px;
    box-shadow: none;
    transition: all .25s ease;
    width: 100%;
}
.woocommerce-checkout #place_order:hover{
    opacity: .9;
    box-shadow: none;
}

/* --- Coupon form --- */
.woocommerce-checkout .checkout_coupon .form-row-first input{
    background: rgba(255,255,255,.04) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 10px !important;
    color: #fff !important;
    box-shadow: none !important;
}
.woocommerce-checkout .checkout_coupon .form-row-first input:focus{
    border-color: rgba(56,189,248,.35) !important;
    box-shadow: 0 0 0 3px rgba(56,189,248,.08) !important;
}
.woocommerce-checkout .checkout_coupon .form-row-last button{
    background: transparent !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    border-radius: 10px !important;
    color: #fff !important;
    height: 3.125em;
    transition: all .2s ease;
}
.woocommerce-checkout .checkout_coupon .form-row-last button:hover{
    border-color: rgba(56,189,248,.3) !important;
    color: #38bdf8 !important;
    background: rgba(56,189,248,.05) !important;
}

/* --- Create account checkbox + password --- */
.woocommerce-checkout .woocommerce-account-fields{
    background: linear-gradient(170deg, #0d1117 0%, #111a2e 60%, #0d1117 100%);
    padding: .75rem 1.25rem;
    border-radius: 12px;
    border: 1px solid rgba(56,189,248,.08);
    margin-top: 1rem;
}
.woocommerce-checkout .woocommerce-account-fields > .form-row{
    margin-bottom: 0 !important;
}
.woocommerce-checkout .woocommerce-account-fields .create-account{
    background: none;
    padding: 0;
    border: none;
    border-radius: 0;
    margin-top: .75rem;
}
.woocommerce-checkout .woocommerce-form__label-for-checkbox{
    color: rgba(255,255,255,.7) !important;
    font-size: 14px;
    font-weight: 500;
    display: flex !important;
    align-items: center;
    gap: 14px;
    cursor: pointer;
    margin: 0;
    line-height: 1;
}
.woocommerce-checkout .woocommerce-form__label-for-checkbox input[type="checkbox"]{
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    min-width: 18px;
    flex-shrink: 0;
    border: 2px solid rgba(255,255,255,.2);
    border-radius: 5px;
    background: rgba(255,255,255,.04);
    cursor: pointer;
    position: relative;
    transition: all .2s ease;
    margin: 0;
    vertical-align: middle;
}
.woocommerce-checkout .woocommerce-form__label-for-checkbox input[type="checkbox"]:checked{
    background: #0284c7;
    border-color: #0284c7;
}
.woocommerce-checkout .woocommerce-form__label-for-checkbox input[type="checkbox"]:checked::after{
    content: '';
    position: absolute;
    left: 4px;
    top: 1px;
    width: 5px;
    height: 9px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.woocommerce-checkout .create-account .form-row label{
    color: rgba(255,255,255,.5) !important;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .8px;
}
.woocommerce-checkout .create-account .form-row input.input-text{
    background: rgba(255,255,255,.04) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 10px !important;
    color: #fff !important;
    box-shadow: none !important;
}
.woocommerce-checkout .create-account .form-row input.input-text:focus{
    border-color: rgba(56,189,248,.35) !important;
    box-shadow: 0 0 0 3px rgba(56,189,248,.08) !important;
}
.woocommerce-checkout .password-input .show-password-input{
    filter: invert(1);
    opacity: .5;
}
.woocommerce-checkout .password-input .show-password-input:hover{
    opacity: 1;
}

/* --- Terms & conditions --- */
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper{
    color: rgba(255,255,255,.5);
    font-size: 13px;
}

/* --- Responsive checkout --- */
@media(max-width:767px){
    .woocommerce-checkout .woocommerce-billing-fields__field-wrapper{
        padding: 1rem;
        border-radius: 14px;
    }
    .woocommerce-checkout #order_review{
        padding: 14px;
        border-radius: 14px !important;
    }
    .woocommerce-checkout #place_order{
        height: 48px;
        font-size: 14px;
    }
}

/* ═══════════════════════════════════════════════════════════
   THANK YOU / ORDER RECEIVED PAGE
   ═══════════════════════════════════════════════════════════ */

/* --- "Gracias. Tu pedido ha sido recibido." message --- */
.woocommerce-order-received .woocommerce-thankyou-order-received{
    color: rgba(255,255,255,.65);
    font-size: 15px;
    margin-bottom: 1.5rem;
}

/* --- Order overview bar (número, fecha, email, total, método) --- */
.woocommerce-order-received .woocommerce-order-overview{
    background: linear-gradient(170deg, #0d1117 0%, #111a2e 60%, #0d1117 100%);
    border: 1px solid rgba(56,189,248,.1);
    border-radius: 16px;
    padding: 1.25rem 1.5rem;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 2rem;
    margin: 0 0 2rem;
}
.woocommerce-order-received .woocommerce-order-overview li{
    border: none !important;
    border-right: 1px solid rgba(255,255,255,.08) !important;
    padding: 0 1.5rem 0 0 !important;
    margin: 0 !important;
    color: rgba(255,255,255,.5);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .5px;
}
.woocommerce-order-received .woocommerce-order-overview li:last-child{
    border-right: none !important;
}
.woocommerce-order-received .woocommerce-order-overview li strong{
    display: block;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    margin-top: 2px;
}

/* --- Talo bank transfer plugin --- */
.woocommerce-order-received .talo-payment-section{
    background: linear-gradient(170deg, #0d1117 0%, #111a2e 60%, #0d1117 100%) !important;
    border: 1px solid rgba(56,189,248,.08) !important;
    border-radius: 16px !important;
    padding: 1.5rem !important;
}
.woocommerce-order-received .payment-status.waiting{
    background: rgba(56,189,248,.06) !important;
    border: 1px solid rgba(56,189,248,.15) !important;
    border-radius: 12px !important;
}
.woocommerce-order-received .payment-info{
    background: rgba(255,255,255,.02) !important;
    border: 1px solid rgba(255,255,255,.06) !important;
    border-radius: 12px !important;
}
.woocommerce-order-received .payment-warning{
    background: rgba(234,179,8,.06) !important;
    border: 1px solid rgba(234,179,8,.15) !important;
    border-radius: 10px !important;
}
.woocommerce-order-received .payment-warning .status-message-title{
    color: #fbbf24 !important;
}
.woocommerce-order-received .status-mesage-description-highlight{
    color: #f59e0b !important;
}
.woocommerce-order-received .status-message-title{
    color: #fff !important;
    font-weight: 600;
}
.woocommerce-order-received .status-message-description{
    color: rgba(255,255,255,.6) !important;
}
.woocommerce-order-received .payment-title{
    color: #fff !important;
    font-weight: 700;
}
.woocommerce-order-received .payment-description{
    color: rgba(255,255,255,.6) !important;
}
.woocommerce-order-received .payment-alias-label,
.woocommerce-order-received .payment-amount-label{
    color: rgba(255,255,255,.5) !important;
    font-size: 13px;
    font-weight: 600;
}
.woocommerce-order-received .payment-alias,
.woocommerce-order-received .payment-amount{
    background: rgba(255,255,255,.04) !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    border-radius: 10px !important;
    color: #fff !important;
}
.woocommerce-order-received .copy-button{
    background: rgba(56,189,248,.1) !important;
    border: 1px solid rgba(56,189,248,.2) !important;
    border-radius: 8px !important;
    color: #38bdf8 !important;
    font-weight: 600 !important;
    transition: all .2s ease;
}
.woocommerce-order-received .copy-button:hover{
    background: rgba(56,189,248,.2) !important;
}
.woocommerce-order-received .bank-info-owner,
.woocommerce-order-received .bank-info-cuit,
.woocommerce-order-received .bank-info-bank{
    color: rgba(255,255,255,.6) !important;
}

/* --- "Detalles del pedido" section --- */
.woocommerce-order-received .woocommerce-order-details{
    margin-bottom: 2rem;
}
.woocommerce-order-received .woocommerce-order-details > h2,
.woocommerce-order-received .woocommerce-order-details__title{
    color: #fff;
    font-size: 1.4em;
    font-weight: 700;
    margin-bottom: 1rem;
}
/* Order details table */
.woocommerce-order-received .woocommerce-table--order-details{
    background: linear-gradient(170deg, #0d1117 0%, #111a2e 60%, #0d1117 100%) !important;
    border: 1px solid rgba(56,189,248,.08) !important;
    border-radius: 16px !important;
    overflow: hidden;
}
.woocommerce-order-received .woocommerce-table--order-details thead th{
    background: rgba(0,0,0,.25) !important;
    color: rgba(255,255,255,.5) !important;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .8px;
    font-weight: 600;
    padding: .75rem 1.25rem !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
}
.woocommerce-order-received .woocommerce-table--order-details td,
.woocommerce-order-received .woocommerce-table--order-details th{
    color: rgba(255,255,255,.8) !important;
    padding: .75rem 1.25rem !important;
    border-bottom: 1px solid rgba(255,255,255,.04) !important;
    background: transparent !important;
}
.woocommerce-order-received .woocommerce-table--order-details tfoot th{
    color: rgba(255,255,255,.5) !important;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    font-size: 14px;
    background: transparent !important;
}
.woocommerce-order-received .woocommerce-table--order-details tfoot td{
    color: #fff !important;
    font-weight: 600;
}
.woocommerce-order-received .woocommerce-table--order-details .product-name a{
    color: #fff !important;
    text-decoration: none;
}
.woocommerce-order-received .woocommerce-table--order-details .product-name a:hover{
    color: #38bdf8 !important;
}
.woocommerce-order-received .woocommerce-table--order-details .amount{
    color: #fff !important;
    font-weight: 600;
}
/* Total row accent */
.woocommerce-order-received .woocommerce-table--order-details tfoot tr:last-child td .amount{
    color: #38bdf8 !important;
    font-size: 1.15em;
}

/* --- Action buttons (Cambiar método de pago, Cancelar) --- */
.woocommerce-order-received .woocommerce-order-details a.button,
.woocommerce-order-received .order-actions a,
.woocommerce-order-received td.order-actions a{
    background: rgba(56,189,248,.1) !important;
    border: 1px solid rgba(56,189,248,.2) !important;
    border-radius: 8px !important;
    color: #38bdf8 !important;
    font-size: 13px;
    font-weight: 600;
    padding: .4rem .8rem !important;
    text-decoration: none;
    transition: all .2s ease;
}
.woocommerce-order-received .woocommerce-order-details a.button:hover,
.woocommerce-order-received .order-actions a:hover,
.woocommerce-order-received td.order-actions a:hover{
    background: rgba(56,189,248,.2) !important;
}

/* --- "Dirección de facturación" section --- */
.woocommerce-order-received .woocommerce-customer-details .woocommerce-column__title{
    color: #fff !important;
    font-size: 1.4em;
    font-weight: 700;
    margin-bottom: 1rem;
}
.woocommerce-order-received .woocommerce-customer-details address{
    background: linear-gradient(170deg, #0d1117 0%, #111a2e 60%, #0d1117 100%) !important;
    border: 1px solid rgba(56,189,248,.08) !important;
    border-radius: 16px !important;
    padding: 1.25rem 1.5rem !important;
    color: rgba(255,255,255,.65) !important;
}
.woocommerce-order-received .woocommerce-customer-details address p{
    color: rgba(255,255,255,.65) !important;
}

/* --- Generic text colors --- */
.woocommerce-order-received .woocommerce-order p{
    color: rgba(255,255,255,.65);
}

/* --- Responsive thank you --- */
@media(max-width:767px){
    /* Order overview: hide checkmark, clean grid layout */
    .woocommerce-order-received .woocommerce-order-overview{
        padding: 1rem !important;
        padding-left: 1rem !important;
        gap: 0;
        border-radius: 12px;
        flex-direction: column;
    }
    .woocommerce-order-received .woocommerce-order-overview::before{
        display: none !important;
    }
    .woocommerce-order-received .woocommerce-order-overview li{
        border-right: none !important;
        padding: .5rem 0 !important;
        border-bottom: 1px solid rgba(255,255,255,.06) !important;
    }
    .woocommerce-order-received .woocommerce-order-overview li:last-child{
        border-bottom: none !important;
        padding-bottom: 0 !important;
    }
    .woocommerce-order-received .woocommerce-order-overview li:first-child{
        padding-top: 0 !important;
    }

    /* Talo section: more compact on mobile */
    .woocommerce-order-received .talo-payment-wrapper,
    .woocommerce-order-received .talo-payment-section{
        padding: .75rem !important;
        border-radius: 12px !important;
    }
    .woocommerce-order-received .talo-payment-section .payment-status{
        padding: .75rem !important;
        border-radius: 10px !important;
        margin-bottom: .75rem !important;
    }
    .woocommerce-order-received .talo-payment-section .payment-info{
        padding: .75rem !important;
        border-radius: 10px !important;
        margin-bottom: .75rem !important;
    }
    .woocommerce-order-received .talo-payment-section .payment-title{
        font-size: 14px !important;
    }
    .woocommerce-order-received .talo-payment-section .payment-description{
        font-size: 13px !important;
        line-height: 1.4 !important;
    }
    .woocommerce-order-received .talo-payment-section .payment-warning{
        padding: .75rem !important;
        border-radius: 10px !important;
        margin-bottom: .75rem !important;
    }
    .woocommerce-order-received .talo-payment-section .payment-warning .status-message-title{
        font-size: 14px !important;
    }
    .woocommerce-order-received .talo-payment-section .payment-warning .status-message-description{
        font-size: 12px !important;
        line-height: 1.4 !important;
    }
    .woocommerce-order-received .talo-payment-section .payment-alias-label,
    .woocommerce-order-received .talo-payment-section .payment-amount-label{
        font-size: 12px !important;
        margin-bottom: .25rem !important;
    }
    .woocommerce-order-received .talo-payment-section .payment-alias,
    .woocommerce-order-received .talo-payment-section .payment-amount{
        padding: .5rem .75rem !important;
        font-size: 14px !important;
        border-radius: 8px !important;
    }
    .woocommerce-order-received .talo-payment-section .payment-alias-container,
    .woocommerce-order-received .talo-payment-section .payment-amount-container{
        gap: .5rem !important;
        margin-bottom: .75rem !important;
    }
    .woocommerce-order-received .talo-payment-section .copy-button{
        padding: .4rem .75rem !important;
        font-size: 12px !important;
    }
    .woocommerce-order-received .talo-payment-section .payment-bank-info{
        font-size: 13px !important;
        padding: .5rem 0 !important;
    }
    .woocommerce-order-received .talo-payment-section .bank-info-owner,
    .woocommerce-order-received .talo-payment-section .bank-info-cuit,
    .woocommerce-order-received .talo-payment-section .bank-info-bank{
        font-size: 12px !important;
        margin-bottom: .15rem !important;
    }

    .woocommerce-order-received .woocommerce-table--order-details{
        border-radius: 12px !important;
    }
    .woocommerce-order-received .woocommerce-customer-details address{
        border-radius: 12px !important;
        padding: 1rem !important;
    }
}

/* --- Fix: checkmark icon spacing on order overview --- */
.woocommerce-order-received .woocommerce-order-overview::before{
    left: 1.25rem;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    color: #22c55e;
}
.woocommerce-order-received .woocommerce-order-overview{
    padding-left: 3.5rem;
    position: relative;
}

/* --- Downloads section on order-received page --- */
.woocommerce-order-received .woocommerce-order-downloads{
    margin-bottom: 2rem;
}
.woocommerce-order-received .woocommerce-order-downloads__title{
    color: #fff;
    font-size: 1.4em;
    font-weight: 700;
    margin-bottom: 1rem;
}
.woocommerce-order-received .woocommerce-order-downloads .shop_table{
    background: linear-gradient(170deg, #0d1117 0%, #111a2e 60%, #0d1117 100%) !important;
    border: 1px solid rgba(56,189,248,.08) !important;
    border-radius: 16px !important;
    overflow: hidden;
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}
.woocommerce-order-received .woocommerce-order-downloads .shop_table thead th{
    background: rgba(0,0,0,.25) !important;
    color: rgba(255,255,255,.5) !important;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .8px;
    font-weight: 600;
    padding: .75rem 1.25rem !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
    border-right: none !important;
    border-left: none !important;
    border-top: none !important;
}
.woocommerce-order-received .woocommerce-order-downloads .shop_table td{
    color: rgba(255,255,255,.8) !important;
    padding: .75rem 1.25rem !important;
    border-bottom: 1px solid rgba(255,255,255,.04) !important;
    border-right: none !important;
    border-left: none !important;
    border-top: none !important;
    background: transparent !important;
    vertical-align: middle;
}
.woocommerce-order-received .woocommerce-order-downloads .shop_table .product-name a{
    color: #fff !important;
    text-decoration: none;
}
.woocommerce-order-received .woocommerce-order-downloads .shop_table .product-name a:hover{
    color: #38bdf8 !important;
}
.woocommerce-order-received .woocommerce-order-downloads .shop_table .button.alt,
.woocommerce-order-received .woocommerce-order-downloads .shop_table .button.download,
.woocommerce-order-received .woocommerce-order-downloads .shop_table a.woocommerce-MyAccount-downloads-file{
    display: inline-block;
    background: rgba(56,189,248,.1) !important;
    border: 1px solid rgba(56,189,248,.2) !important;
    border-radius: 8px !important;
    color: #38bdf8 !important;
    font-size: 13px;
    font-weight: 600;
    padding: .5rem 1rem !important;
    text-decoration: none;
    transition: all .2s ease;
}
.woocommerce-order-received .woocommerce-order-downloads .shop_table .button.alt:hover,
.woocommerce-order-received .woocommerce-order-downloads .shop_table .button.download:hover,
.woocommerce-order-received .woocommerce-order-downloads .shop_table a.woocommerce-MyAccount-downloads-file:hover{
    background: rgba(56,189,248,.2) !important;
}
/* Responsive downloads on order-received — card layout that actually fills the viewport */
@media(max-width:767px){
    /* Break out of native table layout so the grid rows can span 100% width */
    .woocommerce-order-received .woocommerce-order-downloads .shop_table,
    .woocommerce-order-received .woocommerce-order-downloads .shop_table tbody{
        display: block !important;
        width: 100% !important;
        border-radius: 12px !important;
    }
    .woocommerce-order-received .woocommerce-order-downloads .shop_table thead{
        display: none !important;
    }
    .woocommerce-order-received .woocommerce-order-downloads .shop_table tbody tr{
        display: grid !important;
        width: 100% !important;
        grid-template-columns: 1fr 1fr !important;
        gap: .9rem .75rem !important;
        padding: 1rem .85rem !important;
        margin-bottom: .75rem;
        border-bottom: 1px solid rgba(255,255,255,.06) !important;
        box-sizing: border-box !important;
    }
    .woocommerce-order-received .woocommerce-order-downloads .shop_table tbody td{
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;   /* center label + value within each column */
        gap: 4px !important;
        padding: 0 !important;
        border: 0 !important;
        font-size: 14px;
        background: transparent !important;
        text-align: center !important;
    }
    .woocommerce-order-received .woocommerce-order-downloads .shop_table tbody td::before{
        content: attr(data-title);
        font-weight: 600;
        color: rgba(255,255,255,.55);
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .4px;
    }

    /* Product name: full row, larger, no "PRODUCTO" label repeated */
    .woocommerce-order-received .woocommerce-order-downloads .shop_table tbody td.download-product{
        grid-column: 1 / -1 !important;
        align-items: center !important;
        font-size: 16px;
        font-weight: 600;
        color: #fff;
    }
    .woocommerce-order-received .woocommerce-order-downloads .shop_table tbody td.download-product::before{
        display: none !important;
    }

    /* Download button: full row, bigger tap target, fills the card edge-to-edge */
    .woocommerce-order-received .woocommerce-order-downloads .shop_table tbody td.download-file{
        grid-column: 1 / -1 !important;
        align-items: stretch !important;
        margin-top: .25rem;
    }
    .woocommerce-order-received .woocommerce-order-downloads .shop_table tbody td.download-file::before{
        display: none !important;
    }
    .woocommerce-order-received .woocommerce-order-downloads .shop_table tbody td.download-file .button,
    .woocommerce-order-received .woocommerce-order-downloads .shop_table tbody td.download-file a.woocommerce-MyAccount-downloads-file{
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
        text-align: center !important;
        padding: .8rem 1rem !important;
        font-size: 14px !important;
        margin: 0 !important;
    }
}

/* ══════════════════════════════════════════════════════ */

.woocommerce table.shop_attributes,
.woocommerce table.shop_table td,
.woocommerce table.shop_table tfoot th,
.woocommerce table.shop_table tfoot td,
.woocommerce table.shop_table{
    border: 0;
    border-spacing: 0
}
.woocommerce table.shop_table th{
    border-bottom: 1px solid var(--color-medium)
}

button.ywpar_apply_discounts {
    height: 3.125em;
    border: 0;
    padding: 0.5rem 1.5rem;
    background: var(--fire-gradient);
}

button.ywpar_apply_discounts:hover{
    background-color: var(--color-button-hover)
}


.wp-block-woocommerce-checkout-order-summary-block {
    background: var(--color-ultra-dark);
    border-radius: 20px!important;
}
.woocommerce-checkout #order_review{
    padding: 20px;
    background: linear-gradient(170deg, #0d1117 0%, #111a2e 60%, #0d1117 100%);
    border-radius: 20px !important;
    border: 1px solid rgba(56,189,248,.08);
    box-shadow: 0 8px 32px rgba(0,0,0,.3);
}

.wc-block-components-sidebar{
    margin-top: 0!important
}

.is-large .wc-block-checkout__sidebar.is-sticky{
    top: 100px
}


.add-to-cart-container{
    flex:  0 0 auto;
    width: 100%;
}


.add-to-cart-container .button{
    padding: 0.25rem 1.5rem;
    border-radius: 999px;
    background: var(--fire-gradient)
}

.add-to-cart-container .button:hover{
    background-color: var(--color-button-hover)
}

.width-100{
    transform: translateX(-50%);
    min-width: 100vw !important;
    margin-left: 0!important
}


.btn-large{
    font-weight: 700;
}



.btn-primary-elementor a{
    background: var(--fire-gradient)
}
.btn-primary-elementor a:hover{
    background-color: var(--color-button-hover)
}

.wp-block-social-links{
    list-style: none;
    padding-left: 0;
}



.wp-block-social-links {
    background: none;
    box-sizing: border-box;
    margin-left: 0;
    padding-left: 0;
    padding-right: 0;
    text-indent: 0
}

.wp-block-social-links .wp-social-link a,.wp-block-social-links .wp-social-link a:hover {
    border-bottom: 0;
    box-shadow: none;
    text-decoration: none
}

.wp-block-social-links .wp-social-link svg {
    height: 1.5em;
    width: 1.5em
}

.wp-block-social-links .wp-social-link span:not(.screen-reader-text) {
    font-size: .65em;
    margin-left: .5em;
    margin-right: .5em
}

.wp-block-social-links.has-small-icon-size {
    font-size: 16px
}


.wp-block-social-links.aligncenter {
    display: flex;
    justify-content: center
}

.wp-block-social-links.alignright {
    justify-content: flex-end
}

.wp-block-social-link {
    border-radius: 9999px;
    display: block;
    height: auto
}



.wp-block-social-link a {
    align-items: center;
    display: flex;
    line-height: 0
}

.wp-block-social-link:hover {
    transform: scale(1.1)
}

.wp-block-social-links .wp-block-social-link.wp-social-link {
    display: inline-block;
    margin: 0;
    padding: 0
}

.wp-block-social-links .wp-block-social-link.wp-social-link .wp-block-social-link-anchor,.wp-block-social-links .wp-block-social-link.wp-social-link .wp-block-social-link-anchor svg,.wp-block-social-links .wp-block-social-link.wp-social-link .wp-block-social-link-anchor:active,.wp-block-social-links .wp-block-social-link.wp-social-link .wp-block-social-link-anchor:hover,.wp-block-social-links .wp-block-social-link.wp-social-link .wp-block-social-link-anchor:visited {
    color: currentColor;
    fill: currentColor
}

:where(.wp-block-social-links:not(.is-style-logos-only)) .wp-social-link {
    background-color: #f0f0f0;
    color: #444
}

:where(.wp-block-social-links:not(.is-style-logos-only)) .wp-social-link-facebook {
    background-color: #0866ff;
    color: #fff
}


:where(.wp-block-social-links:not(.is-style-logos-only)) .wp-social-link-instagram {
    background-color: #f00075;
    color: #fff
}

:where(.wp-block-social-links:not(.is-style-logos-only)) .wp-social-link-tiktok {
    background-color: #000;
    color: #fff
}


:where(.wp-block-social-links:not(.is-style-logos-only)) .wp-social-link-twitter {
    background-color: #1da1f2;
    color: #fff
}


:where(.wp-block-social-links:not(.is-style-logos-only)) .wp-social-link-whatsapp {
    background-color: #25d366;
    color: #fff
}

:where(.wp-block-social-links:not(.is-style-logos-only)) .wp-social-link-x {
    background-color: #000;
    color: #fff
}


:where(.wp-block-social-links.is-style-logos-only) .wp-social-link {
    background: none
}

:where(.wp-block-social-links.is-style-logos-only) .wp-social-link svg {
    height: 1.25em;
    width: 1.25em
}


:where(.wp-block-social-links.is-style-logos-only) .wp-social-link-facebook {
    color: #0866ff
}


:where(.wp-block-social-links.is-style-logos-only) .wp-social-link-instagram {
    color: #f00075
}

:where(.wp-block-social-links.is-style-logos-only) .wp-social-link-whatsapp {
    color: #25d366
}

:where(.wp-block-social-links.is-style-logos-only) .wp-social-link-x {
    color: #000
}



.wp-block-social-links.is-style-pill-shape .wp-social-link {
    width: auto
}

:root :where(.wp-block-social-links .wp-social-link a) {
    padding: .25em
}

:root :where(.wp-block-social-links.is-style-logos-only .wp-social-link a) {
    padding: 0
}

:root :where(.wp-block-social-links.is-style-pill-shape .wp-social-link a) {
    padding-left: .6666666667em;
    padding-right: .6666666667em
}

.offcanvas{
    background-color: var(--color-dark)
}

.offcanvas-header{
    color: #fff;
    border-bottom: 1px solid var(--color-medium-dark);
    padding: 1rem 1.25rem;
}

.offcanvas-header .offcanvas-title{
    font-family: "Space Grotesk", sans-serif;
    font-weight: 600;
    letter-spacing: .02em;
}

.offcanvas-header .btn-close{
    opacity: .7;
    filter: invert(1);
    transition: opacity .15s ease;
}

.offcanvas-header .btn-close:hover{
    opacity: 1;
}

/* ── Offcanvas menu (mobile nav) ── */
#offcanvas-navbar{
    --menu-accent: var(--color-primary-light);
}
@media (max-width: 991px){
    #offcanvas-navbar{
        background: linear-gradient(170deg, #0d1117 0%, #111a2e 50%, #0d1117 100%);
        border-left: 1px solid rgba(56, 189, 248, .08);
    }
}

/* Header with logo */
#offcanvas-navbar .offcanvas-header{
    background: transparent;
    border-bottom: 1px solid rgba(255,255,255,.07);
    padding: .9rem 1.25rem;
    align-items: center;
}

#offcanvas-navbar .offcanvas-brand{
    flex: 1;
}

#offcanvas-navbar .offcanvas-brand img{
    height: 32px;
    width: auto;
}

#offcanvas-navbar .btn-close{
    opacity: .4;
    filter: invert(1);
    transition: opacity .15s ease;
    padding: .5rem;
}

#offcanvas-navbar .btn-close:hover{
    opacity: 1;
}

/* Offcanvas body layout - mobile only */
@media (max-width: 991px){
    #offcanvas-navbar .offcanvas-body{
        padding: 0 !important;
        display: flex;
        flex-direction: column;
    }
}

/* Footer branding - mobile only */
.offcanvas-footer{
    display: none;
}
#offcanvas-navbar .offcanvas-footer{
    margin-top: auto;
    padding: 1.25rem;
    text-align: center;
    border-top: 1px solid rgba(255,255,255,.05);
}
@media (max-width: 991px){
    #offcanvas-navbar .offcanvas-footer{ display: block; }
}

#offcanvas-navbar .offcanvas-footer span{
    font-size: 11px;
    color: rgba(255,255,255,.2);
    letter-spacing: .05em;
    text-transform: uppercase;
    font-weight: 500;
}

/* ── Slide-in animation for menu items ── */
@keyframes menuItemSlideIn {
    from {
        opacity: 0;
        transform: translateX(-12px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

#offcanvas-navbar.showing li,
#offcanvas-navbar.show li {
    animation: menuItemSlideIn .3s ease forwards;
}

#offcanvas-navbar.showing li:nth-child(1), #offcanvas-navbar.show li:nth-child(1) { animation-delay: .03s; }
#offcanvas-navbar.showing li:nth-child(2), #offcanvas-navbar.show li:nth-child(2) { animation-delay: .06s; }
#offcanvas-navbar.showing li:nth-child(3), #offcanvas-navbar.show li:nth-child(3) { animation-delay: .09s; }
#offcanvas-navbar.showing li:nth-child(4), #offcanvas-navbar.show li:nth-child(4) { animation-delay: .12s; }
#offcanvas-navbar.showing li:nth-child(5), #offcanvas-navbar.show li:nth-child(5) { animation-delay: .15s; }
#offcanvas-navbar.showing li:nth-child(6), #offcanvas-navbar.show li:nth-child(6) { animation-delay: .18s; }
#offcanvas-navbar.showing li:nth-child(7), #offcanvas-navbar.show li:nth-child(7) { animation-delay: .21s; }
#offcanvas-navbar.showing li:nth-child(8), #offcanvas-navbar.show li:nth-child(8) { animation-delay: .24s; }
#offcanvas-navbar.showing li:nth-child(9), #offcanvas-navbar.show li:nth-child(9) { animation-delay: .27s; }
#offcanvas-navbar.showing li:nth-child(10), #offcanvas-navbar.show li:nth-child(10) { animation-delay: .30s; }

/* =============================================
   CARRITO OFFCANVAS — Rediseño
   ============================================= */

/* ── Container ── */
#offcanvas-cart{
    background: linear-gradient(170deg, #0d1117 0%, #111a2e 50%, #0d1117 100%);
    border-left: 1px solid rgba(56, 189, 248, .08);
    --cart-accent: var(--color-primary-light, #03A9F4);
}

/* ── Header ── */
#offcanvas-cart .offcanvas-header{
    background: transparent;
    border-bottom: 1px solid rgba(255,255,255,.07);
    padding: 1rem 1.25rem;
}

#offcanvas-cart .offcanvas-title{
    color: #fff;
    font-size: 1.1rem;
    font-weight: 600;
    letter-spacing: .01em;
}

#offcanvas-cart .cart-header-icon{
    color: var(--cart-accent);
    font-size: 1rem;
}

#offcanvas-cart .cart-count-badge{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 99px;
    background: var(--cart-accent);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
}

#offcanvas-cart .btn-close{
    opacity: .4;
    filter: invert(1);
    transition: opacity .15s ease;
}
#offcanvas-cart .btn-close:hover{ opacity: 1; }

/* ── Body layout ── */
#offcanvas-cart .offcanvas-body{
    display: flex;
    flex-direction: column;
}

#offcanvas-cart .cart-list{
    flex: 1;
    overflow-y: auto;
}

#offcanvas-cart .widget_shopping_cart_content{
    height: 100%;
    display: flex;
    flex-direction: column;
}

#offcanvas-cart .woocommerce-mini-cart{
    flex: 1;
    overflow-y: auto;
    padding: .75rem;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* ── Product cards ── */
#offcanvas-cart .woocommerce-mini-cart-item{
    color: #fff;
    background: rgba(255,255,255,.035);
    border: 1px solid rgba(255,255,255,.06) !important;
    border-radius: 12px;
    padding: .85rem !important;
    transition: all .2s ease;
}

#offcanvas-cart .woocommerce-mini-cart-item:hover{
    background: rgba(255,255,255,.06);
    border-color: rgba(255,255,255,.1) !important;
    transform: translateY(-1px);
}

/* ── Product image ── */
#offcanvas-cart .item-image img{
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,.5);
    transition: box-shadow .2s ease;
}

#offcanvas-cart .woocommerce-mini-cart-item:hover .item-image img{
    box-shadow: 0 4px 16px rgba(3,169,244,.15);
}

/* ── Product info ── */
#offcanvas-cart .item-name{
    font-weight: 500;
    color: #fff;
}

#offcanvas-cart .cart-product-title{
    color: #fff !important;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
}

#offcanvas-cart .cart-product-excerpt{
    color: rgba(255,255,255,.35) !important;
    font-size: 12px;
}

/* ── Quantity display ── */
#offcanvas-cart .item-quantity .quantity{
    font-size: 13px;
    color: rgba(255,255,255,.5);
}

/* Mismo tamano que el "2 ×" de al lado: la regla global .woocommerce-Price-amount (16px) lo agrandaba. Solo queda
   para cantidades mayores a 1 (la venta de a uno no repite el precio, ver add_minicart_quantity_fields) */
#offcanvas-cart .item-quantity .quantity .woocommerce-Price-amount{
    color: rgba(255,255,255,.7);
    font-size: inherit;
}

/* ── Quantity controls (unified group, transparent) ── */
#offcanvas-cart .quantity .input-group-text{
    color: #fff;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.1);
    cursor: pointer;
    transition: all .15s ease;
    border-radius: 0;
    font-size: 14px;
    padding: .3rem .6rem;
}

#offcanvas-cart .quantity .input-group-text:first-child{
    border-radius: 8px 0 0 8px;
}

#offcanvas-cart .quantity .input-group-text:last-child{
    border-radius: 0 8px 8px 0;
}

#offcanvas-cart .quantity .input-group-text:hover{
    background: rgba(56,189,248,.15);
    border-color: rgba(56,189,248,.3);
    color: #38bdf8;
}

#offcanvas-cart .quantity .form-control{
    background: rgba(255,255,255,.04);
    border-color: rgba(255,255,255,.1);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    text-align: center;
    border-radius: 0;
}

/* ── Price total per item ── */
#offcanvas-cart .bootscore-custom-render-total{
    color: #fff;
    font-weight: 700;
    font-size: 14px;
}

/* ── Columna del precio: precio arriba y tacho abajo, los dos en el flujo (25/09/2026) ──
   El tacho iba con position:absolute al pie de la fila y, con el precio tachado de las ofertas (dos renglones), a
   320-360 px se montaba sobre el precio: la fila (alto de la miniatura, 55 px) no alcanzaba para los dos. En el flujo,
   si no entran la fila se estira; en compu entran y el tacho queda abajo como antes, alineado con el precio. */
#offcanvas-cart .remove{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
}

#offcanvas-cart .remove .bootscore-custom-render-total{
    margin-bottom: 0 !important;
}

/* ── Remove button — same transparent style as quantity ── */
#offcanvas-cart .remove_from_cart_button{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.1);
    opacity: 1;
    transition: all .2s ease;
    font-size: 14px;
    color: rgba(255,255,255,.6) !important;
    flex-shrink: 0;
    margin-top: auto;
}

#offcanvas-cart .remove_from_cart_button:hover{
    opacity: 1;
    background: rgba(239,68,68,.12);
    border-color: rgba(239,68,68,.3);
    color: #ef4444 !important;
    transform: scale(1.05);
}

/* ── Quantity controls — same height as trash button ── */
#offcanvas-cart .quantity .input-group{
    height: 32px;
    max-width: 120px;
    border-radius: 8px;
    overflow: hidden;
}

#offcanvas-cart .quantity .input-group-text,
#offcanvas-cart .quantity .form-control{
    height: 32px;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 32px;
}

#offcanvas-cart .quantity .form-control::-webkit-outer-spin-button,
#offcanvas-cart .quantity .form-control::-webkit-inner-spin-button{
    -webkit-appearance: none;
    margin: 0;
}
#offcanvas-cart .quantity .form-control{
    -moz-appearance: textfield;
}

/* ── "Seguir comprando" (25/09/2026): va al final de la lista, dentro del scroll ──
   Antes era una franja fija de 86 px entre la lista y el pie: a 320x568 la lista de juegos quedaba en 154-195 px.
   Es un boton (cierra el panel, no navega): como enlace a /tienda/ hacia precargar la tienda sin usarla. */
#offcanvas-cart .cart-continue-shopping{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: .5rem 0 .25rem;
}

#offcanvas-cart .continue-shopping-link{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: rgba(255,255,255,.4);
    background: transparent;
    font: inherit;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.5;
    text-decoration: none;
    cursor: pointer;
    padding: .5rem 1rem;
    border-radius: 8px;
    border: 1px solid rgba(255,255,255,.08);
    transition: all .2s ease;
}

#offcanvas-cart .continue-shopping-link:hover{
    color: rgba(255,255,255,.8);
    border-color: rgba(255,255,255,.15);
    background: rgba(255,255,255,.04);
}

#offcanvas-cart .continue-shopping-link i{
    font-size: 11px;
    transition: transform .2s ease;
}

#offcanvas-cart .continue-shopping-link:hover i{
    transform: translateX(-3px);
}

/* ── Stock badges ── */
#offcanvas-cart .cart-badge .badge{
    font-size: 10px;
    font-weight: 600;
    border-radius: 6px;
}

/* ── List group borders reset ── */
#offcanvas-cart .list-group-flush > .list-group-item{
    border-color: transparent;
    background: transparent;
}

/* ── Cart footer ── */
#offcanvas-cart .cart-footer{
    background: rgba(0,0,0,.3) !important;
    color: #fff;
    border-top: 1px solid rgba(255,255,255,.07);
    padding: 1.15rem 1rem !important;
}

#offcanvas-cart .woocommerce-mini-cart__total{
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: .6rem;
}

#offcanvas-cart .woocommerce-mini-cart__total .woocommerce-Price-amount{
    color: #fff;
    font-weight: 700;
}

/* ── Desglose arriba del Total (24/09/2026): solo cuando hay descuentos (woocommerce/cart/mini-cart.php).
   Renglones chicos y apretados: en celulares bajos la lista de juegos ya queda en ~195 px ── */
#offcanvas-cart .ms-mc-desglose{
    margin: 0 0 .3rem;
    font-size: 13px;
    line-height: 1.25;
}

#offcanvas-cart .ms-mc-desglose__fila{
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    color: #94a3b8;
}

#offcanvas-cart .ms-mc-desglose__fila + .ms-mc-desglose__fila{
    margin-top: 2px;
}

#offcanvas-cart .ms-mc-desglose dt{
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
}

#offcanvas-cart .ms-mc-desglose dd{
    flex: 0 0 auto;
    margin: 0;
    white-space: nowrap;
    font-family: "Space Grotesk", sans-serif;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

/* La regla global .woocommerce-Price-amount (16px) agrandaba los montos chicos hasta el tamano del Total */
#offcanvas-cart .ms-mc-desglose .woocommerce-Price-amount{
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}

#offcanvas-cart .ms-mc-desglose__fila--descuento{
    color: #10b981;
}

/* 700 y no 600: Space Grotesk esta alojada solo en 400, 500 y 700 */
#offcanvas-cart .ms-mc-desglose__fila--descuento dd{
    font-weight: 700;
}

/* ── Progress bar (discount threshold) ── */
#offcanvas-cart .cart-footer .progress{
    background: rgba(255,255,255,.08);
    border-radius: 99px;
    height: 8px;
    overflow: hidden;
}

#offcanvas-cart .cart-footer .progress-bar{
    background: linear-gradient(90deg, var(--cart-accent), #38bdf8);
    border-radius: 99px;
    box-shadow: 0 0 12px rgba(3,169,244,.35);
}

/* ── "Ver carrito" button ── */
#offcanvas-cart .buttons .btn-secondary{
    color: rgba(255,255,255,.75);
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 10px;
    transition: all .25s ease;
    font-weight: 500;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px); /* 25/09/2026: Safari 17 o menos (iPhone incluido) solo entiende el prefijado */
}

#offcanvas-cart .buttons .btn-secondary:hover{
    color: #fff;
    background: rgba(255,255,255,.08);
    border-color: rgba(56,189,248,.3);
    box-shadow: 0 0 12px rgba(56,189,248,.1);
    transform: translateY(-1px);
}

/* ── "Finalizar compra" button ── */
#offcanvas-cart .buttons .btn-primary{
    background: linear-gradient(135deg, #0ea5e9 0%, #38bdf8 100%);
    border: none;
    border-radius: 10px;
    font-weight: 600;
    box-shadow: 0 4px 16px rgba(14,165,233,.3);
    transition: all .25s ease;
}

#offcanvas-cart .buttons .btn-primary:hover{
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(14,165,233,.45);
}

/* ── Pantallas bajas (celulares de 568 a 740 px de alto, notebooks chicas), 25/09/2026 ──
   El encabezado y el pie (desglose, total, barra de descuento y boton) quedan fijos y se comian el alto: a 320x568
   con descuento el pie media 260 px. Mas apretados, sin achicar nada por debajo de lo legible ni el boton tactil. */
@media (max-height: 740px){
    #offcanvas-cart .offcanvas-header{
        padding-top: .7rem;
        padding-bottom: .7rem;
    }

    #offcanvas-cart .cart-footer{
        padding: .75rem 1rem !important;
    }

    #offcanvas-cart .woocommerce-mini-cart__total{
        margin-bottom: .35rem;
    }

    #offcanvas-cart .cart-footer .barra-descuento-wrapper{
        padding: 4px 0 8px;
    }

    #offcanvas-cart .cart-footer .barra-descuento-title{
        margin-bottom: 6px;
        font-size: 13.5px;
        line-height: 1.3;
    }

    #offcanvas-cart .cart-footer .barra-descuento-meta{
        margin-top: 5px;
    }

    #offcanvas-cart .cart-footer .barra-descuento-meta > p{
        line-height: 1.35;
    }

    #offcanvas-cart .cart-footer .barra-descuento-success{
        font-size: 12px;
    }
}

/* ── Empty cart state ── */
#offcanvas-cart .woocommerce-mini-cart__empty-message{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 4rem 2rem;
    flex: 1;
    background: transparent;
    border: none;
    margin: 0;
}

#offcanvas-cart .empty-cart-icon{
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.06);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.5rem;
}

#offcanvas-cart .empty-cart-icon i{
    font-size: 28px;
    color: rgba(255,255,255,.15);
}

#offcanvas-cart .empty-cart-title{
    color: rgba(255,255,255,.7);
    font-size: 16px;
    font-weight: 600;
    margin-bottom: .35rem;
}

#offcanvas-cart .empty-cart-subtitle{
    color: rgba(255,255,255,.3);
    font-size: 13px;
    margin-bottom: 1.5rem;
    max-width: 220px;
    line-height: 1.5;
}

#offcanvas-cart .empty-cart-btn{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: .6rem 1.25rem;
    border-radius: 10px;
    background: linear-gradient(135deg, #0ea5e9 0%, #38bdf8 100%);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: all .25s ease;
    box-shadow: 0 4px 16px rgba(14,165,233,.3);
}

#offcanvas-cart .empty-cart-btn:hover{
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(14,165,233,.45);
    color: #fff;
}

/* ── Block UI overlay (AJAX loading) ── */
#offcanvas-cart .blockUI.blockOverlay,
#offcanvas-cart .loader{
    background-color: rgba(13,17,23,.85) !important;
    opacity: 1 !important;
    border-radius: 12px;
}

/* ── Slide-in animation for cart items ── */
#offcanvas-cart.showing .woocommerce-mini-cart-item,
#offcanvas-cart.show .woocommerce-mini-cart-item{
    animation: menuItemSlideIn .3s ease forwards;
}
#offcanvas-cart.showing .woocommerce-mini-cart-item:nth-child(1),
#offcanvas-cart.show .woocommerce-mini-cart-item:nth-child(1){ animation-delay: .05s; }
#offcanvas-cart.showing .woocommerce-mini-cart-item:nth-child(2),
#offcanvas-cart.show .woocommerce-mini-cart-item:nth-child(2){ animation-delay: .1s; }
#offcanvas-cart.showing .woocommerce-mini-cart-item:nth-child(3),
#offcanvas-cart.show .woocommerce-mini-cart-item:nth-child(3){ animation-delay: .15s; }
#offcanvas-cart.showing .woocommerce-mini-cart-item:nth-child(4),
#offcanvas-cart.show .woocommerce-mini-cart-item:nth-child(4){ animation-delay: .2s; }
#offcanvas-cart.showing .woocommerce-mini-cart-item:nth-child(5),
#offcanvas-cart.show .woocommerce-mini-cart-item:nth-child(5){ animation-delay: .25s; }

/* Items hidden before animation */
#offcanvas-cart .woocommerce-mini-cart-item{
    opacity: 0;
}
#offcanvas-cart.show .woocommerce-mini-cart-item{
    opacity: 1;
}

/* ── Quantity buttons (global — outside offcanvas) ── */
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button{
    background-color: var(--color-dark) !important;
    border: 1px solid var(--color-dark) !important;
}

.quantity .input-group-text,
.item-quantity .input-group-text{
    color: #fff;
    background-color: var(--color-medium-dark);
    border: 1px solid var(--color-medium-dark);
}

.quantity .form-control{
    background-color: var(--color-dark);
    border-color: var(--color-medium-dark);
    color: #fff;
}

.list-group-flush > .list-group-item{
    border-color: var(--color-medium-light);
}

/* ── Cart footer (global fallback) ── */
.cart-footer{
    background-color: var(--color-very-dark) !important;
    color: #fff;
    border-top: 1px solid var(--color-medium-dark);
}


.my-offcanvas-account .woocommerce-MyAccount-content a,
.my-offcanvas-account .woocommerce-MyAccount-content{
    color: #fff
}

.my-offcanvas-account .list-group-item{
    color: #fff;
    background-color: var(--color-dark);
    border-color: var(--color-very-dark);
}

.woocommerce-billing-fields__field-wrapper{
    margin-bottom: 1rem
}


#payment a{
    color: #fff;
    opacity: 0.82;
    font-weight: 500
}


.woocommerce .blockUI.blockOverlay,.woocommerce .loader,#offcanvas-cart .blockUI.blockOverlay,#offcanvas-cart .loader {
    background-color: var(--color-medium) !important;
    opacity: 1 !important;
    border-radius: 20px
}

.woocommerce .blockUI.blockOverlay:before,.woocommerce .loader:before,#offcanvas-cart .blockUI.blockOverlay:before,#offcanvas-cart .loader:before {
    color: var(--color)
}

#order_review .product-name{
    position: relative;
}

#order_review .product-quantity {
    align-items: center;
    background: #fff;
    border: 2px solid hsla(0,0%,7%,.11);
    border-radius: 1em;
    box-shadow: 0 0 0 2px #fff;
    color: #000;
    display: flex;
    justify-content: center;
    line-height: 1;
    min-height: 20px;
    min-width: 20px;
    padding: 0 .4em;
    position: absolute;
    left: 40px;
    top: 7px;
    transform: translate(50%,-50%);
    white-space: nowrap;
    z-index: 1;
}

.alert-info, .must-log-in, .woocommerce-info, .woocommerce-noreviews {
    --bs-alert-color: #cff4fc;
    --bs-alert-bg: rgba(13, 202, 240, 0.1);
    --bs-alert-border-color: rgba(13, 202, 240, 0.3);
    --bs-alert-link-color: #9eeaf9;
}

.alert-danger, .woocommerce-error, .wc-stripe-error {
    --bs-alert-color: #f8d7da;
    --bs-alert-bg: rgba(220, 53, 69, 0.1);
    --bs-alert-border-color: rgba(220, 53, 69, 0.3);
    --bs-alert-link-color: #f1aeb5;
}

.alert-success, .woocommerce-message, .woocommerce-thankyou-order-details {
    --bs-alert-color: #d1e7dd;
    --bs-alert-bg: rgba(25, 135, 84, 0.1);
    --bs-alert-border-color: rgba(25, 135, 84, 0.3);
    --bs-alert-link-color: #a3cfbb;
}

.alert-warning {
    --bs-alert-color: #fff3cd;
    --bs-alert-bg: rgba(255, 193, 7, 0.1);
    --bs-alert-border-color: rgba(255, 193, 7, 0.3);
    --bs-alert-link-color: #ffe69c;
}


.wp-block-yith-ywpar-cart-points-message img,
#yith-par-message-cart img{
    filter: invert(1)
}


.download-product a,
.product-name a{
    color: #fff
}

.woocommerce-order-details table.upload_receipt{
    background: var(--color-ultra-dark)!important;
    border:1px solid var(--color-ultra-dark)!important;
}

.woocommerce-order-details .peprodev_woocommerce_receipt_uploader{
    padding: 1rem;
}

.woocommerce-order-details .peprodev_woocommerce_receipt_uploader,
.woocommerce .woocommerce-customer-details address {
    background: var(--color-ultra-dark)!important;
    border:1px solid var(--color-ultra-dark)!important;
    border-radius: 20px;
    margin-bottom: 1rem
}

.woo-products-products .woo-products-product-thumbnail{
    margin-bottom: 0.5rem
}

.woocommerce div.product span.price, .card .price,
div.product span.price ins,
div.product span.price del{
    display: block!important;
    line-height: 1
}

#yith-wcwl-popup-message {
    background-color: var(--color-ultra-dark);
    box-shadow: 1px 0 4px rgba(255,255,255,0.2);
}

.wishlist_table.modern_grid.wishlist_view li .item-details:before{
    display: none
}


.wishlist_table.modern_grid li .product-thumbnail,
.wishlist_table.modern_grid li .item-details{
    display: block;
}

.wishlist_table.modern_grid li .product-thumbnail,
.wishlist_table.modern_grid li .item-details{
    width: 100%
}

.wishlist_table.modern_grid li .item-details .item-details-wrapper{
    padding: 0.5rem 0
}

.checkout-product-thumbnail{
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 300
}


.wp-block-search__inside-wrapper {
    display: flex;
    padding: 0.5rem 0;
}

.wp-block-search__inside-wrapper input[type="search"]:focus{
    box-shadow: none
}


.checkout-product-thumbnail img{
    width: 50px
}


.checkout_coupon button.button{
    height: 3.125em;
    color: #fff;
    background-color: transparent;
    border-color: var(--color-medium);
}

.wc-block-components-sidebar-layout .wc-block-components-main{
    background-color: var(--color-medium-dark);
    padding: 1rem;
    border-radius: 20px
}
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper{
    background: linear-gradient(170deg, #0d1117 0%, #111a2e 60%, #0d1117 100%);
    padding: 1.5rem;
    border-radius: 20px;
    border: 1px solid rgba(56,189,248,.08);
    box-shadow: 0 8px 32px rgba(0,0,0,.3);
}

.woocommerce form .form-row.woocommerce-validated .woocommerce-terms-and-conditions-checkbox-text {
    color: #fff;
}


.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce form .form-row input.input-text,
textarea, select, input[type=text],input[type=tel], input[type=email], input[type=password], input[type=search],
.wc-block-checkout__add-note .wc-block-components-textarea,
.wc-blocks-components-select .wc-blocks-components-select__select,
.wc-block-components-form .wc-block-components-text-input input[type=text],
.wc-block-components-form .wc-block-components-text-input input[type=tel],
.wc-block-components-form .wc-block-components-text-input input[type=email],
.wc-block-components-form .wc-block-components-text-input input[type=password]
{
    border-radius: 4px;
    box-sizing: border-box;
    color: #2b2d2f;
    font-family: inherit;
    font-size: 1em;
    height: 3.125em;
    line-height: 1em;
    margin: 0;
    min-height: 0;
    padding: 1em .5em;
    width: 100%;
    background-color: var(--color-dark)!important;
    color: #fff!important;
    border: 0!important;
    box-shadow: inset 0 0 0 1px var(--color-medium)
}


.woocommerce form .form-row.woocommerce-invalid label {
    color: #fff;
}


.wc-blocks-components-select .wc-blocks-components-select__label,
.wc-block-components-form .wc-block-components-text-input label, .wc-block-components-text-input label{
    color: #fff!important
}

.wc-blocks-components-select .wc-blocks-components-select__expand{
    fill: #fff
}

.woocommerce-product-gallery__image, .woocommerce div.product div.images .flex-control-thumbs img{
    border-radius: 20px
}

.woocommerce div.product div.summary{
    backdrop-filter: blur(60px) saturate(100%);
    -webkit-backdrop-filter: blur(60px) saturate(100%);
    background-color: transparent;
    background-image: linear-gradient(1turn, var(--color-dark) 0, rgba(39, 39, 39, 0) 70%);
    border-radius: 20px;
    padding: 1rem;

}




.woocommerce div.product p.price > span > bdi,
.woocommerce div.product p.price ins,
.woocommerce div.product p.price ins .woocommerce-Price-amount,
.woocommerce div.product p.price{
    font-size: 35px;
    color: #fff
}

.woocommerce div.product p.price del{
    text-decoration: none
}

.woocommerce div.product p.price del .woocommerce-Price-amount{
    text-decoration: line-through
}


.nav-tabs .nav-link.active{
    background-color: var(--color-dark);
    color: #fff
}

.card {

    --bs-card-border-width: var(--bs-border-width);
    --bs-card-border-color: var(--color-dark);
    --bs-card-bg: var(--color-dark)

}


.woocommerce div.product span.price, .card .price,
.woocommerce div.product .card-body{
    color: #fff
}


.list-group {
    --bs-list-group-color: #fff;
    --bs-list-group-bg: var(--color-ultra-dark);
    --bs-list-group-border-color: var(--color-medium-dark);
    --bs-list-group-border-width: var(--bs-border-width);
    --bs-list-group-border-radius: 20px;

    --bs-list-group-action-color: #fff;
    --bs-list-group-action-hover-color: #fff;
    --bs-list-group-action-hover-bg: var(--color-very-dark);

    --bs-list-group-action-active-color: #fff;
    --bs-list-group-action-active-bg:  var(--color-very-dark);


}

.list-group-item[aria-current="page"]{
    background-color: var(--color-very-dark)
}


.woocommerce div.product .product_title{
    font-size: 26px;
    margin-bottom: 1rem
}

.subinfos {
    align-items: center;
    background-color: hsla(0, 0%, 6%, .3);
    border-radius: 100px;
    display: flex;
    font-size: 13px;
    gap: 10px;
    height: 51px;
    justify-content: space-evenly;
    padding: 0 20px;
    margin-bottom: 1rem;
}

.platform-container{
    align-items: center;
    display: flex;
    gap: 10px;
}

.spacer {
    background-color: hsla(0,0%,100%,.15);
    height: 20px;
    width: 1px;
}

.check-info{
    color: #6dd432;
    padding-right: 5px
}


.pagination {

    --bs-pagination-color: #fff;
    --bs-pagination-bg: var(--color-very-dark);
    --bs-pagination-border-color: var(--color-ultra-dark);
    --bs-pagination-hover-color: #fff;
    --bs-pagination-hover-bg: var(--color-ultra-dark);
    --bs-pagination-hover-border-color: var(--color-very-dark);
    --bs-pagination-focus-color: #fff;
    --bs-pagination-focus-bg: var(--color-very-dark);
    --bs-pagination-focus-box-shadow: none;
    --bs-pagination-active-color: #fff;
    --bs-pagination-active-bg: var(--color-ultra-dark);
    --bs-pagination-active-border-color: var(--color-very-dark);
    --bs-pagination-disabled-color: #ccc;
    --bs-pagination-disabled-bg: var(--color-medium);
    --bs-pagination-disabled-border-color: var(--color-medium-dark);

}



.elementor-toggle .elementor-tab-title{
    padding: 20px;
    border-radius: 15px;
}

.elementor-toggle .elementor-tab-title.elementor-active{
    border-radius: 15px 15px 0 0
}

.elementor-toggle .elementor-tab-content{
    border-radius:  0 0 15px 15px
}

.border-radius{
    border-radius: 20px
}

.wpcf7-form label{
    display: block;
}

.wpcf7-form textarea,
.wpcf7-form input[type="text"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="email"]{
    width: 100%;
    padding: 10px 10px
}

.wpcf7-form textarea{
    max-height: 120px
}

.wpcf7-form input[type="submit"]{
    padding: 0.25rem 2.5rem;
    border-radius: 999px;
    background: var(--fire-gradient);
    border: 0
}

.wpcf7-form input[type="submit"]:hover{
    background-color: var(--color-button-hover)
}



.joinchat {
    --bottom: 50px;
    --sep: 6px;
    --s: 60px;
    position: fixed;
    display: none;
    z-index: 1000;
    right: var(--sep);
    bottom: var(--bottom);
    font: normal normal normal 16px/1.625em var(--joinchat-font);
    letter-spacing: 0;
    animation: joinchat_show .5s cubic-bezier(.18,.89,.32,1.28) 10ms both;
    transform: scale3d(0,0,0);
    transform-origin: calc(var(--s)/-2) calc(var(--s)/-4);
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    touch-action: manipulation;
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: rgb(0 0 0/0);
}

.joinchat.view{
    display: block;
    transform: scale3d(1, 1, 1);
}

.joinchat__button {
    position: absolute;
    z-index: 2;
    bottom: 8px;
    right: 8px;
    height: var(--s);
    min-width: var(--s);
    background: #25d366;
    color: inherit;
    border-radius: calc(var(--s)/2);
    box-shadow: 1px 6px 24px 0 rgba(7,94,84,.24);
    cursor: pointer;
    transition: background-color .2s linear;
}

.joinchat__button__open {
    width: var(--s);
    height: var(--s);
    border-radius: 50%;
    background: rgb(0 0 0/0) var(--joinchat-ico) 50% no-repeat;
    background-size: 60%;
    overflow: hidden;
}

@keyframes joinchat_show {
    0% {
        transform: scale3d(0,0,0)
    }

    to {
        transform: scaleX(1)
    }
}

.logo-footer{
    width: 300px;
    max-width: 100%;

}

.cont-search-toggler{
    position: relative;
}

#collapse-search .wp-block-search__label{
    display: none
}

#collapse-search {
    width: 300px;
    left: -300px;
    top: 50%;
    transform: translateY(-50%);
}

#collapse-search .wp-block-search__input{
    background: var(--fire-gradient);
    background-color: var(--color)!important;
    border-radius: 99px;
    padding: 0.65rem 1rem;
    height: auto;

}

#collapse-search .wp-block-search__input::placeholder{
    color: #fff
}

#collapse-search .wp-block-search__button{
    display: none
}

.dgwt-wcas-search-input:focus {
    outline: none !important;
    border-color: #38bdf8 !important;
    box-shadow:
        0 0 0 3px rgba(56, 189, 248, 0.35),
        0 8px 30px rgba(56, 189, 248, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

/* My Account page form overrides */
.woocommerce-account #reg_billing_dni_facturante {
    width: 100%
}

.woocommerce-account .ms-auth-card button.woocommerce-button {
    width: 100%;
    border-radius: 45px;
    background: var(--fire-gradient);
    color: #fff
}

.woocommerce-account .ms-auth-card button.woocommerce-button:hover {
    background: linear-gradient(10deg, #0288D1, transparent) #1a3de0 !important;
    filter: brightness(1.1);
}



.full-slider .slide-inner{
	padding: 0!important
}

.full-slider .swiper-slide-inner,
.full-slider .swiper-slide img{
	height: calc(100vh - var(--wp-admin--admin-bar--height, 0px))!important;
		object-fit: cover; 
		max-height: 650px;
}

.home #masthead{
	position: fixed;
	width: 100%;
}

.home #content{
	margin-top: 0!important;
	padding-top: 0!important
}

.cut-page:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 60px;
    background: #0B1120; /* navy del sistema, mismo criterio que .page-banner:after */
    clip-path: polygon(0 0, 100% 100%, 0% 100%);
	z-index: 1001
}



.slider-caption{
	position:absolute;
	width: 100%;
	top: 50%;
	left: 50%;
	transform: translate(-50% , -50%);
	padding: 0 1.5rem;
	z-index: 1001
}

.slider-caption h2{
	font-size: 2.5rem;
	    text-shadow: 1px 1px black;
}

.slider-caption p{
	font-size: 1.75rem;
	    text-shadow: 1px 1px black;
}


@media screen and (orientation: portrait) {

	
	.full-slider .swiper-slide{
	height: auto!important;
}


.full-slider .swiper-slide-inner,
.full-slider .swiper-slide img{
	height: auto!important;
	aspect-ratio: 1920/1080;
	min-height: 350px; 

}
	
}

@media (max-width: 600px){
	.cut-page:after {
		height: 35px
	}
	
	.slider-caption1{
			transform: translate(-50%);
		top: auto;
		bottom: 3rem
	}
	
	.slider-caption h2{
	font-size: 2rem;
		line-height:1
}

.slider-caption p{
	font-size: 1.25rem;
	line-height:1
}
	
}

@media (max-width: 575px){
		.slider-caption1{
		
		bottom: 2rem
	}
	
	
		.slider-caption h2{
	font-size: 1.5rem;
}

.slider-caption p{
	font-size: 1rem;
	line-height:1
}
	
}





@media (min-width: 992px){
    .to-fixed .top-nav{
        opacity: 0;
        transition: 0s;
        position: absolute;
        visibility: hidden;
    }

    .to-fixed .main-nav{
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        transform: translateY(-50%);
        bottom: auto;
        top: 50%;
    }  
}


@media (min-width: 1400px){
    .page-banner img{
        max-height: 700px
    }
}


@media (max-width: 1199px){
    #bootscore-navbar li a, #bootscore-navbar-m li a{
        --bs-navbar-nav-link-padding-x: 1rem
    }

    .cart-toggler .cart-total{
        display: none!important
    }
}

@media (max-width: 991px){
    .navbar-expand-lg .offcanvas .offcanvas-body{
        display: flex;
        flex-direction: column;
        align-items: normal;
        padding: 0;
    }

    /* ── Main nav (categories) inside offcanvas ── */
    .main-nav{
        order: -1;
        position: relative;
        transform: none;
        padding: .6rem .85rem !important;
        border-radius: 0 !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background-color: transparent !important;
        background: none !important;
    }

    #offcanvas-navbar #bootscore-navbar{
        flex-direction: column !important;
        gap: 2px;
    }

    #offcanvas-navbar #bootscore-navbar li{
        opacity: 0;
    }

    #offcanvas-navbar #bootscore-navbar li a{
        --bs-nav-link-padding-x: 1rem;
        --bs-nav-link-padding-y: .8rem;
        border-radius: 10px;
        font-size: 15px;
        font-weight: 500;
        color: rgba(255,255,255,.85);
        transition: all .2s ease;
        position: relative;
        overflow: hidden;
    }

    /* Left accent bar (hidden by default) */
    #offcanvas-navbar #bootscore-navbar li a::before{
        content: "";
        position: absolute;
        left: 0;
        top: 25%;
        height: 50%;
        width: 3px;
        border-radius: 0 3px 3px 0;
        background: var(--menu-accent);
        opacity: 0;
        transition: opacity .2s ease;
    }

    /* Icon styling */
    #offcanvas-navbar #bootscore-navbar li a i{
        width: 24px;
        text-align: center;
        font-size: 17px;
        color: rgba(255,255,255,.45);
        transition: all .2s ease;
    }

    /* Hover state */
    #offcanvas-navbar #bootscore-navbar li a:hover{
        background-color: rgba(255,255,255,.06);
        color: #fff;
        transform: translateX(3px);
    }

    #offcanvas-navbar #bootscore-navbar li a:hover::before{
        opacity: 1;
    }

    #offcanvas-navbar #bootscore-navbar li a:hover i{
        color: var(--menu-accent);
    }

    /* Active/current item - only accent bar + icon, no background */
    #offcanvas-navbar #bootscore-navbar li.current-menu-item a{
        background: none !important;
        background-color: transparent !important;
        color: #fff;
    }

    #offcanvas-navbar #bootscore-navbar li.current-menu-item a::before{
        opacity: 1;
    }

    #offcanvas-navbar #bootscore-navbar li.current-menu-item a i{
        color: var(--menu-accent);
    }

    /* ── Top nav (secondary links) inside offcanvas ── */
    #offcanvas-navbar .top-nav{
        border-top: 1px solid rgba(255,255,255,.06);
        padding: .4rem .85rem !important;
    }

    #offcanvas-navbar #menu-top-menu{
        flex-direction: column;
        gap: 1px;
    }

    #offcanvas-navbar #menu-top-menu li{
        opacity: 0;
    }

    #offcanvas-navbar #menu-top-menu li a{
        display: block;
        padding: .55rem 1rem;
        border-radius: 8px;
        font-size: 13.5px;
        color: rgba(255,255,255,.7);
        transition: all .2s ease;
    }

    #offcanvas-navbar #menu-top-menu li a:hover{
        color: #fff;
        background-color: rgba(255,255,255,.05);
        transform: translateX(3px);
    }
    
    .menu-mobile #bootscore-navbar-m{
        flex-direction: row;
    }
    
  
  
    .menu-mobile{
            position: absolute;
    width: 100%;
    top: 100%;
    left: 0;
        transition: opacity .15s linear;
    }
  
  
    .to-fixed .menu-mobile{
        opacity: 0;
                   backdrop-filter: blur(60px) saturate(100%);
    -webkit-backdrop-filter: blur(60px) saturate(100%);
    background-color: transparent;       
    }
    
  .menu-mobile #bootscore-navbar-m li a {
    --bs-nav-link-padding-y: 0.25rem;
}
    

}


@media (max-width: 767px){ 
    
      .menu-mobile .fa-windows, .menu-mobile  .fa-bookmark, .menu-mobile .fa-xbox{
        display: none;
    }
    
    
}


@media (max-width: 575px){
    
    
    .menu-mobile #bootscore-navbar-m li a{
                 --bs-nav-link-padding-x: 0.5rem ;
    }
    
    .woocommerce #content div.product div.images{
        display: none
    }
    .woocommerce .woocommerce-content > div.product {
        margin-top: 0px;
    }
    .woocommerce #masthead{
        position: -webkit-sticky!important; /* 25/09/2026: iOS 12 o menos solo entiende el prefijado; en los demas gana la linea de abajo */
        position: sticky!important
    }

    .logo-footer{
        margin: auto
    }
    
    
      .page-banner .post-thumbnail img {
        min-height: 400px;
    }
    
}


@media (max-width: 500px){
    .cont-search-toggler{
        position: static;
    }
    #collapse-search {
        width: 300px;
        left: 50%;
        top: auto;
        transform: translate(-50%, 100%);
        bottom: 15px;
    } 

}


@media (max-width: 480px){
    
    
      .menu-mobile #bootscore-navbar-m li a{
                font-size: 14px
    }
    
    .add-to-cart-container .button{
        padding: 0.25rem 1rem
    }
    .woocommerce .card .woocommerce-loop-product__title,
    .woo-products-product-title,
    .wc-block-product-template .wp-block-post-title{
        flex: 0 0 auto;
        width: 100%;
    }
    
    .woocommerce .card a.woocommerce-LoopProduct-link.woocommerce-loop-product__link{
            flex-wrap: wrap
    }
}


@media (max-width: 411px){
    .site-branding img {
        width: 140px;
    }
}


/* =====================================================
   MUNDOSTEAM - MY ACCOUNT REDESIGN
   ===================================================== */

/* --- ACCOUNT NAVIGATION (Sidebar) --- */
.ms-account-nav {
    background-color: var(--color-ultra-dark);
    border-radius: 20px;
    overflow: hidden;
}

.ms-account-nav__header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 1.25rem;
    border-bottom: 1px solid var(--color-medium-dark);
}

.ms-account-nav__avatar img {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 2px solid var(--color-primary-light);
    object-fit: cover;
}

.ms-account-nav__user-info {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.ms-account-nav__greeting {
    font-weight: 600;
    font-size: 15px;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ms-account-nav__email {
    font-size: 13px;
    color: var(--color-light);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ms-account-nav__list {
    list-style: none;
    padding: 0.5rem 0;
    margin: 0;
}

.ms-account-nav__item a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0.65rem 1.25rem;
    color: var(--color-very-light);
    text-decoration: none;
    font-size: 14px;
    font-weight: 400;
    transition: all 0.15s ease;
    border-left: 3px solid transparent;
}

.ms-account-nav__item a:hover {
    background-color: var(--color-very-dark);
    color: #fff;
}

.ms-account-nav__item.is-active a {
    background-color: var(--color-very-dark);
    color: #fff;
    border-left-color: var(--color-primary-light);
    font-weight: 500;
}

.ms-account-nav__item.is-active .ms-account-nav__icon {
    color: var(--color-primary-light) !important;
}

.ms-account-nav__icon {
    width: 20px;
    text-align: center;
    font-size: 14px !important;
    color: var(--color-medium-light) !important;
    transition: color 0.15s ease;
}

.ms-account-nav__item a:hover .ms-account-nav__icon {
    color: var(--color-primary-light) !important;
}

.ms-account-nav__separator {
    height: 1px;
    background-color: var(--color-medium-dark);
    margin: 0.5rem 1.25rem;
}

.ms-account-nav__item.is-logout a {
    color: var(--color-light);
}

.ms-account-nav__item.is-logout a:hover {
    color: #ef5350;
}

.ms-account-nav__item.is-logout a:hover .ms-account-nav__icon {
    color: #ef5350;
}


/* =============================================
   USER DROPDOWN MENU — Rediseño
   ============================================= */
.ms-user-dropdown{
    position: relative;
    --dd-accent: var(--color-primary-light, #03A9F4);
}

/* ── Container ── */
.ms-user-dropdown__menu{
    background: linear-gradient(170deg, #0d1117 0%, #111a2e 60%, #0d1117 100%) !important;
    border: 1px solid rgba(56,189,248,.1) !important;
    border-radius: 16px !important;
    padding: 0 !important;
    min-width: 280px !important;
    box-shadow: 0 16px 48px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.03) inset !important;
    margin-top: .5rem !important;
    overflow: hidden;
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    animation: ddFadeIn .2s ease;
}

@keyframes ddFadeIn{
    from{ opacity: 0; transform: translateY(-6px); }
    to{ opacity: 1; transform: translateY(0); }
}

/* ── User header ── */
.ms-user-dropdown__header{
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 1.15rem 1.25rem;
    background: rgba(255,255,255,.025);
}

.ms-user-dropdown__avatar{
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 2px solid var(--dd-accent);
    box-shadow: 0 0 14px rgba(3,169,244,.2);
    transition: box-shadow .2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(3,169,244,.08);
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
}

/* Fallback icon when no avatar image */
.ms-user-dropdown__avatar:not(:has(img))::after{
    content: "\f007";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 16px;
    color: var(--dd-accent);
}

.ms-user-dropdown__avatar img{
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.ms-user-dropdown__header:hover .ms-user-dropdown__avatar{
    box-shadow: 0 0 20px rgba(3,169,244,.35);
}

.ms-user-dropdown__info{
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.ms-user-dropdown__name{
    font-weight: 600;
    font-size: 15px;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
}

.ms-user-dropdown__email{
    font-size: 12px;
    color: rgba(255,255,255,.4);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Dividers ── */
.ms-user-dropdown__divider{
    height: 1px;
    background: rgba(255,255,255,.06);
    margin: 0;
}

/* ── Item groups ── */
.ms-user-dropdown__items{
    padding: .4rem;
}

/* ── Menu items ── */
.ms-user-dropdown__item{
    display: flex;
    align-items: center;
    gap: 12px;
    padding: .6rem .85rem;
    color: rgba(255,255,255,.8) !important;
    text-decoration: none !important;
    font-size: 14px;
    font-weight: 450;
    border-radius: 10px;
    transition: all .2s ease;
    position: relative;
}

.ms-user-dropdown__item:hover{
    background: rgba(255,255,255,.06);
    color: #fff !important;
    transform: translateX(2px);
}

/* ── Icons ── */
.ms-user-dropdown__item i{
    width: 20px;
    text-align: center;
    font-size: 14px;
    color: rgba(255,255,255,.35) !important;
    transition: all .2s ease;
}

.ms-user-dropdown__item:hover i{
    color: var(--dd-accent) !important;
    filter: drop-shadow(0 0 4px rgba(3,169,244,.3));
}

/* ── Logout item ── */
.ms-user-dropdown__item--logout{
    color: rgba(255,255,255,.45) !important;
}

.ms-user-dropdown__item--logout:hover{
    color: #ef5350 !important;
    background: rgba(239,68,68,.08);
}

.ms-user-dropdown__item--logout:hover i{
    color: #ef5350 !important;
    filter: drop-shadow(0 0 4px rgba(239,68,68,.3));
}


/* --- AUTH FORMS (Login, Register, Lost/Reset Password) --- */
.ms-auth-container {
    padding-top: 1rem;
}

.ms-auth-container .row {
    align-items: stretch;
}

.ms-auth-container .row > [class*="col"] {
    display: flex;
    flex-direction: column;
}

.ms-auth-card {
    background-color: var(--color-ultra-dark);
    border-radius: 20px;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.ms-auth-card form {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.ms-auth-card form .ms-btn-fire {
    margin-top: auto;
}

.ms-auth-card__header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--color-medium-dark);
}

.ms-auth-card__header h2 {
    font-size: 1.25rem;
    font-weight: 600;
    color: #fff;
    margin: 0;
    font-family: "Space Grotesk", sans-serif;
}

.ms-auth-card__header-icon {
    font-size: 1.25rem;
    color: var(--color-primary-light);
}

/* Input groups with icons */
.ms-input-group {
    border-radius: 4px;
    overflow: hidden;
}

.ms-input-group .form-control,
.ms-input-group .input-text {
    border-left: 0 !important;
}

.ms-auth-note {
    color: var(--color-light);
    font-size: 14px;
    margin-bottom: 1.25rem;
    line-height: 1.5;
}

.ms-auth-link {
    color: var(--color-primary-light) !important;
    font-size: 13px;
    text-decoration: none !important;
    transition: opacity 0.15s ease;
}

.ms-auth-link:hover {
    opacity: 0.8;
}

/* Fire gradient button */
.ms-btn-fire {
    background: var(--fire-gradient) !important;
    border: 0 !important;
    border-radius: 45px !important;
    padding: 0.65rem 1.5rem !important;
    font-weight: 600;
    color: #fff !important;
    font-size: 15px;
    transition: all 0.2s ease;
    height: auto !important;
    box-shadow: none !important;
}

.ms-btn-fire:hover {
    background: linear-gradient(10deg, #0288D1, transparent) #1a3de0 !important;
    filter: brightness(1.1);
}

/* Auth form labels - white text for readability */
.ms-auth-card .form-label {
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 0.4rem;
}

.ms-auth-card .form-label .required {
    color: var(--color-primary-light);
}

/* Auth form checkboxes */
.ms-auth-card .form-check-label {
    font-size: 13px;
    color: #fff;
}

/* Password field fix - ensure full width */
.ms-input-group .woocommerce-Input--text {
    flex: 1;
    min-width: 0;
}

/* Fix password toggle icon positioning - overlay instead of taking space */
.ms-auth-card .show-password-input,
.ms-input-group .show-password-input {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    cursor: pointer;
    color: var(--color-medium-light);
    background: none !important;
    border: none !important;
    padding: 0 !important;
    width: auto !important;
    height: auto !important;
}

/* Ensure input-group wraps password field properly */
.ms-input-group {
    position: relative;
    flex-wrap: nowrap !important;
}

/* Password input inside group should ignore the toggle button for width calc */
.ms-input-group input[type="password"] {
    padding-right: 40px !important;
}

/* Icon styling inside inputs */
.ms-input-icon {
    background-color: var(--color-dark) !important;
    border: 0 !important;
    box-shadow: inset 0 0 0 1px var(--color-medium);
    color: var(--color-light) !important;
    padding: 0 0.85rem;
    display: flex;
    align-items: center;
    font-size: 14px;
}

/* Auth card border for definition */
.ms-auth-card {
    border: 1px solid var(--color-medium-dark);
}

/* Recuerdame text */
.ms-auth-card .woocommerce-form-login__rememberme {
    display: block;
}


/* --- DASHBOARD --- */
.ms-dashboard-welcome {
    background: linear-gradient(135deg, var(--color-medium-dark) 0%, var(--color-ultra-dark) 100%);
    border-radius: 20px;
    padding: 2rem;
    border: 1px solid var(--color-medium-dark);
    position: relative;
    overflow: hidden;
}

.ms-dashboard-welcome::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 200px;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(3, 169, 244, 0.05));
    pointer-events: none;
}

.ms-dashboard-welcome__title {
    font-size: 1.5rem;
    font-weight: 400;
    color: #fff;
    margin-bottom: 0.5rem;
    font-family: "Space Grotesk", sans-serif;
}

.ms-dashboard-welcome__name {
    color: var(--color-primary-light);
    font-weight: 600;
}

.ms-dashboard-welcome__text {
    color: var(--color-light);
    font-size: 14px;
    margin-bottom: 0;
}

/* Dashboard quick-access cards */
.ms-dashboard-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    background-color: var(--color-ultra-dark);
    border-radius: 16px;
    border: 1px solid var(--color-medium-dark);
    text-decoration: none !important;
    transition: all 0.2s ease;
    height: 100%;
}

.ms-dashboard-card:hover {
    border-color: var(--color-medium);
    background-color: var(--color-very-dark);
    transform: translateY(-2px);
}

.ms-dashboard-card__icon {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: var(--fire-gradient);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: #fff;
}

.ms-dashboard-card__body {
    flex: 1;
    min-width: 0;
}

.ms-dashboard-card__title {
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    margin: 0 0 2px;
}

.ms-dashboard-card__desc {
    font-size: 13px;
    color: var(--color-light);
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ms-dashboard-card__arrow {
    flex-shrink: 0;
    color: var(--color-medium-light);
    font-size: 12px;
    transition: transform 0.2s ease;
}

.ms-dashboard-card:hover .ms-dashboard-card__arrow {
    transform: translateX(3px);
    color: var(--color-primary-light);
}

/* Hide cross-sells / related products inside mini-cart offcanvas */
#offcanvas-cart .cross-sells,
#offcanvas-cart .related,
#offcanvas-cart [class*="cross-sell"],
#offcanvas-cart .featured-products-slider {
    display: none !important;
}

/* --- ACCOUNT CONTENT AREA --- */
.ms-account-content {
    background-color: var(--color-ultra-dark);
    border-radius: 20px;
    padding: 1.5rem;
}

.woocommerce-MyAccount-content > p:first-child a {
    color: var(--color-primary-light);
}

/* Account content tables and links */
.ms-account-content a {
    color: var(--color-primary-light);
}

/* --- ACCOUNT TABLES (Orders, Downloads, etc.) --- */
.ms-account-content .woocommerce-orders-table,
.ms-account-content .woocommerce-table,
.woocommerce-MyAccount-content .woocommerce-orders-table,
.woocommerce-MyAccount-content .woocommerce-table {
    width: 100%;
    color: #fff;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
}

/* Table header */
.woocommerce-MyAccount-content .woocommerce-orders-table thead th,
.woocommerce-MyAccount-content .woocommerce-table thead th {
    background-color: var(--color-dark);
    color: var(--color-very-light);
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--color-medium-dark);
    white-space: nowrap;
}

.woocommerce-MyAccount-content .woocommerce-orders-table thead th:first-child {
    border-radius: 12px 0 0 0;
}

.woocommerce-MyAccount-content .woocommerce-orders-table thead th:last-child,
.woocommerce-MyAccount-content .woocommerce-table thead th:last-child {
    border-radius: 0 12px 0 0;
}

/* Table cells */
.woocommerce-MyAccount-content .woocommerce-orders-table td,
.woocommerce-MyAccount-content .woocommerce-table td {
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--color-medium-dark);
    vertical-align: middle;
    color: var(--color-very-light);
}

/* Zebra striping */
.woocommerce-MyAccount-content .woocommerce-orders-table tbody tr:nth-child(even),
.woocommerce-MyAccount-content .woocommerce-table tbody tr:nth-child(even) {
    background-color: rgba(255, 255, 255, 0.02);
}

/* Row hover */
.woocommerce-MyAccount-content .woocommerce-orders-table tbody tr:hover,
.woocommerce-MyAccount-content .woocommerce-table tbody tr:hover {
    background-color: rgba(3, 169, 244, 0.04);
}

/* Order number links */
.woocommerce-MyAccount-content .woocommerce-orders-table .woocommerce-orders-table__cell-order-number a {
    font-weight: 600;
    color: var(--color-primary-light);
}

/* Status badges */
.woocommerce-MyAccount-content .woocommerce-orders-table .woocommerce-orders-table__cell-order-status {
    font-size: 13px;
}

/* Action buttons in tables */
.woocommerce-MyAccount-content .woocommerce-orders-table .woocommerce-button,
.woocommerce-MyAccount-content .woocommerce-orders-table .button,
.woocommerce-MyAccount-content .woocommerce-table .woocommerce-button,
.woocommerce-MyAccount-content .woocommerce-table .button {
    display: inline-block;
    padding: 0.35rem 0.75rem;
    font-size: 12px;
    font-weight: 500;
    border-radius: 8px;
    border: 1px solid var(--color-medium);
    background-color: transparent;
    color: var(--color-very-light);
    text-decoration: none;
    transition: all 0.15s ease;
    white-space: nowrap;
    margin: 2px;
}

.woocommerce-MyAccount-content .woocommerce-orders-table .woocommerce-button:hover,
.woocommerce-MyAccount-content .woocommerce-orders-table .button:hover,
.woocommerce-MyAccount-content .woocommerce-table .woocommerce-button:hover,
.woocommerce-MyAccount-content .woocommerce-table .button:hover {
    background-color: var(--color-primary-light);
    border-color: var(--color-primary-light);
    color: #fff;
}

/* "View" button - primary style */
.woocommerce-MyAccount-content .woocommerce-orders-table .button.view,
.woocommerce-MyAccount-content .woocommerce-table .button.view {
    border-color: var(--color-primary-light);
    color: var(--color-primary-light);
}

/* "Cancel" button - danger style */
.woocommerce-MyAccount-content .woocommerce-orders-table .button.cancel {
    border-color: rgba(239, 83, 80, 0.4);
    color: #ef5350;
}

.woocommerce-MyAccount-content .woocommerce-orders-table .button.cancel:hover {
    background-color: #ef5350;
    border-color: #ef5350;
    color: #fff;
}

/* "Pay" / change payment button */
.woocommerce-MyAccount-content .woocommerce-orders-table .button.pay {
    border-color: rgba(255, 152, 0, 0.4);
    color: #ffa726;
}

.woocommerce-MyAccount-content .woocommerce-orders-table .button.pay:hover {
    background-color: #ffa726;
    border-color: #ffa726;
    color: #fff;
}

/* Download buttons */
.woocommerce-MyAccount-content .woocommerce-table .button.alt,
.woocommerce-MyAccount-content .woocommerce-table .button.download {
    border-color: var(--color-primary-light);
    color: var(--color-primary-light);
}

/* Pagination button (Siguiente) */
.woocommerce-MyAccount-content .woocommerce-pagination .woocommerce-button,
.woocommerce-MyAccount-content .woocommerce-Pagination .woocommerce-button,
.woocommerce-MyAccount-content .woocommerce-pagination .button,
.woocommerce-MyAccount-content a.woocommerce-button--next,
.woocommerce-MyAccount-content a.woocommerce-button--previous {
    display: inline-block;
    padding: 0.5rem 1.25rem;
    font-size: 13px;
    font-weight: 600;
    border-radius: 10px;
    background: var(--fire-gradient);
    color: #fff !important;
    border: 0;
    text-decoration: none;
    transition: all 0.2s ease;
}

.woocommerce-MyAccount-content .woocommerce-pagination .woocommerce-button:hover,
.woocommerce-MyAccount-content a.woocommerce-button--next:hover,
.woocommerce-MyAccount-content a.woocommerce-button--previous:hover {
    filter: brightness(1.1);
}

/* Responsive: stack table on mobile */
@media (max-width: 767px) {
    .woocommerce-MyAccount-content .woocommerce-orders-table thead,
    .woocommerce-MyAccount-content .woocommerce-table--order-downloads thead {
        display: none;
    }

    .woocommerce-MyAccount-content .woocommerce-orders-table tbody tr,
    .woocommerce-MyAccount-content .woocommerce-table--order-downloads tbody tr {
        display: block;
        background-color: var(--color-very-dark);
        border-radius: 12px;
        padding: 1rem;
        margin-bottom: 0.75rem;
        border: 1px solid var(--color-medium-dark);
    }

    .woocommerce-MyAccount-content .woocommerce-orders-table tbody td,
    .woocommerce-MyAccount-content .woocommerce-table--order-downloads tbody td {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0.4rem 0;
        border-bottom: 1px solid rgba(255,255,255,0.05);
        font-size: 13px;
    }

    .woocommerce-MyAccount-content .woocommerce-orders-table tbody td:last-child,
    .woocommerce-MyAccount-content .woocommerce-table--order-downloads tbody td:last-child {
        border-bottom: 0;
    }

    .woocommerce-MyAccount-content .woocommerce-orders-table tbody td::before,
    .woocommerce-MyAccount-content .woocommerce-table--order-downloads tbody td::before {
        content: attr(data-title);
        font-weight: 600;
        color: #fff;
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: 0.3px;
    }

    .woocommerce-MyAccount-content .woocommerce-orders-table tbody td .button,
    .woocommerce-MyAccount-content .woocommerce-table--order-downloads tbody td .button {
        font-size: 11px;
        padding: 0.3rem 0.6rem;
    }
}

/* Hide old list-group styles inside new nav */
.ms-account-nav .list-group {
    display: none;
}

/* Ensure dropdown sits above other elements */
.ms-user-dropdown .dropdown-menu {
    z-index: 9999;
}


/* ==========================================================
   PASSWORD STRENGTH METER & AUTOFILL — Dark theme overrides
   ========================================================== */

/* Container for relocated password strength elements */
.ms-password-strength-container {
    width: 100%;
    margin-top: 0.5rem;
}

/* Fallback: if meter stays inside input-group, allow it to wrap */
.ms-input-group:has(.woocommerce-password-strength),
.ms-input-group:has(.woocommerce-password-hint) {
    flex-wrap: wrap !important;
}

.ms-input-group .woocommerce-password-strength,
.ms-input-group .woocommerce-password-hint {
    flex: 0 0 100% !important;
    width: 100% !important;
    border-radius: 8px !important;
}

/* Fix browser autofill light background on ALL dark-theme inputs */
.ms-auth-card input:-webkit-autofill,
.ms-auth-card input:-webkit-autofill:hover,
.ms-auth-card input:-webkit-autofill:focus,
.ms-auth-card input:-webkit-autofill:active,
.ms-input-group input:-webkit-autofill,
.woocommerce form input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px var(--color-dark) inset !important;
    -webkit-text-fill-color: #fff !important;
    caret-color: #fff !important;
    transition: background-color 5000s ease-in-out 0s !important;
}

/* Password strength meter — nuclear override with max specificity */
div.woocommerce-password-strength,
.woocommerce-password-strength,
.ms-auth-card .woocommerce-password-strength,
.woocommerce-account .woocommerce-password-strength,
.woocommerce form .woocommerce-password-strength,
.ms-input-group + .woocommerce-password-strength,
.form-row .woocommerce-password-strength,
[class*="woocommerce-password-strength"] {
    all: unset !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin-top: 0.5rem !important;
    margin-bottom: 0 !important;
    padding: 0.5rem 0.75rem !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    font-family: "Barlow", sans-serif !important;
    text-align: center !important;
    line-height: 1.4 !important;
    float: none !important;
    position: static !important;
    clear: both !important;
    /* Default: orange/warning */
    background-color: rgba(255, 152, 0, 0.15) !important;
    color: #ffa726 !important;
    border: 1px solid rgba(255, 152, 0, 0.3) !important;
}

/* Short = red */
div.woocommerce-password-strength.short,
.woocommerce-password-strength.short,
[class*="woocommerce-password-strength"].short {
    background-color: rgba(239, 83, 80, 0.15) !important;
    color: #ef5350 !important;
    border-color: rgba(239, 83, 80, 0.3) !important;
}

/* Bad = orange */
div.woocommerce-password-strength.bad,
.woocommerce-password-strength.bad,
[class*="woocommerce-password-strength"].bad {
    background-color: rgba(255, 152, 0, 0.15) !important;
    color: #ffa726 !important;
    border-color: rgba(255, 152, 0, 0.3) !important;
}

/* Good = cyan */
div.woocommerce-password-strength.good,
.woocommerce-password-strength.good,
[class*="woocommerce-password-strength"].good {
    background-color: rgba(3, 169, 244, 0.15) !important;
    color: #03A9F4 !important;
    border-color: rgba(3, 169, 244, 0.3) !important;
}

/* Strong = green */
div.woocommerce-password-strength.strong,
.woocommerce-password-strength.strong,
[class*="woocommerce-password-strength"].strong {
    background-color: rgba(102, 187, 106, 0.15) !important;
    color: #66bb6a !important;
    border-color: rgba(102, 187, 106, 0.3) !important;
}

/* Password hint text */
div.woocommerce-password-hint,
.woocommerce-password-hint,
small.woocommerce-password-hint,
[class*="woocommerce-password-hint"] {
    all: unset !important;
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin-top: 0.4rem !important;
    font-size: 12px !important;
    font-family: "Barlow", sans-serif !important;
    color: var(--color-light) !important;
    line-height: 1.4 !important;
    background: none !important;
    float: none !important;
    clear: both !important;
}


/* --- RESPONSIVE --- */
@media (max-width: 767px) {
    .ms-auth-card {
        padding: 1.5rem;
    }

    .ms-dashboard-welcome {
        padding: 1.5rem;
    }

    .ms-dashboard-welcome__title {
        font-size: 1.25rem;
    }

    .ms-account-content {
        padding: 1rem;
    }

    .ms-account-nav {
        margin-bottom: 1rem;
    }
}

@media (max-width: 575px) {
    .ms-auth-card {
        padding: 1.25rem;
        border-radius: 16px;
    }

    .ms-dashboard-card {
        padding: 1rem;
    }

    .ms-dashboard-card__icon {
        width: 38px;
        height: 38px;
        font-size: 16px;
    }
}


/* ============================================================
   CART PAGE — WooCommerce Blocks
   Clean dark design matching site aesthetic
   Uses site CSS variables for consistency
   ============================================================ */

/* --- LAYOUT: gap between main & sidebar --- */
.wc-block-components-sidebar-layout.wc-block-cart {
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
}
.wc-block-components-sidebar-layout .wc-block-components-main {
    width: calc(65% - 12px) !important;
    max-width: calc(65% - 12px) !important;
    flex: none !important;
    border: 0 !important;
}
.wc-block-components-sidebar-layout .wc-block-components-sidebar {
    width: calc(35% - 12px) !important;
    max-width: calc(35% - 12px) !important;
    flex: none !important;
    border: 0 !important;
    align-self: flex-start !important;
    position: sticky !important;
    top: 100px !important;
}

/* --- YITH POINTS MESSAGE (cart page) --- */
.wp-block-yith-ywpar-cart-points-message.woocommerce-info,
.woocommerce-info.yith-par-message-cart {
    background: rgba(56,189,248,.06) !important;
    background-color: rgba(56,189,248,.06) !important;
    border: 1px solid rgba(56,189,248,.12) !important;
    border-radius: 12px !important;
    padding: 12px 18px !important;
    color: rgba(255,255,255,.85) !important;
    font-size: 14px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-bottom: 16px !important;
}
.woocommerce-info.yith-par-message-cart::before {
    display: none !important;
}
.woocommerce-info.yith-par-message-cart img {
    width: 22px !important;
    height: 22px !important;
    filter: drop-shadow(0 0 4px rgba(56,189,248,.3));
}
.woocommerce-info.yith-par-message-cart strong {
    color: #38bdf8 !important;
    font-weight: 700 !important;
}

/* --- MAIN PANEL (product list) --- */
.wc-block-cart .wc-block-cart__main {
    background: linear-gradient(170deg, #0d1117 0%, #111a2e 60%, #0d1117 100%) !important;
    border-radius: 20px !important;
    border: 1px solid rgba(56,189,248,.08) !important;
    padding: 0 !important;
    overflow: hidden;
    height: fit-content !important;
    box-shadow: 0 8px 32px rgba(0,0,0,.3);
}

/* Table display fix (WC Blocks breaks table-cell with flex) */
.wc-block-cart .wc-block-cart-items,
.wc-block-cart .wc-block-cart-items.wp-block-woocommerce-cart-line-items-block { display: table !important; width: 100% !important; border-collapse: collapse !important; background: transparent !important; background-color: transparent !important; }
.wc-block-cart .wc-block-cart-items thead { display: table-header-group !important; }
.wc-block-cart .wc-block-cart-items tbody { display: table-row-group !important; }

/* --- TABLE HEADER --- */
.wc-block-cart .wc-block-cart-items thead th,
.wc-block-cart-items th {
    background: rgba(0,0,0,.25) !important;
    color: rgba(255,255,255,.5) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.2px !important;
    padding: 14px 20px !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
}

/* --- PRODUCT ROWS --- */
.wc-block-cart-items .wc-block-cart-items__row {
    display: table-row !important;
    transition: background-color 0.2s ease;
}
.wc-block-cart-items .wc-block-cart-items__row:hover {
    background-color: rgba(255, 255, 255, 0.03) !important;
}
.wc-block-cart-items .wc-block-cart-items__row + .wc-block-cart-items__row {
    border-top: 1px solid rgba(255,255,255,.06) !important;
}

/* Force TDs to table-cell */
.wc-block-cart-items td,
.wc-block-cart-items .wc-block-cart-item__image,
.wc-block-cart-items .wc-block-cart-item__product,
.wc-block-cart-items .wc-block-cart-item__total {
    display: table-cell !important;
    padding: 16px 20px !important;
    vertical-align: middle !important;
    color: #fff !important;
    border-bottom: 0 !important;
}

/* --- IMAGE --- */
.wc-block-cart-items td.wc-block-cart-item__image {
    width: 150px !important;
    padding: 16px 12px 16px 20px !important;
}
.wc-block-cart-items .wc-block-cart-item__image img {
    width: 130px !important;
    height: auto !important;
    border-radius: 14px !important;
    border: 1px solid rgba(255,255,255,.06) !important;
    transition: all .2s ease;
    box-shadow: 0 2px 10px rgba(0,0,0,.3);
}
.wc-block-cart-items .wc-block-cart-items__row:hover .wc-block-cart-item__image img {
    border-color: rgba(56,189,248,.15) !important;
    box-shadow: 0 4px 16px rgba(3,169,244,.12);
}

/* --- TOTAL COLUMN --- */
.wc-block-cart-items td.wc-block-cart-item__total {
    text-align: right !important;
    white-space: nowrap !important;
    padding-right: 24px !important;
}

/* --- PRODUCT NAME --- */
.wc-block-cart-items .wc-block-components-product-name {
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    text-decoration: none !important;
    transition: color 0.2s ease;
}
.wc-block-cart-items .wc-block-components-product-name:hover {
    color: var(--color-primary-light) !important;
}

/* --- UNIT PRICE (below name) --- */
.wc-block-cart-item__product .wc-block-components-product-price {
    color: var(--color-light) !important;
    font-weight: 500 !important;
    font-size: 13px !important;
}
/* TOTAL column price */
.wc-block-cart-item__total .wc-block-components-product-price {
    color: #fff !important;
    font-weight: 700 !important;
    font-size: 16px !important;
}

/* --- HIDE METADATA (Requisitos Minimos) --- */
.wc-block-cart-items .wc-block-components-product-metadata,
.wc-block-cart-items .wc-block-components-product-details {
    display: none !important;
}

/* --- INNER PRODUCT LAYOUT --- */
.wc-block-cart-items .wc-block-cart-item__wrap {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}
/* Quantity + trash on same row */
.wc-block-cart-items .wc-block-cart-item__quantity {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    margin-top: 8px !important;
    line-height: 1 !important;
}
.wc-block-cart-items .wc-block-cart-item__quantity .wc-block-components-quantity-selector { margin: 0 !important; }
.wc-block-cart-items .wc-block-cart-item__quantity .wc-block-cart-item__remove-link { margin: 0 !important; padding: 0 !important; }

/* --- QUANTITY CONTROLS --- */
.wc-block-cart-items .wc-block-components-quantity-selector {
    display: inline-flex !important;
    align-items: stretch !important;
    height: 36px !important;
    border-radius: 10px !important;
    background: rgba(255,255,255,.04) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    overflow: hidden !important;
    transition: border-color .2s ease !important;
}
.wc-block-cart-items .wc-block-components-quantity-selector:hover {
    border-color: rgba(255,255,255,.15) !important;
}
.wc-block-cart-items .wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input {
    background: transparent !important;
    color: #fff !important;
    border: 0 !important;
    border-left: 1px solid rgba(255,255,255,.08) !important;
    border-right: 1px solid rgba(255,255,255,.08) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-align: center !important;
    width: 40px !important;
}
.wc-block-cart-items .wc-block-components-quantity-selector .wc-block-components-quantity-selector__button {
    background: transparent !important;
    color: rgba(255,255,255,.5) !important;
    border: 0 !important;
    padding: 0 10px !important;
    transition: all .2s ease;
}
.wc-block-cart-items .wc-block-components-quantity-selector .wc-block-components-quantity-selector__button:hover {
    background: rgba(56,189,248,.15) !important;
    color: #38bdf8 !important;
}

/* --- TRASH ICON --- */
.wc-block-cart-items .wc-block-cart-item__remove-link,
.wc-block-cart-item__product .wc-block-cart-item__remove-link {
    font-size: 0 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    border-radius: 10px !important;
    background: rgba(255,255,255,.06) !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    transition: all .2s ease !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
}
.wc-block-cart-items .wc-block-cart-item__remove-link svg,
.wc-block-cart-item__product .wc-block-cart-item__remove-link svg {
    display: none !important;
}
.wc-block-cart-items .wc-block-cart-item__remove-link::before,
.wc-block-cart-item__product .wc-block-cart-item__remove-link::before {
    content: '\f2ed';
    font-family: 'Font Awesome 6 Free', 'Font Awesome 5 Free', 'FontAwesome' !important;
    font-weight: 900 !important;
    font-size: 13px !important;
    color: rgba(255,255,255,.6) !important;
    transition: color .2s ease;
}
.wc-block-cart-items .wc-block-cart-item__remove-link:hover {
    background: rgba(239,68,68,.1) !important;
    border-color: rgba(239,68,68,.3) !important;
    transform: scale(1.05);
}
.wc-block-cart-items .wc-block-cart-item__remove-link:hover::before {
    color: #ef4444 !important;
}

/* --- SIDEBAR (totals) --- */
.wc-block-cart .wc-block-cart__sidebar,
.wc-block-cart .wp-block-woocommerce-cart-totals-block {
    border-radius: 20px !important;
    background: linear-gradient(170deg, #0d1117 0%, #111a2e 60%, #0d1117 100%) !important;
    border: 1px solid rgba(56,189,248,.08) !important;
    padding: 24px !important;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0,0,0,.3);
}

/* TOTALS HEADING */
.wc-block-cart .wp-block-woocommerce-cart-order-summary-heading-block {
    color: #fff !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
    letter-spacing: 1.2px !important;
    margin-bottom: 12px !important;
    padding-bottom: 12px !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
}

/* Remove internal borders from sidebar */
.wc-block-cart .wc-block-cart__sidebar .wc-block-components-totals-wrapper {
    border-top: none !important;
    border-bottom: none !important;
    padding: 6px 0 !important;
}
/* Compact internal spacing */
.wc-block-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-block {
    margin-bottom: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
}
.wc-block-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-coupon-form-block {
    padding: 4px 0 8px 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
}
.wc-block-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-totals-block {
    padding: 0 !important;
    margin: 0 !important;
}

/* Coupon link */
.wc-block-cart .wc-block-components-panel__button {
    color: #0ea5e9 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    border: none !important;
}
.wc-block-cart .wc-block-components-panel__button:hover {
    color: #38bdf8 !important;
}

/* Totals labels + values */
.wc-block-cart .wc-block-components-totals-item__label {
    color: var(--color-light) !important;
    font-size: 14px !important;
}
.wc-block-cart .wc-block-components-totals-item__value {
    color: #fff !important;
    font-weight: 600 !important;
}

/* Total final row — emphasized */
.wc-block-cart .wc-block-components-totals-footer-item {
    padding-top: 12px !important;
    margin-top: 8px !important;
    border-top: 1px solid rgba(255,255,255,.06) !important;
}
.wc-block-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
    font-weight: 700 !important;
    font-size: 15px !important;
    color: #fff !important;
}
.wc-block-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
    font-weight: 800 !important;
    font-size: clamp(20px, 3vw, 26px) !important;
    color: #0ea5e9 !important;
    text-decoration: none !important;
}

/* Coupon input */
.wc-block-cart .wc-block-components-totals-coupon__input .wc-block-components-text-input input {
    background: rgba(255,255,255,.04) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 10px !important;
    color: #fff !important;
    font-size: 14px !important;
}
.wc-block-cart .wc-block-components-totals-coupon__input .wc-block-components-text-input input:focus {
    border-color: #0ea5e9 !important;
    box-shadow: 0 0 0 2px rgba(14, 165, 233, 0.15) !important;
}
.wc-block-cart .wc-block-components-totals-coupon__input .wc-block-components-text-input label {
    color: var(--color-light) !important;
}
.wc-block-cart .wc-block-components-totals-coupon__button {
    background: rgba(255,255,255,.04) !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    color: #fff !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    transition: all .2s ease;
}
.wc-block-cart .wc-block-components-totals-coupon__button:hover {
    background: rgba(255,255,255,.08) !important;
    border-color: rgba(56,189,248,.2) !important;
}

/* --- CHECKOUT BUTTON (hero cyan gradient) --- */
.wc-block-cart .wc-block-cart__submit-button,
.wc-block-cart a.wc-block-cart__submit-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 50px !important;
    padding: 0 20px !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #0ea5e9 0%, #38bdf8 100%) !important;
    border: none !important;
    color: #fff !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em !important;
    cursor: pointer;
    transition: all .25s ease !important;
    text-decoration: none !important;
    box-shadow: 0 4px 16px rgba(14,165,233,.3) !important;
}
.wc-block-cart .wc-block-cart__submit-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(14,165,233,.45) !important;
    background: linear-gradient(135deg, #0ea5e9 0%, #67d4ff 100%) !important;
}
/* Shimmer animation */
.wc-block-cart .wc-block-cart__submit-button,
.wc-block-cart a.wc-block-cart__submit-button {
    position: relative !important;
    overflow: hidden !important;
}
.wc-block-cart .wc-block-cart__submit-button::after,
.wc-block-cart a.wc-block-cart__submit-button::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 60%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent);
    animation: cart-shimmer 3s ease-in-out infinite;
    pointer-events: none;
}
@keyframes cart-shimmer {
    0%   { left: -100%; }
    50%  { left: 150%; }
    100% { left: 150%; }
}

/* --- SHIPPING --- */
.wc-block-cart .wc-block-components-shipping-rates-control,
.wc-block-cart .wc-block-components-totals-shipping {
    color: var(--color-light) !important;
}
.wc-block-cart .wc-block-components-radio-control__label,
.wc-block-cart .wc-block-components-radio-control__description {
    color: #fff !important;
}

/* --- EMPTY CART --- */
.wc-block-cart .wc-block-cart__empty-cart__title,
.wp-block-woocommerce-empty-cart-block {
    color: var(--color-light) !important;
    text-align: center !important;
}

/* --- RESPONSIVE — TABLET --- */
@media (max-width: 768px) {
    .wc-block-cart .wc-block-cart-items,
    .wc-block-cart .wc-block-cart-items thead,
    .wc-block-cart .wc-block-cart-items tbody,
    .wc-block-cart-items .wc-block-cart-items__row,
    .wc-block-cart-items td {
        display: revert !important;
    }
    .wc-block-cart .wc-block-cart__main {
        border-radius: 16px !important;
        padding: 0 !important;
    }
    .wc-block-cart .wc-block-cart__sidebar,
    .wc-block-cart .wp-block-woocommerce-cart-totals-block {
        margin-top: 1rem !important;
        padding: 20px !important;
        border-radius: 16px !important;
    }
    .wc-block-cart .wc-block-components-sidebar-layout .wc-block-components-sidebar {
        position: static !important;
    }
}

/* --- RESPONSIVE — MOBILE --- */
@media (max-width: 480px) {
    .wc-block-cart .wc-block-cart__main { border-radius: 14px !important; }
    .wc-block-cart .wc-block-cart__sidebar { border-radius: 14px !important; padding: 16px !important; }
    .wc-block-cart-items td { padding: 10px !important; }
    .wc-block-cart-items .wc-block-cart-item__quantity { gap: 6px !important; }
    .wc-block-cart-items .wc-block-cart-item__remove-link { width: 34px !important; min-width: 34px !important; height: 34px !important; }
    .wc-block-cart .wc-block-cart__submit-button { height: 46px !important; font-size: 14px !important; }
}

/* ============================================ */
/* FOOTER IMPROVEMENTS                          */
/* ============================================ */
#footer {
    background: linear-gradient(170deg, #0a0f1a 0%, #111a2e 50%, #0a0f1a 100%);
    border-top: 1px solid rgba(56,189,248,.06);
    position: relative;
}
#footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 300px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(14,165,233,.4), transparent);
}
.bootscore-footer-columns {
    padding: 48px 0 32px;
}
.bootscore-footer-columns .row {
    align-items: flex-start;
}
/* Col 1 - Logo */
.bootscore-footer-columns .row > div:first-child {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}
.bootscore-footer-columns .row > div:first-child .widget {
    text-align: left;
}
.bootscore-footer-columns .row > div:first-child img {
    max-width: 160px;
    height: auto;
}
/* Col 2 - Navigation */
.bootscore-footer-columns .row > div:nth-child(2) {
    padding-top: 4px;
}
#footer-menu,
.bootscore-footer-columns .row > div:nth-child(2) ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 32px;
}
#footer-menu li a,
.bootscore-footer-columns .row > div:nth-child(2) ul li a {
    color: rgba(255,255,255,.45);
    text-decoration: none;
    font-size: .875rem;
    transition: all .2s ease;
    padding: 4px 0;
    display: inline-block;
}
#footer-menu li a:hover,
.bootscore-footer-columns .row > div:nth-child(2) ul li a:hover {
    color: #38bdf8;
    transform: translateX(3px);
}
/* Col 3 - Social */
.bootscore-footer-columns .row > div:nth-child(3) {
    padding-top: 4px;
}
/* Nuestras redes title */
.bootscore-footer-columns .row > div:nth-child(3) h2,
.bootscore-footer-columns .row > div:nth-child(3) h3,
.bootscore-footer-columns .row > div:nth-child(3) .widget-title,
.bootscore-footer-columns .row > div:nth-child(3) .wp-block-heading {
    font-size: .875rem;
    font-weight: 600;
    color: rgba(255,255,255,.7);
    margin-bottom: 14px;
    text-transform: uppercase;
    letter-spacing: .06em;
}
#footer .wp-block-social-link {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.1);
    transition: all .25s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}
#footer .wp-block-social-link:hover {
    background: rgba(14,165,233,.12);
    border-color: rgba(14,165,233,.35);
    transform: translateY(-2px);
}
/* Center the anchor inside */
#footer .wp-block-social-link a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 0;
}
/* SVG icon sizing and color */
#footer .wp-block-social-link svg {
    width: 18px;
    height: 18px;
    fill: #fff;
    color: #fff;
}
#footer .wp-block-social-link:hover svg {
    fill: #38bdf8;
    color: #38bdf8;
}
#footer .wp-block-social-link svg path {
    fill: #fff;
}
#footer .wp-block-social-link:hover svg path {
    fill: #38bdf8;
}
/* Col 4 - Legal (columna fija en footer.php; tipografía clonada del menú y del título de redes) */
.ms-footer-legal {
    padding-top: 4px;
}
.ms-footer-legal__title {
    font-size: .875rem;
    font-weight: 600;
    color: rgba(255,255,255,.7);
    margin-bottom: 14px;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.ms-footer-legal__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 6px;
}
.ms-footer-legal__list li a {
    color: rgba(255,255,255,.45);
    text-decoration: none;
    font-size: .875rem;
    transition: all .2s ease;
    padding: 4px 0;
    display: inline-block;
}
.ms-footer-legal__list li a:hover {
    color: #38bdf8;
    transform: translateX(3px);
}
/* Copyright bar */
.bootscore-footer-info {
    background: rgba(0,0,0,.15);
    border-top: 1px solid rgba(255,255,255,.04);
    padding: 12px 0;
}
/* ══════════════════════════════════════════════════════
   Related products carousel (single product page)
   ══════════════════════════════════════════════════════ */
.ms-related {
    margin: 2.5rem 0;
    position: relative;
}
.ms-related__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}
.ms-related__title {
    margin: 0;
    color: #fff;
    font-size: 1.35rem;
    font-weight: 700;
}
.ms-related__nav-buttons {
    display: flex;
    gap: .5rem;
}
.ms-related__nav {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid rgba(148, 184, 255, 0.14);
    background: rgba(148, 184, 255, 0.06);
    color: rgba(248, 250, 252, 0.8);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s, color 0.2s, opacity 0.2s;
}
.ms-related__nav:hover {
    background: rgba(34, 211, 238, 0.12);
    border-color: rgba(34, 211, 238, 0.4);
    color: #22d3ee;
}
.ms-related__nav.is-disabled {
    opacity: 0.35;
    cursor: not-allowed;
    pointer-events: none;
}
.ms-related__nav i { font-size: 14px; pointer-events: none; }

.ms-related__track {
    display: flex;
    align-items: stretch;
    gap: 1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding-bottom: 4px; /* leave some space in case of focus ring */
}
.ms-related__track::-webkit-scrollbar { display: none; }

.ms-related__item {
    flex: 0 0 calc((100% - 3rem) / 4);  /* 4 visible on desktop, 1rem gap × 3 gaps = 3rem */
    scroll-snap-align: start;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

/* Ensure the inner product card fills the full slot height (so all cards match) */
.ms-related__item > * {
    flex: 1 1 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
}
/* Push the price/add-to-cart row to the bottom of each card */
.ms-related__item .card-body,
.ms-related__item .woocommerce-loop-product__content,
.ms-related__item > * > .price,
.ms-related__item > * > .add-to-cart-container {
    margin-top: auto;
}

@media (max-width: 991.98px) {
    .ms-related__item { flex: 0 0 calc((100% - 2rem) / 3); } /* 3 on tablets */
}
@media (max-width: 767.98px) {
    .ms-related__head { margin-bottom: .75rem; }
    .ms-related__title { font-size: 1.15rem; }
    .ms-related__item { flex: 0 0 calc((100% - 1rem) / 2); } /* 2 on phones */
}
@media (max-width: 479.98px) {
    .ms-related__item { flex: 0 0 70%; } /* 1 big + peek on very small phones */
}

.bootscore-copyright {
    color: rgba(255,255,255,.25);
    font-size: .78rem;
}


/* ══════════════════════════════════════════════════════════════════════
   CHECKOUT — Títulos dentro de su tarjeta + cupón discreto en el resumen
   Los títulos "Detalles de facturación" / "Tu pedido" pasan a estar DENTRO
   de sus tarjetas, y el cupón se reubica entre el Total y los métodos de pago.
   ══════════════════════════════════════════════════════════════════════ */

/* Facturación: el estilo de tarjeta pasa al contenedor que también contiene
   el título (.woocommerce-billing-fields ya envuelve <h3> + los campos). */
.woocommerce-checkout #customer_details .woocommerce-billing-fields {
    background: linear-gradient(170deg, #0d1117 0%, #111a2e 60%, #0d1117 100%);
    padding: 1.5rem;
    border-radius: 20px;
    border: 1px solid rgba(56,189,248,.08);
    box-shadow: 0 8px 32px rgba(0,0,0,.3);
}
.woocommerce-checkout #customer_details .woocommerce-billing-fields__field-wrapper {
    background: none;
    padding: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    margin: 0;
}

/* Pedido: la tarjeta .ms-checkout-ordercard (ver woocommerce/checkout/
   form-checkout.php) envuelve el título + el #order_review. */
.woocommerce-checkout .ms-checkout-ordercard {
    background: linear-gradient(170deg, #0d1117 0%, #111a2e 60%, #0d1117 100%);
    padding: 20px;
    border-radius: 20px;
    border: 1px solid rgba(56,189,248,.08);
    box-shadow: 0 8px 32px rgba(0,0,0,.3);
}
.woocommerce-checkout .ms-checkout-ordercard #order_review {
    background: none !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Títulos como encabezado de tarjeta, con divisor sutil. */
.woocommerce-checkout h3#order_review_heading,
.woocommerce-checkout .woocommerce-billing-fields > h3 {
    margin: 0 0 1.1rem;
    padding-bottom: .8rem;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

/* Cupón reubicado dentro de "Tu pedido", entre el Total y los pagos.
   El <form> se renderiza arriba (fuera del form principal) y lo mueve por DOM
   assets/js/ms-checkout-coupon.js. */
.woocommerce-checkout .woocommerce-form-coupon-toggle {
    display: none;                       /* oculto en su posición original (arriba) */
}
.woocommerce-checkout .ms-coupon {
    margin: 6px 0 18px;
    padding: 16px 16px 0;                /* 16px = padding de las celdas → alinear */
    border-top: 1px solid rgba(255,255,255,.08);
}
.woocommerce-checkout .ms-coupon .woocommerce-form-coupon-toggle {
    display: block;                      /* visible, ya reubicado */
    margin: 0;
}
.woocommerce-checkout .ms-coupon .woocommerce-info {
    background: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    font-size: .82rem;
    line-height: 1.2;
    color: rgba(255,255,255,.5);
}
.woocommerce-checkout .ms-coupon .woocommerce-info::before {
    content: none !important;            /* quitar el ícono (i) por defecto */
}
.woocommerce-checkout .ms-coupon .ms-coupon-ico {
    display: inline-flex;
    color: rgba(255,255,255,.42);
    transition: color .15s ease;
}
.woocommerce-checkout .ms-coupon .woocommerce-info a.showcoupon {
    color: rgba(255,255,255,.72);
    text-decoration: none;
    font-weight: 500;
    font-size: .84rem;
    cursor: pointer;
    transition: color .15s ease;
}
.woocommerce-checkout .ms-coupon:hover .ms-coupon-ico,
.woocommerce-checkout .ms-coupon .woocommerce-info a.showcoupon:hover {
    color: #38bdf8;
}
/* Form compacto (input + botón unidos). El layout flex lo da _wc-coupon.scss. */
.woocommerce-checkout .ms-coupon form.checkout_coupon {
    flex-wrap: nowrap !important;
    margin: 12px 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
}
.woocommerce-checkout .ms-coupon form.checkout_coupon .input-text {
    width: 100% !important;
    height: 42px;
    font-size: .85rem !important;
    background: rgba(255,255,255,.04) !important;
    border: 1.5px solid rgba(255,255,255,.1) !important;
    border-radius: 10px 0 0 10px !important;   /* unir con el botón */
}
.woocommerce-checkout .ms-coupon form.checkout_coupon .input-text:focus {
    border-color: rgba(56,189,248,.6) !important;
}
.woocommerce-checkout .ms-coupon form.checkout_coupon button {
    height: 42px;
    margin-left: -1.5px;                       /* solapar bordes con el input */
    background: #0ea5e9;
    border: 1.5px solid #0ea5e9;
    color: #fff;
    font-size: .82rem;
    font-weight: 600;
    padding: 0 18px;
    white-space: nowrap;
    border-radius: 0 10px 10px 0 !important;
}
.woocommerce-checkout .ms-coupon form.checkout_coupon button:hover {
    background: #0284c7;
    border-color: #0284c7;
}

/* 25/09/2026: campos a 16 px en pantallas tactiles. Safari de iPhone (todas las versiones, tambien las
   de hoy) agranda la pagina al tocar un campo con letra de menos de 16 px, y el cliente tiene que
   achicarla con los dedos para volver a ver Pagar. Medido en produccion a 390 px con UA de iPhone:
   quedaban chicos el cupon (13,6 px), el "Ordenar por" de /tienda/ (14 px) y el buscador de FiboSearch
   escondido en el icono del header (14 px, por main.css). Los datos del paso 1, el buscador de
   provincia, el buscador del header movil, el de la home y los de mi cuenta ya estaban en 16 px.
   Solo con (hover: none) and (pointer: coarse): en la compu no cambia nada. El buscador de la pildora
   de escritorio (iPad apaisado) se arregla en assets/css/ms-header.css. */
@media (hover: none) and (pointer: coarse) {
    /* Cupon: pasa de .85rem a 16 px. El relleno de arriba y abajo venia en em (1em .5em de una regla
       general) y con 16 px no entraba el texto en los 42 px de alto: va en 0 y el texto queda centrado
       igual que hoy; los costados quedan en los 6,8 px de siempre. */
    .woocommerce-checkout .ms-coupon form.checkout_coupon .input-text {
        font-size: 16px !important;
        padding: 0 6.8px;
    }
    /* "Ordenar por", solo en la tienda (/tienda/, sus filtros y el buscador de productos, todos con
       body.woocommerce-shop): ahi lo achican a 14px !important shop-archive.css (0,2,1, que se carga solo
       con is_shop()) y ms-tienda-estilo.php (0,2,2, en linea despues de esta hoja), por eso el selector
       llega a (0,3,3). El alto es 3.125em de una regla general: se fija en los 43,75 px de hoy para que
       no crezca. En categorias y etiquetas (/categoria-producto/, /etiqueta-producto/) ya estaba en 16 px
       con 50 px de alto y 16 px de relleno arriba y abajo: fijarle 43,75 px cortaba el texto a la mitad,
       por eso no se toca. */
    body.woocommerce-shop form.woocommerce-ordering select.orderby {
        font-size: 16px !important;
        height: 43.75px;
    }
    /* FiboSearch del icono del header: hoy ms-header.js abre en su lugar el buscador .ms-mobile-search
       (16 px), pero si ese JS no corre el que se enfoca es este. El overlay movil propio de FiboSearch
       esta apagado en todas sus instancias (js-dgwt-wcas-mobile-overlay-disabled); si algun dia se prende,
       su campo (.dgwt-wcas-overlay-mobile .dgwt-wcas-search-input) tambien tiene que ir aca. */
    .cont-search-toggler .dgwt-wcas-search-input {
        font-size: 16px !important;
    }
}

/* Tarjetas en móvil. */
@media (max-width: 767px) {
    .woocommerce-checkout #customer_details .woocommerce-billing-fields {
        padding: 1rem;
        border-radius: 14px;
    }
    .woocommerce-checkout .ms-checkout-ordercard {
        padding: 14px;
        border-radius: 14px;
    }
}

/* =============================================
   PRODUCTOS RELACIONADOS EN CARRITO
   Offcanvas (.ms-suggest-*) + página de carrito (.ms-crosssell-*)
   ============================================= */

/* ── Pills de origen (comunes) ── */
.ms-sug-pill {
    display: inline-block;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: .4px;
    text-transform: uppercase;
    border-radius: 99px;
    padding: 2px 7px;
    line-height: 1.4;
    white-space: nowrap;
}
/* "Combina bien": sugerencia del mapa de sagas en la que hay un servicio de por medio (Game Pass, Windows, Office),
   25/09/2026. Mismo color que "Tu saga": las dos salen de lo que ya llevás en el carrito. */
.ms-sug-pill--saga,
.ms-sug-pill--combo {
    color: #38bdf8;
    background: rgba(56, 189, 248, .1);
    border: 1px solid rgba(56, 189, 248, .25);
}
.ms-sug-pill--top {
    color: #f59e0b;
    background: rgba(245, 158, 11, .1);
    border: 1px solid rgba(245, 158, 11, .3);
}
.ms-sug-pill--impulso {
    color: #10b981;
    background: rgba(16, 185, 129, .1);
    border: 1px solid rgba(16, 185, 129, .3);
}

/* ── Offcanvas: bloque (vive DENTRO del área scrolleable de items) ── */
#offcanvas-cart .ms-suggest-block {
    margin: 4px 0 0;
    border-top: 1px dashed rgba(255, 255, 255, .08);
    padding-top: 14px;
}
#offcanvas-cart .ms-suggest-title {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: #38bdf8;
    margin: 0 2px 10px;
}
#offcanvas-cart .ms-suggest-spark {
    font-size: 12px;
}
#offcanvas-cart .ms-suggest-list {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

/* ── Offcanvas: tarjeta compacta ── */
#offcanvas-cart .ms-suggest-card {
    display: flex;
    gap: 10px;
    align-items: center;
    background: rgba(14, 165, 233, .05);
    border: 1px solid rgba(56, 189, 248, .12);
    border-radius: 12px;
    padding: 9px 10px;
    transition: all .2s ease;
}
#offcanvas-cart .ms-suggest-card:hover {
    background: rgba(14, 165, 233, .09);
    border-color: rgba(56, 189, 248, .25);
    transform: translateY(-1px);
}
#offcanvas-cart .ms-suggest-thumb {
    flex-shrink: 0;
    display: block;
    width: 42px;
}
#offcanvas-cart .ms-suggest-thumb img {
    width: 42px;
    height: 42px;
    object-fit: cover;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .5);
    display: block;
}
#offcanvas-cart .ms-suggest-info {
    flex: 1;
    min-width: 0;
}
#offcanvas-cart .ms-suggest-name {
    display: block;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.25;
    color: #fff !important;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#offcanvas-cart .ms-suggest-meta {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: 4px;
}
#offcanvas-cart .ms-suggest-price,
#offcanvas-cart .ms-suggest-price .woocommerce-Price-amount {
    font-size: 13px;
    font-weight: 700;
    color: #fff;
}

/* ── Offcanvas: botón + ── */
#offcanvas-cart .ms-suggest-add {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(14, 165, 233, .12);
    border: 1px solid rgba(56, 189, 248, .35);
    color: #38bdf8 !important;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    transition: all .15s ease;
}
#offcanvas-cart .ms-suggest-add:hover {
    background: linear-gradient(135deg, #0EA5E9, #38BDF8);
    color: #fff !important;
    border-color: transparent;
    box-shadow: 0 0 14px rgba(14, 165, 233, .4);
    transform: scale(1.06);
}
#offcanvas-cart .ms-suggest-add .btn-loader {
    border-radius: 8px;
}
/* Error de un "+" que no pudo agregar el juego (ms_mc_js, 25/09/2026): va debajo de su sugerencia y del ancho de las
   tarjetas. Los avisos del desplegable traen márgenes laterales y 1rem abajo, pensados para arriba de la lista. */
#offcanvas-cart .ms-suggest-list .ms-sug-error {
    margin: 0;
    padding-top: .625rem;
    padding-bottom: .625rem;
    border-radius: 12px;
    font-size: 13px;
    line-height: 1.35;
}

/* ── Página de carrito: panel ── */
.woocommerce-cart .ms-crosssell-panel {
    background: linear-gradient(170deg, #0D1117 0%, #111A2E 60%, #0D1117 100%);
    border: 1px solid rgba(56, 189, 248, .08);
    border-radius: 20px;
    padding: 26px 28px;
    position: relative;
    overflow: hidden;
    margin: 24px 0;
    font-family: Barlow, sans-serif;
}
.woocommerce-cart .ms-crosssell-panel::before {
    content: '';
    position: absolute;
    top: -40px;
    left: -40px;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(14, 165, 233, .12), transparent 70%);
    pointer-events: none;
}
.woocommerce-cart .ms-crosssell-title {
    margin: 0 0 4px;
    font-weight: 800;
    font-size: 22px;
    letter-spacing: -.3px;
    color: #fff;
}
.woocommerce-cart .ms-crosssell-accent {
    background: linear-gradient(135deg, #0EA5E9, #38BDF8);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.woocommerce-cart .ms-crosssell-sub {
    margin: 0 0 20px;
    font-size: 13px;
    color: rgba(230, 237, 247, .55);
}
.woocommerce-cart .ms-crosssell-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(175px, 1fr));
    gap: 14px;
}

/* ── Página de carrito: tarjeta ── */
.woocommerce-cart .ms-crosssell-card {
    background: rgba(255, 255, 255, .035);
    border: 1px solid rgba(255, 255, 255, .07);
    border-radius: 14px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 9px;
    transition: all .2s ease;
}
.woocommerce-cart .ms-crosssell-card:hover {
    background: rgba(255, 255, 255, .055);
    border-color: rgba(56, 189, 248, .25);
    transform: translateY(-3px);
    box-shadow: 0 10px 28px rgba(0, 0, 0, .45);
}
.woocommerce-cart .ms-crosssell-thumb {
    display: block;
}
.woocommerce-cart .ms-crosssell-thumb img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 10px;
    display: block;
    box-shadow: inset 0 0 40px rgba(0, 0, 0, .35);
}
.woocommerce-cart .ms-crosssell-name {
    font-size: 14px;
    font-weight: 600;
    color: #fff !important;
    line-height: 1.3;
    min-height: 36px;
    text-decoration: none;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.woocommerce-cart .ms-crosssell-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
}
.woocommerce-cart .ms-crosssell-price,
.woocommerce-cart .ms-crosssell-price .woocommerce-Price-amount {
    font-size: 15px;
    font-weight: 700;
    color: #fff;
}
.woocommerce-cart .ms-crosssell-add {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border-radius: 9px;
    padding: 8px 0;
    width: 100%;
    background: rgba(14, 165, 233, .12);
    border: 1px solid rgba(56, 189, 248, .35);
    color: #38bdf8 !important;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: all .15s ease;
}
.woocommerce-cart .ms-crosssell-add:hover {
    background: linear-gradient(135deg, #0EA5E9, #38BDF8);
    color: #fff !important;
    border-color: transparent;
    box-shadow: 0 0 14px rgba(14, 165, 233, .4);
}
.woocommerce-cart .ms-crosssell-add .btn-loader {
    border-radius: 9px;
}

@media (max-width: 640px) {
    .woocommerce-cart .ms-crosssell-panel {
        padding: 18px 14px;
        border-radius: 16px;
    }
    .woocommerce-cart .ms-crosssell-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
    /* La pill (nowrap) baja a línea propia si no entra al lado del precio */
    .woocommerce-cart .ms-crosssell-row {
        flex-wrap: wrap;
    }
}

/* Cross-sells nativos del Cart Block (React): los reemplaza el panel propio */
.wp-block-woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block {
    display: none;
}

/* 28/09/2026: panel de filtros en categorias y etiquetas (/categoria-producto/..., /etiqueta-producto/...).
   main.css (_wc-shop-filters.scss) le fija 300 px de ancho a .ms-filters-offcanvas.offcanvas-start en todos
   los tamanos, pero en escritorio el panel va dentro de la col-lg-3 de woocommerce.php, que entre 992 y
   1399 px deja menos lugar: 216 px de 992 a 1199 y 261 px de 1200 a 1399. El panel se salia de su columna
   y tapaba el borde de la primera tarjeta, el h1 y el "Mostrando 1-24": 60 px a 1031 y 15 px a 1366
   (medido en produccion en /categoria-producto/steam/, /categoria-producto/microsoft/ y
   /etiqueta-producto/rpg/). En /tienda/ no pasaba porque ms-tienda-estilo.php (mundosteam-snippets) le pone
   este mismo ancho, pero con body.woocommerce-shop, que las categorias no tienen: en /tienda/ esta regla no
   cambia nada. No era shop-archive.css: esa hoja no tiene ninguna regla del panel, y cargarla en las
   categorias achicaba "Ordenar por" a 14 px (en iPhone agranda la pagina al tocarlo, ver 25/09 mas arriba).
   Va aca y no en el .scss porque main.css ya no se compila en el servidor (mu-plugins/ms-scss-apagado.php).
   Desde 1400 px la columna deja 306 px y el panel queda en 300, como hoy. En celular y tablet el panel es
   el cajon deslizante de Bootstrap y sus 300 px no se tocan. */
@media (min-width: 992px) {
    .ms-filters-offcanvas.offcanvas-start {
        width: 100%;
        max-width: 300px;
    }
}