/* Site navigation — loaded after page CSS to keep layout + active state consistent */

/* Header + nav eni bütün səhifələrdə eyni (Ana səhifə ilə) */
.main-header > .container,
.main-nav > .container {
    max-width: var(--container-max, 1140px);
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--container-pad, 20px);
    padding-right: var(--container-pad, 20px);
    box-sizing: border-box;
}

@media (min-width: 993px) {
    .main-nav .nav-wrapper {
        display: flex;
        align-items: stretch;
        justify-content: flex-start;
        gap: 0;
        min-height: 52px;
    }

    .main-nav .burger-btn {
        display: none !important;
        width: 0 !important;
        min-width: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        overflow: hidden;
        border: none;
    }

    .main-nav .menu-list {
        display: flex;
        flex: 1 1 auto;
        flex-wrap: nowrap;
        align-items: stretch;
        list-style: none;
        margin: 0;
        padding: 0;
        min-width: 0;
    }

    .main-nav .nav-item {
        display: flex;
        align-items: stretch;
        flex-shrink: 0;
    }

    .main-nav .nav-link-wrapper {
        display: flex;
        align-items: stretch;
        height: 100%;
    }

    .main-nav .nav-link {
        display: flex;
        align-items: center;
        padding: 0 12px;
        font-size: 13px;
        font-weight: 600;
        white-space: nowrap;
        height: 100%;
        box-sizing: border-box;
    }

    .main-nav .nav-popular-link {
        margin-left: auto;
        flex-shrink: 0;
        align-self: center;
        padding: 8px 0 8px 12px;
    }
}

/* Active page — orange background on current nav item */
.main-nav .nav-item.active > .nav-link,
.main-nav .nav-item.active > .nav-link-wrapper > .nav-link {
    background: var(--primary, #f7971c);
    color: #fff !important;
}

.main-nav .nav-item.active:hover > .nav-link,
.main-nav .nav-item.active:hover > .nav-link-wrapper > .nav-link {
    color: #fff !important;
}

.main-nav .nav-item.highlight {
    background: transparent;
}

.main-nav .nav-item.highlight > .nav-link {
    color: var(--dark, #333);
    background: transparent;
}

.main-nav .nav-item:not(.active):hover > .nav-link,
.main-nav .nav-item:not(.active):hover > .nav-link-wrapper > .nav-link {
    color: var(--primary, #f7971c);
    background: transparent;
}