/* Tablet menu */
@media only screen and (min-width: 641px) and (max-width: 1024px) {

    #header-outer .row,
    #header-outer .row>div {
        align-items: center;
        flex-direction: row;
        display: flex;
    }

    .modal-form-outer.ai-input-outer.ai-search-outer.ai-input-outer.header-ai-search {
        margin: 0 3rem 0 1rem;
    }

    #header-outer:not([data-format=left-header]) #top .span_3,
    #header-outer:not([data-format=left-header]) #top .span_9 {
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        float: none;
        width: auto;
        position: relative !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .header-avatar-link {
        margin-left: 0;
    }
}

/* Mobile menu */
@media only screen and (max-width: 640px) {

    #header-outer .row {
        display: flex;
        align-items: center;
        width: 100%;
        justify-content: space-between;
    }

    #header-outer .row>div {
        display: flex;
        align-items: center;
    }

    #header-outer:not([data-format=left-header]) #top .span_3 {
        flex-grow: 1;
        justify-content: center;
    }

    #header-outer:not(.search-active) .ai-input-outer,
    #header-outer.search-active .col {
        z-index: -1 !important;
        opacity: 0 !important;
        transition: opacity 0.3s ease-in-out, margin-top 0.2s ease-in-out, z-index 0.1s ease-in-out;
    }

    #header-outer.search-active .ai-input-outer,
    #header-outer:not(.search-active) .col {
        z-index: 1000 !important;
        opacity: 1 !important;
        transition: opacity 0.3s ease-in-out, margin-top 0.2s ease-in-out, z-index 0.1s ease-in-out;
    }

    #header-outer.search-active .ai-input-outer {
        z-index: 1002 !important;
        margin-top: 0;
    }

    #header-outer.search-active #top>.container>.row {
        position: relative;
        height: 100%;
    }

    #header-outer .ai-input-outer {
        margin-top: -8px;
    }

    #header-ai-search-container {
        position: absolute;
        top: -1rem;
        left: -1.2rem;
        width: calc(100% + 4rem);
    }

    #header-outer.at-top #header-ai-search-container {
        left: -2rem;
    }

    #header-outer.search-active #header-ai-search-container,
    #header-outer.search-active.at-top #header-ai-search-container {
        top: -0.75rem;
        left: 0;
        width: 100%;
        height: calc(100% + 1.5rem);
        max-height: none;
        align-items: center !important;
    }

    #header-outer.search-active:not(.at-top) #header-ai-search-container {
        top: -0.85rem;
        left: -1.2rem;
        width: calc(100% + 2.4rem);
        height: calc(100% + 1.5rem);
    }

    #header-outer .header-ai-search {
        width: 100% !important;
    }

    #header-outer.search-active .header-ai-search {
        margin: 0 !important;
        height: 100%;
        max-height: none;
    }

    .modal-form-outer.ai-input-outer.ai-search-outer.ai-input-outer.header-ai-search .modal-form,
    .modal-form-outer.ai-input-outer.ai-search-outer.ai-input-outer.header-ai-search .modal-form .ai-input-form-inner {
        min-height: 3.5rem;
    }

    #header-outer.search-active .modal-form-outer.ai-input-outer.ai-search-outer.ai-input-outer.header-ai-search .modal-form,
    #header-outer.search-active .modal-form-outer.ai-input-outer.ai-search-outer.ai-input-outer.header-ai-search .modal-form .ai-input-form-inner {
        height: 100%;
        min-height: 56px;
        width: 100% !important;
        max-width: none;
    }

    #header-outer.search-active:not(.at-top) .modal-form-outer.ai-input-outer.ai-search-outer.ai-input-outer.header-ai-search .modal-form,
    #header-outer.search-active:not(.at-top) .modal-form-outer.ai-input-outer.ai-search-outer.ai-input-outer.header-ai-search .modal-form .ai-input-form-inner {
        background-color: transparent !important;
    }

    #header-outer #top nav>ul {
        padding: 0 !important;
    }

    .modal-form-outer.ai-input-outer.ai-search-outer.ai-input-outer.header-ai-search {
        margin: 0 1.4rem;
    }

    .mobile-search-icon {
        display: block;
        z-index: 1001;
    }

    .slide-out-widget-area-toggle.mobile-icon.slide-out-from-right,
    body.page-template-template-my-account .header-avatar-link,
    body.parent-pageid-132834 .header-avatar-link {
        display: none !important;
    }

    body.page-template-template-my-account .slide-out-widget-area-toggle.mobile-icon.slide-out-from-right,
    body.parent-pageid-132834 .slide-out-widget-area-toggle.mobile-icon.slide-out-from-right {
        display: block !important;
    }

    #top #mobile-cart-link,
    #top .mobile-search,
    #top .span_9>.slide-out-widget-area-toggle {
        margin-top: -0.2rem;
    }

    body #header-outer.at-top #top .slide-out-widget-area-toggle a .lines-button:after,
    body #header-outer.invisible #top .slide-out-widget-area-toggle a .lines-button:after,
    body #header-outer.at-top #top .slide-out-widget-area-toggle a .lines:after,
    body #header-outer.invisible #top .slide-out-widget-area-toggle a .lines:after,
    body #header-outer.at-top #top .slide-out-widget-area-toggle a .lines:before,
    body #header-outer.invisible #top .slide-out-widget-area-toggle a .lines:before,
    body #header-outer.scrolling #top .slide-out-widget-area-toggle a .lines-button:after,
    body #header-outer.scrolling #top .slide-out-widget-area-toggle a .lines:after,
    body #header-outer.scrolling #top .slide-out-widget-area-toggle a .lines:before {
        background-color: #86a696;
    }

    body.page-template-suppliers #header-outer.at-top #top .slide-out-widget-area-toggle a .lines-button:after,
    body.page-template-suppliers #header-outer.invisible #top .slide-out-widget-area-toggle a .lines-button:after,
    body.page-template-suppliers #header-outer.at-top #top .slide-out-widget-area-toggle a .lines:after,
    body.page-template-suppliers #header-outer.invisible #top .slide-out-widget-area-toggle a .lines:after,
    body.page-template-suppliers #header-outer.at-top #top .slide-out-widget-area-toggle a .lines:before,
    body.page-template-suppliers #header-outer.invisible #top .slide-out-widget-area-toggle a .lines:before,
    body.page-template-suppliers #header-outer.scrolling #top .slide-out-widget-area-toggle a .lines-button:after,
    body.page-template-suppliers #header-outer.scrolling #top .slide-out-widget-area-toggle a .lines:after,
    body.page-template-suppliers #header-outer.scrolling #top .slide-out-widget-area-toggle a .lines:before {
        background-color: #A9C4BA;
    }

    #header-outer.search-active:not(.transparent) .ai-input-outer {
        margin: 0;
        width: 100% !important;
    }

    #header-outer:not(.transparent) .circle-mobile-header,
    body.page-template-suppliers #header-outer .circle-mobile-header,
    body.single-tribe_events #header-outer .circle-mobile-header {
        border: 0.5px solid var(--color-primary);
        box-shadow: 0 0 0.7px 0.7px var(--color-primary), inset 0 0 1.5px 0.7px var(--color-primary);
        opacity: 0.7;
    }

    #header-outer:not(.transparent) .circle-mobile-header:nth-child(4),
    #header-outer:not(.transparent) .circle-mobile-header:nth-child(5),
    body.page-template-suppliers #header-outer .circle-mobile-header:nth-child(4),
    body.page-template-suppliers #header-outer .circle-mobile-header:nth-child(5),
    body.single-tribe_events #header-outer .circle-mobile-header:nth-child(4),
    body.single-tribe_events #header-outer .circle-mobile-header:nth-child(5) {
        box-shadow: 0 0 3px 0px var(--color-primary), inset 0 0 3px 1px var(--color-primary);
    }

    .ai-input-progress-data.strong.answer-active {
        padding: 0 !important;
    }

    .ai-input-progress-data:not(.question-loading) .circles.circles-answer {
        left: 0.2rem !important;
    }

    .ai-category-button-row {
        gap: 0.4rem !important;
    }

    .ai-input-progress-data.strong.answer-active .ai-answer-container {
        padding-top: 0.8rem !important;
    }

    .ai-input-data-item,
    .ai-input-progress-relevance {
        line-height: 1.2rem !important;
        margin-bottom: 0.5rem;
    }

    body:not(.page-template-suppliers) #header-outer.at-top.transparent .modal-form input.input-text::placeholder {
        color: rgba(195, 212, 207, 0.3) !important;
    }

    .ai-input-data-item::before,
    .ai-input-progress-relevance::before {
        top: 0.35rem !important;
    }

    .modal-form input.input-text {
        font-size: 16px !important;
    }

    #header-outer.at-top.transparent .ai-input-outer:not(.active) .ai-input-form-button:not(.modified),
    #header-outer.at-top.transparent .ai-input-outer:not(.active) .ai-input-form-button:not(.modified):hover,
    #header-outer.at-top.transparent .ai-input-outer:not(.active) .ai-input-form-button:not(.modified):active,
    #header-outer.at-top.transparent .ai-input-outer:not(.active) .ai-input-form-button:not(.modified):focus {
        box-shadow: none !important;
    }

    #header-outer .col.span_3,
    #header-outer[data-format=centered-menu-bottom-bar] #top .span_9,
    #top .col.span_9 {
        width: auto !important;
        position: relative !important;
    }

    #top .col.span_9 {
        min-width: 22px;
    }

    body #top #logo img,
    #header-outer[data-permanent-transparent="false"] #logo .dark-version {
        height: 22px !important;
    }

    #header-outer #top #mobile-cart-link i,
    #header-outer .mobile-search .icon-salient-search,
    #header-outer .mobile-user-account .icon-salient-m-user,
    #top .span_9>.slide-out-widget-area-toggle>div {
        -webkit-transform: none !important;
        transform: none !important;
    }
}