/**
 * P1 — CSS hiệu năng load (giảm giật, chớp, CLS).
 * Load sau styles.css trên Site.Master.
 */
@layer ola-perf {
    /* Logo header — giữ khung trước khi ảnh tải */
    .header-logo-img,
    .ola-vne-brand__logo,
    .ola-vne-nav-brand__img {
        display: block;
        width: auto;
        height: 40px;
        max-height: 40px;
        object-fit: contain;
    }

    .ola-vne-brand__link {
        display: inline-flex;
        align-items: center;
        min-height: 40px;
    }

    .ola-vne-nav-brand {
        min-height: 40px;
    }

    /* Trending — tin đầu hiện ngay, không chờ JS */
    #ola-trending-slider .ola-trending-item:first-child {
        opacity: 1;
        transform: translateY(0);
        pointer-events: auto;
    }

    /* Trang chủ — slick pre-init (tránh nhảy layout trước .slick-initialized) */
    .ola-home-page .top__news__slider:not(.slick-initialized) {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow: hidden !important;
        max-height: 320px;
    }

        .ola-home-page .top__news__slider:not(.slick-initialized) > .item {
            flex: 0 0 25% !important;
            max-width: 25% !important;
            min-width: 0 !important;
            overflow: hidden !important;
            display: flex !important;
            align-items: stretch !important;
        }

    .ola-home-page .article__entry-carousel:not(.slick-initialized) {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow: hidden !important;
    }

        .ola-home-page .article__entry-carousel:not(.slick-initialized) > .item {
            flex: 0 0 25% !important;
            max-width: 25% !important;
            min-width: 0 !important;
            overflow: hidden !important;
            display: flex !important;
            align-items: stretch !important;
        }

    .ola-home-page .top__news__slider .article__image,
    .ola-home-page .article__entry-carousel .article__image {
        aspect-ratio: 16 / 11;
        background: #eef2f7;
    }

    /* QC band — cô lập layout, giảm reflow lan */
    .ola-ad-band-top,
    .ola-master-bottom-ad-wrap,
    .ola-ad-slot {
        contain: layout style;
    }

    /* Hero trang chủ — giữ khung ảnh LCP trước khi tải */
    .ola-home-page .hero-card.hero-large .ola-post-img {
        width: 100%;
        height: auto;
        aspect-ratio: 4 / 3;
        object-fit: cover;
        background: #eef2f7;
    }

    /* Hoãn hoạt ảnh trang trí đến sau frame đầu (giảm jank paint đầu) */
    html:not(.ola-page-ready) .ola-trending-strip__card::before,
    html:not(.ola-page-ready) .ola-brand-logo--live::after,
    html:not(.ola-page-ready) .ola-subscribe-btn::before {
        animation: none !important;
    }

    /* Chi tiết SP / Tour — hoãn pulse, shine, fade đến sau frame đầu */
    html:not(.ola-page-ready) .fade-effect,
    html:not(.ola-page-ready) .btn-buy-now,
    html:not(.ola-page-ready) .btn-buy-now::after,
    html:not(.ola-page-ready) .bc-flash-tag,
    html:not(.ola-page-ready) .badge-detail-no-shopping::after,
    html:not(.ola-page-ready) .btn-book::before {
        animation: none !important;
    }

    @media (prefers-reduced-motion: reduce) {
        html *,
        html *::before,
        html *::after {
            animation-duration: 0.01ms !important;
            animation-iteration-count: 1 !important;
            transition-duration: 0.01ms !important;
            scroll-behavior: auto !important;
        }
    }
}