/* meseneked.hu lightbox - a Milkbox 1.3.1 megjelenese, fuggoseg nelkul.
   A prev/next/close GIF-ek az eredeti Milkbox sprite-jai (17x40 es 20x40):
   alapallapot a sprite tetejen, hover 23 px-szel lejjebb. */

.lb-overlay {
    position: fixed;
    inset: 0;
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background-color: rgba(0, 0, 0, .8);
    cursor: pointer;
    opacity: 0;
    transition: opacity .25s ease;
    box-sizing: border-box;
}

.lb-overlay.lb-open { opacity: 1; }

/* a display:flex kulonben felulirna a bongeszo [hidden] szabalyat */
.lb-overlay[hidden] { display: none; }

/* a feher doboz - Milkbox #mbCenter */
.lb-box {
    max-width: 100%;
    max-height: 100%;
    display: flex;
    flex-direction: column;
    background-color: #fff;
    border: 5px solid #fff;
    padding: 5px;
    margin: 0;
    cursor: default;
    box-sizing: border-box;
}

/* min-height:0 kell, hogy a kep zsugorodni tudjon a flex oszlopban */
.lb-figure {
    margin: 0;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lb-figure.lb-loading {
    min-height: 60px;
    background: #fff url(loading.gif) no-repeat center;
}

.lb-figure img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    opacity: 0;
    transition: opacity .25s ease;
}

.lb-figure img.lb-shown { opacity: 1; }

/* also sav - Milkbox #mbBottom */
.lb-bottom {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
    font-size: 10px;
    color: #666;
    line-height: 1.4em;
    padding-top: 8px;
    margin: 0;
}

.lb-caption {
    flex: 1 1 auto;
    text-align: justify;
    min-width: 0;
    padding-top: 14px;
}

.lb-count {
    flex: 0 0 auto;
    font-size: 9px;
    text-align: right;
    white-space: nowrap;
    padding-top: 15px;
}

.lb-nav {
    flex: 0 0 auto;
    display: flex;
    padding-left: 8px;
    border-left: 1px solid #9c9c9c;
}

/* A kattintofelulet 44x44 (erintes), de a latszo ikon a sprite pontos merete:
   17x20 a nyilaknal, 20x20 a bezarasnal. A ::before ablaka vagja ki a sprite-bol
   az alapallapotot; hover-nel 23 px-szel feljebb toljuk - ahogy a Milkbox tette. */
.lb-nav button {
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    background: transparent;
    cursor: pointer;
    padding: 0;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lb-nav button::before {
    content: "";
    display: block;
    height: 20px;
    background-repeat: no-repeat;
    background-position: 0 0;
}

.lb-prev::before,
.lb-next::before { width: 17px; }

.lb-close::before { width: 20px; }

.lb-prev::before  { background-image: url(prev.gif); }
.lb-next::before  { background-image: url(next.gif); }
.lb-close::before { background-image: url(close.gif); }

.lb-nav button:hover::before,
.lb-nav button:focus-visible::before { background-position: 0 -23px; }

.lb-nav button[disabled] {
    opacity: .3;
    cursor: default;
}

.lb-nav button[disabled]:hover::before { background-position: 0 0; }

/* kepernyoolvasonak szant, vizualisan rejtett szoveg */
.lb-sr {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

@media (prefers-reduced-motion: reduce) {
    .lb-overlay,
    .lb-figure img { transition: none; }
}

/* keskeny kepernyon a felirat a gombok ala kerul */
@media (max-width: 480px) {
    .lb-overlay { padding: 8px; }
    .lb-bottom { flex-wrap: wrap; }
    .lb-caption { order: 3; flex-basis: 100%; text-align: left; padding-top: 4px; }
}