@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-Thin.otf') format('opentype');
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-ThinItalic.otf') format('opentype');
    font-weight: 100;
    font-style: italic;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-ExtraLight.otf') format('opentype');
    font-weight: 200;
    font-style: normal;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-ExtraLightItalic.otf') format('opentype');
    font-weight: 200;
    font-style: italic;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-Light.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-LightItalic.otf') format('opentype');
    font-weight: 300;
    font-style: italic;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-Regular.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-Italic.otf') format('opentype');
    font-weight: 400;
    font-style: italic;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-MediumItalic.otf') format('opentype');
    font-weight: 500;
    font-style: italic;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-SemiBold.otf') format('opentype');
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-SemiBoldItalic.otf') format('opentype');
    font-weight: 600;
    font-style: italic;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-Bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-BoldItalic.otf') format('opentype');
    font-weight: 700;
    font-style: italic;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-ExtraBold.otf') format('opentype');
    font-weight: 800;
    font-style: normal;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-ExtraBoldItalic.otf') format('opentype');
    font-weight: 800;
    font-style: italic;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-Black.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
}
@font-face {
    font-family: 'Inter';
    src: url('/storage/app/files/Inter/Inter-BlackItalic.otf') format('opentype');
    font-weight: 900;
    font-style: italic;
}

.--hidden{
    display:none;
}

