/**
 * Gallery Lightbox — shared component
 *
 * Used independently by template-single.php (analysis-single.css's own
 * .as-chart__zoom-link triggers) and intel-template.php (Market Hub's
 * .intel-gallery-slide triggers) — enqueued separately by each page via
 * enqueue.php, not bundled into either page's own CSS file. Markup is
 * injected at runtime by gallery-lightbox.js, not written into either
 * template, so there's exactly one source of truth for both.
 *
 * Caption/timestamp block and prev/next nav are optional per trigger —
 * gallery-lightbox.js hides them when a trigger provides no
 * data-caption/data-timestamp, or no data-lightbox-group (single-image,
 * no nav) — see that file for the exact rules. template-single.php's
 * existing zoom-links supply neither, reproducing today's plain
 * image-only lightbox exactly; intel-template.php's gallery slides
 * supply both.
 *
 * Namespaced .ewi-gallery-lightbox*, not .ewi-lightbox* — main.v2.js/
 * base.v2.css already define an unrelated, pre-existing, sitewide
 * "Global Lightbox" under the .ewi-lightbox name (with !important rules).
 * This component must never collide with that one.
 */

.ewi-gallery-lightbox {
    display: none;
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.92);
    z-index: 999999;
    align-items: center;
    justify-content: center;
    cursor: zoom-out;
}

.ewi-gallery-lightbox.is-open { display: flex; }

.ewi-gallery-lightbox__stage {
    position: relative;
    max-width: 95vw;
    max-height: 92vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: default;
}

.ewi-gallery-lightbox__img {
    max-width: 95vw;
    max-height: 80vh;
    width: auto;
    height: auto;
    border-radius: 8px;
    object-fit: contain;
    display: block;
    margin: 0 auto;
}

.ewi-gallery-lightbox__close {
    position: absolute;
    top: 16px;
    right: 20px;
    color: #fff;
    font-size: 2rem;
    cursor: pointer;
    background: none;
    border: none;
    line-height: 1;
    z-index: 2;
}

.ewi-gallery-lightbox__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
    border: none;
    color: #fff;
    font-size: 24px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.15s;
    z-index: 2;
}

.ewi-gallery-lightbox__nav:hover,
.ewi-gallery-lightbox__nav:focus-visible {
    background: rgba(255, 255, 255, 0.25);
}

.ewi-gallery-lightbox__nav--prev { left: 16px; }
.ewi-gallery-lightbox__nav--next { right: 16px; }

.ewi-gallery-lightbox__meta {
    max-width: 95vw;
    margin-top: 14px;
    text-align: center;
    color: #e6e6e6;
}

.ewi-gallery-lightbox__caption {
    margin: 0 0 4px;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #e6e6e6 !important;
}

.ewi-gallery-lightbox__caption:empty { display: none; }

.ewi-gallery-lightbox__timestamp {
    margin: 0;
    font-size: 0.8125rem;
    color: #9ca3af !important;
}

.ewi-gallery-lightbox__timestamp:empty { display: none; }

@media (max-width: 640px) {
    .ewi-gallery-lightbox__nav { width: 36px; height: 36px; font-size: 20px; }
    .ewi-gallery-lightbox__nav--prev { left: 8px; }
    .ewi-gallery-lightbox__nav--next { right: 8px; }
    .ewi-gallery-lightbox__close { top: 10px; right: 12px; font-size: 1.6rem; }
}