/* 1. Apertura suave y fluida */
[id^="product-description-short"] {
    transition: max-height 0.6s cubic-bezier(0.4, 0, 0.2, 1); /* Movimiento más natural */
    overflow: hidden;
    position: relative;
}

/* El degradado: Ahora se funde con el GRIS de tu fondo */
[id^="product-description-short"].is-collapsed::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px;
    /* Cambia #f6f6f6 por el color exacto de tu fondo gris */
    background: linear-gradient(transparent, #f6f6f6); 
    pointer-events: none;
    transition: opacity 0.3s;
}

/* El Botón "Zara Style": Minimalista y profesional */
.btn-ver-mas-discreto {
    background: none;
    color: #1a1a1a;          /* Texto casi negro, muy elegante */
    border: none;
    border-bottom: 1px solid #1a1a1a; /* Solo una línea debajo */
    padding: 0 0 2px 0;      /* Pegado a la línea */
    font-size: 12px;
    text-transform: uppercase; /* Mayúsculas tipo marca de moda */
    letter-spacing: 1px;     /* Espaciado entre letras */
    cursor: pointer;
    margin-top: 15px;
    font-weight: 500;
    transition: all 0.3s ease;

	/* ESTO ELIMINA EL RECUADRO EN MÓVIL */
    outline: none !important;
    -webkit-tap-highlight-color: transparent; /* Quita el destello azul en Android/iOS */
}

.btn-ver-mas-discreto:hover {
    color: #999;             /* Gris suave al pasar el ratón */
    border-bottom-color: #999;
    text-decoration: none;
}

/* Ocultamos el degradado al expandir */
[id^="product-description-short"]:not(.is-collapsed)::after {
    opacity: 0;
}
