/**
 * Sticky index — bottom nav (mobile & tablet only)
 * DILANA BALI + section links
 */

/* Hidden on desktop */
.bali-page .sticky-index {
    display: none;
}

/* Hidden when overlay/drawer open */
body.bali-page.reserve-drawer-open .sticky-index,
body.bali-page.left-menu-open .sticky-index {
    visibility: hidden;
    pointer-events: none;
}

/* Visible on tablet and mobile */
@media (max-width: 1024px) {
    .bali-page .sticky-index {
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 9999;
        background: #f6f3e7;
        box-shadow: 0 -2px 20px rgba(0, 0, 0, 0.08);
        padding: var(--space-sm) var(--space-md);
    }

    .bali-page .sticky-index__inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: var(--space-md);
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .bali-page .sticky-index__brand {
        flex-shrink: 0;
        font-size: 0.875rem;
        font-weight: 500;
        letter-spacing: 0.12em;
        color: #2c2c2c;
    }

    .bali-page .sticky-index__list {
        display: flex;
        align-items: center;
        gap: var(--space-md);
        list-style: none;
        margin: 0;
        padding: 0;
        flex: 1;
        min-width: 0;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .bali-page .sticky-index__list::-webkit-scrollbar {
        display: none;
    }

    .bali-page .sticky-index__item {
        flex-shrink: 0;
    }

    .bali-page .sticky-index__link {
        display: flex;
        align-items: baseline;
        gap: 0.35em;
        color: #2c2c2c;
        text-decoration: none;
        font-size: 0.75rem;
        letter-spacing: 0.08em;
        padding: var(--space-xs) var(--space-sm);
        border-bottom: 2px solid transparent;
        transition: border-color 0.2s ease, color 0.2s ease;
        white-space: nowrap;
    }

    .bali-page .sticky-index__link:hover {
        color: #1a1a1a;
        border-color: rgba(44, 44, 44, 0.3);
    }

    .bali-page .sticky-index__num {
        font-size: 0.6875rem;
        color: #5c5c5c;
    }

    .bali-page .sticky-index__label {
        font-weight: 500;
    }

    /* Spacer so content isn't hidden behind sticky bar */
    .bali-page .panel-stack {
        padding-bottom: 56px;
    }
}

@media (max-width: 768px) {
    .bali-page .sticky-index {
        padding: var(--space-sm) var(--space-lg);
    }

    .bali-page .sticky-index__brand {
        font-size: 0.8125rem;
        letter-spacing: 0.1em;
    }

    .bali-page .sticky-index__link {
        font-size: 0.6875rem;
    }

    .bali-page .panel-stack {
        padding-bottom: 52px;
    }
}