/* ===================================
   99 - Reglas sin uso detectado
   ===================================

   Estas reglas venian en style.css pero NINGUN selector aparece
   en los .html ni en los .js del proyecto (busqueda del 2026-07-27).
   Se conservan aqui, aisladas, en vez de borrarlas.

   Si confirmas que no las necesitas:
   borra este archivo y quita su @import de style.css.

   Si alguna si se usa (por ejemplo en HTML que genera PHP),
   muevela al archivo tematico que le corresponda:
     .gradient-text .................. 02-base.css
     .breadcrumb ..................... 06-navigation.css
     .admin-login-logo ............... 06-navigation.css
     .testimonial-card ............... 08-cards.css
     .newsletter-input / .search-bar . 04-forms.css
     .image-gallery / .social-share .. 11-producto-detalle.css
     .animate-float / fadeInUpNotif .. 03-animations.css
     .progress-bar / .badge-* ........ 07-feedback.css
     .filter-sidebar ................. 10-productos.css
   =================================== */

/* ===== Texto con degradado dorado ===== */
.gradient-text {
    background: linear-gradient(135deg, #C9A96E 0%, #A8884E 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* ===== Breadcrumb (se usa el markup de Tailwind directamente) ===== */
.breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* ===== Logo del login admin (admin-login.html usa .login-logo inline) ===== */
.admin-login-logo {
    height: 80px;
    width: 80px;
    object-fit: cover;
    border-radius: 50%;
    border: 3px solid rgba(201, 169, 110, 0.4);
    box-shadow: 0 4px 30px rgba(201, 169, 110, 0.15);
}

/* ===== Tarjeta de testimonio ===== */
.testimonial-card {
    transition: all 0.3s ease;
}

.testimonial-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

/* ===== Input de newsletter ===== */
.newsletter-input {
    position: relative;
}

.newsletter-input input {
    padding-right: 120px;
}

.newsletter-input button {
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
}

/* ===== Barra de busqueda ===== */
.search-bar {
    position: relative;
}

.search-bar input {
    padding-left: 40px;
}

.search-bar .search-icon {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #9CA3AF;
}

/* ===== Galeria de imagenes ===== */
.image-gallery {
    position: relative;
}

.image-gallery .thumbnail {
    cursor: pointer;
    transition: all 0.3s ease;
}

.image-gallery .thumbnail:hover {
    transform: scale(1.05);
    border-color: var(--color-gold);
}

/* ===== Botones de compartir en redes ===== */
.social-share button {
    transition: all 0.3s ease;
}

.social-share button:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(201, 169, 110, 0.3);
}

/* ===== Barra de progreso ===== */
.progress-bar {
    height: 8px;
    background: #1F2937;
    border-radius: 10px;
    overflow: hidden;
}

.progress-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--color-gold), var(--color-gold-dark));
    border-radius: 10px;
    transition: width 0.3s ease;
}

/* ===== Badges de producto ===== */
.badge-new,
.badge-sale,
.badge-hot {
    animation: badge-pulse 2s ease-in-out infinite;
}

@keyframes badge-pulse {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(201, 169, 110, 0.7);
    }
    50% {
        transform: scale(1.05);
        box-shadow: 0 0 0 10px rgba(201, 169, 110, 0);
    }
}

/* ===== Sidebar de filtros (productos.html usa clases de Tailwind) ===== */
.filter-sidebar {
    position: sticky;
    top: 100px;
}

.filter-sidebar label {
    transition: color 0.18s ease;
}

.filter-sidebar label:hover {
    color: var(--color-gold);
}

/* ===== Animacion flotante ===== */
@keyframes float {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-10px);
    }
}

.animate-float {
    animation: float 3s ease-in-out infinite;
}

/* ===== Animacion de notificacion (js/main/cart.js usa .animate-fade-in-up) ===== */
@keyframes fadeInUpNotif {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
