﻿
/*                                                                     Стили для размеров экрана                                                                           */

@media (min-width: 0) and (max-width: 479px) {

    #modalContentCall {
        max-width: none !important;
        max-height: none !important;
        border: none;
        border-radius: 0;
    }

    #pnlCall, #pnlMainPhoto, #pnlMap, #emptyMyNotes, #categories, #subcategories, .set-chats, .blog-modal, .blog-notes {
        padding: 0 !important;
    }

    .set-back {
        display: flex !important;
    }

    .avd-search, .set-left-container, .set-bell-image, .ast-card-description-column, .search-address-img {
        display: none !important;
    }

    .modal-content {
        padding: 20px !important;
        max-width: 300px !important;
    }

    .modal-contentOnly {
        bottom: 70px !important;
        max-width: calc(100vw - 40px) !important;
        font-size: 14px !important;
    }

    .title-pnlInfo {
        font-size: 20px !important;
        line-height: 26px !important;
    }

    .auth-form, .makead-form, .post-form, .set-form, .sitemap-form {
        padding: 0 !important;
        background-color: #fff !important;
    }

    .set-form {
        padding: 20px !important;
    }

    .user-form {
        flex-direction: column;
        padding: 0 !important;
    }

    .avd-titlePhoto, .set-title-margin-h2, .post-title {
        font-size: 24px !important;
    }

    .search-h1FullAst, .search-countAds, .set-main-text-attention-hight {
        font-size: 22px !important;
    }

    .main-text-attention-hight, .avd-numberPhone, .set-main-text-attention-message, .search-factMain {
        font-size: 20px !important;
    }

    .avd-title-name, .makead-lblTotalCost {
        font-size: 18px !important;
    }

    .ast-text-attention, .ast-main-text-attention, .set-sidebar-item, .search-factText, .makead-ulCategories, .makead-ulSubcategories {
        font-size: 16px !important;
    }

    .ast-card-title, .ast-card-title-column {
        font-size: 15px !important;
    }

    .ast-card-price, .ast-card-price-column, .avd-btnNo, .avd-btnYes, .avd-description-sendMoneyToAnimal, .avd-address-value, .avd-charact-label, .avd-charact-value, .avd-descriptionText, .avd-infoAd, .avd-divCategory, .avd-priceList, .blog-description, .blog-btnSearch, .desc-pnlInfo, .lbl14px, .set-chat-nameClient, .set-chat-titleAd, .set-bell-title, .post-description, .post-description-dop, .post-nameClient {
        font-size: 14px !important;
    }

    .ast-card-town, .ast-card-town-column, .set-chat-message, .set-bell-description, .set-bell-time, .set-chat-time, .set-chats-typingIndicator {
        font-size: 13px !important;
    }

    .ast-lblCookie, .set-messageTime {
        font-size: 12px !important;
    }

    .authOrReg-div {
        box-shadow: none !important;
    }

    .auth-divLink {
        gap: 0 !important;
        justify-content: space-between !important;
    }

    .ast-card-grid {
        flex: 0 0 calc((100% - 20px) / 2) !important;
    }

    .ast-card-container-grid, .ast-card-container-column, .set-card-container, .user-card-container {
        gap: 20px !important;
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .ast-card-heart, .ast-card-heart-column {
        width: 16px !important;
        height: 16px !important;
    }

    .ast-imgCardCategory {
        width: 40px !important;
        height: 40px !important;
    }

    .ast-map-modal-content {
        max-height: none !important;
        border-radius: 0 !important;
    }

    .ast-titleTown {
        justify-content: start !important;
        font-size: 26px !important;
    }

    .ast-cardsCategory {
        height: 310px !important;
        margin-bottom: 40px !important;
    }

    .ast-cardCategory {
        gap: 10px !important;
        padding: 15px !important;
    }

    .ast-titleFullAst {
        margin-bottom: 20px !important;
        font-size: 22px !important;
    }

    .ast-text-container-category, .post-image-and-name, .search-fullAst, .search-divFact, .divNewOldIndicator {
        margin-bottom: 20px !important;
    }

    .ast-search {
        margin: 0 !important;
    }

    .search-view-image {
        max-width: 15px !important;
    }

    .search-pagination {
        gap: 5px !important;
        margin: 40px 0 20px 0 !important;
    }

    .search-pagination-btn, .search-pagination-img-right, .search-pagination-img-left {
        max-width: 35px !important;
        font-size: 14px;
    }

    .avd-bigPhoto {
        max-width: none !important;
        padding: 20px 0 0 0 !important;
        border: none;
        border-radius: 0;
    }

    .avd-container-main {
        flex-direction: column;
        gap: 0 !important;
        padding: 0 !important;
    }

    ._404-div, .avd-container-left, .avd-container-right, .blog-notesAndSearch, .post-div, .user-container-right {
        padding: 20px !important;
    }

    .avd-modalButtons, .set-help {
        gap: 20px !important;
    }

    .avd-div-img-dop {
        border-radius: 0 !important;
    }

    .avd-btnEditDeleteAndPay, .set-horizontal-phones, .avd-priceList-item {
        flex-direction: column;
    }

    .avd-title {
        margin-bottom: 10px !important;
        font-size: 24px !important;
    }

    .avd-moder, .avd-lblDelete {
        margin-bottom: 30px !important;
        font-size: 18px !important;
    }

    .avd-cost {
        margin-bottom: 20px !important;
        font-size: 18px !important;
    }

    .avd-tbReasonCancel {
        height: 39px !important;
        font-size: 14px !important;
    }

    .avd-img-cards-under, .set-account-1 {
        gap: 10px !important;
    }

    .avd-divButtonsNumberPhone {
        flex-direction: column;
        gap: 10px !important;
    }

    .avd-charact-cb-div {
        gap: 5px !important;
    }

    .avd-address-img {
        width: 12px !important;
        height: 12px !important;
    }

    .avd-photo-and-name {
        gap: 10px !important;
    }

    .avd-imageUrl-client {
        max-width: 50px !important;
        max-height: 50px !important;
    }

    .avd-priceList-price {
        text-align: start !important;
    }

    .set-right-container {
        min-width: 0 !important;
        padding: 0 !important;
        border-radius: 0 !important;
    }

    .set-all {
        flex-direction: column-reverse;
    }

    .set-h2-div, .set-sidebar-photo, .blog-div-write-header {
        margin-bottom: 30px !important;
    }

    .set-title-margin-h3 {
        margin-bottom: 20px !important;
        font-size: 20px !important;
    }

    .set-main-text-attention-low {
        margin-bottom: 0 !important;
        font-size: 15px !important;
    }

    .set-chat, .set-bell {
        padding: 10px !important;
        border-radius: 20px !important;
    }

    .set-bell-isRead {
        margin: 6px 10px 0 -17px !important;
    }

    .set-bell-window {
        max-height: none !important;
    }

    .set-bell-time-div {
        max-width: 70px !important;
    }

    .set-messages {
        gap: 8px !important;
    }

    .set-message {
        padding: 8px 14px 8px 14px !important;
        font-size: 14px !important;
        line-height: 20px !important;
    }

    .set-message-tb {
        padding: 8px 8px 8px 10px !important;
        font-size: 14px !important;
    }

    .set-div-makead {
        height: 90px !important;
        bottom: 50px !important;
    }

    .set-chat-imageClient {
        max-width: 40px !important;
        max-height: 40px !important;
    }

    .set-chat-imageClient-dop, .set-chatTop-imageClient-dop {
        top: 5px !important;
        left: 5px !important;
        max-width: 30px !important;
        max-height: 30px !important;
    }

    .set-chatDiv {
        max-height: calc(100dvh - 206px) !important;
    }

    .set-dno {
        margin-bottom: 10px !important;
    }

    .sitemap-divCategories {
        flex-direction: column;
        gap: 50px;
    }

    .blog-modal-content {
        padding: 25px !important;
        min-height: 340px !important;
        border-radius: 0 !important;
    }

    .blog-group {
        display: grid !important;
        gap: 8px !important;
    }

    .blog-description-input {
        height: 200px !important;
    }

    .blog-notes {
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    .post-imageClient {
        width: 30px !important;
        height: 30px !important;
    }

    .makead, .sitemap-category-content {
        padding: 30px !important;
    }

    .makead-label-and-cb {
        gap: 10px !important;
        flex-direction: column;
    }

    .makead-checkboxes {
        flex-direction: column;
        align-items: flex-start !important;
        margin-top: 20px !important;
    }

    .makead-title-h2, .makead-title-h2-spec {
        margin-bottom: 20px !important;
        font-size: 24px !important;
    }

    .makead-title-h2-spec {
        margin: 40px 0 0 0 !important;
    }

    .makead-charact-ad, .makead-cardsCost {
        margin-bottom: 60px !important;
        gap: 20px !important;
    }

    .makead-photo-load-box {
        grid-template-columns: repeat(auto-fill, minmax(53px, 1fr)) !important;
    }

    .makead-photo-description, .makead-number {
        margin-bottom: 60px !important;
        flex-direction: column;
        align-items: start !important;
    }

    .makead-choice-title {
        margin-bottom: 0 !important;
        font-size: 24px !important;
    }

    .user-container-left {
        padding: 20px !important;
        position: inherit !important;
    }
}

@media (min-width: 480px) and (max-width: 767px) {

    .set-back {
        display: flex !important;
    }

    .avd-search, .set-left-container, .set-bell-image, .ast-card-description-column {
        display: none !important;
    }

    .makead-form, .set-chats {
        padding: 0 !important;
    }

    .modal-content {
        padding: 20px !important;
        max-width: 350px !important;
    }

    .modal-contentOnly {
        bottom: 70px !important;
        max-width: calc(100vw - 40px) !important;
        font-size: 16px !important;
    }

    .title-pnlInfo {
        font-size: 22px !important;
        line-height: 30px !important;
    }

    .auth-form, .makead-form, .post-form, .set-form, .sitemap-form {
        padding: 0 !important;
        background-color: #fff !important;
    }

    .set-form {
        padding: 30px !important;
    }

    .user-form {
        flex-direction: column;
        padding: 0 !important;
    }

    .avd-title, .post-title {
        font-size: 26px !important;
    }

    .avd-cost, .search-h1FullAst, .search-countAds {
        font-size: 22px !important;
    }

    .avd-numberPhone, .set-main-text-attention-message, .search-factMain {
        font-size: 20px !important;
    }

    .ast-main-text-attention {
        font-size: 18px !important;
    }

    .post-description, .post-description-dop, .search-factText {
        font-size: 16px !important;
    }

    .ast-card-title, .ast-card-title-column, .post-nameClient, .set-message-tb {
        font-size: 15px !important;
    }

    .avd-btnNo, .avd-btnYes, .avd-description-sendMoneyToAnimal, .avd-address-value, .avd-charact-label, .avd-charact-value, .avd-descriptionText, .avd-infoAd, .avd-priceList, .lbl14px, .desc-pnlInfo {
        font-size: 14px !important;
    }

    .set-bell-time {
        font-size: 13px !important;
    }

    .authOrReg-div {
        box-shadow: none !important;
    }

    .ast-card-grid {
        flex: 0 0 calc((100% - 40px) / 3) !important;
    }

    .ast-card-container-grid, .ast-card-container-column, .set-card-container, .user-card-container {
        gap: 20px !important;
        grid-template-columns: repeat(3, 1fr) !important;
    }

    .ast-card-heart, .ast-card-heart-column {
        width: 16px !important;
        height: 16px !important;
    }

    .ast-imgCardCategory {
        width: 40px !important;
        height: 40px !important;
    }

    .ast-cardsCategory {
        height: 310px !important;
        margin-bottom: 40px !important;
    }

    .ast-cardCategory {
        gap: 10px !important;
        padding: 15px !important;
    }

    .ast-titleFullAst {
        margin-bottom: 20px !important;
        font-size: 22px !important;
    }

    .ast-search {
        margin: 0 !important;
    }

    .search-view-image {
        max-width: 15px !important;
    }

    .search-pagination {
        margin: 40px 0 20px 0 !important;
    }

    .avd-bigPhoto {
        max-width: none !important;
        padding: 30px !important;
    }

    .avd-container-main {
        flex-direction: column;
        gap: 0 !important;
        padding: 0 !important;
    }

    .avd-container-right, .avd-container-left {
        max-width: 700px !important;
        align-self: center;
        padding: 30px !important;
    }

    .avd-btnEditDeleteAndPay, .set-horizontal-phones, .avd-priceList-item {
        flex-direction: column;
    }

    .avd-moder, .avd-lblDelete {
        margin-bottom: 30px !important;
        font-size: 18px !important;
    }

    .avd-divButtonsNumberPhone {
        flex-direction: column;
        gap: 10px !important;
    }

    .avd-charact-cb-div {
        gap: 5px !important;
    }

    .avd-address-img {
        width: 12px !important;
        height: 12px !important;
    }

    .avd-priceList-price {
        text-align: start !important;
    }

    .set-right-container {
        min-width: 0 !important;
        padding: 0 !important;
        border-radius: 0 !important;
    }

    .set-chat {
        padding: 15px !important;
    }

    ._404-div, .post-div, .set-bell, .user-container-right {
        padding: 20px !important;
    }

    .set-bell-window {
        max-height: none !important;
    }

    .set-bell-time-div {
        max-width: 70px !important;
    }

    .set-bell-isRead {
        margin: 6px 10px 0 -17px !important;
    }

    .set-message {
        padding: 10px 16px 10px 16px !important;
        max-width: 70% !important;
        font-size: 14px !important;
    }

    .set-div-makead {
        height: 90px !important;
        bottom: 50px !important;
    }

    .set-account-1 {
        gap: 10px !important;
    }

    .set-chatDiv {
        max-height: calc(100dvh - 230px) !important;
    }

    .set-dno {
        margin-bottom: 10px !important;
    }

    .sitemap-divCategories {
        flex-direction: column;
        gap: 50px;
    }

    .blog-notesAndSearch {
        min-height: calc(100dvh - 206px) !important;
    }

    .blog-modal, .blog-modal-content {
        min-height: 340px !important;
    }

    .blog-group {
        display: grid !important;
        gap: 8px !important;
    }

    .post-image-and-name, .search-fullAst, .search-divFact, .divNewOldIndicator {
        margin-bottom: 20px !important;
    }

    .makead-label-and-cb {
        gap: 10px !important;
        flex-direction: column;
    }

    .makead-checkboxes {
        flex-direction: column;
        margin-top: 20px !important;
        align-items: flex-start !important;
    }

    .makead-title-h2, .makead-title-h2-spec {
        margin-bottom: 20px !important;
        font-size: 24px !important;
    }

    .makead-title-h2-spec {
        margin: 40px 0 0 0 !important;
    }

    .makead-charact-ad, .makead-cardsCost {
        margin-bottom: 60px !important;
        gap: 20px !important;
    }

    .makead-photo-description, .makead-number {
        margin-bottom: 60px !important;
        flex-direction: column;
        align-items: start !important;
    }

    .makead-choice-title {
        margin-bottom: 0 !important;
        font-size: 24px !important;
    }

    .user-container-left {
        max-width: none !important;
        padding: 20px;
        position: inherit !important;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {

    .modal-contentOnly {
        bottom: 70px !important;
        max-width: calc(100vw - 40px) !important;
    }

    .set-back {
        display: flex !important;
    }

    .avd-search, .set-left-container {
        display: none !important;
    }

    .user-form {
        flex-direction: column;
    }

    .ast-main-text-attention, .search-h1FullAst, .search-countAds {
        font-size: 22px !important;
    }

    .search-factText {
        font-size: 16px !important;
    }

    .ast-card-grid {
        flex: 0 0 calc((100% - 40px) / 3) !important;
    }

    .ast-card-container-grid, .ast-card-container-column, .set-card-container, .user-card-container {
        gap: 20px !important;
        grid-template-columns: repeat(3, 1fr) !important;
    }

    .ast-card-heart, .ast-card-heart-column {
        width: 16px !important;
        height: 16px !important;
    }

    .ast-cardsCategory {
        margin-bottom: 40px !important;
    }

    .ast-titleFullAst {
        margin-bottom: 20px !important;
        font-size: 22px !important;
    }

    .ast-search {
        margin: 0 !important;
    }

    .search-factMain {
        font-size: 20px !important;
    }

    .search-view-image {
        max-width: 15px !important;
    }

    .search-pagination {
        margin: 40px 0 20px 0 !important;
    }

    .search-fullAst, .search-divFact {
        margin-bottom: 20px !important;
    }

    .avd-container-main {
        flex-direction: column;
        gap: 40px !important;
        align-items: center;
        padding-top: 50px !important;
    }

    .avd-container-right, .avd-container-left {
        max-width: 700px !important;
    }

    .set-bell-window {
        max-height: none !important;
    }

    .set-div-makead {
        bottom: 50px !important;
    }

    .set-chatDiv {
        max-height: calc(100dvh - 370px) !important;
    }

    .set-dno {
        margin-bottom: 10px !important;
    }

    .sitemap-divCategories {
        flex-direction: column;
        gap: 50px;
    }

    .user-container-left {
        max-width: none !important;
        position: inherit !important;
    }

    .user-container-right {
        max-width: none !important;
        margin-top: 40px !important;
    }
}

@media (min-width: 1024px) and (max-width: 1279px) {

    #avdSeparatorTop, #setMobSidebarItems, .avd-search {
        display: none !important;
    }

    .ast-card-town, .ast-card-town-column {
        font-size: 13px !important;
    }

    .ast-card-time, .ast-card-time-column {
        font-size: 12px !important;
    }

    .user-form {
        flex-direction: column;
    }

    .ast-card-grid {
        flex: 0 0 calc((100% - 40px) / 4) !important;
    }

    .set-card-container {
        grid-template-columns: repeat(3, 1fr) !important;
    }

    .avd-container-main {
        flex-direction: column;
        gap: 40px !important;
        align-items: center;
        padding-top: 50px !important;
    }

    .avd-container-right, .avd-container-left {
        max-width: 700px !important;
    }

    .user-container-left {
        max-width: none !important;
        position: inherit !important;
    }

    .user-container-right {
        max-width: none !important;
        margin-top: 40px !important;
    }
}

@media (min-width: 1280px) and (max-width: 1439px) {

    #avdSeparatorTop, #setMobSidebarItems {
        display: none !important;
    }

    .ast-card-town, .ast-card-town-column {
        font-size: 13px !important;
    }

    .ast-card-time, .ast-card-time-column {
        font-size: 12px !important;
    }

    .ast-btnSearch {
        display: flex !important;
        opacity: 1 !important;
    }

    .set-messages {
        padding-right: 20px;
    }
}

@media (min-width: 1440px) and (max-width: 1919px) {

    #avdSeparatorTop, #setMobSidebarItems {
        display: none !important;
    }

    .ast-card-town, .ast-card-town-column {
        font-size: 14px !important;
    }

    .ast-card-time, .ast-card-time-column {
        font-size: 13px !important;
    }

    .ast-btnSearch {
        display: flex !important;
        opacity: 1 !important;
    }

    .set-messages {
        padding-right: 20px;
    }
}

