/**/

    html {
      scroll-behavior: smooth;
      overflow-x: hidden;
      overscroll-behavior: none;
    }

    *{
        box-sizing: border-box;
    }

    body{
        font-family: "Inter", sans-serif;
        margin: 0;
    }

    .hide_element{
        display: none;
        margin: 0;
    }

    /**/

    #onboarding{
        width: 100%;
        max-width: 550px;
        left: 0; right: 0;
        margin: auto;
    }

    /**/

    h1{
        width: 100%;
        margin: 0;
        text-align: center;
        font-size: 30px;
        margin-bottom: 20px;
    }

    /**/

    step{
        width: 100%;
        min-height: calc(100svh - 56px - 88px);
        position: relative;
        display: none;
        padding: 30px;
        padding-top: 10px;
    }
    .step_view{
        display: flex;
        flex-wrap: wrap;
        align-content: flex-start;
        align-items: flex-start;
    }

    .step_center{
        align-content: stretch;
    }

    /**/


    .welcome_location{
        position: relative;
        display: flex;
        align-content: center;
        align-items: center;
        justify-content: flex-start;
    }

    .welcome_location_search_results{
        position: relative;
        display: block;
        width: 100%;
    }

    #welcome_location_search_results_all {
        margin-top: 12px;
        width: 100%;
        background: #FFF;
        display: none;
        flex-wrap: wrap;
        border-radius: 12px;
        gap: 10px;
        padding: 10px;
        max-height: 68svh;
        overflow: auto;
        box-shadow: 0 0 4px rgb(0 0 0 / 0.1), 0 1px 2px rgb(0 0 0 / 0.1);
    }
    .result-item {
        width: 100%;
        padding: 10px;
        cursor: pointer;
        background: #FFF;
        border-radius: 6px;
        display: block;
    }
    .result-item name {
        width: 100%;
        font-weight: 520;
        position: relative;
        display: flex;
        align-content: center;
        align-items: center;
        justify-content: flex-start;
    }
    .result-item img{
        box-sizing: unset;
        width: 19px;
        pointer-events: none;
        user-select: none;
        margin-right: 2px;
        margin-left: -3px;
        margin-bottom: 1px;
    }
    .result-item street{
        position: relative;
        display: block;
        width: 100%;
        font-size: 12px;
        opacity: .6;
        margin-top: 2px;
    }

    .welcome_search_results_skeleton{
        width: 100%;
        height: 71px;
        background: #DEDEDE;
    }

    .welcome_location_search_results_not_found{
        margin: 16px 0;
        font-size: 12px;
        color: #71717A;
    }

    .host_google_not_found{
        padding: 10px;
        margin: 0;
        font-size: 14.5px;
        user-select: none;
        pointer-events: none;
    }

    /**/

    phase{
        width: 100%;
        height: auto;
        display: flex;
        padding: 10px 30px;
        gap: 20px;
        align-content: center;
        align-items: center;
        justify-content: space-between;
    }

    .phase_back{
        margin: 0;
        display: flex;
        align-content: center;
        justify-content: center;
        align-items: center;
        border-radius: 9999px;
        background: #F8F8FD;
        padding: 8px;
        cursor: pointer;
    }
    .phase_back img{
        box-sizing: unset;
        width: 20px;
        pointer-events: none;
        user-select: none;
    }

    bar{
        width: 100%;
        border-radius: 9999px;
        overflow: hidden;
        pointer-events: none;
        user-select: none;
        background: #EAEAEB;
        height: 4px;
    }

    bar fill{
        position: relative;
        display: block;
        width: 0%;
        height: 100%;
        background: #1E1A24;
        border-radius: 9999px;
        transition: all 200ms ease-in;
    }

    #fill{
        width: 18%;
    }

    /**/

    step h2{
        margin: 0;
        margin-bottom: 10px;
        font-weight: 600;
    }

    step h4{
        margin: 0;
        margin-bottom: 40px;
        opacity: .6;
        font-size: 14px;
        font-weight: 400;
    }

    content{
        width: 100%;
        position: relative;
        display: block;
        height: auto;
    }

    .content-gap{
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .content-grid{
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    /**/

    .price-discover{
        width: 100%;
        display: flex;
        align-content: center;
        align-items: center;
        justify-content: center;
        flex-wrap: nowrap;
        gap: 12px;
        margin-bottom: 50px;
    }

    .price-discover img{
        user-select: none;
        box-sizing: unset;
        width: 20px;
        padding: 14px;
        border: 1px solid var(--qetra-border);
        border-radius: 999999px;
        cursor: pointer;
        transition: 0.3s all ease;
        opacity: .8;
        -webkit-tap-highlight-color: transparent;
    }
    .price-discover img:active{
        background: #F5F5F7;
    }

    .price-min{
        pointer-events: none;
        opacity: .1 !important;
        cursor: not-allowed;
    }

    .price-discover input{
        width: 200px;
        height: 70px;
        background-color: #F5F5F7;
        border: none;
        outline: 0px;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        align-content: center;
        color: var(--qetra-color-black);
        font-size: 30px;
        font-weight: 400;
        text-align: center;
        border-radius: 24px;

        transition: all 200ms ease;
        outline: 2px solid transparent;
    }
    /* Chrome, Safari, Edge, Opera */
    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
      -webkit-appearance: none;
      margin: 0;
    }

    /* Firefox */
    input[type=number] {
      -moz-appearance: textfield;
    }

    /**/

    .profit_card{
        width: 100%;
        border-radius: 12px;
        background: #f8f8fc;
        padding: 30px 20px;
        margin-top: 14px;
    }
    .profit_card p{
        margin: 0;
        width: 100%;
        text-align: center;
        font-weight: 550;
        font-size: 21px;
    }
    .negative{
        color: red;
    }
    .profit_card span{
        position: relative;
        width: 100%;
        display: block;
        text-align: center;
        font-size: 13px;
        opacity: .8;
        margin-top: 12px;
    }

    .profit_card_expl{
        margin: 0;
        margin-top: 10px;
        font-size: 12px;
        opacity: .7;
    }
    .profit_card_expl b{
        font-weight: 550 !important;
    }


    /**/

    .client-radar{
        width: 100%;
        background: #FFF;
        border: 1px solid #DEDEDE;
        display: flex;
        align-content: center;
        align-items: center;
        border-radius: 12px;
        padding: 15px;
        user-select: none;
        pointer-events: none;
    }

    .client-radar-icon{
        aspect-ratio: 1/1;
        box-sizing: unset;
        width: 21px;
        padding: 12px;
        background: #eeeeee;
        border-radius: 9999px;
        margin-right: 15px;
    }

    .client-radar-side{
        display: flex;
        flex-wrap: wrap;
    }

    .client-radar-name{
        margin: 0;
        width: 100%;
        font-size: 13px;
    }

    .client-radar-warning{
        margin: 0;
        display: flex;
        align-content: center;
        align-items: center;
        justify-content: flex-start;
        padding: 6px 8px;
        border-radius: 6px;
        background: #ffe4e1;
        color: #FF3B30;
        font-size: 12px;
        margin-top: 4px;
        z-index: 10;
    }
    .client-radar-warning img{
        box-sizing: unset;
        width: 12px;
        margin-right: 3px;
    }

    .client-radar-blur{
        position: absolute;
        width: 105%;
        background: #ffffff00;
        opacity: 1;
        z-index: 9;
        height: 100px;
        backdrop-filter: blur(2px);
        margin-top: -10px;
        margin-left: -2.5%;
    }

    /**/

    .channel{
        width: 100%;
        border-radius: 24px;
        background: #EFF2F3;
        padding: 40px;
        user-select: none;
        pointer-events: none;
        overflow: hidden;
    }
    .channel img{
        width: 100%;
        box-sizing: unset;
    }

    /**/

    #password_eye{
        box-sizing: unset;
        width: 19px;
        padding: 10px;
        position: absolute;
        right: 0;
        cursor: pointer;
        opacity: .5;
        outline: none;
        border: none;
        -webkit-tap-highlight-color: transparent;
    }

    /**/

    #step_paywall{
        height: auto;
        padding-left: 0px;
        padding-right: 0px;
    }
    #step_paywall h2, #step_paywall h4{
        padding-left: 30px;
        padding-right: 30px;
    }

    .trust-brands-title{
        margin: 0;
        width: 100%;
        margin-bottom: 10px;
    }
    .trust-brands{
        width: 100%;
        display: grid;
        grid-template-columns: repeat(3, calc(calc(100% - 14px) / 3));
        gap: 12px;
        align-content: center;
        justify-content: center;
        align-items: center;
        margin-bottom: 30px;
    }
    .trust-brands img{
        user-select: none;
        pointer-events: none;
        width: 100%;
        opacity: .9;
    }

    .paywall_card_plans_swipe{
        margin-top: 10px;
        display: grid;
        grid-template-columns: repeat(2, calc(100% - 12px));
        gap: 12px;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x mandatory;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;

        padding: 2px 30px;
    }

    .paywall_card_plan{
        width: 100%;
        height: auto;
        border-radius: 24px;
        padding: 24px;
        background: #f4f4f4;
    }
    .paywall_card_plan_second{
        background: #FFF;
        outline: 1px solid #DEDEDE;
    }

    .paywall_card_plan_title{
        margin: 0;
        font-weight: 600;
        display: flex;
        align-content: center;
        align-items: center;
        justify-content: flex-start;
        width: 100%;
        gap: 8px;
        font-size: 20px;
    }

    badge{
        position: relative;
        font-size: 12px;
        background: #0166ff;
        color: #FFF;
        padding: 4px 8px;
        border-radius: 8px;
        font-weight: 550;
    }

    .paywall_card_plan_price{
        margin: 0;
        margin-top: 16px;
        display: flex;
        gap: 8px;
        align-items: flex-end;
    }
    .paywall_card_plan_price total{
        font-weight: 600;
        font-size: 28px;
    }
    .paywall_card_plan_price span{
        font-size: 12px;
        opacity: .7;
        padding-bottom: 5px;
    }

    .paywall_card_plan_price_number_users{
        margin: 0;
        margin-top: 2px;
        font-size: 13px;
        opacity: .7;
        width: 100%;
    }

    #step_paywall .ui-btn{
        margin: 40px 0;
        margin-bottom: 20px;
        width: 100%;
    }

    .paywall_card_plan_trust{
        width: 100%;
        display: flex;
        align-items: flex-start;
        justify-content: center;
        justify-content: flex-start;
        gap: 8px;
        font-size: 14px;
        opacity: .7;
        margin: 0;
        margin-top: 12px;
    }
    .paywall_card_plan_trust img{
        box-sizing: unset;
        width: 17px;
        aspect-ratio: 1/1;
        user-select: none;
        pointer-events: none;
    }

    .legal{
        width: 100%;
        font-size: 11px;
        opacity: .6;
        margin: 0;
        margin-top: 30px;
        text-align: center;
    }

    .paywall_table{
        width: 100%;
        border-radius: 12px;
        padding: 24px;
        background: #f4f4f4;
        margin-top: 10px;
    }
    .paywall_table p{
        margin: 0;
        opacity: .7;
        border-bottom: 1px solid #DEDEDE;
        padding-bottom: 5px;
        margin-bottom: 5px;
        display: flex;
        align-items: center;
        align-content: center;
        justify-content: space-between;
        font-size: 15px;
    }

    #step_paywall_2 .ui-btn{
        margin-bottom: 0px;
    }

    /**/

    .padding{
        padding-left: 30px;
        padding-right: 30px;
    }

    /**/

    sheet{
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        position: relative;
        bottom: 0px; left: 0; right: 0;
        padding: 20px 30px;
        background: #FFF;
        box-shadow: 0 0 4px rgb(0 0 0 / 0.1), 0 1px 2px rgb(0 0 0 / 0.1);
        flex-direction: column;
    }
    sheet .ui-btn{
        max-width: 500px;
        margin: auto;
    }

    .sheet_to_down{
        position: relative;
    }

    /**/

    #step_google{
        min-height: calc(100svh - 207px);
    }

    #step_host_name{

    }

    #step_seg{
        min-height: calc(100svh - 56px - 88px);
    }

    /**/

    #step_erk_radar content{
        margin-top: -30px;
    }

    /**/

    .modal-legal-terms{
        width: 100%;
        height: 100svh;
        position: fixed;
        left: 0; top: 0; right: 0;
        display: block;
        border-radius: 12px 12px 0px 0px;
        background: #FFF;
        z-index: -9999999;
        visibility: hidden;
        transition: all 200ms ease;
        transform: translateY(50vh);
    }
    .modal-legal-terms-view{
        z-index: 9999999;
        visibility: visible;
        transform: translateY(0vh);
    }
    .modal-legal-terms-header{
        width: 100;
        padding: 14px 30px;
        border-bottom: 1px solid #DEDEDE;
    }
    .modal-legal-terms-header p{
        margin: 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
        align-content: center;
    }
    .modal-legal-terms-header img{
        user-select: none;
        padding: 10px;
        right: -10px;
        cursor: pointer;
        width: 21px;
        box-sizing: unset;
    }
    .modal-legal-terms object, #read-terms{
        width: 100%;
        height: 100%;
        position: relative;
        display: block;
        outline: none;
        border: none;
        border-radius: 0px;
        background: #FFF;
    }

    /**/

    #step_account_email_found{
        width: 100%;
        color: red;
        margin: 0;
        margin-top: 7px;
        margin-bottom: 12px;
        font-size: 13px;
    }
    #step_account_email_found a{
        text-decoration: none;
        color: red;
        border-bottom: 1px solid red;
    }

    /**/

    .small{
        width: 100%;
        margin: 0;
        margin-top: 5px;
        font-size: 12px;
        opacity: .6;
        text-align: center;
    }

    /**/

    modal{
        position: fixed;
        left: 0; top: 0; right: 0;
        width: 100%;
        height: 100vh;
        -webkit-backdrop-filter: blur(7px);
        backdrop-filter: blur(7px);
        background: rgb(255 255 255 / 90%);
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        align-content: center;
        padding: 20px;
        z-index: 999999999999;
    }
    modal p {
        margin: 0;
        font-size: 18px;
        width: 100%;
        text-align: center;
        font-weight: 450;
    }
    modal span {
        width: 100%;
        text-align: center;
        opacity: .95;
        font-size: 13px;
        margin-top: 7px;
        color: #b4b4b4;
    }