html, body {
    overflow-x: hidden;
}

#header .header-nav
 {
    padding:0;
}

#header .header-top {
    padding: 0!important;
}

#_desktop_shop-logo{

	text-align:center
}

.thumbnail-container .thumbnail-top a picture img{

	margin:0 auto;

}

.product-price-and-shipping .price {
    font-weight: 500;
    font-size: 25px;
}

.product-title a {
    display: block;          /* Para que el ancho sea respetado */
    white-space: nowrap;     /* No permitir saltos de línea */
    overflow: hidden;        /* Ocultar el exceso de texto */
    text-overflow: ellipsis; /* Agrega "..." si es demasiado largo */
}

.flag-supertop {
  background: linear-gradient(135deg, #00BFA5, #00E5C3);
  color: #FFFFFF;
}

.super-offer-top {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    color: #16a085;
    font-size: 12px;
    background-color: white;
    padding: 3px 8px;
    border-radius: 4px;
    border: 1px solid #16a085;
    text-align: center;
}

.super-offer-top .countdown-timer {
    display: flex;
    gap: 4px;
    align-items: flex-start; /* Alinea los bloques al inicio */
}

.time-unit {
    display: flex;
    flex-direction: column; /* Número arriba, label abajo */
    align-items: center;
    font-size: 10px; /* Pequeñito */
}

.time-unit span {
    display: block;
}

.time-unit .days,
.time-unit .hours,
.time-unit .minutes,
.time-unit .seconds {
    padding: 0px 2px;
    min-width: 18px;
    text-align: center;
    font-weight: bold;
}

.time-unit .label {
    margin-top: 1px;
    font-size: 8px; /* Muy pequeño debajo del número */
    color: #16a085;
    text-transform: uppercase;
}

/* ============================================================
   FIX CORE WEB VITALS: Corrección CLS (Layout Shift) - Nivel 3
   ============================================================ */

/* 1. IMÁGENES: Forzar el tamaño desde el contenedor raíz */
.thumbnail-container .thumbnail-top {
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    display: block !important;
    background-color: #f8f8f8 !important;
    overflow: hidden !important;
}

.thumbnail-container .thumbnail-top img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    margin: 0 !important;
}


@media (max-width: 767px) {  
	
	/* 4. Blindaje del Logo (Medidas exactas según Lighthouse 170x85) */
    #_mobile_shop-logo {
        min-height: 85px !important; 
        display: flex !important;
        align-items: center;
        justify-content: center;
    }


    /* Base para que no rompa el PC */
  #slider-blindaje, #cashback-blindaje { display: block; width: 100%; }

    #header .header-nav {
        padding: 0px!important;
    }

    #header .mobile-header .mobile-header-top {
        padding: 5px!important;
    }

    #header .mobile-header .shop-logo {
        margin-bottom: 0px!important;
    }

    #btn_mostrar_mas_all,#btn_mostrar_mas{
   	 margin-top:0px!important
   }

    /* 1. RESTAURAR DISEÑO DE CABECERA (Logo Izquierda, Teléfono Derecha) */
    .parent-logo-phone { display: flex !important; justify-content: space-between !important; align-items: center !important; min-height: 85px !important; padding:0px; }
    #_mobile_shop-logo { display: block !important; margin: 0 !important; }
    #_mobile_shop-logo img, .logo.img-fluid { height: 85px !important; object-fit: contain !important; }
    .phone-parent { display: flex !important; align-items: center !important; }
    
    /* =======================================================
       ¡NUEVO! BLINDAJE DE BUSCADOR Y BARRA NARANJA
       Evita que empujen al Slider cuando se inyectan por JS
       ======================================================= */
    #_mobile_tptnsearch { 
        min-height: 44px !important; 
        display: block !important; 
        width: 100% !important; 
    }
    .mobile-header-bottom { min-height: 60px !important; display: flex !important; width: 100% !important; background-color: #f28b26; }
    
    /* 2. BLINDAJE MATEMÁTICO NIVEL DIOS (contain: size) */
    #slider-blindaje {
        width: 100% !important;
        aspect-ratio: 412 / 158 !important; 
        display: block !important;
        overflow: hidden !important;
        contain: size layout paint !important; 
        background-color: #f0f0f0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #cashback-blindaje {
        width: 100% !important;
        height: 63px !important;
        display: block !important;
        contain: size layout paint !important; 
        margin: 0 !important;
        padding: 0 !important;
    }
    
    /* 3. Tarjetas de Producto y Estrellas */
    .thumbnail-container .thumbnail-top { aspect-ratio: 1 / 1 !important; width: 100% !important; display: block !important; background-color: #fdfdfd; overflow: hidden; }
    .comments_note, .star_ratings, .star_content_ratings, .star_content_ratings.clearfix { min-height: 18px !important;}
    
    /* 4. Aislamiento del contenido */
    #wrapper { contain: layout paint !important; }

}