/* ==========================================================================
   CasaLema — AWS Product Tags
   Cintas diagonales de etiquetas en la esquina superior derecha de cada
   resultado de búsqueda dinámico.
   ========================================================================== */

/* El item de resultado necesita position:relative y overflow:hidden.
   El plugin AWS ya agrega position:relative en su propio CSS, pero
   forzamos overflow:hidden aquí para que las cintas no se desborden. */
.aws_result_item {
    overflow: hidden !important;
}

/* Contenedor de las cintas — cubre todo el item */
.aws-tag-ribbons {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 2;
}

/* Cinta base — diagonal en la esquina superior derecha */
.aws-tag-ribbon {
    position: absolute;
    top: 14px;
    right: -24px;
    width: 90px;
    padding: 4px 0;
    background: #5a9e3e;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
    transform: rotate(45deg);
    transform-origin: center center;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Segunda cinta — desplazada hacia abajo para no superponerse */
.aws-tag-ribbon:nth-child(2) {
    top: 34px;
}

/* Tercera cinta */
.aws-tag-ribbon:nth-child(3) {
    top: 54px;
}

/* Cuarta cinta */
.aws-tag-ribbon:nth-child(4) {
    top: 74px;
}
.aws-tag-ribbon {
    position: absolute;
    top: 19px;
    right: -22px;
    width: 100px;
    padding: 4px 0;
    background: #5a9e3e;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
    transform: rotate(45deg);
    transform-origin: center center;
    overflow: hidden;
    text-overflow: ellipsis;
}
.aws-search-result .aws_result_price {
    display: block;
    flex-shrink: 0;
    padding: 0;
    text-align: right;
    margin-right: 40px;
}

.c-product-grid__item .bonificado-icon {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1 !important;
    height: auto;
    max-width: 90px;
}
span.aws-tag-ribbon {
    display: none;
}
span.aws-tag-ribbon.aws-tag-preventa {
    background: #fe0303;
    display: block;
    color: white;
}
span.aws-tag-ribbon.aws-tag-oferta {
    background: #871ee5;
    display: block; 
    color: white;
}
span.aws-tag-ribbon.aws-tag-nuevo {
    background: #f09e27;
    display: block; 
    color: white;
}
span.aws-tag-ribbon.aws-tag-bonificado {
    background: #ade0e4;
    display: block;
    color: black;
}
/* ==========================================================================
   Personalización por slug de etiqueta.
   Agregue reglas aquí usando la clase .aws-tag-{slug} para asignar
   colores distintos a cada etiqueta.

   Ejemplo:
   .aws-tag-oferta    { background: #e74c3c; }
   .aws-tag-nuevo     { background: #3498db; }
   .aws-tag-liquidacion { background: #e67e22; }
   ========================================================================== */
