/* ===== Catálogo de Artes (grid, tarjetas, filtros) ===== */

/* Filtros (Tema/Color) */
.filters-bar{ 
    display:flex; 
    gap:10px; 
    flex-wrap:wrap; 
    align-items:center; 
    margin:8px 0 14px; 
}
.filter-group{ 
    position:relative; 
}
.filter-toggle{ 
    display:inline-flex; 
    align-items:center; 
    gap:8px; 
    padding:8px 12px; 
    border:1px solid rgba(255,255,255,.18); 
    background:rgba(255,255,255,.06);
    backdrop-filter: blur(1px) brightness(.9);
    color:#fff; 
    border-radius:10px; 
    cursor:pointer; 
}
.filter-toggle .filter-label{ 
    opacity:.85; 
    font-size:.9rem; 
}
.filter-toggle .filter-current{ 
    font-weight:700; 
}
.filter-toggle .hamburger{ 
    font-size:1rem; 
    line-height:1; 
    opacity:.9; 
}
.filter-menu{ 
    position:absolute; 
    top:110%; 
    left:0; 
    min-width:200px; 
    background:rgba(0, 0, 0, 0.047); 
    border:1px solid rgba(255,255,255,.18); 
    border-radius:10px; 
    padding:6px; 
    list-style:none; 
    margin:6px 0 0; 
    z-index:20; 
    backdrop-filter: blur(10px) brightness(.9); 
}
.filter-menu li{ 
    margin:0; 
}
.filter-menu button{ 
    display:flex; 
    width:100%; 
    text-align:left; 
    padding:8px 10px; 
    border:none; 
    background:transparent; 
    color:#fff; 
    border-radius:8px; 
    cursor:pointer; 
}
.filter-menu button:hover{ 
    background:rgba(255,255,255,.08); 
}
.filter-menu .active{
    background:#f4c87da2; 
    backdrop-filter: blur(10px) brightness(.9); 
}

/* Grid y tarjetas */
.art-grid{ display:grid; 
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); 
    gap:14px; 
}
.art-card{ 
    position:relative; 
    border:1px solid rgba(255,255,255,.12); 
    border-radius:14px; overflow:hidden; 
    background: rgba(255,255,255,.04); 
    backdrop-filter: blur(2px) brightness(.6);
}
.art-thumb{ 
    width:100%; 
    aspect-ratio: 16/10; 
    object-fit:cover; 
    display:block; 
    filter: contrast(1.02) saturate(1.05); 
}
.art-body{ 
    padding:10px; 
    color:#fff; 
}
.art-title{ 
    font-weight:700; 
    margin-bottom:6px; 
}
.art-tags{ 
    font-size:.8rem; 
    opacity:.8; 
}
.art-actions{ 
    display:flex; 
    flex-wrap:wrap; 
    gap:8px; 
    margin-top:8px; 
}
.art-actions a{ 
    display:inline-block; 
    padding:8px 10px; 
    border:1px solid rgba(255,255,255,.18); 
    border-radius:8px; 
    color:#fff; 
    background: rgba(255, 255, 255, 0.06); 
    text-decoration:none; 
    font-size:.9rem; 
}
.art-actions a:hover{ 
    filter: brightness(1.05); 
}

/* Sentinel para lazy load */
#load-more-sentinel{ 
    width:100%; 
    height:1px; 
}