/*
 * LimageCMS v0.4 Advertising — A5 Frontend Engine
 *
 * Isolated advertising styles. No global site rules are changed here.
 */

.limage-slot--ad {
    display: block;
    width: 100%;
}

.limage-ad {
    width: 100%;
    box-sizing: border-box;
}

.limage-ad + .limage-ad {
    margin-top: 16px;
}

.limage-ad__image {
    display: block;
    max-width: 100%;
    width: 100%;
    height: auto;
    margin: 0 auto;
}

.limage-ad__link {
    display: block;
    width: 100%;
    color: inherit;
    text-decoration: none;
}

.limage-ad__link:hover {
    text-decoration: none;
}

.limage-ad:not(.limage-ad--grid) .limage-ad__link {
    overflow: hidden;
    border-radius: 12px;
    background: #e9edf2;
}

.limage-ad:not(.limage-ad--grid) .limage-ad__image {
    max-height: 420px;
    object-fit: contain;
}

.limage-ad__variant {
    width: 100%;
}

.limage-ad__variant--mobile {
    display: none;
}

.limage-ad--grid {
    min-width: 0;
    width: 100%;
    height: 100%;
    margin: 0;
}

.gallery-card--ad {
    height: 100%;
    min-width: 0;
}

.gallery-card--ad .gallery-card__ad-media {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #e9edf2;
}

.gallery-card--ad .gallery-card__ad-media > * {
    max-width: 100%;
    max-height: 100%;
}

.gallery-card--ad .gallery-card__ad-media > .limage-ad__variant {
    width: 100%;
    height: 100%;
}

.gallery-card--ad .gallery-card__ad-media > .limage-ad__variant > * {
    max-width: 100% !important;
    max-height: 100%;
}

.gallery-card--ad .gallery-card__ad-media > .limage-ad__link,
.gallery-card--ad .gallery-card__ad-media > .limage-ad__link > .limage-ad__image {
    width: 100%;
    height: 100%;
}

.gallery-card--ad .gallery-card__ad-media > .limage-ad__link > .limage-ad__image {
    object-fit: cover;
    background: transparent;
}

.gallery-card--ad .gallery-card__ad-media > .limage-ad__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: transparent;
}

.gallery-card--ad .gallery-card__body {
    min-width: 0;
}

.gallery-card--ad .gallery-card__title {
    overflow-wrap: anywhere;
}

.site-header .limage-slot--ad {
    margin-top: 14px;
    padding-bottom: 14px;
}

.site-footer__ad {
    padding-bottom: 24px;
}

.site-footer__ad .limage-slot--ad {
    margin-top: 0;
}

.frontend-layout--with-sidebar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    align-items: start;
    gap: 24px;
}

.frontend-layout__sidebar {
    min-width: 0;
}

.frontend-layout__sidebar .limage-ad {
    position: sticky;
    top: 20px;
}

.gallery-page__media-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    align-items: start;
    gap: 24px;
}

.gallery-page__media-main {
    min-width: 0;
}

.gallery-page__ad-sidebar {
    min-width: 0;
}

.gallery-page__ad-sidebar .limage-ad {
    position: sticky;
    top: 20px;
}

.gallery-page__content-ad {
    margin: 24px 0;
}

@media (max-width: 900px) {
    .frontend-layout--with-sidebar,
    .gallery-page__media-layout {
        grid-template-columns: 1fr;
    }

    .frontend-layout__sidebar .limage-ad,
    .gallery-page__ad-sidebar .limage-ad {
        position: static;
    }

    .gallery-page__ad-sidebar {
        order: 2;
    }

    .gallery-page__media-main {
        order: 1;
    }
}

@media (max-width: 700px) {
    .limage-ad__variant--desktop {
        display: none;
    }

    .limage-ad__variant--mobile {
        display: block;
    }

    .site-header .limage-slot--ad {
        margin-top: 10px;
        padding-bottom: 10px;
    }

    .site-footer__ad {
        padding-bottom: 18px;
    }
}

/* A8 frontend hardening: keep advertising content inside its placement. */
.limage-ad,
.limage-ad__variant,
.limage-slot--ad {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.limage-ad img,
.limage-ad video,
.limage-ad iframe,
.limage-ad object,
.limage-ad embed {
    max-width: 100%;
}

.limage-ad iframe,
.limage-ad video {
    display: block;
    width: 100%;
}

.limage-ad__image {
    height: auto;
}

/* Long advertiser titles/content must not create horizontal overflow. */
.limage-ad,
.limage-ad * {
    overflow-wrap: anywhere;
    word-break: normal;
}

@media (max-width: 700px) {
    .limage-ad:not(.limage-ad--grid) .limage-ad__image {
        max-height: none;
    }

    .site-header .limage-slot--ad,
    .site-footer__ad,
    .frontend-layout__sidebar,
    .gallery-page__ad-sidebar {
        width: 100%;
        max-width: 100%;
    }
}

/* A8 Header: keep the navigation row intact and place the ad below it.
 * The header uses a flex layout; the ad gets its own full-width row.
 */
@media (min-width: 721px) {
    .site-header__inner {
        flex-wrap: wrap;
    }

    .site-header__inner > .limage-slot--ad {
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
        margin-top: 0;
        padding-bottom: 14px;
    }

    .site-header__inner > .limage-slot--ad .limage-ad {
        width: 100%;
        max-width: 100%;
    }
}