/*стили для мобилы*/
@media (max-width: 768px) {
    .catalog-grid-links {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 580px) {
    .v-container {
        padding-left: 16px;
        padding-right: 16px;
    }
    .home-grid-links {
        grid-gap: 16px;
    }
    .home-grid-links .item {
        padding: 16px;
        min-height: 228px;
    }
    .home-grid-links .item .title {
        font-size: 18px;
        margin-top: 32px;
    }
    .catalog-grid-links {
        grid-gap: 16px;
    }
    .v-header .pageName {
        font-size: 12px;
        display: -webkit-box;
        -webkit-line-clamp: 3;           /* Количество видимых строк */
        -webkit-box-orient: vertical;
        width: 20ch;             /* Ограничение примерно в 20 символов */
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .v-product-list-card {
        padding: 16px!important;
        display: flex!important;
        flex-direction: column!important;
        gap: 16px!important;
    }
    .v-product-list-card .name,
    .v-product-list-card .article,
    .v-product-list-card .quantity{
        text-align: center!important;
    }

    .v-card-item {
        flex-direction: column;
    }
    .v-card-item .img,
    .v-card-item .description {
        margin: 0 0 16px 0;
    }
    .v-card-item .description .name,
    .v-card-item .description .article {
        text-align: center;
        width: 100%;
        display: block;
    }
    .v-card-item .actions {
        width: 100%;
        display: flex;
        align-items: center;
        gap: 12px;
        justify-content: space-between;
        margin-bottom: 16px;
    }
    .v-card-item .price {
        margin: 0;
    }
    .v-card-item .remove {
        margin-right: 16px;
    }
    .v-card-item .delivery-selector .form-label {
        width: 100%;
    }
    .v-card-total-block .link {
        font-size: 16px;
    }
    .v-card-total-block {
        padding-left: 16px;
        padding-right: 16px;
    }
    .form-item.source-item {
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 16px;
    }
    .radio-input {
        width: 100%!important;
        font-size: 16px;
    }
    select {
        width: 100%;
    }
    .v-order-wrapper .form-item.total-item {
        gap: 12px;
        display: flex;
        flex-wrap: wrap;
    }
    .v-order-wrapper .form-item.total-item > div:first-child {
        width: 100%;
    }
    .form-section .total-price {
        width: 100%;
        text-align: left;
    }
    .order-result .buttons .item {
        gap: 4px;
        font-size: 12px;
    }
    .order-result .title {
        font-size: 24px;
    }
    .v-header .search-btn,
    .backBtn{
        width: 24px;
        height: 24px;
    }
    .v-btn {
        height: 40px;
        font-size: 14px;
        padding: 6px 12px;
    }
    .sku-prop {
        font-size: 14px;
        padding: 6px 12px;
    }
    .v-product-detail .product-name {
        font-size: 24px;
        margin-bottom: 24px;
    }
    .v-product-detail .title {
        margin-bottom: 16px;
    }
    .v-product-detail-actions .price {
        font-size: 18px;
    }
    .v-request-card {
        padding: 12px;
        gap: 12px;
    }
    .v-request-card .status,
    .v-request-card .name,
    .v-request-card .fio {
        margin: 0;
    }
    .v-request-card .name,
    .v-request-card .fio{
        width: 80%;
    }
    .v-request-card .order-number {
        margin-right: auto;
    }
    .pageTitle {
        font-size: 24px;
        margin-bottom: 16px;
    }
    .v-request-detail .item {
        padding: 16px;
        font-size: 14px;
    }
    .service-categories .item {
        padding: 12px;
    }
    input[type="text"],
    input[type="tel"],
    input[type="number"],
    input[type="password"],
    input[type="email"] {
        margin-bottom: 16px;
        font-size: 14px;
        height: 40px;
    }
    input::placeholder {
        font-size: 14px;
    }
    .v-auth-wrapper .title {
        font-size: 24px;
        margin-bottom: 24px;
    }
    .v-auth-wrapper .v-btn {
        margin-top: 24px;
    }
    .v-header .logo {
        width: 30px;
    }
    .home-grid-links .item .icon {
        width: 60px;
        height: 60px;
    }
    .v-quantity-btn input {
        margin: 0;
    }
    .v-card-item .quantity {
        text-align: center;
    }
    .v-order-actions .cancel, .v-order-actions .save {
        height: 50px;
        font-size: 14px;
    }
    .v-order-wrapper .form-item {
        gap: 12px;
    }
    .radio-input {
        gap: 8px;
        font-size: 13px;
    }
    .radio-input .radio {
        width: 16px;
        height: 16px;
    }
    .radio-input .radio:before {
        width: 8px;
        height: 8px;
        left: calc(50% - 4px);
        top: calc(50% - 4px);
    }
    .v-order-wrapper .form-item.total-item .total {
        font-size: 18px;
    }
    .modal-header-search .close-btn {
        top: calc(50% + 5px);
    }

    .modal-product-list {
        display: flex!important;
        flex-direction: column!important;
        gap: 12px!important;

    }
    .modal-product-preview {
        flex-direction: column;
        align-items: center;
        margin-bottom: 8px;
    }
    .modal-product-preview .modal-product-info *{
        width: 100%;
    }
    .product-detail-body .title {
        margin-bottom: 12px;
    }
    .modal-add-to-order-btn {
        font-size: 14px;
        padding: 12px;
        height: 40px;
    }
    .v-request-detail .item .name {
        font-size: 14px;
    }
}
@media (max-width: 460px) {
    .form-label,
    .v-order-wrapper .input,
    .form-item.source-item .radio-input{
        font-size: 14px;
    }
    .home-grid-links {
        grid-template-columns: 1fr;
    }
    .home-grid-links .item {
        min-height: 140px;
    }
    .home-grid-links .item .title {
        margin-top: 18px;
        font-size: 16px;
    }
    .v-rating__user {
        flex-direction: column;
        align-items: center;
    }
    .v-rating__user-info {
        text-align: center;
    }
    .v-footer .grid {
        grid-gap: 6px;
    }
    .v-footer .grid .item {
        font-size: 12px;
    }
    .v-footer .grid .item svg.updateIcon {
        width: 30px;
        height: 30px;
    }
    .catalog-grid-links {
        grid-template-columns: 1fr;
    }
    .catalog-grid-links .item {
        padding: 16px;
        min-height: 250px;
    }
    .catalog-grid-links .item .title {
        margin-top: 24px;
        text-align: center;
    }
    .catalog-grid-links .item .img {
        width: 100%;
        height: 150px;
    }

    .v-header .v-container {
        flex-wrap: wrap;
    }

}

/*стили для мобилы end*/