/* ================================
   MOBILE HEADER REDESIGN
   uavending.com / Helix3
   ================================ */

@media (max-width: 767px) {

    /* база */
    body,
    .body-wrapper,
    .body-innerwrapper {
        background: #f4f5f7 !important;
    }

    /* верхнее десктопное меню */
    #sp-top-menu {
        display: none !important;
    }

    /* верхний бар: язык / корзина */
    #sp-top-bar {
        background: #111 !important;
        padding: 5px 0 !important;
        min-height: 42px !important;
    }

    #sp-top-bar .container {
        width: 100% !important;
        padding: 0 12px !important;
    }

    #sp-top-bar .row {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        margin: 0 !important;
    }

    /* скрываем старый логотип в top-bar */
    #sp-logo {
        display: none !important;
    }

    /* скрываем телефон, почту, соцсети */
    #sp-top1,
    #sp-top2,
    .sp-contact-info,
    .sp-social-icons {
        display: none !important;
    }

    /* языковой переключатель компактнее */
    .mod-languages,
    #sp-top-bar select {
        transform: scale(.9);
        transform-origin: left center;
        max-width: 130px !important;
    }

    /* основная мобильная шапка */
    #sp-header {
        background: #fff !important;
        min-height: 56px !important;
        height: 56px !important;
        box-shadow: 0 2px 10px rgba(0,0,0,.10) !important;
        margin: 0 !important;
        padding: 0 !important;
        position: relative !important;
        z-index: 99 !important;
    }

    #sp-header .container {
        width: 100% !important;
        padding: 0 16px !important;
    }

    #sp-header .row {
        min-height: 56px !important;
        display: flex !important;
        align-items: center !important;
        position: relative !important;
        margin: 0 !important;
    }

    #sp-menu {
        width: 100% !important;
        padding: 0 !important;
    }

    #sp-menu .sp-column {
        min-height: 56px !important;
        display: flex !important;
        align-items: center !important;
    }

    /* бургер */
    #offcanvas-toggler {
        display: block !important;
        color: #333 !important;
        font-size: 24px !important;
        line-height: 56px !important;
        margin: 0 !important;
        padding: 0 !important;
        float: none !important;
        position: relative !important;
        z-index: 3 !important;
    }

    #offcanvas-toggler i {
        color: #333 !important;
    }

    /* текстовый логотип по центру */
    #sp-header .row::after {
        content: "LIBERTY";
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        font-size: 22px;
        font-weight: 800;
        color: #d8a11b;
        letter-spacing: 2px;
        pointer-events: none;
        z-index: 1;
    }

    /* десктопное меню не показываем */
    .sp-megamenu-parent {
        display: none !important;
    }

    /* offcanvas меню */
    .offcanvas-menu {
        background: #111 !important;
        color: #fff !important;
    }

    .offcanvas-menu .offcanvas-inner {
        padding: 28px 22px !important;
    }

    .offcanvas-menu a {
        color: #fff !important;
        font-size: 16px !important;
        line-height: 1.4 !important;
        padding: 12px 0 !important;
        display: block !important;
        border-bottom: 1px solid rgba(255,255,255,.08) !important;
    }

    .close-offcanvas {
        color: #fff !important;
        font-size: 24px !important;
    }

    /* контент ближе к шапке */
    #sp-main-body {
        padding-top: 12px !important;
        background: #f4f5f7 !important;
    }

    /* картинки/видео не вылезают */
    img,
    iframe,
    video {
        max-width: 100% !important;
        height: auto !important;
    }

    iframe,
    video {
        border-radius: 12px !important;
    }

    /* текст читабельнее */
    p {
        font-size: 16px !important;
        line-height: 1.55 !important;
    }

    /* кнопки современнее */
    a.btn,
    .btn,
    button,
    input[type="submit"] {
        border-radius: 12px !important;
        padding: 11px 18px !important;
        font-weight: 700 !important;
    }
}