body{
    background: linear-gradient(180deg, #E4F0FF 0%, #E3FFED 70%);
    background-repeat: no-repeat;
    min-height: 100vh;
    margin:0;
    font-family: 'Inter', sans-serif;
    padding: 35px 0 42px;
    box-sizing: border-box;
}
a{
    text-decoration: none;
    color: inherit;
}
footer.not_auth{
    padding: 0;
}
form{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
#app{
    max-width: 500px;
    height: 100%;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}
#page{
    width: 100%;
}
.top-block{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 25px;
}
.top-block img{
    width: 84px;
    margin-bottom: 28px;
}
.top-block .name{
    color: rgba(30, 64, 176, 1);
    text-transform: uppercase;
    font-size: 28px;
    font-weight: bold;
    margin-bottom: 7px;
    width: 70%;
    text-align: center;
}
.top-block .title{
    font-size: 28px;
    font-weight: bold;
    color: rgba(44, 44, 44, 1);
    width: 100%;
    text-align: center;
    margin-bottom: 7px;
}
.top-block .sub_name{
    font-size: 17px;
    color: rgba(44, 44, 44, 1);
}
.form-block{
    background: rgba(255, 255, 255, 1);
    border-radius: 14px;
    padding: 35px 24px;
}
.form-block .input-row{
    width:70%;
}
.form-block .input-row label{
    width:70%;
    margin-bottom: 7px;
    font-size: 14px;
    display: block;
}
.form-block .input-row input{
    width: 100%;
    margin-bottom: 14px;
    border-radius: 7px;
    background: rgba(243, 243, 245, 1);
    padding: 18px;
    border: none;
    outline: none;
    box-sizing: border-box;
}
.form-block .button{
    width: 100%;
    border-radius: 7px;
    background: rgba(20, 94, 252, 1);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 49px;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
    border: none;
    outline: none;
}
.form-block .resend{
    color: #145EFC;
    margin: 28px auto 0 auto;
    font-weight: 500;
    display: block;
    background: none;
    border: none;
    font-size: 11px;
    font-family: 'Inter';
    cursor: pointer;
}
.main-content{
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
    background: white;
    margin-bottom: 21px;
    padding: 33px 25px 25px;
    border-radius: 14px;
}
.main-content .images_support{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 31px;
}
.main-content .images_support .main-img{
    position: absolute;
}
.main-content .images_support .back-img{
    
}
.main-content .percentages{
    width: 161px;
    height: 161px;
    border-radius: 70%;
    border: 10px solid rgba(14, 186, 129, 1);
    color: rgba(14, 186, 129, 1);
    font-size: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    margin: auto;
    margin-bottom: 18px;
}
.main-content .percentages.orange{
    color: rgba(255, 204, 0, 1);
    border: 10px solid rgba(255, 204, 0, 1);
}
.main-content .percentages.red{
    color: rgba(222, 63, 62, 1);
    border: 10px solid rgba(222, 63, 62, 1);
}
.main-content .percentages span{
    
}
.main-content .timer_row{
    margin-bottom: 18px;
    text-align: center;
    
}
.main-content .timer_row .timer_title{
    font-size: 13px;
}
.main-content .timer_row .timer_time{
    font-weight: bold;
    font-size: 21px;    
    color: rgba(44, 44, 44, 1);
}
.main-content .button{
    background: linear-gradient(90deg, #125FFA 0%, #00A543 70%);
    color: white;
    text-transform: uppercase;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    font-size: 17px; 
    width: 100%;
    border: none;
    outline: none;
    cursor: pointer;
}
.main-content .button.orange{
    background: linear-gradient(90deg, #FD680C 0%, #FFB300 70%);
}
.main-content .button.red{
    background: linear-gradient(90deg, #DE3F3E 0%, #FD680C 70%);
}
.main-content .button img{
    margin-right: 14px;
}
.bottom_block{
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
    background: white;
    margin-bottom: 31px;
    padding: 24px 35px;
    border-radius: 14px;
}
.bottom_block .info_row{
    display: flex;
    font-size: 13px;
    justify-content: center;
}
.bottom_block .info_row .info_title{
    font-weight: bold;
}
.bottom_block .info_row .info_info{
    margin-left: 4px;
}

/* Страница активности */
.main-content.activity_page{
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
    background: white;
    margin-bottom: 21px;
    padding: 38px 28px 28px;
    border-radius: 14px;
}
.main-content.activity_page .images_support{
    margin-bottom: 24px;
}
.main-content.activity_page .timer_row{
    margin-bottom: 28px;
}
.main-content.activity_page .timer_row .timer_time{
    margin-bottom: 14px;
}
.main-content .timer_row .timer_title{
    line-height: 17px;
}
.main-content.activity_page .button{
    width: 100%;
    border-radius: 7px;
    background: rgba(20, 94, 252, 1);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 49px;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
    border: none;
    outline: none;
    text-transform: none;
}

.main-content.activity_page .steps_counter {
    margin-bottom: 24px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.main-content.activity_page .steps_counter .steps_quantity {
    color: rgba(20, 94, 252, 1);
    font-size: 56px;
    font-weight: bold;
    margin-bottom: 4px;
    width: 70%;
    text-align: center;
}
.main-content.activity_page .steps_counter .steps_subtitle {
    color: rgba(107, 115, 131, 1);
    font-size: 14px;
}
.main-content.activity_page .steps_goal {
    width: 70%;
    margin-bottom: 21px;
}
.main-content.activity_page .steps_goal .row {
    color: rgba(113, 114, 130, 1);
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.main-content.activity_page .steps_goal .row.first {
    font-size: 13px;
    margin-bottom: 10px;
}
.main-content.activity_page .steps_goal .row.first .left {

}
.main-content.activity_page .steps_goal .row.first .right {

}
.main-content.activity_page .steps_goal .graph {
    background: rgba(230, 231, 235, 1);
    border-radius: 7px;
    height: 14px;
}
.main-content.activity_page .steps_goal .graph .full{
    background: linear-gradient(90deg, #4EA0FF 0%, #1863FC 70%);
    height: 14px;
    border-radius: 7px;
    width: 15%; /*ТУТ МЕНЯЕМ ЗАПОЛНЕННОСТЬ*/
}
.main-content.activity_page .steps_goal .row.second {
    font-size: 11px;
    margin-top: 7px;
}
.main-content.activity_page .steps_goal .row.second .right {
    margin-left: auto;
}
.main-content.activity_page .personal_data {
    margin-bottom: 21px;
    display: flex;
    justify-content: space-between;
}
.main-content.activity_page .personal_data .item {
    width: calc(23% - 14px);
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
    padding: 21px 18px 10px;
    border-radius: 14px;
    text-align: center;
    margin-right: 14px;
}
.main-content.activity_page .personal_data .item img {
    margin-bottom: 7px;
}
.main-content.activity_page .personal_data .item .quantity {
    color: rgba(44, 44, 44, 1);
    font-size: 17px;
    font-weight: bold;
    width: 70%;
    margin-bottom: 4px;
}
.main-content.activity_page .personal_data .item .unit {
    color: rgba(107, 115, 131, 1);
    font-size: 8px;
    width: 70%;
    margin-bottom: 21px;
}
.main-content.activity_page .personal_data .item .title {
    color: rgba(107, 115, 131, 1);
    font-size: 8px;
    text-transform: uppercase;
    width: 70%;
}
.main-content.activity_page .personal_data .item.kilometrs {
    background: rgba(239, 246, 255, 1);
}
.main-content.activity_page .personal_data .item.calories {
    background: rgba(255, 247, 237, 1);
}
.main-content.activity_page .personal_data .item.time {
    background: rgba(241, 254, 244, 1);
    margin-right: 0px;
}
.main-content.activity_page .disconect_app {
    border: 1px solid rgba(185, 248, 207, 1);
    background: rgba(241, 254, 244, 1);
    padding: 21px 28px 18px 18px;
    display: flex;
    align-items: center;
}
.main-content.activity_page .disconect_app img {
    margin-right: 10px;
}
.main-content.activity_page .disconect_app .info {

}
.main-content.activity_page .disconect_app .info .connected {
    color: rgba(15, 84, 44, 1);
    font-size: 14px;
    margin-bottom: 7px;
}
.main-content.activity_page .disconect_app .info .app_name {
    color: rgba(15, 84, 44, 1);
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 4px;
}
.main-content.activity_page .disconect_app .info .last_upd {
    margin-bottom: 2px;
    color: rgba(0, 130, 54, 1);
}
.main-content.activity_page .disconect_app .info .last_upd_time {
    color: rgba(0, 130, 54, 1);
}
.main-content.activity_page .disconect_app .disconnect {
    margin-left: auto;
    color: rgba(231, 0, 11, 1);
    font-size: 13px;
    cursor: pointer;
    border: none;
    outline: none;
    background: none;
}
.bottom_block .title {
    margin-bottom: 21px;
    display: flex;
    align-items: center;
    font-size: 17px;
    font-weight: bold;
}
.bottom_block .title img {
    margin-right: 14px;
}
.bottom_block .geo_access {
    margin-bottom: 14px;
    border: 1px solid rgba(255, 178, 0, 1);
    background: rgba(254, 253, 239, 0.5);
    padding: 18px 28px 18px 35px;
    border-radius: 14px;
}
.bottom_block .geo_access .title {
    color: rgba(172, 129, 76, 1);
    font-size: 13px;
}
.bottom_block .geo_access .description {
    font-size: 8px;
    color: rgba(44, 44, 44, 1);
}
.bottom_block .button {
    width: 100%;
    border-radius: 7px;
    background: rgba(20, 94, 252, 1);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 49px;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
    border: none;
    outline: none;
    text-transform: none;
}
/* Страница активности */


/* Страница контакты */
.top-block.contacts{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.top-block.contacts .title{
    font-size: 21px;
    text-align: left;
    width: auto;
}
.top-block.contacts .button{
    width: 154px;
    border-radius: 7px;
    background: rgba(20, 94, 252, 1);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 31px;
    text-align: center;
    font-size: 11px; 
    font-weight: 600;
    cursor: pointer;
    border: none;
    outline: none;
    text-transform: none;
}
.top-block.contacts .button img{
    margin: 0;
    margin-right: 8px;
    max-width: 15px;
    width: auto;
}
.main-content.contacts .empty_contacts{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}
.main-content.contacts .empty_contacts img{
    margin-bottom: 28px;
}
.main-content.contacts .empty_contacts .text{
    color: rgba(106, 114, 130, 1);
    font-size: 13px;
    width: 70%;
    text-align: center;
}
.main-content.contacts_item{
    padding: 14px 21px;
    margin-bottom: 14px;
    position: relative;
}
.main-content.contacts_item .control_buttons{
    display: flex;
    align-items: center;
    position: absolute;
    right: 21px;
}
.main-content.contacts_item .control_buttons img{
    cursor: pointer;
}
.main-content.contacts_item .control_buttons img:first-child{
    margin-right: 14px;
}
.main-content.contacts_item .name{
    color: rgba(44, 44, 44, 1);
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 21px;
}
.main-content.contacts_item .phone{
    margin-bottom: 10px;
    color: rgba(74, 85, 101, 1);
    display: flex;
    align-items: center;
}
.main-content.contacts_item .email{
    margin-bottom: 21px;
    color: rgba(74, 85, 101, 1);
    display: flex;
    align-items: center;
}
.main-content.contacts_item .phone img{
    margin-right: 7px;
}
.main-content.contacts_item .email img{
    margin-right: 7px;
}
.main-content.contacts_item .connection_type{
    background: rgba(218, 234, 255, 1);
    color: rgba(20, 71, 230, 1);
    font-size: 10px;
    border-radius: 21px;
    width: max-content;
    padding: 4px 14px;
}
.contacts_counter{
    color: rgba(106, 114, 130, 1);
    font-size: 10px;
    text-align: center;
}
/* Страница контакты */


/* Страница настроек */
.main-content.settings {
    padding: 21px;
    margin-bottom: 14px;
    position: relative;
}
.main-content.settings .title {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 14px;
}
.main-content.settings .data_form {
    margin-bottom: 14px;

}
.main-content.settings .data_form input {
    margin-bottom: 7px;
    width: 100%;
    box-sizing: border-box;
    border-radius: 7px;
    outline: none;
    border: none;
    background: rgba(243, 243, 245, 1);
    height: 28px;
    padding: 0 14px;
}
.main-content.settings .button{
    background: rgba(106, 114, 130, 1);
    width: 100%;
    height: 35px;
    border-radius: 7px;
    text-transform: none;
    font-size: 14px;
}
.main-content.settings .button.change {

}
.main-content.settings .button.save {
    background: rgba(20, 94, 252, 1);
    color: white;
}
.main-content.settings .select-wrapper {
    position: relative;
}
.main-content.settings select {
    width: 100%;
    box-sizing: border-box;
    border-radius: 7px;
    outline: none;
    border: none;
    background: rgba(243, 243, 245, 1);
    height: 28px;
    padding: 0 14px;
    padding-right: 45px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}
.main-content.settings .select-wrapper::after {
    content: "⮟"; /* или ▼ */
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    color: #666;
    pointer-events: none;
}
.main-content.settings .switch {
    position: absolute;
    right: 21px;
    top: 21px;
    display: inline-block;
    width: 35px;
    height: 21px;
}
.main-content.settings .switch input {
    display: none;
}
.main-content.settings .slider {
    position: absolute;
    inset: 0;
    background: #d9d9df;
    border-radius: 699px;
    cursor: pointer;
    transition: background-color 0.25s ease;
}
.main-content.settings .slider::before {
    content: "";
    position: absolute;
    width: 18px;
    height: 18px;
    left: 1px;
    top: 1px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 2px rgba(0,0,0,.15);
    transition: transform 0.25s ease;
}
.main-content.settings .switch input:checked + .slider {
    background: rgba(20, 94, 252, 1);
}
.main-content.settings .switch input:checked + .slider::before {
    transform: translateX(14px);
}
.main-content.settings .description {
    color: rgba(74, 85, 101, 1);
}
.button.big {
    background: rgba(20, 94, 252, 1);
    width: 100%;
    height: 49px;
    border-radius: 14px;
    text-transform: none;
    border: none;
    outline: none;
    font-size: 14px;
    margin-bottom: 14px;
    color: white;
    cursor: pointer;
}
.button.big.exit {
    background: rgba(255, 255, 255, 1);
    border: 2px solid rgba(255, 202, 202, 1);
    margin-bottom: 35px;
    color: rgba(231, 0, 11, 1);
}
.button.exit.big img {
    margin-right: 7px;
}
.links_block {
    margin-bottom: 35px;
    color: rgba(20, 94, 252, 1);
    text-align: center;
}
.links_block .support {
    margin-bottom: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    cursor: pointer;
}
.links_block .support img {
    margin-right: 4px;
}
.links_block .support span {
    text-decoration: underline;
}
.links_block .info_link {
    margin-bottom: 7px;
    text-decoration: underline;
    font-weight: 500;
    cursor: pointer;
}
.links_block .developer {
    color: rgba(74, 85, 101, 1);
    margin-top: 18px;
    font-weight: 500;
}
.links_block .developer a {
    text-decoration: none;
    color: rgba(20, 94, 252, 1);
}
.links_block .developer a img {
    margin-left: 4px;
}
/* Страница настроек */

/* Уведомления */
#obj-ui-overlay-notifications-area{
    position: fixed;
    top: 30px;
    left: 50%;
    margin: auto;
    z-index: 999999;
    width: 302px;
    margin-left: -150px;
    padding: 0 0 0 0;
}
#obj-ui-overlay-notifications-area .obj-ui-overlay-notification{
    background: rgba(255, 255, 255, 1);
    box-shadow: none;
    backdrop-filter: none;
    border-radius: 10px;
    padding: 11px 14px;
    margin: auto;
    box-sizing: border-box;
}
#obj-ui-overlay-notifications-area .obj-ui-overlay-notification .icon{
    width: 14px;
    margin-right: 7px;
}
.obj-ui-overlay-notification .text{
    font-size: 10px;
    color: rgba(44, 44, 44, 1);
}
.obj-ui-overlay-notification .text .title{
    display: none;
}
.obj-ui-overlay-notification .text .comment{
    
}
/* Уведомления */