/* SHOP BAYAR GG — perbaikan layout 19 Okt 2026 (dimuat paling akhir).
   1. Desktop ≥960px: banner carousel 16:10 di kolom sempit memotong teks & tombol.
   2. Ponsel: .sg-tabs-wrap { overflow:hidden } memotong chip kategori yang digulir. */

/* --- Desktop: banner full-width, teks intro di bawahnya --- */
@media (min-width: 960px) {
    .sg-home-hero {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 20px !important;
    }

    .sg-home-hero .sg-carousel-section {
        width: 100% !important;
    }

    .sg-home-hero .sg-hero-carousel {
        width: 100% !important;
        aspect-ratio: 16 / 6.4 !important;
        max-height: 360px !important;
    }

    .sg-home-hero .sg-promo-banner {
        text-align: left !important;
        padding: 4px 2px 8px !important;
    }

    .sg-home-hero .sg-promo-banner-title {
        font-size: clamp(1.5rem, 1vw + 1rem, 2rem) !important;
    }

    .sg-home-hero .sg-promo-banner-desc {
        max-width: 72ch !important;
        margin-inline: 0 !important;
    }
}

/* --- Ponsel: chip kategori digulir di dalam kartu, tidak terpotong di tengah --- */
@media (max-width: 760px) {
    .sg-tabs-wrap {
        overflow: hidden !important;
        min-width: 0 !important;
    }

    .sg-tabs-wrap .sg-tabs {
        display: flex !important;
        flex-wrap: nowrap !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-x: auto !important;
        margin: 0 !important;
        padding: 2px 2px 4px !important;
        scroll-padding-inline: 2px !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .sg-tabs-wrap .sg-tab {
        flex: 0 0 auto !important;
        max-width: none !important;
    }
}

/* --- Desktop: menu navbar satu baris, pencarian yang menyusut --- */
@media (min-width: 761px) {
    .sg-nav-row {
        flex-wrap: nowrap !important;
        gap: 10px !important;
    }

    .sg-nav-menu {
        flex-wrap: nowrap !important;
        min-width: 0 !important;
        margin-left: 10px !important;
        gap: 0 !important;
    }

    .sg-nav-menu-link,
    .sg-nav-cta-btn,
    .sg-nav-dropdown-toggle {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
    }

    .sg-nav-menu-link {
        padding: 8px 10px !important;
        font-size: .8rem !important;
    }

    .sg-nav-cta-btn {
        padding: 9px 12px !important;
        font-size: .78rem !important;
    }

    .sg-nav-actions {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        justify-content: flex-end;
        gap: 8px !important;
    }

    .sg-nav-search {
        flex: 1 1 140px;
        min-width: 0;
        max-width: 200px;
    }

    .sg-nav-search-form {
        width: 100% !important;
        max-width: none !important;
    }
}

/* --- Desktop: semua chip kategori terlihat, tidak tergeser sampai terpotong --- */
@media (min-width: 761px) {
    .sg-tabs-wrap {
        overflow: visible !important;
    }

    .sg-tabs-wrap .sg-tabs {
        display: flex !important;
        flex-wrap: wrap !important;
        overflow: visible !important;
        max-width: 100% !important;
    }
}

/* --- Desktop: tombol Buat Order ikut alur halaman, tidak menimpa daftar produk --- */
@media (min-width: 761px) {
    .checkout-direct .tg-embed-body .tg-sticky-cta,
    body > .tg-sticky-cta {
        position: static !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        z-index: 1 !important;
        margin: 8px 0 0 !important;
        padding: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    .checkout-direct .tg-embed-body .tg-card-products {
        padding-bottom: 20px !important;
    }
}

/* --- Ponsel: nama produk di kartu jangan terpotong jadi satu suku kata --- */
@media (max-width: 760px) {
    body.sg-page-product .checkout-direct .tg-embed-body .tg-item .i-name {
        -webkit-line-clamp: 3 !important;
        line-clamp: 3 !important;
        font-size: .78rem !important;
        line-height: 1.25 !important;
    }
}

/* --- Ponsel, halaman produk: rail kanan tidak menimpa isian form --- */
@media (max-width: 760px) {
    body.sg-page-product main.wrap,
    body.sg-page-product .product-topbar-in,
    body.sg-page-product .checkout-direct .tg-embed-body .tg-main {
        padding-right: calc(12px + var(--sg-side-rail-btn, 44px) + var(--sg-side-rail-edge, 8px)) !important;
    }
}

/* --- Order: label progress tidak dobel --- */
.od-timeline-progress-head {
    justify-content: flex-end;
}
