.mg-gallery { margin: 1.5em 0; }

.mg-search { margin-bottom: 1.25em; }
.mg-search label { display: block; font-weight: 600; margin-bottom: .4em; }
.mg-search-row { display: flex; gap: .5em; max-width: 420px; }
.mg-search input[type="search"] { flex: 1; min-width: 0; padding: .6em .8em; font-size: 1rem; border: 1px solid #c7c7c7; border-radius: 6px; }
.mg-search button { padding: .6em 1.1em; font-size: 1rem; border: 0; border-radius: 6px; background: #111; color: #fff; cursor: pointer; }
.mg-search button:hover { background: #333; }
.mg-clear { display: inline-block; margin-top: .5em; font-size: .9em; }

.mg-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 8px; }
.mg-photo { display: block; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 4px; background: #eee; }
.mg-photo img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .2s ease; }
.mg-photo:hover img { transform: scale(1.03); }

.mg-empty, .mg-hint { padding: 1em; background: #f5f5f5; border-radius: 6px; }
.mg-event-title { margin: 1.5em 0 .5em; }
.mg-pages { margin-top: 1.25em; display: flex; flex-wrap: wrap; gap: .35em; }
.mg-pages .page-numbers { padding: .35em .7em; border: 1px solid #ddd; border-radius: 4px; text-decoration: none; }
.mg-pages .current { background: #111; color: #fff; border-color: #111; }

.mg-events { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.mg-event { display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.mg-event img, .mg-event-placeholder { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 6px; background: #e6e6e6; display: block; }
.mg-event-name { font-weight: 600; margin-top: .5em; }
.mg-event-meta { font-size: .9em; opacity: .75; }

.mg-lightbox { position: fixed; inset: 0; z-index: 99999; background: rgba(0, 0, 0, .92); display: flex; align-items: center; justify-content: center; }
.mg-lightbox img { max-width: 94vw; max-height: 86vh; object-fit: contain; }
.mg-lightbox button { position: absolute; background: none; border: 0; color: #fff; font-size: 2.2rem; line-height: 1; padding: .4em .6em; cursor: pointer; }
.mg-lightbox .mg-close { top: 8px; right: 8px; }
.mg-lightbox .mg-prev { left: 4px; top: 50%; transform: translateY(-50%); }
.mg-lightbox .mg-next { right: 4px; top: 50%; transform: translateY(-50%); }
.mg-lightbox .mg-save { bottom: 16px; left: 50%; transform: translateX(-50%); font-size: 1rem; border: 1px solid rgba(255, 255, 255, .6); border-radius: 6px; text-decoration: none; color: #fff; padding: .5em 1em; position: absolute; }
