/**
 * Minimal safety-net styling for the [vgs_events] / [vgs_gallery] shortcodes.
 * The "Vedic Girls School" theme fully styles these same classes via its own
 * assets/css/style.css (loaded after this file wins by cascade order), so on
 * that theme these rules are effectively invisible. On any OTHER theme, this
 * keeps the grid/cards/lightbox from looking broken.
 */
.vgs-events-grid,
.vgs-gallery-grid { margin-top: 1rem; }

.vgs-no-results { text-align: center; color: #888; padding: 2rem 0; }

.filter-tabs { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 1.5rem; }
.filter-tabs .nav-link {
  border: 1px solid #e5d9c3; background: #fff; color: #666; font-weight: 600;
  padding: 9px 22px; border-radius: 50px; font-size: 0.86rem; cursor: pointer;
}
.filter-tabs .nav-link.active { background: #7a1237; color: #fff; border-color: #7a1237; }

.event-card, .gallery-item { border-radius: 14px; overflow: hidden; background: #fff; box-shadow: 0 10px 30px rgba(0,0,0,0.08); }
.event-card img, .gallery-item img { width: 100%; display: block; }
.event-card .event-body { padding: 20px; }
.event-card h6 a { color: inherit; text-decoration: none; }
.gallery-item { position: relative; cursor: pointer; margin-bottom: 24px; }

.lightbox-modal .modal-content { background: transparent; border: none; }
.lightbox-modal img, .lightbox-modal iframe { width: 100%; border-radius: 10px; }
.lightbox-modal .btn-close { filter: invert(1); }