@media (min-width: 1920px) {

    #avdSeparatorTop, #setMobSidebarItems {
        display: none !important;
    }

    .ast-card-town, .ast-card-town-column {
        font-size: 14px !important;
    }

    .ast-card-time, .ast-card-time-column {
        font-size: 13px !important;
    }

    .ast-btnSearch {
        display: flex !important;
        opacity: 1 !important;
    }

    .set-messages {
        padding-right: 20px;
    }
}




/*                                                                      Общие стили для всех окон                                                                            */




@font-face {
    font-family: 'Onest-Black';
    src: url('../fonts/Onest-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Onest-Bold';
    src: url('../fonts/Onest-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Onest-ExtraBold';
    src: url('../fonts/Onest-ExtraBold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Onest-ExtraLight';
    src: url('../fonts/Onest-ExtraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Onest-Light';
    src: url('../fonts/Onest-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Onest-Medium';
    src: url('../fonts/Onest-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Onest-Regular';
    src: url('../fonts/Onest-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Onest-SemiBold';
    src: url('../fonts/Onest-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Onest-Thin';
    src: url('../fonts/Onest-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Onest-VariableFont_wght';
    src: url('../fonts/Onest-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
}

@font-face {
    font-family: 'PODKOVA';
    src: url('../fonts/PODKOVA.TTF') format('truetype');
    font-weight: 100 900;
    font-style: normal;
}

@keyframes pulse {
    0%, 50% {
        transform: scale(1);
        opacity: 1;
    }

    25% {
        transform: scale(1.7);
        opacity: 1;
    }
}

html {
    font-size: 16px;
    min-height: 100%;
    scroll-behavior: smooth;
}

body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 50px;
    font-family: Onest-Regular, 'Inter', sans-serif;
    color: #343434;
}

    body.no-scroll {
        overflow: hidden;
    }

    body.scroll {
        overflow: auto;
    }

.headerMain, .headerDop {
    display: none;
}

.headerLabels {
    display: flex;
    gap: 30px;
    align-items: center;
}

.headerLabel {
    align-content: center;
    font-size: 14px;
    white-space: nowrap;
    text-decoration: none;
    transition: 0.2s;
    color: #fff;
}

    .headerLabel:hover {
        color: #fff;
    }

.headerImageLink {
    display: flex;
    width: 100%;
    height: 100%;
    max-width: 40px;
    max-height: 40px;
    border-radius: 30px;
    object-fit: cover;
}

.headerImg {
    width: 20px;
    height: 20px;
}

.headerLabelAction {
    font-family: Onest-Bold;
    letter-spacing: 0.5px;
}

.headerLogoComp, .headerLogoMob {
    display: flex;
    height: 56px;
    align-items: center;
    justify-content: center;
    background-color: #343434;
}

.logo {
    display: flex;
    justify-content: center;
    text-decoration: none;
}

.footerComp, .footerMob {
    display: flex;
    background-color: #343434;
}

.footerComp {
    display: none;
}

.footer-div {
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: center;
    padding: 8px 0;
    font-size: 10px;
    font-family: Onest-Medium;
    text-decoration: none;
    color: #bbb;
}

    .footer-div:hover {
        filter: brightness(0) invert(1);
    }

.footer-a {
    color: wheat;
}

    .footer-a:hover {
        color: #2ec2c8;
    }

.footer-a-reverb {
    color: #2ec2c8;
}

    .footer-a-reverb:hover {
        color: wheat;
    }

.footer-messageCount, .label-bellCount, .label-messageCount {
    position: absolute;
    align-content: center;
    width: 15px;
    height: 15px;
    right: -5px;
    top: -2px;
    background-color: red;
    border-radius: 50%;
    text-align: center;
    color: #fff;
    font-size: 10px;
    font-family: Onest-Black;
    cursor: pointer;
}

.footer-messageCount {
    top: 4px;
    right: auto;
    margin-left: 15px;
}

.totalHorBlockGap20, .totalVertBlockGap50, .totalVertBlockGap20, .totalVertBlockGap10, .totalVertBlockGap5 {
    display: flex;
    gap: 50px;
}

.totalVertBlockGap50, .totalVertBlockGap20, .totalVertBlockGap10, .totalVertBlockGap5 {
    flex-direction: column;
}

.totalHorBlockGap20, .totalVertBlockGap20 {
    gap: 20px;
}

.totalVertBlockGap10 {
    gap: 10px;
}

.totalVertBlockGap5 {
    gap: 5px;
}

.total-text {
    font-family: Onest-SemiBold;
    font-size: 18px;
}

.total-link {
    width: fit-content;
    font-family: Onest-Regular;
    font-size: 14px;
    color: #198de4;
    text-decoration: none;
}

    .total-link:hover {
        color: #c45200;
    }

.total-info {
    display: flex;
    width: 100%;
    padding: 10px;
    align-items: center;
    border-radius: 10px;
    color: #864129;
    background-color: #fff0bb;
}

.total-h3Title {
    background-color: #dbfdff;
    padding: 10px;
    border-radius: 10px;
    justify-content: center !important;
}

.total-lblInfo {
    font-size: 18px;
}

.total-lblInfoValue {
    font-family: Onest-Bold;
    font-size: 24px;
}

.total-lblMiniInfo {
    font-size: 14px;
    color: #757575;
}

.anim {
    display: flex;
    width: 100%;
    max-width: 100px;
}

.anim-button {
    display: flex;
    width: 100%;
    height: 100%;
    max-width: 88px;
    align-self: center;
}

.buttonAnim {
    display: flex;
    justify-content: center;
    height: 100%;
    flex-grow: 1;
}

.call-animation {
    display: none;
    margin-top: 20px;
    justify-content: center;
    align-items: center;
}

.circle {
    animation: pulse 0.6s infinite ease-in-out;
}

    .circle:nth-child(1) {
        animation-delay: 0s;
    }

    .circle:nth-child(2) {
        animation-delay: 0.1s;
    }

    .circle:nth-child(3) {
        animation-delay: 0.2s;
    }

.main-container-message-attention {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    background-color: #fff;
}

.main-text-attention-hight {
    font-family: Onest-Bold;
    font-size: 24px;
    margin-bottom: 10px;
    text-align: center;
}

.main-text-attention-low {
    font-family: Onest-Medium;
    font-size: 18px;
    margin-bottom: 20px;
    text-align: center;
}

.placeholder-red::placeholder {
    color: #ff7070;
    font-family: Onest-Regular;
}

.my-dropdown {
    overflow-y: auto !important;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.15) !important;
    transition: background-color 0.2s ease !important;
    border: none !important;
    border-radius: 10px !important;
    z-index: 1070;
}

.select2-search--dropdown {
    padding: 15px 10px;
}

.select2-container--default .select2-selection--single {
    background-color: #eee !important;
    border: none !important;
    height: 44px !important;
    align-content: center !important;
    padding: 5px;
    border-radius: 10px !important;
    font-family: Onest-Medium;
}

.my-dropdown .select2-results__option {
    padding: 15px !important;
    transition: background-color 0.2s ease !important;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: #fff !important;
    color: #000 !important;
}

.my-dropdown .select2-results__option--selected {
    background-color: #fff !important;
    font-family: Onest-SemiBold;
}

.my-dropdown .select2-results__option:hover {
    background-color: #e8e8e8 !important;
}

.select2.select2-container.select2-container--default {
    height: 44px;
    width: 100% !important;
}

.my-dropdown .select2-search__field {
    border: 2px solid #35d9ba !important;
    border-radius: 10px;
    outline: none;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    display: flex !important;
    align-self: center !important;
    height: 100% !important;
    margin-right: 5px;
}

.select2-container--default .select2-results > .select2-results__options {
    max-height: 300px !important;
    font-family: Onest-Light;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #343434;
}

.select2-search--dropdown .select2-search__field {
    height: 44px !important;
    padding: 10px !important;
}

.hidden-m {
    display: none !important;
}

.tab {
    color: #808080;
    font-size: 18px;
    font-family: Onest-Bold;
    user-select: none;
}

.active {
    color: #000;
    pointer-events: none;
}

    .active:hover {
        color: #000;
    }

.passive {
    cursor: pointer;
}

    .passive:hover {
        color: #ff6163;
    }

.block-relative {
    position: relative;
    width: 100%;
}

.lblTabLink {
    display: flex;
    margin-bottom: 10px;
    gap: 50px;
    width: 100%;
}

.divNewOldIndicator {
    max-width: fit-content;
    white-space: nowrap;
    margin-bottom: 40px;
    overflow-x: scroll;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

    .divNewOldIndicator::-webkit-scrollbar {
        display: none;
    }

.separator-container {
    height: 9px;
    position: relative;
}

.separator {
    height: 2px;
    position: absolute;
    top: 7px;
    left: 0;
    right: 0;
    background-color: #e3e2e1;
}

.separator-1 {
    height: 10px;
    position: absolute;
    top: 9px;
    left: 0;
    right: 0;
    z-index: 1;
    background-color: #fff;
}

.indicator {
    position: absolute;
    height: 16px;
    border-radius: 30px;
    background-color: #555;
    transition: width 0.2s ease, transform 0.2s ease;
    z-index: 1;
}

.makead-title-input-form-control,
.set-form-control,
.tb-all {
    width: 100%;
    padding: 10px;
    border: 2px solid #343434;
    border-radius: 10px;
    outline: none;
    height: 44px;
    font-family: Onest-Light;
}

    .tb-all:focus, .set-form-control:focus {
        border: 2px solid #35d9ba;
    }

.horizontal-label {
    display: flex;
    justify-content: space-between;
    margin-bottom: 5px;
}

.max-width {
    width: 100%;
}

.max-width-300 {
    max-width: 300px !important;
}

.text-dec {
    display: flex;
    color: inherit;
    text-decoration: none;
    transition: 0.2s;
}

a.text-dec {
    color: inherit;
}

.flex-and-center-hor {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
    max-width: 250px;
    width: 100%;
    align-self: center;
}

.display-flex, .display-vertical {
    display: flex;
}

.display-vertical {
    flex-direction: column;
}

.message-container-center {
    opacity: 0;
    transition: opacity 1s ease-in-out;
    display: none;
    align-self: center;
    text-align: center;
}

    .message-container-center.show {
        opacity: 1;
        display: block;
    }

.adinlike-deleted-opacity {
    opacity: 0.6;
}

.disabled-textbox {
    color: #666;
    background-color: #eee;
    pointer-events: none;
}

.disabled-button {
    color: #666 !important;
    background-color: #eee !important;
    pointer-events: none !important;
}

.red-title {
    color: #864129;
    background-color: #fff0bb;
    font-family: Onest-Medium;
}

.attention-green {
    display: flex;
    width: 100%;
    margin-bottom: 20px;
    color: #228b22;
}

.main-chb {
    display: flex;
    align-items: center;
    height: 30px;
    user-select: none;
}

    .main-chb input[type="checkbox"] {
        width: 18px;
        height: 18px;
        margin-right: 10px;
        cursor: pointer;
        appearance: none;
        background-color: #eee;
        border: 1px solid #ccc;
        border-radius: 3px;
        transition: background-color 0.25s ease;
    }

        .main-chb input[type="checkbox"]:checked {
            background-color: #2196F3;
            border: none !important;
        }

            .main-chb input[type="checkbox"]:checked::before {
                content: '✔';
                display: block;
                text-align: center;
                color: #fff;
                font-size: 13px;
            }

.divPartBlurLeft, .divPartBlurRight {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 10px;
    background: linear-gradient(90deg,#fff 0,rgba(255,255,255,0) 100%);
}

.divPartBlurRight {
    right: 0;
    left: auto;
    background: linear-gradient(270deg,#fff 0,rgba(255,255,255,0) 100%);
}

.title-pnlInfo {
    font-size: 26px;
    font-family: Onest-Bold;
    max-width: 500px;
    line-height: 34px;
    margin-bottom: 20px;
    margin-right: 30px;
}

.desc-pnlInfo {
    max-width: 500px;
    margin-bottom: 30px;
}

.file-upload-wrapper,
.file-upload-wrapper-file,
.file-upload-wrapper-div {
    display: contents;
    width: 150px;
    height: 150px;
    border-radius: 10px;
}

    .file-upload-wrapper img,
    .file-upload-wrapper-img {
        width: 150px;
        height: 150px;
        border: 1px solid #343434;
        cursor: pointer;
        object-fit: cover;
        display: grid;
        align-items: center;
        text-align: center;
    }

.file-upload-wrapper-img {
    width: 100%;
    height: 100%;
    border-radius: 10px;
    user-select: none;
}

    .file-upload-wrapper-img:hover,
    .file-upload-wrapper:hover img {
        filter: brightness(75%);
    }

.file-upload-wrapper input[type="file"],
.file-upload-wrapper-file input[type="file"] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.radio-group-ver {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.radio-group-hor {
    display: flex;
    gap: 10px;
}

.radio-option {
    display: flex;
    width: fit-content;
    align-items: center;
    padding: 5px 10px;
    font-family: Onest-Light;
    cursor: pointer;
    user-select: none;
}

    .radio-option::before {
        content: "";
        width: 16px;
        height: 16px;
        border: 2px #808080 solid;
        border-radius: 50%;
        margin-right: 15px;
        transition: 0.2s ease;
    }

    .radio-option input[type="radio"] {
        display: none;
    }

    .radio-option.selected {
        font-family: Onest-SemiBold;
    }

        .radio-option.selected::before {
            background-color: #343434;
        }

.noneActiveButton {
    pointer-events: none !important;
    color: #808080 !important;
    background-color: #ddd !important;
}

.ulSuggestions {
    display: none;
    padding: 10px;
    top: 150px;
    position: absolute;
    border-radius: 10px;
    border: 1px solid #e5e5e5;
    background-color: #fff;
    z-index: 1000;
    list-style: none;
    box-shadow: 0 10px 20px -5px rgba(0,0,0,.2) !important;
}

.liSuggestion {
    padding: 10px;
    border-radius: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    transition: background 0.05s;
}

    .liSuggestion:hover,
    .liSuggestion.hovered {
        background-color: #ffeeb0;
    }

.liSuggestion-found {
    font-family: Onest-Bold;
}

.ymaps-2-1-79-inner-panes, .ymaps-2-1-79-map, .ymaps-2-1-79-search__suggest-item {
    border-radius: 10px;
}

.ymaps-2-1-79-map-copyrights-promo {
    display: none !important;
}

#modalContentCall {
    max-width: 700px;
    max-height: 600px;
    height: 100%;
    background-color: #fdecd6;
}

.modal {
    display: none;
    z-index: 1060;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    opacity: 0;
    transition: opacity 0.25s ease;
    padding: 20px;
    justify-content: center;
}

    .modal.show, .modal-contentOnly.show {
        opacity: 1;
    }

.modal-content {
    display: flex;
    flex-direction: column;
    height: max-content;
    max-width: fit-content;
    align-self: center;
    padding: 30px;
    border-radius: 15px;
    transform: translateY(-50px);
    transition: transform 0.25s ease;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
}

.modal.show .modal-content {
    transform: translateY(0);
}

.modal-contentOnly {
    display: none;
    position: fixed;
    bottom: 20px;
    align-self: center;
    padding: 20px;
    font-size: 18px;
    border-radius: 15px;
    z-index: 1060;
    color: #fff;
    background-color: #343434;
    opacity: 0;
    transition: opacity 0.25s ease;
    box-shadow: rgba(0, 0, 0, 0.5) 0 0 5px;
}

.close {
    display: flex;
    width: 50px;
    height: 50px;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    right: 0;
    font-size: 30px;
    font-weight: bold;
    color: #aaa;
    cursor: pointer;
}




/*                                                                     Стили окна авторизации                                                                              */




.auth-form {
    display: flex;
    width: 100%;
    min-height: calc(100dvh - 106px);
    align-items: center;
    justify-content: center;
    padding: 50px;
    background-color: #eeaeae;
}

.auth-div {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 15px;
}

.authOrReg-div {
    display: flex;
    flex-direction: column;
    gap: 30px;
    width: 100%;
    max-width: 420px;
    padding: 30px;
    border-radius: 20px;
    background-color: #fff;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.1);
}

.auth-header {
    margin: 0;
    text-align: center;
    font-size: 26px;
}

.auth-attention-red {
    color: #f66;
    text-align: right;
}

.auth-divLink {
    display: flex;
    gap: 20px;
    justify-content: center;
    margin-top: 10px;
}

.auth-icon {
    display: flex;
    width: 40px;
    height: 40px;
}




/*                                                                           Стили окна настроек                                                                             */




.set-form {
    display: flex;
    width: 100%;
    min-height: calc(100dvh - 106px);
    padding: 50px;
    background-color: #eeaeae;
}

.set {
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 50px;
}

.set-left-container, .set-right-container {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 400px;
    align-items: center;
    padding: 30px;
    border-radius: 20px;
    background-color: #fff;
}

.set-right-container {
    min-width: 500px;
    max-width: 1000px;
    padding: 40px;
}

.set-account {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 50px;
    font-family: Onest-Light;
}

.set-sidebar-menu {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.set-sidebar-item {
    width: max-content;
    cursor: pointer;
    font-size: 18px;
    font-family: Onest-Light;
    user-select: none;
}

    .set-sidebar-item:hover {
        color: #626262;
    }

.set-active {
    font-family: Onest-Bold;
    color: #343434;
    pointer-events: none;
}

    .set-active:hover {
        color: #343434;
    }

.set-sidebar {
    display: none;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

.set-sidebar-photo {
    display: flex;
    flex-direction: column;
    width: 150px;
}

#imgClientChange, #fileUploadImp {
    border-radius: 50%;
}

.set-all {
    display: flex;
    margin-bottom: 40px;
}

.set-account-set {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.set-account-1 {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    margin-right: 40px;
    font-family: Onest-Light;
}

.set-password-box {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 50px;
}

.set-horizontal-label {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.set-horizontal-label-block, .set-horizontal-label-column {
    display: flex;
    gap: 10px;
    align-items: center;
}

.set-horizontal-label-column {
    flex-direction: column;
    align-items: start;
}

.set-div-params {
    display: flex;
    flex-direction: column;
    gap: 30px;
    user-select: none;
}

.set-horizontal-namemail {
    display: -webkit-box;
    width: fit-content;
    max-width: 250px;
    position: relative;
    -webkit-box-orient: vertical;
    overflow-wrap: break-word;
}

.set-horizontal-phones {
    display: flex;
    position: relative;
    gap: 5px;
    width: fit-content;
}

.set-label-gray, .set-label-blue {
    font-family: Onest-Regular;
    font-size: 14px;
    color: #808080;
    align-content: center;
    min-width: 180px;
}

.set-label-blue {
    color: #198de4;
    cursor: pointer;
    min-width: fit-content;
}

.set-h2-div {
    display: flex;
    gap: 30px;
    justify-content: space-between;
    margin-bottom: 50px;
}

.set-back {
    display: none;
    width: 100%;
    max-width: 20px;
    user-select: none;
    cursor: pointer;
}

.set-title-margin-h2, .set-title-margin-h3 {
    display: flex;
    text-align: center;
    justify-content: center;
    width: 100%;
    margin: 0;
    font-family: Onest-Medium;
    font-size: 26px;
    user-select: none;
    -webkit-user-select: none; /* Chrome, Safari, Opera */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
}

.set-title-margin-h3 {
    justify-content: start;
    margin-bottom: 20px;
    font-size: 20px;
}

.set-save-center {
    display: flex;
    flex-direction: column;
    max-width: 300px;
}

.set-save-data {
    width: 20px;
    height: 20px;
    position: absolute;
    top: -5px;
    right: -25px;
    user-select: none;
}

.set-bell-window {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.set-bells {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

.set-bell {
    height: fit-content;
    display: flex;
    width: 100%;
    padding: 25px;
    border-radius: 30px;
    justify-content: space-between;
    transition: background-color 0.1s;
    cursor: pointer;
}

.set-bell-info-all {
    display: flex;
    gap: 30px;
    overflow: hidden;
    align-items: center;
    width: 100%;
}

.set-bell-info {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-width: 120px;
}

.set-bell-title {
    width: 100%;
    font-family: Onest-Bold;
    letter-spacing: 0.03em;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 3px;
    cursor: pointer;
}

.set-bell-description {
    font-size: 14px;
    font-family: Onest-Regular;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #666;
    cursor: pointer;
}

.set-bell-image {
    width: 35px;
    height: 35px;
    object-fit: cover;
    align-self: center;
}

.set-bell-time-div {
    max-width: 120px;
    display: flex;
    width: 100%;
}

.set-bell-time {
    color: #999;
    font-family: Onest-Regular;
    font-size: 14px;
    width: 100%;
    text-align: right;
    cursor: pointer;
}

.set-bell-link {
    text-decoration: none;
    color: inherit;
    display: flex;
}

    .set-bell-link:hover {
        color: #9b4f00;
    }

.set-bell-isRead {
    max-width: 7px;
    max-height: 7px;
    background-color: #0058ff;
    border-radius: 10px;
    width: 100%;
    margin: 6px 10px 0 0;
}

.set-image {
    width: 150px;
    height: 150px;
    object-fit: cover;
    border-radius: 50%;
    margin-bottom: 20px;
}

.set-imgChangePhoto {
    max-width: 30px;
    max-height: 30px;
    padding: 2px;
    position: absolute;
    bottom: 8px;
    left: 8px;
    border-radius: 50%;
    border: none !important;
    background-color: #fff;
}

.set-separator {
    width: 50%;
    height: 1px;
    background-color: #ccc;
    margin: 20px 0 20px 0;
}

.set-separator-center {
    width: 100%;
    height: 1px;
    background-color: #ccc;
    margin: 30px 0 30px 0;
}

.set-labelSeparator {
    font-family: Onest-Regular;
    font-size: 12px;
    color: #808080;
    align-self: center;
    margin: 10px 0 10px 0;
}

.set-exitAccount {
    border: none;
    background: none;
    font-size: 14px;
    width: fit-content;
    height: fit-content;
    align-self: center;
    color: #000;
}

.set-deleteAccount {
    border: none;
    background: none;
    color: #b70000;
    font-size: 14px;
    width: fit-content;
    height: fit-content;
    align-self: center;
    align-content: center;
}

.set-attention-red {
    color: #f66;
    max-width: 300px;
    align-content: center;
    margin-bottom: 6px;
}

.set-dno {
    display: flex;
    flex-direction: column;
    height: fit-content;
}

.set-help {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    gap: 50px;
}

.set-description-input {
    width: 100%;
    min-height: 100px;
    border: 1px solid #646464;
    padding: 10px;
    border-radius: 10px;
    outline: none;
}

.set-divElementsHelp {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 500px;
    width: 100%;
    opacity: 1;
    transition: opacity 0.5s ease-in-out;
    user-select: none;
}

    .set-divElementsHelp.show {
        opacity: 0;
    }

.set-main-text-attention-low {
    max-width: 600px;
    text-align: center;
    font-size: 18px;
    margin-bottom: 40px;
}

.set-main-text-attention-hight {
    font-family: Onest-Bold;
    font-size: 24px;
    margin-bottom: 20px;
    text-align: center;
}

.set-main-text-attention-message {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    color: #808080;
    font-size: 24px;
    font-family: Onest-Bold;
}

.set-labels-main {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.set-help-email {
    width: 100%;
    height: 44px;
    padding: 10px;
    font-size: 16px;
    border: 1px solid #5a5a5a;
    border-radius: 10px;
    outline: none;
}

.set-messages {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    min-height: 100px;
    gap: 10px;
    padding-bottom: 5px;
    overflow: auto;
    border-radius: 20px;
}

.set-message {
    width: fit-content;
    max-width: 80%;
    padding: 8px 14px 8px 14px;
    position: relative;
    border-radius: 20px;
    font-size: 15px;
    word-break: break-word;
    background-color: #e0f0ff;
}

.set-messageTime {
    min-width: fit-content;
    align-content: end;
    font-size: 13px;
    color: #999;
    margin: 6px 0 0 10px;
}

.set-message-text {
    align-content: center;
    cursor: text;
}

.set-message-container-center {
    display: none;
    align-self: center;
    text-align: center;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
}

    .set-message-container-center.show {
        opacity: 1;
    }

.set-message-window {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.set-chatDiv {
    display: flex;
    flex-direction: column;
    height: 100%;
    gap: 20px;
    position: relative;
    max-height: calc(100dvh - 238px);
}

.set-message-btnSend {
    width: 100%;
    max-width: 30px;
}

.set-message-tb {
    width: 100%;
    padding: 8px 8px 8px 12px;
    font-size: 16px;
    border: 2px solid #343434;
    border-radius: 10px;
    outline: none;
}

    .set-message-tb:focus {
        border: 2px solid #35d9ba;
    }

.set-message-isRead {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background-color: #1e90ff;
    position: absolute;
    left: -20px;
    bottom: 15px;
}

.set-chats {
    display: flex;
    width: 100%;
    flex-direction: column;
    overflow: auto;
    padding: 0 30px 0 0;
}

/* Шапка чата */

.set-chatTop {
    display: flex;
    width: 100%;
    gap: 10px;
    padding: 10px;
    align-items: center;
    position: relative;
    border-radius: 10px;
    text-decoration: none;
    box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.1);
}

.set-chatTop-images {
    max-width: 50px;
    max-height: 50px;
}

.set-chatTop-imageAst {
    width: 100%;
    object-fit: cover;
    border-radius: 10px;
    aspect-ratio: 1;
}

.set-chatTop-imageClient-dop {
    max-width: 30px !important;
    max-height: 30px !important;
    position: absolute;
    top: 5px;
    left: 5px;
    z-index: 1;
    border: 2px solid #fff;
}

/* ---------- */

/* Чат */

.set-chat {
    display: flex;
    width: 100%;
    height: fit-content;
    padding: 20px;
    justify-content: space-between;
    position: relative;
    border-radius: 30px;
    cursor: pointer;
    transition: background-color 0.1s;
}

.set-chat-info-all {
    display: flex;
    gap: 20px;
    overflow: hidden;
    align-items: center;
    width: 100%;
}

.set-chat-info {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-width: 120px;
    width: 100%;
}

.set-chat-titleAd, .set-chat-message {
    font-size: 15px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #343434;
    cursor: pointer;
}

.set-chat-imageClient {
    width: 100%;
    height: 100%;
    max-width: 40px;
    max-height: 40px;
    align-self: center;
    object-fit: cover;
    aspect-ratio: 1;
    border-radius: 50%;
}

.set-chat-imageClient-dop {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 1;
    border: 2px solid #fff;
}

.set-chat-imageClient-online {
    min-width: 8px;
    min-height: 8px;
    align-self: center;
    align-content: center;
    margin-left: 10px;
    border: 2px solid #02d15c;
    border-radius: 50%;
    background-color: #02d15c;
}

.set-chat-imageAst {
    display: flex;
    width: 100%;
    max-width: 70px;
    object-fit: cover;
    aspect-ratio: 1;
    border-radius: 10px;
}

.set-chat-nameClient {
    font-family: Onest-Bold;
    letter-spacing: 0.03em;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    color: #343434;
    cursor: pointer;
}

.set-chat-messageCheckAndTime {
    display: flex;
    width: 100%;
    gap: 8px;
}

.set-chat-check {
    max-width: 15px;
    max-height: 15px;
    align-self: end;
    margin: 0 0 2px 0;
    user-select: none;
}

.set-chat-message, .set-chat-time {
    font-size: 14px;
    color: #999;
}

.set-chat-time {
    min-width: fit-content;
    margin-left: auto;
    cursor: pointer;
}

.set-chat-countMessages {
    width: 20px;
    height: 20px;
    text-align: center;
    align-content: center;
    border-radius: 50%;
    margin-left: auto;
    cursor: pointer;
    font-size: 11px;
    font-family: Onest-Bold;
    color: #fff;
    background-color: #cc661c;
}

.set-chats-typingIndicator {
    display: flex;
    font-size: 14px;
    color: #999;
}

/* --- */

.set-btn-make-ad-cont {
    width: 100%;
    max-width: 250px;
}

.set-btn-make-ad-sticky {
    height: 48px;
}

.set-div-makead {
    display: flex;
    height: 110px;
    align-items: center;
    justify-content: center;
    margin: 20px 0 -30px 0;
    position: sticky;
    background-color: #fff;
}

.set-form-control {
    max-width: 300px;
}

.set-save-photo {
    display: none;
    width: 100px;
    height: 30px;
    font-size: 12px;
    padding: 0;
    align-self: center;
    margin-top: 20px;
    border: none;
    background-color: #24b7ff;
    color: #fff;
    border-radius: 10px;
    transition: background-color 0.2s;
}

.set-card-container, .set-post-container {
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    display: grid;
    width: 100%;
}

.set-post-container {
    grid-template-columns: repeat(1, 1fr);
    margin-bottom: 20px;
}

.set-divGridCont {
    display: grid;
    height: 100%;
    grid-template-rows: auto 1fr auto;
}

.set-div-ast {
    display: flex;
    flex-direction: column;
    gap: 20px;
    flex-grow: 1;
}

.set-container-wait-ast-attention {
    display: none;
    width: 100%;
}

.set-text-wait-ast-low {
    font-family: Onest-SemiBold;
    font-size: 18px;
    text-align: center;
    color: #666;
}

.set-switch {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 25px;
}

    .set-switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

.set-slider {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 34px;
    cursor: pointer;
    transition: 0.2s;
    background-color: #ccc;
}

    .set-slider:before {
        position: absolute;
        content: "";
        height: 15px;
        width: 15px;
        left: 6px;
        bottom: 5px;
        background-color: #fff;
        transition: .2s;
        border-radius: 50%;
    }

input:checked + .set-slider {
    background-color: #35d9ba;
}

    input:checked + .set-slider:before {
        transform: translateX(23px);
    }

.set-state-info {
    display: flex;
    flex-direction: column;
    gap: 20px;
    height: 100%;
}

.set-title-name {
    margin-bottom: 10px !important;
}

.set-wallet-container {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.set-wallet {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 500px;
}

.set-walletTbAndButtons, .set-walletBtnCount {
    display: flex;
    gap: 10px;
}

.set-walletCount {
    width: 100%;
    padding: 10px 15px;
    border-radius: 10px;
    font-family: Onest-Medium;
    cursor: pointer;
    user-select: none;
    background-color: #fff3de;
}




/*                                                                          Стили окна главной                                                                            */




.ast-form {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: calc(100dvh - 106px);
    align-items: center;
}

.ast-search {
    display: flex;
    width: 100%;
    height: 88px;
    padding: 0 20px 20px 20px;
    align-items: end;
    justify-content: center;
    margin: 10px 0;
    position: sticky;
    z-index: 1050;
    background-color: #fff;
    transition: background-color 0.25s ease, box-shadow 0.25s ease;
}

.ast-search-div {
    display: flex;
    width: 100%;
    align-items: center;
    opacity: 0;
    transition: 0.1s;
}

.ast-search-and-attention {
    display: flex;
    flex-direction: column;
    width: 100%;
    overflow: hidden;
}

.ast-img-filters {
    display: flex;
    height: 48px;
    min-width: 48px;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    opacity: 1;
    transition: 0.1s;
    cursor: pointer;
    background-color: #fde76e;
}

.ast-img-filter {
    height: 20px;
    width: 20px;
    user-select: none;
}

.ast-filters {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    position: sticky;
    z-index: 1;
    overflow: auto;
    opacity: 0;
}

.ast-filters-dop {
    height: 100%;
    max-width: none !important;
    padding: 30px 30px 0 !important;
}

.ast-filters-and-cards, .search-filters-and-cards {
    display: flex;
    width: 100%;
    padding: 0 20px 20px 20px;
    flex-grow: 1;
}

.ast-img-category {
    display: flex;
    width: 25px;
    height: 25px;
    align-self: center;
    margin-right: 8px;
    border-radius: 5px;
    cursor: pointer;
    background-color: #fde76e;
}

.ast-urlCategoryFilters {
    font-family: Onest-Medium;
    font-size: 14px;
    cursor: pointer;
    color: #777;
    white-space: nowrap;
}

.ast-img-caretRight {
    height: 12px;
    width: 12px;
    align-self: center;
    user-select: none;
}

.ast-cardsCategory {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 390px;
    gap: 10px;
    margin-bottom: 50px;
    opacity: 0;
    transition: 0.1s;
}

    .ast-cardsCategory::-webkit-scrollbar {
        display: none;
    }

.ast-cardsCategoryRow {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    -webkit-user-drag: none;
    user-select: none;
}

.ast-cardCategory {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    width: 100%;
    padding: 20px;
    border-radius: 15px;
    text-decoration: none;
    transition: 0.1s;
    background-color: #f2eeeb;
    cursor: pointer;
}

.ast-cardCategoryClick {
    background-color: #343434;
    color: #fff;
    pointer-events: none;
}

.ast-imgCardCategory {
    width: 50px;
    height: 50px;
    cursor: pointer;
}

.ast-lblCardCategory {
    font-family: Onest-Medium;
    width: max-content;
    cursor: pointer;
}

.ast-search-el {
    display: flex;
    gap: 10px;
    width: 100%;
}

.ast-checkbox {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 10px;
}

.ast-card-container-grid {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(4, 1fr);
    width: 100%;
}

.ast-card-container-column {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 100%;
}

.ast-carousel-container {
    display: flex;
    width: 100%;
    position: relative;
    align-items: center;
    overflow: hidden;
}

.ast-carousel {
    display: flex;
    gap: 20px;
    flex-grow: 1;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    scroll-behavior: smooth;
    will-change: transform;
    transition: transform 0.3s ease;
}

    .ast-carousel::-webkit-scrollbar {
        display: none;
    }

.ast-carousel-btnLeft, .ast-carousel-btnRight {
    position: absolute;
    left: 10px;
    width: 40px;
    height: 40px;
    padding: 9px;
    border-radius: 50%;
    border: 2px solid #fff;
    background-color: #343434;
    z-index: 1;
    cursor: pointer;
    box-shadow: 0 0 10px rgba(255, 255, 255);
}

.ast-carousel-btnRight {
    left: auto;
    right: 10px;
    transform: scaleX(-1);
}

.ast-div-fixed-buttons {
    display: flex;
    flex-direction: column;
    gap: 10px;
    position: sticky;
    padding: 0 0 20px 0;
    background: linear-gradient(180deg,rgba(255,255,255,0) -50%,#ffffff8a 100%);
}

.ast-main-container {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 30px;
}

.ast-noAst-div {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 20px;
}

.ast-text-attention-main {
    font-family: Onest-Bold;
    font-size: 20px;
    line-height: 1.2;
}

.ast-text-attention {
    font-family: Onest-Medium;
    font-size: 18px;
}

.ast-text-container-category {
    font-family: Onest-Bold;
    font-size: 20px;
    margin-bottom: 30px;
}

.ast-label-category {
    align-self: center;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    overflow-wrap: break-word;
    cursor: pointer;
}

/* Табличная карточка объявления */

.ast-card-grid {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-width: 130px;
    min-height: 228px;
    flex: 0 0 calc((100% - 60px) / 4);
}

.ast-card-imgFull {
    position: relative;
    padding-top: 100%;
    aspect-ratio: 1/1;
}

.ast-card-img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    border-radius: 20px;
    object-fit: cover;
    transition: 0.1s;
    opacity: 0;
    user-select: none;
}

.ast-card-charact, .ast-card-charact-column {
    display: flex;
    flex-direction: column;
    width: 100%;
    flex-grow: 1;
}

a.ast-card-charact, a.ast-card-charact-column {
    text-decoration: none;
    color: inherit;
}

.ast-card-titleHeart, .ast-card-titleHeart-column {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.ast-card-title, .ast-card-title-column, .promo-cardTitle {
    display: -webkit-box;
    font-size: 16px;
    font-family: Onest-SemiBold;
    word-wrap: break-word;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    margin: 10px 0 3px 0;
    color: #0076df;
    transition: 0.2s;
}

.ast-card-heartBox, .ast-card-heartBox-column {
    display: flex;
    width: 100%;
    height: 40px;
    max-width: 40px;
    justify-content: center;
}

    .ast-card-heartBox:hover, .ast-card-heartBox-column:hover {
        filter: invert(40%) sepia(100%) saturate(5792%) hue-rotate(350deg) brightness(100%) contrast(100%);
    }

.ast-card-heart, .ast-card-heart-column {
    width: 18px;
    height: 18px;
    align-self: center;
    user-select: none;
}

.ast-card-price, .ast-card-price-column {
    width: 100%;
    font-size: 15px;
    font-family: Onest-SemiBold;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
}

.ast-card-town, .ast-card-town-column, .ast-card-description-column {
    display: -webkit-box;
    width: 100%;
    margin-top: 3px;
    font-size: 12px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    word-break: break-all;
    cursor: pointer;
}

.ast-card-time, .ast-card-time-column {
    width: 100%;
    margin: 5px 0;
    font-size: 11px;
    cursor: pointer;
}

/* ----------------------------- */

/* Строчная карточка объявления */

.ast-card-column {
    display: flex;
    width: 100%;
    gap: 10px;
}

.ast-card-imgFull-column {
    flex: 0 0 auto;
    min-width: 100px;
    min-height: 100px;
    width: 25%;
    height: 100%;
    align-self: center;
    aspect-ratio: 1/1;
}

.ast-card-img-column {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    border-radius: 20px;
    transition: 0.1s;
}

.ast-card-title-column {
    font-size: 18px;
    margin: 0 0 3px 0;
}

.ast-card-heartBox-column {
    height: 30px;
}

.ast-card-heart-column {
    align-self: inherit;
}

.ast-card-description-column {
    font-size: 14px;
    word-break: break-word;
    -webkit-line-clamp: 4;
    color: #757575;
}

.ast-card-time-column {
    margin: 5px 0 0 0;
}

/* ----------------------------- */

.ast-modal {
    display: none;
    z-index: 1060;
    top: 0;
    left: 0;
    width: 100vw;
    min-height: 100dvh;
    background-color: rgba(0, 0, 0, 0.6);
    opacity: 0;
    transition: opacity 0.25s ease;
    position: fixed;
}

    .ast-modal.show {
        opacity: 1;
    }

.ast-modal-content {
    background-color: #fff;
    transition: transform 0.25s ease;
    transform: translateY(-50px);
    height: 100dvh;
    display: flex;
    flex-direction: column;
    width: 100%;
}

.ast-modal.show .ast-modal-content {
    transform: translateY(0);
}

.ast-filters-top {
    display: flex;
    justify-content: center;
    min-height: 60px;
    align-items: center;
    position: sticky;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

.ast-close {
    display: flex;
    position: absolute;
    width: 60px;
    height: 60px;
    padding: 23px;
    right: 0;
    user-select: none;
    cursor: pointer;
}

    .ast-close:hover,
    .ast-close-town:hover {
        filter: brightness(75%);
    }

.ast-filters-text {
    font-family: Onest-Bold;
    font-size: 16px;
    margin-bottom: 10px;
    letter-spacing: 0.4px;
}

.ast-title, .search-title {
    width: 100%;
    height: 100%;
    padding: 10px 10px 10px 15px;
    border: 2px solid #fff;
    border-radius: 10px;
    font-family: Onest-Medium;
    letter-spacing: 0.2px;
    text-overflow: ellipsis;
    outline: none;
    box-shadow: rgba(0, 0, 0, 0.2) 0 0 4px;
}

    .ast-title:focus:placeholder-shown, .search-title:focus:placeholder-shown {
        transition: 0.15s ease-in-out;
        color: #555;
    }

.ast-a {
    text-decoration: none;
    color: #c45200;
}

    .ast-a:hover {
        color: #2ec2c8;
    }

.ast-div-attention-text {
    display: flex;
    width: 100%;
    height: 100px;
    align-items: center;
    justify-content: space-around;
    z-index: 1051;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

.ast-main-text-attention {
    font-family: Podkova;
    font-weight: 700;
    font-size: 24px;
    line-height: 1.6;
    letter-spacing: -0.2px;
    text-align: center;
    padding: 0 20px;
    margin: 0;
}

.ast-divTown-comp {
    display: flex;
    width: 100%;
    height: 48px;
    max-width: 300px;
    padding: 10px 15px;
    border-radius: 10px;
    cursor: pointer;
    user-select: none;
    background-color: #fff;
    box-shadow: rgba(0, 0, 0, 0.2) 0 0 4px;
}

.ast-divTown-mob {
    display: flex;
    flex-direction: column;
    width: fit-content;
    margin-bottom: 20px;
    cursor: pointer;
}

.ast-divImageAndLabel {
    display: flex;
    align-items: center;
}

.ast-imgGeo {
    width: 18px;
    height: 18px;
    margin-right: 5px;
}

.ast-map {
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 200px;
    margin-bottom: 30px;
    border: 1px solid;
    border-radius: 10px;
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.5);
}

.ast-divCloseTown {
    position: absolute;
    top: 0;
    right: 0;
    width: 59px;
    cursor: pointer;
    justify-content: center;
    align-items: center;
    display: flex;
}

.ast-close-town {
    display: flex;
    width: 100%;
    padding: 22px;
    user-select: none;
}

.ast-titleTown {
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
    font-size: 26px;
    font-family: Onest-Bold;
    user-select: none;
}

.ast-divButtonsTown {
    gap: 10px;
    display: flex;
    flex-wrap: wrap;
}

.ast-btnTownSerach, .ast-btnTownSerachInAll {
    padding: 10px 20px;
    background-color: #343434;
    color: #fff;
    border: none;
    width: 100%;
    border-radius: 10px;
    transition: background-color 0.2s;
    flex: 1 1 230px;
}

.ast-btnTownSerachInAll {
    background-color: #ddd;
    color: #343434;
}

.ast-tbAddress {
    display: flex;
    outline: none;
    padding: 10px;
    font-size: 16px;
    border: 2px solid #343434;
    border-radius: 10px;
    width: 100%;
    margin-bottom: 20px;
}

.ast-map-modal-content {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    max-width: 800px;
    max-height: 700px;
    border-radius: 15px;
    padding: 30px;
    overflow: hidden;
    transition: transform 0.25s ease;
    transform: translateY(-50px);
    background-color: #fff;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
}

.modal.show .ast-map-modal-content {
    transform: translateY(0);
}

.ast-category-modal-content {
    display: flex;
    position: absolute;
    width: 100%;
    height: fit-content;
    max-width: 800px;
    min-height: 400px;
    max-height: calc(100dvh - 350px);
    border-radius: 0 0 15px 15px;
    padding: 30px;
    overflow: hidden;
    transition: transform 0.25s ease;
    transform: translateY(-50px);
    background-color: #fff;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
}

.modal.show .ast-category-modal-content {
    transform: translateY(0);
}

.ast-titleCategory {
    font-size: 22px;
    font-family: Onest-Bold;
}

.ast-divCategoryFilters {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 20px;
    gap: 10px;
}

.ast-divUrlCategory {
    display: flex;
    gap: 5px;
    overflow-x: scroll;
    scrollbar-width: none;
    user-select: none;
    -webkit-user-drag: none;
}

.ast-ulCategories {
    display: flex;
    flex-direction: column;
    list-style: none;
    padding: 0;
    margin: 0;
    font-family: Onest-Bold;
    font-size: 24px;
}

.ast-ulSubcategories {
    display: flex;
    flex-direction: column;
    list-style: none;
    padding: 0;
    margin: 0;
    font-family: Onest-Medium;
    font-size: 18px;
    margin-left: 20px;
}

.ast-liCategory {
    display: flex;
    padding: 10px;
    align-items: center;
    border-radius: 10px;
    cursor: pointer;
    color: #343434;
    text-decoration: none;
}

    .ast-liCategory.hovered {
        background-color: #f2f2f2;
        color: #e85555;
    }

.ast-liSubcategory {
    padding: 5px;
    cursor: pointer;
    color: #343434;
    text-decoration: none;
}

.ast-liCategoryFilters {
    width: fit-content;
    border-radius: 10px;
    padding: 8px 14px;
    font-family: Onest-Medium;
    background-color: #eee;
    user-select: none;
    cursor: pointer;
}

.ast-iconCategory, .ast-iconCaretRight {
    width: 100%;
    max-width: 30px;
    margin-right: 20px;
    flex-shrink: 0;
    user-select: none;
}

.ast-iconCaretRight {
    margin-left: auto;
    margin-right: 0;
}

.ast-lblTown {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
}

.ast-lblCookie {
    font-size: 14px;
}

.ast-close-cookie {
    position: absolute;
    top: 0;
    right: 0;
    max-width: 54px;
    padding: 20px;
    user-select: none;
    cursor: pointer;
}

    .ast-close-cookie:hover {
        opacity: 0.7;
    }

.ast-div-anim {
    width: 100%;
    display: flex;
    justify-content: center;
    min-height: calc(100dvh - 564px);
    height: 100%;
}

.ast-div-anim-dop {
    min-height: calc(100dvh - 564px);
}

.ast-dopDivAnim-mob, .ast-dopDivAnim-comp {
    margin: 50px 0 30px 0 !important;
    min-height: auto !important;
}

.ast-titleFullAst {
    margin-bottom: 30px;
    font-size: 30px;
    font-family: Onest-Bold;
}

.ast-normal-link {
    color: inherit;
    text-decoration: none;
}

    .ast-normal-link:hover {
        color: inherit;
        filter: contrast(90%);
    }




/*                                                                         Стили окна поисковой                                                                           */




.search-div-anim {
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
}

.search-divCategoryList {
    display: flex;
    flex-direction: column;
    padding-left: 10px;
    line-height: 25px;
    user-select: none;
}

.search-liCategoryList {
    width: fit-content;
    font-size: 15px;
    cursor: pointer;
}

.search-liCategoryList-selected {
    font-family: Onest-Bold;
    pointer-events: none;
}

    .search-liCategoryList-selected:hover {
        color: inherit;
    }

.search-fullAst {
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-family: Onest-Bold;
    margin-bottom: 30px;
}

.search-h1FullAst, .search-countAds {
    display: inline;
    margin: 0;
    font-size: 30px;
}

.search-countAds {
    margin-left: 5px;
    color: #aaa;
}

.search-view {
    display: flex;
    gap: 10px;
    user-select: none;
}

.search-view-image {
    width: 100%;
    max-width: 20px;
    cursor: pointer;
    filter: invert(50%) sepia(100%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%);
}

    .search-view-image:hover {
        filter: invert(47%) sepia(15%) saturate(5792%) hue-rotate(332deg) brightness(96%) contrast(101%);
    }

.search-view-image-active {
    pointer-events: none;
    filter: none;
}

.search-address-img {
    width: 15px;
    height: 15px;
    margin: 4px 4px 0 -2px;
}

.search-divFact {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 30px;
    text-align: center;
    align-items: center;
    margin-bottom: 50px;
    border-radius: 20px;
    background-color: #ffefef;
}

.search-factMain {
    font-family: Onest-Bold;
    font-size: 24px;
}

.search-factText {
    font-family: Onest-Regular;
    font-size: 20px;
}

.search-pagination {
    display: flex;
    gap: 10px;
    margin-top: 40px;
}

.search-pagination-btn, .search-pagination-img-right, .search-pagination-img-left {
    display: flex;
    width: 100%;
    max-width: 40px;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1;
    border-radius: 50%;
    border: 1px solid #ddd;
    background-color: #fff;
    transition: 0.1s;
    user-select: none;
    cursor: pointer;
}

    .search-pagination-btn:hover {
        border: 2px solid #a86a6a;
    }

    .search-pagination-btn.active {
        font-family: Onest-Bold;
        color: #fff;
        border: none;
        background-color: #a86a6a;
    }

.search-pagination-img-right, .search-pagination-img-left {
    width: auto;
    padding: 10px;
    border: none;
    background-color: #eeaeae;
}

.search-pagination-img-left {
    transform: rotate(180deg);
}

    .search-pagination-img-right:hover, .search-pagination-img-left:hover {
        background-color: #dd8a8a;
    }




/*                                                                      Стили окна одного объявления                                                                      */




.avd-form {
    display: flex;
    flex-direction: column;
    min-height: calc(100dvh - 106px);
}

.avd-container-main {
    display: flex;
    width: 100%;
    gap: 100px;
    justify-content: center;
    padding: 0 50px 50px 50px;
}

.avd-search {
    display: flex;
    width: 100%;
    height: 88px;
    padding: 0 50px;
    justify-content: center;
    margin-bottom: 30px;
}

.avd-search-div {
    display: flex;
    width: 100%;
    gap: 50px;
    align-items: center;
    max-width: 1400px;
    opacity: 1;
    transition: 0.1s;
}

.avd-container-left {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 700px;
    height: fit-content;
}

.avd-container-right {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: fit-content;
    max-width: 500px;
    gap: 50px;
    position: sticky;
    z-index: 1;
}

.avd-user-buttons {
    display: flex;
    width: 100%;
    gap: 10px;
    align-items: center;
    justify-content: center;
}

.avd-imageUrl-client {
    display: flex;
    max-width: 80px;
    max-height: 80px;
    border-radius: 50%;
    position: relative;
}

    .avd-imageUrl-client::after {
        content: "";
        position: absolute;
        inset: 0;
        transition: background 0.2s ease;
        border-radius: inherit;
    }

    .avd-imageUrl-client:hover::after {
        background: rgba(0, 0, 0, 0.2);
    }

.avd-image-client {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.avd-charact-cb-div {
    display: grid;
    gap: 10px;
}

.avd-img-margin {
    margin-top: 30px;
}

.avd-info-margin {
    display: flex;
    word-break: keep-all;
    margin-top: 20px;
}

.avd-topPage {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

.avd-divTopPage {
    display: flex;
    gap: 10px;
}

.avd-divImgTopPage {
    display: flex;
    justify-content: center;
    width: 30px;
    height: 30px;
    cursor: pointer;
}

.avd-imgTopPage {
    display: flex;
    max-width: 20px;
    user-select: none;
}

.avd-charact-label {
    color: #757575;
    margin-right: 5px;
}

.avd-address-img {
    width: 15px;
    height: 15px;
    margin-right: 4px;
    margin-top: 4px;
    user-select: none;
}

.avd-moder {
    display: flex;
    width: fit-content;
    margin-bottom: 40px;
    font-size: 20px;
}

.avd-divCategory {
    display: flex;
    gap: 5px;
    align-items: center;
    margin-bottom: 10px;
    overflow-x: scroll;
    scrollbar-width: none;
    font-size: 15px;
    white-space: nowrap;
    color: #777;
}

.avd-title {
    display: flex;
    margin-bottom: 20px;
    font-size: 30px;
    font-family: Onest-Bold;
}

.avd-title-name, .set-title-name, .user-title-name {
    font-size: 26px;
    font-family: Onest-Bold;
    text-align: center;
    display: -webkit-box;
    position: relative;
    -webkit-box-orient: vertical;
    overflow-wrap: break-word;
    margin: 0;
}

.avd-title-name {
    font-size: 20px;
    text-align: start;
    transition: 0.2s;
}

.avd-titleUrl-name {
    width: fit-content;
    margin: 0 0 5px 0;
    color: inherit;
    text-decoration: none;
}

    .avd-titleUrl-name:hover {
        color: inherit;
    }

.avd-divButtonsNumberPhone {
    display: flex;
    gap: 20px;
}

.avd-numberPhone {
    display: flex;
    width: 100%;
    align-self: center;
    justify-content: center;
    font-size: 22px;
    font-family: Onest-Bold;
    color: inherit;
    text-decoration: none;
}

    .avd-numberPhone:hover {
        color: #c45200;
    }

.avd-lblDelete {
    display: flex;
    text-align: center;
    justify-content: center;
    margin: 0 20px 30px 20px;
    font-size: 20px;
    font-family: Onest-Bold;
}

.avd-modalButtons {
    display: flex;
    justify-content: center;
    gap: 40px;
}

.avd-btnNo, .avd-btnYes {
    width: fit-content;
    padding: 9px 20px;
    border: none;
    background-color: #f2f2f2;
    color: #343434;
    border-radius: 10px;
    transition: background-color 0.2s;
}

.avd-btnYes {
    color: #fff;
    background-color: #ea5959;
}

.avd-tbReasonCancel {
    width: 100%;
    height: 44px;
    border: 1px solid #343434;
    border-radius: 10px;
    outline: none;
    padding: 12px;
    margin-bottom: 20px;
}

    .avd-tbReasonCancel:focus {
        border: 2px solid #35d9ba;
    }

.avd-title-charact {
    display: flex;
    font-size: 24px;
    font-family: Onest-SemiBold;
    justify-content: center;
    margin: 10px 0 10px 0;
}

.avd-btnDeleteAd,
.avd-btnPayAd,
.avd-btnUpAd,
.avd-btnBackAd,
.avd-btnCloseAd,
.avd-btnOpenMessenger,
.avd-btnEditAd,
.avd-btnShowPhone,
.avd-btnAudioCall,
.avd-btnSendMoney,
.ast-btnSearchFilters,
.ast-btnSearch,
.blog-btnSearch,
.blog-btnEnterNote,
.promo-btnCard,
.promo-btnSendMail,
.set-btnPayWallet,
.set-btn-make-ad-cont,
.set-btn-make-ad-sticky,
.set-btnHelp,
.set-btnSave,
.auth-btnAuth1,
.auth-btnAuth2 {
    width: 100%;
    padding: 10px;
    border: none;
    border-radius: 10px;
    color: #fff;
    background-color: #24b7ff;
    transition: background-color 0.2s;
}

.avd-btnShowPhone {
    background-color: #11c13a;
}

.avd-btnAudioCall {
    background-color: #6ec11a;
}

.blog-btnSearch,
.ast-btnSearch {
    max-width: 80px;
    align-items: center;
    justify-content: center;
    background-color: #343434;
}

.ast-btnSearch {
    opacity: 0;
    transition: opacity 0.1s ease-in-out, background-color 0.15s linear !important;
}

.ast-btnSearchFilters,
.set-btnPayWallet,
.avd-btnSendMoney,
.promo-btnSendMail {
    background-color: #343434;
}

.set-btnPayWallet {
    height: 100%;
    min-width: 120px;
}

.auth-btnAuth1,
.set-btnSave,
.avd-btnEditAd {
    background-color: #11c13a;
}

.avd-btnDeleteAd {
    background-color: #ea5959;
}

.blog-btnEnterNote {
    background-color: #242424;
}

.avd-btnUpAd,
.avd-btnPayAd {
    background-color: #00bbce;
}

.avd-divUpAvd {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.avd-photo-and-name {
    display: flex;
    width: 100%;
    gap: 20px;
}

.avd-type-and-date {
    display: flex;
    flex-direction: column;
    font-size: 14px;
}

.avd-container-infoUser {
    display: flex;
    flex-direction: column;
    gap: 20px;
    justify-content: center;
}

.avd-container-sendMoneyToAinmal {
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-self: center;
}

.avd-title-sendMoneyToAnimal {
    display: flex;
    justify-content: center;
    font-size: 22px;
    font-family: Onest-Bold;
    width: 100%;
}

.avd-description-sendMoneyToAnimal {
    padding: 15px;
    font-size: 15px;
    border-radius: 10px;
    background-color: #fff3de;
}

.avd-container-right-showing {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 40px;
}

.avd-btnEditDeleteAndPay {
    display: flex;
    width: 100%;
    gap: 10px;
}

.avd-separator-top,
.avd-separator-center,
.avd-separator-bottom {
    width: 100%;
    height: 1px;
    margin: 40px 0 0 0;
    background: linear-gradient(to right, transparent, grey, transparent);
}

.avd-separator-center {
    margin: 0;
}

.avd-separator-bottom {
    margin: 0 0 40px 0;
}

.avd-description {
    word-wrap: break-word;
}

.avd-descriptionText {
    white-space: pre-wrap;
    font-size: 16px;
    line-height: 1.5;
    margin: 0;
}

.avd-infoAd {
    margin: 30px 0 0 0;
    color: #777;
}

.avd-cost {
    display: flex;
    margin-bottom: 30px;
    font-size: 24px;
    letter-spacing: 0.5px;
}

.avd-img-cards-under {
    display: grid;
    width: 100%;
    gap: 15px;
    grid-template-columns: repeat(auto-fill, minmax(57px, 1fr));
    user-select: none;
}

.avd-img-card-under {
    width: 100%;
    border-radius: 10px;
    cursor: pointer;
    height: auto;
    object-fit: cover;
    aspect-ratio: 1/1;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}

    .avd-img-card-under:hover {
        border: #89deff 2px solid;
    }

    .avd-img-card-under.active {
        border: 2px solid #11a6ff;
        cursor: auto;
    }

.avd-div-img {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    aspect-ratio: 4/3;
    border: #aaa 1px solid;
    border-radius: 10px;
    margin-bottom: 20px;
    cursor: pointer;
}

.avd-div-img-dop {
    border: none;
    margin-bottom: 0;
}

.avd-slider-img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    z-index: 0;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
    touch-action: pan-y;
    user-select: none;
}

    .avd-slider-img.swiping {
        transition: none;
    }

.avd-slider-arrow {
    position: absolute;
    cursor: pointer;
    z-index: 1;
    height: 100%;
    max-width: 50px;
    width: 100%;
    background-color: rgba(0, 0, 0, 0);
    opacity: 0;
    user-select: none;
    transition: opacity 0.25s ease, background-color 0.25s ease;
}

    .avd-slider-arrow:hover {
        background-color: rgba(0, 0, 0, 0.2);
    }

.avd-div-img:hover .avd-slider-arrow {
    opacity: 1;
}

.avd-left-arrow, .avd-right-arrow {
    left: 0;
    text-align: center;
    align-content: center;
}

.avd-right-arrow {
    right: 0;
    left: auto;
    transform: rotate(180deg);
}

.avd-blur-background {
    width: 100%;
    height: 100%;
    filter: blur(50px);
    background-size: cover;
    z-index: 0;
    position: absolute;
    inset: 0;
    background-position: center;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}

.avd-titlePhoto {
    display: flex;
    justify-content: center;
    margin-bottom: 20px;
    font-size: 26px;
    font-family: Onest-Bold;
    user-select: none;
}

.avd-priceList {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.avd-priceList-item {
    display: flex;
    justify-content: space-between;
}

.avd-priceList-price {
    width: 100%;
    text-align: end;
    align-content: center;
    letter-spacing: 0.5px;
    font-family: Onest-Bold;
}

.avd-bigPhoto {
    height: 100%;
    max-width: 1400px;
    max-height: 100dvh;
}




/*                                                                      Стили окна объявлений пользователя                                                                */




.user-form {
    display: flex;
    min-height: calc(100dvh - 106px);
    justify-content: center;
    padding: 50px;
}

.user-container-left {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: fit-content;
    max-width: 500px;
    position: sticky;
    top: 40px;
    z-index: 1;
}

.user-container-right {
    display: grid;
    width: 100%;
    max-width: 900px;
    min-height: 300px;
    flex-grow: 1;
}

.user-card-container {
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    display: grid;
    width: 100%;
}

.user-sidebar {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

.user-divActiveAndArchiveAst {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.user-callTitle {
    display: flex;
    justify-content: center;
    font-size: 24px;
    font-family: Onest-SemiBold;
    margin-bottom: 60px;
}

.user-photo-and-name {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 15px;
    align-self: center;
    margin-bottom: 10px;
}

.user-type-and-date {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 14px;
}

.user-image-client {
    display: flex;
    width: 100%;
    min-height: 100px;
    max-width: 100px;
    max-height: 100px;
    object-fit: cover;
    align-self: center;
    border-radius: 50%;
    user-select: none;
}

.user-callPhotoAndName {
    display: flex;
    flex-direction: column;
    align-self: center;
    gap: 15px;
    flex-grow: 1;
}

.user-callButtonsSender, user-callButtonsReceiver {
    justify-content: space-between;
    padding: 20px;
    display: none;
    max-width: 200px;
    align-self: center;
    width: 100%;
}

.user-callButtonsReceiver {
    gap: 100px;
    max-width: 400px;
    align-self: center;
}

.user-callAccept, .user-callCancel {
    background-color: #2fe12f;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    padding: 10px;
}

.user-callCancel {
    background-color: #f33;
}

.user-callClose, .user-callVolume {
    background-color: #f33;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    padding: 10px;
}

.user-callVolume {
    background-color: #fff;
}

.user-callTime {
    font-size: 16px;
    align-self: center;
}




/*                                                                  Стили окна размещения объявления                                                                      */




.makead-form {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: calc(100dvh - 106px);
    padding: 50px;
    background-color: #eeaeae;
}

.makead {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 950px;
    align-self: center;
    padding: 40px;
    border-radius: 20px;
    background-color: #fff;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
}

.makead-title-h2, .makead-title-h2-spec {
    font-size: 30px;
    font-family: Onest-Bold;
    line-height: inherit;
    color: #222;
    margin-bottom: 50px;
}

.makead-title-h2-spec {
    margin: 50px 0 20px 0;
}

.makead-title-box, .makead-title-box-address, .makead-title-box-makead {
    width: 100%;
    max-width: 250px;
    color: #808080;
    font-size: 14px;
    font-family: Onest-Regular;
}

.makead-title-box-address {
    max-width: 600px;
}

.makead-title-box-makead {
    max-width: none;
    text-align: center;
    margin-bottom: 20px;
}

.makead-title-input {
    display: flex;
    width: 100%;
    height: 44px;
    justify-content: space-between;
    padding: 10px;
    outline: none;
    border-radius: 10px;
    border: 2px solid #343434;
}

    .makead-title-input:focus {
        border: 2px solid #35d9ba;
    }

.makead-div-labels, .makead-div-labels-dop {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 350px;
    gap: 10px;
}

.makead-div-labels-dop {
    gap: 30px;
}

.makead-dop-serviceBlock {
    display: flex;
    gap: 20px;
    align-items: center;
}

.makead-imgMinus {
    width: 100%;
    max-width: 15px;
    max-height: 15px;
    user-select: none;
    cursor: pointer;
}

.makead-dop-service {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.makead-charact-ad, .makead-cardsCost {
    display: flex;
    flex-direction: column;
    margin-bottom: 80px;
    gap: 30px;
}

.makead-cardsCost {
    gap: 20px;
}

.makead-label-and-cb {
    display: flex;
    gap: 20px;
}

.makead-label-and-tb {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 20px;
}

.makead-label-blue {
    width: fit-content;
    height: fit-content;
    color: #198de4;
    cursor: pointer;
    font-size: 14px;
}

.makead-checkboxes {
    display: flex;
    gap: 20px;
    margin-top: 30px;
}

.makead-checkboxes-gap {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.makead-photo-description {
    display: flex;
    margin-bottom: 80px;
    align-items: center;
    gap: 25px;
}

.makead-photo-load {
    display: flex;
    width: 100%;
    aspect-ratio: 1/1;
    overflow: hidden;
    justify-content: space-between;
    max-width: 150px;
    position: relative;
}

.makead-photo-load-box {
    display: grid;
    gap: 15px;
    grid-template-columns: repeat(auto-fill, minmax(56px, 1fr));
}

.makead-description-input {
    width: 100%;
    min-height: 200px;
    border: 1px solid #343434;
    border-radius: 10px;
    outline: none;
    padding: 14px;
}

    .makead-description-input:focus {
        border: 2px solid #35d9ba;
    }

.makead-address {
    display: flex;
    flex-direction: column;
    gap: 20px;
    height: fit-content;
    margin-bottom: 80px;
}

.makead-map {
    max-width: 600px;
    width: 100%;
    min-height: 200px;
    border: 1px solid;
    border-radius: 10px;
}

.makead-number {
    display: flex;
    flex-direction: column;
    gap: 25px;
    align-self: start;
    margin-bottom: 80px;
}

.makead-btnmakead {
    padding: 10px 20px;
    background-color: #007bff;
    color: #fff;
    border: none;
    max-width: 250px;
    width: 100%;
    border-radius: 10px;
    cursor: pointer;
    align-content: center;
    transition: background-color 0.2s;
}

.makead-attention-red {
    color: #ff7070;
    min-width: 165px;
    display: none;
}

.makead-img-close {
    width: 100%;
    height: 100%;
    max-height: 18px;
    max-width: 18px;
    cursor: pointer;
    position: absolute;
    right: 0;
    margin-right: 1px;
    margin-top: 1px;
    z-index: 1;
    padding: 5px;
    background-color: #fff;
    border-radius: 50%;
    user-select: none;
}

.makead-lblTotalCost {
    font-size: 20px;
}

.makead-cardCostImg {
    max-width: 30px;
    max-height: 30px;
    border-radius: 50%;
}

.makead-cardCost {
    display: flex;
    flex-direction: column;
    gap: 20px;
    justify-content: space-between;
    width: 100%;
    max-width: 150px;
    padding: 10px;
    border: 2px solid #bbb;
    border-radius: 10px;
    cursor: pointer;
    user-select: none;
    font-size: 14px;
}

.makead-DivCategories, .makead-DivSubcategories {
    width: 100%;
    max-width: 400px;
    padding: 10px;
    background-color: #fff;
    border-radius: 15px;
    height: fit-content;
}

.makead-DivSubcategories {
    height: auto;
}

.makead-ulCategories, .makead-ulSubcategories {
    display: flex;
    flex-direction: column;
    list-style: none;
    padding: 0;
    margin: 0;
    font-family: Onest-Medium;
    font-size: 18px;
    gap: 5px;
    width: 100%;
}

.makead-liCategory, .makead-liSubcategory {
    display: flex;
    height: 100%;
    align-items: center;
    padding: 12px 17px;
    border-radius: 15px;
    cursor: pointer;
    color: #343434;
    text-decoration: none;
    transition: 0.1s;
    user-select: none;
}

.makead-iconCategory {
    width: 100%;
    max-width: 25px;
    max-height: 25px;
    margin-right: 15px;
    flex-shrink: 0;
}

.makead-iconCaretRight {
    width: 100%;
    max-width: 20px;
    margin-left: auto;
    flex-shrink: 0;
}

.makead-choice {
    display: flex;
    width: 100%;
    gap: 20px;
    align-self: center;
    justify-content: center;
}

.makead-choice-title {
    display: flex;
    width: 100%;
    max-width: 400px;
    padding: 30px;
    align-self: center;
    text-align: center;
    justify-content: center;
    border-radius: 55px;
    font-family: Onest-SemiBold;
    font-size: 30px;
    line-height: inherit;
    margin-bottom: 50px;
    background-color: #fff;
}

.makead-cb-300 {
    width: 100%;
    max-width: 300px;
    min-width: 100px;
    height: 44px;
}

.makead-title-input-form-control {
    max-width: 600px;
}

    .makead-title-input-form-control:focus {
        border: 2px solid #35d9ba;
    }




/*                                                                          Стили окна блога                                                                                 */




.blog-form {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: calc(100dvh - 106px);
    justify-content: center;
    padding: 50px;
    background-color: #eeaeae;
}

.blog-divTotal {
    display: flex;
    width: 100%;
    max-width: 1000px;
    gap: 40px;
}

.blog-notesAndSearch {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 20px;
    align-self: center;
    min-height: calc(100dvh - 56px);
}

.blog-rightPanel {
    display: flex;
    flex-direction: column;
    position: sticky;
    top: 106px;
    height: fit-content;
    background-color: #fff;
    border-radius: 20px;
    padding: 15px;
    gap: 15px;
}

.blog-imgRightPanel {
    width: 100%;
    max-width: 50px;
    padding: 10px;
    border-radius: 10px;
    cursor: pointer;
    user-select: none;
}

.blog-imgRightPanelDop {
    background-color: #e6e6e6;
    pointer-events: none;
}

.blog-notes {
    display: flex;
    flex-direction: column;
    width: 100%;
    border-radius: 20px;
    background-color: #fff;
    padding: 30px;
    align-self: center;
    flex-grow: 1;
}

.blog-search {
    border: 2px solid #fff;
    border-radius: 10px;
    padding: 10px 10px 10px 15px;
    text-overflow: ellipsis;
    font-family: Onest-Medium;
    box-shadow: rgba(0, 0, 0, 0.2) 0 0 4px;
    letter-spacing: 0.2px;
    outline: none;
    width: 100%;
    height: 100%;
}

    .blog-search::placeholder {
        text-overflow: ellipsis;
    }

.blog-modal {
    display: none;
    z-index: 1060;
    left: 0;
    top: 0;
    width: 100vw;
    max-height: 100dvh;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    opacity: 0;
    transition: opacity 0.25s ease;
    position: absolute;
    padding: 30px;
    min-height: 320px;
    justify-content: center;
}

    .blog-modal.show {
        opacity: 1;
    }

.blog-modal-content {
    background-color: #fff;
    transition: transform 0.25s ease;
    transform: translateY(-50px);
    display: flex;
    flex-direction: column;
    padding: 30px;
    align-self: center;
    width: 100%;
    height: 100%;
    min-height: 320px;
    max-width: 1000px;
    border-radius: 10px;
}

.blog-modal.show .blog-modal-content {
    transform: translateY(0);
}

.blog-close {
    color: #aaa;
    font-size: 30px;
    font-weight: bold;
    cursor: pointer;
    align-items: center;
    display: flex;
    justify-content: center;
    width: 44px;
    height: 44px;
}

.blog-write-title {
    font-family: Onest-Bold;
    font-size: 26px;
    text-align: center;
}

.blog-div-form-group {
    display: flex;
    flex-direction: column;
    gap: 20px;
    flex-grow: 1;
    overflow: auto;
    padding: 0 20px 0 0;
}

.blog-group {
    display: flex;
}

.blog-label-left {
    font-family: Onest-Regular;
    min-width: 200px;
    text-align: left;
    align-self: center;
}

.blog-write-tb {
    width: 100%;
    padding: 10px;
    font-size: 16px;
    border: 1px solid #343434;
    border-radius: 10px;
    outline: none;
    height: 44px;
    text-overflow: ellipsis;
}

    .blog-write-tb:focus {
        border: 2px solid #35d9ba;
    }

.blog-description-input {
    width: 100%;
    height: 150px;
    min-height: 47px;
    border: 1px solid #646464;
    padding: 10px;
    border-radius: 10px;
    outline: none;
    line-height: 1.6;
}

    .blog-description-input:focus {
        border: 2px solid #35d9ba;
    }

.blog-divBtnEnterNote {
    margin-top: 20px;
}

.blog-div-notes {
    display: flex;
    flex-direction: column;
    gap: 30px;
    flex-grow: 1;
}

.blog-title {
    font-family: Onest-SemiBold;
    font-size: 22px;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    white-space: pre-wrap;
    margin-bottom: 15px;
}

.blog-description {
    font-family: Onest-Regular;
    font-size: 16px;
    line-height: 1.6;
    max-height: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    margin-bottom: 10px;
}

.blog-time {
    font-size: 14px;
    font-family: Onest-Regular;
    max-width: 150px;
    color: #666;
}

.blog-image-and-name {
    display: flex;
    margin-bottom: 15px;
}

.blog-link {
    display: flex;
    flex-direction: column;
    background-color: #68cdff21;
    width: 100%;
    border-radius: 20px;
    padding: 20px;
    border: 2px solid #4fbdff8a;
    max-height: 300px;
    color: inherit;
    text-decoration: none;
}

    .blog-link:hover, .blog-link:focus {
        color: inherit;
    }

.blog-imageClient {
    width: 20px;
    height: 20px;
    margin-right: 8px;
    object-fit: cover;
    border-radius: 20px;
}

.blog-nameClient {
    align-self: center;
    font-size: 14px;
    font-family: Onest-Regular;
    letter-spacing: 0.8px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    white-space: pre-wrap;
}

.blog-buttons-bottom {
    display: flex;
    gap: 30px;
    justify-content: center;
    margin-top: 20px;
}

.blog-btns-bottom-round {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    padding: 3px;
    border: 2px solid #242424;
    color: #fff;
    transition: background-color 0.2s;
}

.blog-div-write-header {
    display: flex;
    justify-content: center;
    margin-bottom: 50px;
}

.blog-ast-text-attention-main {
    font-family: Onest-Bold;
    font-size: 26px;
}

.blog-ast-text-attention {
    font-family: Onest-Medium;
    font-size: 18px;
    margin-bottom: 10px;
}

.blog-main-container, .blog-main-container-empty {
    width: 100%;
    height: 100%;
    padding: 30px;
    gap: 10px;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: center;
    flex-grow: 1;
}

.blog-main-container-empty {
    gap: 0;
    padding: 0;
}




/*                                                                           Стили окна статьи                                                                               */




.post-form {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: calc(100dvh - 106px);
    align-items: center;
    padding: 50px;
    background-color: #eeaeae;
}

.post-div {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 800px;
    padding: 40px;
    border-radius: 20px;
    background-color: #fff;
}

.post-title {
    margin-bottom: 35px;
    font-size: 32px;
    font-family: Onest-Bold;
    line-height: 1.2;
    color: #343434;
}

.post-images {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.post-imagePost {
    width: 100%;
    object-fit: cover;
    border-radius: 20px;
    aspect-ratio: 10/7;
}

.post-description, .post-description-dop {
    line-height: 1.8;
    margin-bottom: 25px;
    white-space: pre-wrap;
}

.post-description-dop {
    margin: -10px 0 -15px 0;
}

.post-time {
    max-width: 150px;
    margin-top: 30px;
    font-size: 14px;
    color: #737373;
}

.post-image-and-name {
    display: flex;
    margin-bottom: 30px;
}

.post-imageClient {
    width: 40px;
    height: 40px;
    margin-right: 12px;
    border-radius: 20px;
    object-fit: cover;
}

.post-nameClient {
    display: flex;
    align-self: center;
    font-size: 16px;
    font-family: Onest-Regular;
    margin: 0;
    letter-spacing: 0.8px;
    line-height: 1.4;
}

.post-link, .post-video-not-found {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background-color: #343434;
    font-family: Onest-Medium;
    color: wheat;
    font-size: 22px;
    position: absolute;
    top: 0;
    aspect-ratio: 5/3;
    min-height: 150px;
}

.post-div-video {
    position: relative;
    padding-top: 60%;
    max-height: 500px;
    width: 100%;
}




/*                                                                         Стили окна карты сайта                                                                            */




.sitemap-form {
    display: flex;
    min-height: calc(100dvh - 106px);
    justify-content: center;
    padding: 50px;
    background-color: #eeaeae;
}

.sitemap-category-content {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: fit-content;
    max-width: 1000px;
    padding: 50px;
    border-radius: 15px;
    background-color: #fff;
}

.sitemap-title {
    font-size: 30px;
    font-family: Onest-Bold;
    margin-bottom: 40px;
}

.sitemap-divCategories {
    display: flex;
}

.sitemap-ulCategories {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sitemap-liCategory {
    display: flex;
    width: fit-content;
    align-items: center;
    margin-bottom: 10px;
    border-radius: 10px;
    cursor: pointer;
    color: #343434;
    font-family: Onest-Bold;
    font-size: 24px;
    text-decoration: none;
}

.sitemap-liSubcategory {
    width: fit-content;
    padding: 5px;
    cursor: pointer;
    color: #343434;
    font-family: Onest-Medium;
    font-size: 18px;
    text-decoration: none;
}

.sitemap-iconCaretRight {
    width: 100%;
    max-width: 20px;
    margin-left: 10px;
    flex-shrink: 0;
}




/*                                                                           Стили окна рекламы                                                                            */




.promo-form {
    display: flex;
    flex-direction: column;
    min-height: calc(100dvh - 106px);
    padding: 50px;
}

.promo-h1, .promo-h2 {
    display: flex;
    justify-content: center;
    margin-bottom: 60px;
    font-size: 40px;
    font-family: Onest-Bold;
}

.promo-h2 {
    justify-content: start;
    margin: 0;
    font-size: 22px;
}

.promo-totalBlock {
    display: flex;
    flex-direction: column;
    gap: 50px;
}

.promo-block {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
    max-width: 800px;
    align-self: center;
    padding: 50px;
    border-radius: 20px;
    background-color: #fee;
}

.promo-loadAndSendBox, .promo-priceBox {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 20px;
    border-radius: 20px;
    opacity: 1;
    transition: opacity 0.5s ease-in-out;
    background-color: #fff;
}

    .promo-loadAndSendBox.show {
        opacity: 0;
    }

.promo-priceBox {
    gap: 30px;
}

.promo-loadAndSendMiniBox {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.promo-btnLoadAndSend {
    display: flex;
    gap: 8px;
    width: fit-content;
    align-items: center;
    padding: 10px 12px;
    border-radius: 15px;
    background-color: #eee;
    transition: 0.2s;
    cursor: pointer;
    user-select: none;
}

    .promo-btnLoadAndSend:hover {
        background-color: #ddd;
    }

.promo-card {
    width: 100%;
    height: 200px;
    text-align: center;
    align-content: center;
    border: 1px solid #757575;
    border-radius: 20px;
    color: #757575;
}

.promo-imgLoadAndSend {
    max-width: 18px;
    max-height: 18px;
    border: none !important;
}

.promo-lblLoadAndSendBig {
    font-size: 15px;
    font-family: Onest-Medium;
    color: #757575;
}

.promo-lblLoadAndSendSmall {
    font-size: 14px;
    font-family: Onest-Medium;
    cursor: pointer;
}

.promo-lblPiarPlace {
    width: 100%;
    font-family: Onest-Medium;
}

.promo-tbMail {
    width: 100%;
    border: 1px solid #343434;
    border-radius: 10px;
    outline: none;
    padding: 10px;
}

    .promo-tbMail:focus {
        border: 2px solid #35d9ba;
    }

.promo-tbDescription {
    width: 100%;
    min-height: 200px;
    border: 1px solid #343434;
    border-radius: 10px;
    outline: none;
    padding: 14px;
}

    .promo-tbDescription:focus {
        border: 2px solid #35d9ba;
    }

.promo-lblMailBox, .promo-lblMailShow {
    font-size: 18px;
    font-family: Onest-Medium;
}

.promo-lblMailShow {
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
}

    .promo-lblMailShow.show {
        opacity: 1;
    }

.promo-table {
    display: grid;
    grid-auto-flow: column;
    border: 1px solid #ddd;
    border-radius: 20px;
}

.promo-tableColumn {
    display: grid;
    grid-template-rows: repeat(5, auto);
}

.promo-tableRow {
    display: flex;
    min-height: 60px;
    text-align: center;
    align-items: center;
    justify-content: center;
    padding: 10px;
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
}

.promo-tableColumn .promo-tableRow:last-child {
    border-bottom: none;
}

.promo-tableColumn:last-child .promo-tableRow {
    border-right: none;
}

.promo-tableColumn .promo-tableRow:first-child, .promo-tableColumn:first-child .promo-tableRow {
    font-family: Onest-Medium;
}

.promo-cardTitle {
    font-size: 15px;
    color: inherit;
}

.promo-cardDescription {
    margin-bottom: 10px;
    font-size: 13px;
    line-height: 18px;
}

.promo-btnCard {
    max-height: 40px;
    padding: 5px 10px;
    margin-top: auto;
    font-size: 13px;
    font-family: Onest-Medium;
    color: #0076df;
    background-color: #cfedff;
}




/*                                                                            Стили окна 404                                                                                 */




._404-form {
    display: flex;
    min-height: calc(100dvh - 106px);
    justify-content: center;
    padding: 50px;
    background-color: #eeaeae;
}

._404-div {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: fit-content;
    align-self: center;
    padding: 40px;
    border-radius: 20px;
    background-color: #fff;
}

._404-title {
    margin-bottom: 20px;
    font-size: 24px;
    font-family: Onest-Medium;
}




/*                                                                               Ховеры                                                                                      */




.ast-divTown-comp:hover,
.ast-divImageAndLabel:hover,
.ast-liSubcategory:hover,
.ast-card-title:hover,
.ast-card-title-column:hover,
.avd-lblCategory:hover,
.avd-title-name:hover,
.totalLinkRed:hover,
.search-liCategoryList:hover,
.sitemap-liSubcategory:hover,
.sitemap-liCategory:hover {
    color: #e85555;
}

.set-btnHelp:hover,
.avd-btnCloseAd:hover,
.avd-btnBackAd:hover,
.set-save-photo:hover,
.auth-btnAuth2:hover,
.avd-btnOpenMessenger:hover,
.set-btn-make-ad-cont:hover,
.set-btn-make-ad-sticky:hover {
    background-color: #24a1ff;
}

.ast-btnSearch:hover,
.ast-btnSearchFilters:hover,
.ast-btnTownSerach:hover,
.avd-btnSendMoney:hover,
.set-btnPayWallet:hover,
.blog-btnSearch:hover,
.promo-btnSendMail:hover {
    background-color: #444;
}

.avd-btnEditAd:hover,
.avd-btnShowPhone:hover,
.auth-btnAuth1:hover,
.set-btnSave:hover {
    background-color: #00ac03;
}

.avd-btnNo:hover,
.ast-liCategoryFilters:hover {
    background-color: #ddd;
}

.avd-btnYes:hover,
.avd-btnDeleteAd:hover {
    background-color: #cc4e4e;
}

.avd-btnPayAd:hover,
.avd-btnUpAd:hover {
    background-color: #009eae;
}

.set-bell:hover,
.set-chat:hover {
    background-color: #d8f6ff8a;
}

.makead-liCategory:hover,
.makead-liSubcategory:hover {
    background-color: #f2f2f2;
}

.makead-btnmakead:hover {
    background-color: #0066d4;
}

.makead-img-close:hover {
    filter: brightness(75%);
}

.ast-btnTownSerachInAll:hover {
    background-color: #d0d0d0;
}

.avd-btnAudioCall:hover {
    background-color: #67b01d;
}

.close:hover {
    color: #343434;
    text-decoration: none;
}