/* skeleton.css — Skeleton loaders animados para estados de carga */

@keyframes skeleton-pulse {
    0%   { opacity: 1; }
    50%  { opacity: 0.45; }
    100% { opacity: 1; }
}

.skeleton {
    background-color: #e2e8f0;
    border-radius: var(--radius-sm, 0.5rem);
    animation: skeleton-pulse 1.5s ease-in-out infinite;
    display: block;
}

/* Variantes de texto */
.skeleton-text { height: 0.875rem; border-radius: 0.25rem; margin-bottom: 0.5rem; }
.skeleton-text:last-child { width: 75%; }
.skeleton-heading { height: 1.5rem; border-radius: 0.25rem; margin-bottom: 0.75rem; width: 55%; }
.skeleton-label { height: 0.75rem; width: 30%; border-radius: 0.25rem; margin-bottom: 0.35rem; }

/* Variantes dimensionales */
.skeleton-avatar { width: 3rem; height: 3rem; border-radius: 50%; flex-shrink: 0; }
.skeleton-icon { width: 3rem; height: 3rem; border-radius: var(--radius-md, 0.75rem); flex-shrink: 0; }
.skeleton-number { height: 2.5rem; width: 4rem; border-radius: 0.35rem; }
.skeleton-btn { height: 2.25rem; border-radius: var(--radius-md, 0.75rem); }
.skeleton-badge { height: 1.25rem; width: 5rem; border-radius: 0.5rem; }

/* Variante de fila de tabla */
.skeleton-row {
    height: 3.25rem;
    border-radius: var(--radius-sm, 0.5rem);
    margin-bottom: 0.5rem;
}
.skeleton-row:nth-child(even) { opacity: 0.7; }

/* Card skeleton completa */
.skeleton-card {
    border-radius: var(--radius-lg, 1rem);
    border: 1px solid #e2e8f0;
    padding: 1rem;
    background: #fff;
}
.skeleton-card-img { height: 10rem; border-radius: 0.75rem; margin-bottom: 1rem; }