/* ==================================
   QQPK HEADER - GENERAL
================================== */

.site-header {
    position: sticky !important;
    top: 0;
    z-index: 99999 !important;
    width: 100%;
    background: #1c1e22;
}

/* ==================================
   DESKTOP MENU
================================== */

@media (min-width: 1024px) {

    .site-header--row {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
        gap: 16px !important;
    }

    .site-header__logo {
        flex: 0 0 auto;
    }

    .site-header--menu-area {
        display: flex;
        align-items: center;
        justify-content: flex-end !important;
        flex: 1 1 auto;
        width: auto;
        max-width: none;
        min-width: 0;
        gap: 16px !important;
    }

    .site-header__menu {
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: none !important;
    }

    .site-header__menu > ul {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: flex-start !important;
        align-items: center;
        width: max-content !important;
        gap: 14px !important;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .site-header__menu > ul > li {
        flex: 0 0 auto !important;
        margin: 0 !important;
        white-space: nowrap !important;
    }

    .site-header__menu > ul > li > a {
        white-space: nowrap;
    }

    .site-header__btn-login,
    .site-header__langs {
        flex: 0 0 auto !important;
    }
}

/* ==================================
   SMALL DESKTOP
================================== */

@media (min-width: 1024px) and (max-width: 1199px) {

    .site-header--row,
    .site-header--menu-area {
        gap: 10px !important;
    }

    .site-header__menu > ul {
        gap: 9px !important;
    }

    .site-header__menu > ul > li > a {
        font-size: 12px;
    }
}

/* ==================================
   MOBILE FIXED HEADER
================================== */

@media (max-width: 1023px) {

    :root {
        --qqpk-mobile-header-height: 72px;
    }

    .site-header {
        position: fixed !important;
        top: 0 !important;
        left: 0;
        right: 0;
        width: 100%;
        height: var(--qqpk-mobile-header-height);
        padding: 0 !important;
        z-index: 99999 !important;
        background: #1c1e22;
        overflow: visible;
    }

    .site-header--row {
        height: 100%;
        min-height: var(--qqpk-mobile-header-height);
        display: flex;
        align-items: center;
    }

    body {
        padding-top: var(--qqpk-mobile-header-height);
    }

    html {
        scroll-padding-top: 85px;
    }
}

/* ==================================
   WORDPRESS ADMIN BAR
================================== */

@media (min-width: 783px) {

    body.admin-bar .site-header {
        top: 32px !important;
    }
}

@media (max-width: 782px) {

    body.admin-bar .site-header {
        top: 46px !important;
    }
}

/* ==================================
   SMOOTH ANCHOR SCROLLING
================================== */

html {
    scroll-behavior: smooth;
}

@media (min-width: 1024px) {
    html {
        scroll-padding-top: 110px;
    }
}