.clients-page{
    min-height:calc(100vh - 48px);
    margin:-8px -4px 0;
    color:#102648;
}

.clients-page::before{
    content:"Контакты";
    display:block;
    margin:0 0 24px;
    color:#102648;
    font-size:26px;
    line-height:1.12;
    font-weight:800;
    letter-spacing:0;
}

.clients-tabs{
    display:flex;
    align-items:center;
    gap:34px;
    min-height:38px;
    border-bottom:1px solid #cfdcf0;
    padding:0;
    margin:0 0 14px;
}

.clients-tab{
    min-height:38px;
    padding:0 0 12px;
    border:none;
    border-radius:0;
    background:transparent;
    color:#102648;
    font-size:14px;
    font-weight:800;
    border-bottom:3px solid transparent;
}

.clients-tab:hover{
    background:transparent;
    color:#1677ff;
}

.clients-tab.active{
    color:#1f6eff;
    border-bottom-color:#2d72f7;
}

.clients-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:14px;
    padding:16px 18px;
    border:1px solid rgba(207, 220, 240, 0.95);
    border-radius:12px;
    background:rgba(255, 255, 255, 0.86);
    box-shadow:0 14px 34px rgba(30, 64, 115, 0.07);
}

.clients-toolbar-left,
.clients-toolbar-right{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
}

.clients-create-btn{
    min-height:44px;
    padding:0 22px;
    border-radius:8px;
    background:linear-gradient(180deg, #22bd5e 0%, #159947 100%);
    color:#fff;
    font-size:14px;
    font-weight:700;
    box-shadow:0 10px 22px rgba(21, 153, 71, 0.16);
}

.clients-create-btn:hover{
    background:#087f40;
}

.clients-filter-btn,
.clients-action-btn,
.clients-icon-btn{
    min-height:44px;
    padding:0 16px;
    border:1px solid rgba(207, 220, 240, 0.95);
    border-radius:8px;
    background:rgba(255, 255, 255, 0.84);
    color:#102648;
    font-size:13px;
    font-weight:800;
    display:inline-flex;
    align-items:center;
    gap:10px;
}

.clients-filter-btn:hover,
.clients-action-btn:hover,
.clients-icon-btn:hover{
    background:#f8fbff;
    color:#1f6eff;
}

.clients-filter-btn.active{
    border-color:#9dbbeb;
    background:#eaf2ff;
}

.clients-filter-btn svg,
.clients-icon-btn svg{
    width:16px;
    height:16px;
    stroke:currentColor;
}

.clients-caret{
    color:#6b7280;
    font-size:11px;
}

.clients-columns-wrap{
    position:relative;
}

.clients-type-filter-wrap,
.clients-manager-filter-wrap,
.clients-birthday-filter-wrap,
.clients-age-filter-wrap{
    position:relative;
}

.clients-columns-panel,
.clients-type-filter-menu,
.clients-manager-filter-menu,
.clients-birthday-filter-menu,
.clients-age-filter-menu{
    position:absolute;
    top:calc(100% + 4px);
    right:0;
    width:205px;
    max-height:448px;
    overflow:auto;
    display:none;
    padding:8px 10px;
    border:1px solid #e5e7eb;
    border-radius:7px;
    background:#fff;
    box-shadow:0 4px 16px rgba(15,23,42,0.12);
    z-index:30;
}

.clients-type-filter-menu,
.clients-manager-filter-menu,
.clients-birthday-filter-menu,
.clients-age-filter-menu{
    left:0;
    right:auto;
    width:176px;
    padding:6px;
}

.clients-manager-filter-menu{
    width:220px;
}

.clients-birthday-filter-menu{
    width:202px;
}

.clients-age-filter-menu{
    width:146px;
}

.clients-columns-panel.show,
.clients-type-filter-menu.show,
.clients-manager-filter-menu.show,
.clients-birthday-filter-menu.show,
.clients-age-filter-menu.show{
    display:grid;
    gap:4px;
}

.clients-type-filter-menu button,
.clients-manager-filter-menu button,
.clients-birthday-filter-menu button,
.clients-age-filter-menu button{
    width:100%;
    min-height:30px;
    padding:6px 9px;
    border:0;
    border-radius:3px;
    background:#fff;
    color:#1f2937;
    font-size:12px;
    font-weight:400;
    text-align:left;
}

.clients-type-filter-menu button:hover,
.clients-type-filter-menu button.active,
.clients-manager-filter-menu button:hover,
.clients-manager-filter-menu button.active,
.clients-birthday-filter-menu button:hover,
.clients-birthday-filter-menu button.active,
.clients-age-filter-menu button:hover{
    background:#eaf2ff;
    color:#1f2937;
}

.clients-filter-separator{
    height:1px;
    margin:5px -6px;
    background:#e5e7eb;
}

.clients-birthday-custom-fields{
    display:none;
    gap:6px;
    padding:6px 2px 2px;
}

.clients-birthday-custom.open .clients-birthday-custom-fields{
    display:grid;
}

.clients-birthday-custom-fields input{
    width:100%;
    min-height:29px;
    padding:5px 7px;
    border:1px solid #cfd6df;
    border-radius:3px;
    color:#1f2937;
    font-size:12px;
}

.clients-age-range{
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    gap:7px;
    padding:4px 3px 8px;
}

.clients-age-range input{
    width:100%;
    min-height:34px;
    padding:6px 8px;
    border:1px solid #cfd6df;
    border-radius:3px;
    color:#1f2937;
    font-size:12px;
}

.clients-age-range input:focus{
    border-color:#0d6efd;
    outline:none;
    box-shadow:0 0 0 2px rgba(13,110,253,0.12);
}

.clients-age-range span{
    color:#6b7280;
    font-size:14px;
}

.clients-age-apply{
    color:#0d6efd !important;
}

.clients-age-reset{
    color:#0d6efd !important;
}

.clients-column-check{
    display:flex;
    align-items:flex-start;
    gap:7px;
    margin:0;
    font-size:12px;
    font-weight:400;
    color:#374151;
    line-height:1.18;
}

.clients-column-check input{
    width:13px;
    height:13px;
    margin:0;
    accent-color:#1677ff;
    flex-shrink:0;
}

.clients-table-shell{
    width:100%;
    overflow-x:auto;
    overflow-y:visible;
    border:1px solid rgba(207, 220, 240, 0.95);
    border-radius:12px;
    background:rgba(255, 255, 255, 0.78);
    box-shadow:0 14px 34px rgba(30, 64, 115, 0.07);
    scrollbar-color:#9ca3af #f3f4f6;
    scrollbar-width:thin;
}

.clients-table{
    min-width:1560px;
    table-layout:fixed;
    border-collapse:collapse;
}

.clients-table th,
.clients-table td{
    height:58px;
    min-height:58px;
    max-height:58px;
    padding:0 16px;
    border-right:1px solid #d8e2f0;
    border-bottom:1px solid #e6edf7;
    font-size:12px;
    font-weight:700;
    color:#102648;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.clients-table th{
    background:linear-gradient(180deg, #f7f9fd 0%, #eef3fa 100%);
    color:#102648;
    font-weight:800;
    position:relative;
}

.clients-table th:first-child{
    width:28px;
    text-align:center;
}

.clients-table input[type="checkbox"]{
    width:13px;
    height:13px;
    margin:0;
    accent-color:#1677ff;
}

.clients-table tr.clients-row-selected{
    background:#eaf2ff;
}

.clients-sort-btn{
    width:100%;
    min-height:58px;
    padding:0;
    border:none;
    border-radius:0;
    background:transparent;
    color:inherit;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:6px;
    font-size:12px;
    font-weight:800;
}

.clients-sort-btn:hover{
    background:transparent;
    color:#102648;
}

.clients-sort-label{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
}

.clients-sort-arrow{
    color:#7b8491;
    font-size:12px;
    flex-shrink:0;
}

.clients-name-link{
    color:#1f6eff;
    font-weight:800;
}

.clients-company-mark{
    margin-left:5px;
    color:#8792a2;
    font-size:12px;
}

.clients-empty{
    padding:22px 8px;
    color:#667085;
    font-size:13px;
}

.clients-bulkbar{
    display:none;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    flex-wrap:wrap;
    padding:14px 6px 0;
    width:100%;
}

.clients-bulkbar.show{
    display:flex;
}

.clients-bulk-left{
    display:inline-flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}

.clients-bulk-btn{
    min-height:29px;
    padding:5px 12px;
    border:1px solid #cfd6df;
    border-radius:3px;
    background:#fff;
    color:#1f2937;
    font-size:12px;
    font-weight:400;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
}

.clients-bulk-btn:hover{
    background:#f5f7fa;
    color:#1f2937;
}

.clients-bulk-btn svg{
    width:15px;
    height:15px;
    stroke:currentColor;
}

.clients-bulk-delete{
    width:38px;
    min-width:38px;
    padding:5px 10px;
    border-color:#dc111d;
    background:#ff1f2d;
    color:#fff;
}

.clients-bulk-delete:hover{
    background:#dc111d;
    color:#fff;
}

.clients-bulk-count{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:#1f2937;
    font-size:12px;
    font-weight:400;
}

.clients-bulk-clear{
    width:17px;
    height:17px;
    min-height:17px;
    padding:0;
    border:none;
    border-radius:999px;
    background:#c7cbd1;
    color:#fff;
    font-size:12px;
    line-height:1;
}

.clients-bulk-clear:hover{
    background:#9ca3af;
    color:#fff;
}

.clients-footer{
    padding:18px 18px 20px;
    font-size:14px;
    color:#102648;
    font-weight:700;
}

.clients-footer strong{
    color:#1677ff;
    font-weight:400;
}

.clients-modal-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.clients-modal-grid .field-full{
    grid-column:1 / -1;
}

.clients-modal-grid label{
    font-size:13px;
}

.client-form-modal{
    width:560px;
    max-width:calc(100vw - 28px);
    max-height:92vh;
    padding:0;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    border-radius:4px;
}

.crm-modal-root.client-drawer-root{
    overflow:hidden;
    padding:0;
}

.crm-modal-root.client-drawer-root .client-form-backdrop{
    position:fixed;
}

.client-form-drawer{
    position:fixed;
    top:0;
    right:0;
    left:auto;
    transform:none;
    width:min(980px, calc(100vw - 96px));
    max-width:none;
    height:100vh;
    max-height:none;
    border-radius:0;
    border-top:none;
    border-right:none;
    border-bottom:none;
    box-shadow:0 24px 70px rgba(15,23,42,0.28);
    animation:clientDrawerIn 0.22s ease both;
}

@keyframes clientDrawerIn{
    from{
        transform:translateX(100%);
    }
    to{
        transform:translateX(0);
    }
}

.client-form-head{
    padding:14px 16px;
    border-bottom:1px solid #e5e7eb;
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    flex-shrink:0;
}

.client-form-title-wrap{
    min-width:0;
}

.client-form-subtitle{
    margin-top:5px;
    color:#667085;
    font-size:13px;
    line-height:1.25;
}

.client-form-close{
    width:36px;
    height:36px;
    min-height:36px;
    padding:0;
    border:1px solid #d9e2f1;
    border-radius:8px;
    background:#f3f6fb;
    color:#344054;
    font-size:18px;
    line-height:1;
    flex:0 0 auto;
}

.client-form-close:hover{
    background:#e9eef8;
    color:#1f2937;
}

.client-form-body{
    padding:0 12px;
    overflow-y:auto;
    min-height:0;
    scrollbar-color:#9ca3af #f3f4f6;
    scrollbar-width:thin;
}

.client-form-drawer .client-form-body{
    padding:2px 18px 18px;
    flex:1 1 auto;
}

.client-form-section{
    display:grid;
    grid-template-columns:210px 1fr;
    gap:18px;
    padding:16px 0;
    border-bottom:1px solid #e5e7eb;
}

.client-form-general-section{
    padding-top:14px;
}

.client-form-contact-section{
    padding-top:16px;
}

.client-form-section-title{
    color:#29313d;
    font-size:14px;
    font-weight:700;
    line-height:1.35;
}

.client-form-section-title small{
    display:block;
    margin-top:10px;
    color:#8a94a6;
    font-size:12px;
    font-weight:400;
    line-height:1.45;
}

.client-form-fields{
    min-width:0;
    display:grid;
    gap:14px;
}

.client-form-field{
    display:grid;
    gap:6px;
}

.client-form-field label{
    margin:0;
    font-size:12px;
    font-weight:400;
    color:#1f2937;
}

.client-form-type-field{
    gap:5px;
}

.client-form-type-toggle{
    display:inline-flex;
    width:max-content;
    border:1px solid #c7ced8;
    border-radius:3px;
    overflow:hidden;
    background:#fff;
}

.client-form-type-toggle button{
    min-height:28px;
    min-width:84px;
    padding:5px 12px;
    border:none;
    border-right:1px solid #c7ced8;
    border-radius:0;
    background:#fff;
    color:#1f2937;
    font-size:12px;
    font-weight:400;
}

.client-form-type-toggle button:last-child{
    border-right:none;
}

.client-form-type-toggle button.active{
    background:#eef0f2;
}

.client-form-type-toggle button:hover{
    background:#f5f7fa;
    color:#1f2937;
}

.client-form-supplier-check{
    width:max-content;
    display:flex;
    align-items:center;
    gap:5px;
    margin:2px 0 3px;
    color:#344054;
    font-size:12px;
    font-weight:400;
}

.client-form-supplier-check input{
    width:13px;
    height:13px;
    margin:0;
    accent-color:#1677ff;
}

.client-form-truck{
    color:#8a94a6;
    font-size:12px;
}

.client-form-manager-select{
    width:100%;
    min-height:29px;
    padding:4px 34px 4px 10px;
    border:none;
    border-radius:3px;
    background:#eaf2ff;
    color:#1f2937;
    font-size:13px;
    font-weight:400;
    text-align:left;
    cursor:pointer;
}

.client-form-manager-select:hover{
    background:#dfeaff;
    color:#1f2937;
}

.client-form-manager-avatar{
    width:24px;
    height:24px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#ea7d7b;
    color:#fff;
    font-size:13px;
    font-weight:700;
    flex-shrink:0;
}

.client-form-manager-caret{
    margin-left:auto;
    color:#7b8491;
    font-size:12px;
}

.client-form-field label span{
    color:#d92d20;
}

.client-form-field input,
.client-form-field select,
.client-form-field textarea{
    min-height:28px;
    padding:5px 10px;
    border-radius:3px;
    border-color:#c7ced8;
    font-size:12px;
}

.client-form-phone-label{
    display:inline-flex;
    align-items:center;
    gap:4px;
}

.client-form-phone-label span{
    color:#1f2937;
    font-size:11px;
}

.client-form-phone-row{
    display:grid;
    grid-template-columns:168px 42px;
    gap:8px;
    align-items:center;
}

.client-form-phone-input{
    display:grid;
    grid-template-columns:25px 1fr;
    align-items:center;
    min-height:28px;
    border:1px solid #c7ced8;
    border-radius:3px;
    background:#fff;
}

.client-form-phone-input input{
    min-height:26px;
    padding:4px 8px 4px 0;
    border:none;
    border-radius:0;
    box-shadow:none;
}

.client-form-phone-flag{
    width:13px;
    height:9px;
    margin-left:8px;
    display:inline-block;
    border:1px solid #d7dce3;
    background:linear-gradient(#fff 0 33%, #1f5bd8 33% 66%, #e22b2b 66% 100%);
}

.client-form-phone-more{
    min-width:42px;
    min-height:28px;
    padding:0;
    border:1px solid #c7ced8;
    border-radius:3px;
    background:#fff;
    color:#b5bdc8;
    font-size:19px;
    line-height:1;
}

.client-form-phone-more:hover{
    background:#f5f7fa;
    color:#8a94a6;
}

.client-form-add-phone{
    width:max-content;
    min-height:auto;
    padding:0;
    border:none;
    border-radius:0;
    background:transparent;
    color:#1677ff;
    font-size:12px;
    font-weight:400;
}

.client-form-add-phone:hover{
    background:transparent;
    color:#1557bb;
    text-decoration:underline;
}

.client-invited-phone-list{
    display:grid;
    gap:8px;
}

.client-invited-phone-row{
    display:grid;
    grid-template-columns:1fr 34px;
    gap:8px;
    align-items:center;
}

.client-invited-phone-input-wrap{
    width:100%;
}

.client-invited-phone-remove{
    min-width:34px;
    min-height:28px;
    padding:0;
    border:1px solid #f0c4c4;
    border-radius:3px;
    background:#fff;
    color:#a13b3b;
    font-size:18px;
    line-height:1;
}

.client-invited-phone-remove:hover{
    border-color:#d96b6b;
    background:#fff1f1;
    color:#842b2b;
}

.client-invited-phone-add{
    margin-top:2px;
}

.client-form-field textarea{
    min-height:62px;
}

.client-form-birthday{
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    gap:8px;
}

.client-form-inline{
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px;
    align-items:center;
}

.client-form-inline button{
    min-height:28px;
    border-radius:3px;
    font-size:12px;
    font-weight:400;
}

.client-form-discount-row{
    display:grid;
    gap:6px;
}

.client-form-discount-row label{
    margin:0;
    font-size:12px;
    font-weight:400;
    color:#1f2937;
}

.client-form-discount-controls{
    display:grid;
    grid-template-columns:92px 100px 1fr 14px;
    align-items:center;
    gap:0;
}

.client-form-segment{
    min-height:28px;
    padding:4px 8px;
    border:1px solid #c7ced8;
    border-radius:0;
    background:#fff;
    color:#344054;
    font-size:12px;
    font-weight:400;
}

.client-form-segment:first-child{
    border-radius:3px 0 0 3px;
}

.client-form-segment.active{
    background:#eef0f2;
}

.client-form-segment:hover{
    background:#f5f7fa;
    color:#344054;
}

.client-form-discount-controls input{
    height:28px;
    min-height:28px;
    border-left:none;
    border-radius:0 3px 3px 0;
    text-align:right;
}

.client-form-discount-controls span{
    padding-left:7px;
    color:#344054;
    font-size:12px;
}

.client-form-counter{
    float:right;
    color:#8a94a6 !important;
}

.client-form-tags{
    min-height:28px;
    display:grid;
    grid-template-columns:22px 1fr;
    align-items:center;
    border:1px solid #c7ced8;
    border-radius:3px;
    background:#fff;
}

.client-form-tags span{
    color:#8a94a6;
    text-align:center;
    font-size:12px;
}

.client-form-tags input{
    border:none;
    box-shadow:none;
    padding-left:0;
}

.client-form-help{
    margin-top:2px;
    color:#8a94a6;
    font-size:12px;
    line-height:1.35;
}

.client-form-help a{
    color:#1677ff;
}

.client-form-org-btn{
    width:max-content;
    min-height:29px;
    padding:5px 14px;
    border-radius:3px;
    background:#07984a;
    color:#fff;
    font-size:12px;
    font-weight:700;
}

.client-form-org-btn:hover{
    background:#087f40;
}

.client-form-org-editor{
    display:none;
    grid-template-columns:1fr 1fr auto;
    gap:8px;
    align-items:end;
}

.client-form-org-editor.show{
    display:grid;
}

.client-form-org-clear{
    min-height:28px;
    padding:5px 10px;
    border:1px solid #c7ced8;
    border-radius:3px;
    background:#fff;
    color:#344054;
    font-size:12px;
    font-weight:400;
}

.client-form-org-clear:hover{
    background:#f5f7fa;
    color:#344054;
}

.client-form-org-table{
    display:grid;
    grid-template-columns:1fr 1fr;
    color:#1f2937;
    font-size:12px;
}

.client-form-org-head{
    background:#e9ebef;
    padding:10px 8px;
}

.client-form-org-preview{
    grid-column:1 / -1;
    min-height:176px;
    display:block;
    background:#fff;
}

.client-form-org-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    border-bottom:1px solid #eef1f5;
}

.client-form-org-row div{
    min-height:34px;
    padding:9px 8px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.client-form-org-empty{
    min-height:176px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:#1f2937;
}

.client-form-org-empty-icon{
    width:96px;
    height:64px;
    margin-bottom:8px;
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(135deg, #2f83ff, #2f83ff) border-box;
    border:2px solid transparent;
    border-radius:2px;
    position:relative;
    opacity:0.85;
}

.client-form-org-empty-icon::before{
    content:"";
    position:absolute;
    left:23px;
    right:23px;
    top:23px;
    height:10px;
    border:2px solid #2f83ff;
    border-top:none;
    border-radius:0 0 8px 8px;
}

.client-form-org-empty-icon::after{
    content:"";
    position:absolute;
    inset:-17px -22px auto;
    height:26px;
    background:
        linear-gradient(#dcecff, #dcecff) 0 18px / 34px 8px no-repeat,
        linear-gradient(#dcecff, #dcecff) 70px 18px / 34px 8px no-repeat,
        linear-gradient(#8bbcff, #8bbcff) 48px 0 / 2px 15px no-repeat,
        linear-gradient(45deg, transparent 42%, #8bbcff 43% 57%, transparent 58%) 34px 4px / 16px 16px no-repeat,
        linear-gradient(-45deg, transparent 42%, #8bbcff 43% 57%, transparent 58%) 54px 4px / 16px 16px no-repeat;
}

.client-form-org-empty-title{
    font-size:14px;
    font-weight:700;
    margin-top:4px;
}

.client-form-org-empty-text{
    max-width:270px;
    margin-top:10px;
    color:#344054;
    font-size:12px;
    line-height:1.35;
}

.client-form-footer{
    position:sticky;
    bottom:0;
    margin:0;
    padding:12px;
    border-top:1px solid #dbe5f3;
    background:#eaf3ff;
    justify-content:flex-start;
    flex-shrink:0;
}

.client-form-footer .btn-secondary{
    background:#7b8698;
}

.client-form-footer #clientSaveBtn{
    min-width:72px;
    border-radius:3px;
    background:#1f6fe5;
}

.client-form-footer #clientSaveBtn:hover{
    background:#1557bb;
}

.crm-modal-root.client-drawer-root{
    padding:0;
    overflow:hidden;
}

.crm-modal-root.client-drawer-root .client-form-backdrop{
    position:fixed;
    inset:0;
    background:rgba(15,23,42,0.50);
    backdrop-filter:none;
}

.crm-modal-root.client-drawer-root .crm-modal.client-form-drawer{
    position:fixed;
    top:0;
    right:0;
    left:auto;
    transform:none;
    width:min(832px, calc(100vw - 292px));
    min-width:760px;
    height:100vh;
    max-height:none;
    max-width:none;
    border:0;
    border-left:1px solid #dbe5f3;
    border-radius:0;
    background:#fff;
    box-shadow:-10px 0 32px rgba(15,23,42,0.22);
}

.client-form-title-wrap .crm-modal-title:not(.client-form-current-title),
.client-form-subtitle{
    display:none;
}

.client-form-current-title{
    font-size:18px;
    font-weight:400;
    line-height:1.2;
}

.crm-modal-root.client-drawer-root .client-form-head{
    min-height:48px;
    padding:12px 44px 10px 14px;
    align-items:center;
    border-bottom:1px solid #e5e7eb;
}

.crm-modal-root.client-drawer-root .client-form-close{
    position:absolute;
    top:0;
    right:0;
    width:40px;
    height:48px;
    min-height:48px;
    border:0;
    border-left:1px solid #e5e7eb;
    border-radius:0;
    background:#fff;
    color:#8a94a6;
    font-size:27px;
    font-weight:300;
}

.crm-modal-root.client-drawer-root .client-form-close:hover{
    background:#f5f7fa;
    color:#344054;
}

.client-form-tabs{
    height:43px;
    display:flex;
    align-items:flex-end;
    gap:20px;
    padding:0 14px;
    border-bottom:1px solid #e5e7eb;
    background:#fff;
    flex-shrink:0;
}

.client-form-tabs button{
    min-height:42px;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    color:#344054;
    font-size:12px;
    font-weight:400;
}

.client-form-tabs button:hover,
.client-form-tabs button.active{
    background:transparent;
    color:#1677ff;
}

.client-form-tabs button.active{
    border-bottom:2px solid #1677ff;
}

.client-documents-tab-wrap{
    position:relative;
    display:flex;
    align-items:flex-end;
    min-height:42px;
}

.client-form-tabs .client-documents-tab-wrap > button{
    display:flex;
    align-items:center;
    gap:5px;
}

.client-documents-caret{
    color:inherit;
    font-size:12px;
    line-height:1;
}

.client-documents-tab-wrap.open .client-documents-caret{
    transform:rotate(180deg);
}

.client-documents-menu{
    position:absolute;
    top:42px;
    left:0;
    z-index:12;
    width:166px;
    padding:6px 0;
    border:1px solid #dce2eb;
    border-radius:3px;
    background:#fff;
    box-shadow:0 4px 12px rgba(15,23,42,.12);
    display:none;
}

.client-documents-tab-wrap.open .client-documents-menu{
    display:block;
}

.client-form-tabs .client-documents-menu button{
    width:100%;
    min-height:22px;
    padding:3px 10px;
    justify-content:flex-start;
    border:0;
    color:#344054;
    font-size:12px;
    text-align:left;
}

.client-form-tabs .client-documents-menu button:hover,
.client-form-tabs .client-documents-menu button.active{
    background:#eaf3ff;
    color:#1f2937;
}

.client-form-tabs .client-documents-menu button.active{
    border-bottom:0;
}

.client-form-content{
    min-height:0;
    flex:1 1 auto;
    display:grid;
    grid-template-columns:minmax(520px, 1fr) 254px;
}

.crm-modal-root.client-drawer-root .client-form-body{
    padding:26px 12px 72px 14px;
    overflow-y:auto;
    color:#1f2937;
    white-space:normal;
}

.crm-modal-root.client-drawer-root .client-form-section{
    grid-template-columns:210px minmax(260px, 310px);
    gap:20px;
    padding:16px 0;
    border-bottom:1px solid #e5e7eb;
}

.crm-modal-root.client-drawer-root .client-form-general-section{
    padding-top:0;
}

.crm-modal-root.client-drawer-root .client-form-section-title{
    font-size:14px;
    font-weight:400;
    color:#1f2937;
}

.crm-modal-root.client-drawer-root .client-form-manager-select{
    background:#fff;
}

.crm-modal-root.client-drawer-root .client-form-manager-avatar{
    background:#fff;
    color:#c5cbd3;
    border:1px dashed #c5cbd3;
}

.client-form-activity{
    min-height:0;
    display:flex;
    flex-direction:column;
    border-left:12px solid #dcecff;
    background:#eaf3ff;
    overflow:hidden;
}

.client-form-activity-tabs{
    display:flex;
    justify-content:center;
    gap:0;
    padding:14px 12px 8px;
    flex-shrink:0;
}

.client-form-activity-tabs button{
    min-height:29px;
    padding:5px 14px;
    border:1px solid #c7ced8;
    border-radius:0;
    background:#fff;
    color:#1f2937;
    font-size:12px;
    font-weight:400;
}

.client-form-activity-tabs button:first-child{
    border-radius:3px 0 0 3px;
}

.client-form-activity-tabs button:last-child{
    border-left:0;
    border-radius:0 3px 3px 0;
}

.client-form-activity-tabs button.active{
    background:#eef0f2;
}

.client-form-activity-date{
    text-align:center;
    color:#1f2937;
    font-size:11px;
    font-weight:700;
}

.client-form-event-list{
    flex:1 1 auto;
    padding:8px 0 74px 20px;
    overflow-y:auto;
    position:relative;
}

.client-form-event-list::before{
    content:"";
    position:absolute;
    top:12px;
    bottom:24px;
    left:20px;
    width:1px;
    background:#1677ff;
}

.client-form-event{
    position:relative;
    display:grid;
    grid-template-columns:22px 1fr;
    gap:0;
    margin:0 0 11px;
}

.client-form-event-icon{
    width:18px;
    height:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#eaf3ff;
    color:#1677ff;
    font-size:18px;
    line-height:1;
    z-index:1;
}

.client-form-event-body{
    min-width:0;
}

.client-form-event-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    font-size:11px;
    color:#1f2937;
}

.client-form-event-head span{
    color:#7b8491;
    font-size:10px;
}

.client-form-event-source{
    margin-top:4px;
    color:#344054;
    font-size:10px;
}

.client-form-event-message{
    margin-top:5px;
    padding:8px 10px;
    background:#dcecff;
    color:#344054;
    font-size:10px;
    line-height:1.35;
}

.client-form-comment{
    display:grid;
    grid-template-columns:1fr 36px;
    gap:8px;
    align-items:center;
    padding:10px 0 10px 14px;
    background:#eaf3ff;
    flex-shrink:0;
}

.client-form-comment input{
    min-height:30px;
    padding:6px 10px;
    border-radius:3px;
    font-size:12px;
}

.client-form-comment button{
    width:36px;
    min-width:36px;
    min-height:30px;
    padding:0;
    border-radius:50%;
    background:#8db8ff;
    color:#fff;
    font-size:20px;
    line-height:1;
}

.client-tab-panel[hidden]{
    display:none !important;
}

.client-balance-panel{
    padding:0 0 18px;
}

.client-balance-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:0 0 14px;
    border-bottom:1px solid #e5e7eb;
}

.client-balance-summary{
    color:#1f2937;
    font-size:18px;
    font-weight:700;
}

.client-balance-summary.debt{
    color:#b42318;
}

.client-balance-summary.overpaid{
    color:#087f40;
}

.client-balance-add-btn{
    min-height:29px;
    padding:5px 13px;
    border-radius:3px;
    background:#07984a;
    color:#fff;
    font-size:12px;
    font-weight:700;
}

.client-balance-add-btn:hover{
    background:#087f40;
    color:#fff;
}

.client-balance-operation-form{
    margin:14px 0;
    padding:12px;
    border:1px solid #dbe5f3;
    border-radius:4px;
    background:#f8fbff;
}

.client-balance-form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
}

.client-balance-form-grid label{
    display:grid;
    gap:6px;
    margin:0;
    color:#1f2937;
    font-size:12px;
    font-weight:400;
}

.client-balance-form-grid input,
.client-balance-form-grid select{
    min-height:29px;
    padding:5px 10px;
    border:1px solid #c7ced8;
    border-radius:3px;
    background:#fff;
    color:#1f2937;
    font-size:12px;
}

.client-balance-comment-field{
    grid-column:1 / -1;
}

.client-balance-form-actions{
    grid-column:1 / -1;
    display:flex;
    gap:8px;
    justify-content:flex-start;
}

.client-balance-form-actions button{
    min-height:29px;
    padding:5px 12px;
    border-radius:3px;
    font-size:12px;
}

.client-balance-history{
    margin-top:14px;
}

.client-balance-table-wrap{
    width:100%;
    overflow:auto;
    border-top:1px solid #e5e7eb;
}

.client-balance-table{
    width:100%;
    min-width:640px;
    border-collapse:collapse;
    table-layout:fixed;
}

.client-balance-table th,
.client-balance-table td{
    height:34px;
    padding:0 8px;
    border-right:1px solid #e1e6ed;
    border-bottom:1px solid #eef1f5;
    color:#111827;
    font-size:12px;
    font-weight:400;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.client-balance-table th{
    background:#eef0f2;
    text-align:left;
}

.client-balance-table th:last-child,
.client-balance-table td:last-child{
    border-right:0;
    text-align:right;
}

.client-balance-plus{
    color:#b42318 !important;
}

.client-balance-minus{
    color:#087f40 !important;
}

.client-balance-empty{
    padding:22px 0;
    color:#667085;
    font-size:13px;
}

.client-documents-panel{
    padding:0 0 18px;
}

.client-devices-panel{
    padding:0 0 18px;
}

.client-documents-content{
    min-height:330px;
}

.client-devices-content{
    min-height:330px;
}

.client-documents-head{
    display:grid;
    gap:12px;
    align-items:start;
    justify-items:start;
    padding:0 0 8px;
}

.client-documents-head h3{
    margin:0;
    color:#1f2937;
    font-size:14px;
    font-weight:700;
}

.client-documents-primary{
    min-height:29px;
    padding:5px 14px;
    border:0;
    border-radius:3px;
    background:#0a9f4b;
    color:#fff;
    font-size:12px;
    font-weight:700;
}

.client-documents-primary:hover{
    background:#087f40;
    color:#fff;
}

.client-documents-table-wrap{
    width:100%;
    overflow:auto;
}

.client-documents-table{
    width:100%;
    min-width:520px;
    border-collapse:collapse;
    table-layout:fixed;
}

.client-documents-table th,
.client-documents-table td{
    height:34px;
    padding:0 8px;
    border-right:1px solid #e1e6ed;
    border-bottom:1px solid #eef1f5;
    color:#111827;
    font-size:12px;
    font-weight:400;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.client-documents-table th{
    background:#eef0f2;
    text-align:left;
}

.client-documents-table th:last-child,
.client-documents-table td:last-child{
    border-right:0;
    text-align:right;
}

.client-documents-link{
    min-height:0;
    padding:0;
    border:0;
    background:transparent;
    color:#1677ff;
    font:inherit;
}

.client-documents-link:hover{
    background:transparent;
    color:#0f5fd0;
}

.client-documents-status{
    display:inline-flex;
    align-items:center;
    min-height:17px;
    padding:1px 7px;
    border-radius:3px;
    background:#5a6169;
    color:#fff;
    font-size:11px;
    font-weight:700;
}

.client-documents-footer{
    padding:14px 8px 0;
    color:#111827;
    font-size:12px;
}

.client-documents-footer strong{
    font-weight:400;
}

.client-documents-empty{
    min-height:230px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:#1f2937;
}

.client-documents-empty-icon{
    width:58px;
    height:42px;
    margin-bottom:14px;
    border:2px solid #2f83ff;
    border-radius:3px;
    position:relative;
    background:#fff;
}

.client-documents-empty-icon::before{
    content:"";
    position:absolute;
    left:13px;
    right:13px;
    top:16px;
    height:8px;
    border:2px solid #2f83ff;
    border-top:0;
    border-radius:0 0 8px 8px;
}

.client-documents-empty-icon::after{
    content:"";
    position:absolute;
    inset:-20px -38px auto;
    height:52px;
    background:
        linear-gradient(#dcecff, #dcecff) 0 31px / 36px 8px no-repeat,
        linear-gradient(#dcecff, #dcecff) 74px 31px / 36px 8px no-repeat,
        linear-gradient(#dcecff, #dcecff) 12px 14px / 31px 8px no-repeat,
        linear-gradient(#dcecff, #dcecff) 67px 14px / 31px 8px no-repeat,
        linear-gradient(#8bbcff, #8bbcff) 54px 0 / 2px 14px no-repeat,
        linear-gradient(45deg, transparent 42%, #8bbcff 43% 57%, transparent 58%) 39px 4px / 15px 15px no-repeat,
        linear-gradient(-45deg, transparent 42%, #8bbcff 43% 57%, transparent 58%) 57px 4px / 15px 15px no-repeat,
        radial-gradient(circle, #dcecff 0 4px, transparent 5px) 97px 40px / 10px 10px no-repeat,
        radial-gradient(circle, #dcecff 0 4px, transparent 5px) 82px 40px / 10px 10px no-repeat;
    z-index:-1;
}

.client-documents-empty-title{
    color:#1f2937;
    font-size:14px;
    font-weight:700;
}

.client-documents-empty-text{
    max-width:520px;
    margin-top:10px;
    color:#344054;
    font-size:12px;
    line-height:1.35;
}

.client-payments-panel{
    padding:0 0 18px;
}

.client-payments-actions{
    display:flex;
    align-items:center;
    gap:10px;
    padding:0 0 12px;
}

.client-payment-income-btn,
.client-payment-outcome-btn{
    min-height:29px;
    padding:5px 14px;
    border:0;
    border-radius:3px;
    color:#fff;
    font-size:12px;
    font-weight:700;
}

.client-payment-income-btn{
    background:#0a9f4b;
}

.client-payment-income-btn:hover{
    background:#087f40;
    color:#fff;
}

.client-payment-outcome-btn{
    background:#ef232d;
}

.client-payment-outcome-btn:hover{
    background:#dc111d;
    color:#fff;
}

.client-payment-operation-form{
    margin:0 0 12px;
}

.client-payment-form-grid{
    grid-template-columns:1fr 1fr 1fr;
}

.client-payments-history{
    min-height:120px;
}

.client-payments-table-wrap{
    width:100%;
    overflow:auto;
}

.client-payments-table{
    width:100%;
    min-width:520px;
    border-collapse:collapse;
    table-layout:fixed;
}

.client-payments-table th,
.client-payments-table td{
    padding:8px 8px;
    border-right:1px solid #e1e6ed;
    border-bottom:1px solid #eef1f5;
    color:#111827;
    font-size:12px;
    font-weight:400;
    vertical-align:top;
}

.client-payments-table th{
    background:#eef0f2;
    text-align:left;
}

.client-payments-table th:nth-child(1),
.client-payments-table td:nth-child(1){
    width:105px;
}

.client-payments-table th:nth-child(3),
.client-payments-table td:nth-child(3){
    width:96px;
    border-right:0;
    text-align:right;
}

.client-payment-comment-main{
    white-space:pre-line;
    overflow-wrap:anywhere;
}

.client-payment-comment-link{
    margin-top:2px;
    color:#9aa2ad;
    font-size:12px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.client-payments-footer{
    padding:12px 8px 0;
    color:#111827;
    font-size:12px;
}

.client-payments-footer strong{
    font-weight:400;
}

.crm-modal-root.client-drawer-root .client-form-footer{
    position:absolute;
    left:0;
    right:266px;
    bottom:0;
    height:54px;
    padding:10px 14px;
    border-top:1px solid #e5e7eb;
    background:#fff;
    justify-content:flex-start;
    z-index:2;
}

.crm-modal-root.client-drawer-root .client-form-footer .btn-secondary{
    display:none;
}

.crm-modal-root.client-drawer-root .client-form-footer #clientSaveBtn{
    min-width:53px;
    min-height:29px;
    padding:5px 12px;
    border-radius:3px;
    font-size:12px;
}

.client-form-delete-action{
    margin-left:auto;
    min-width:42px;
    min-height:29px;
    padding:0;
    border:none;
    border-radius:3px;
    background:#ff1f2d;
    color:#fff;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}

.client-form-delete-action:hover{
    background:#dc111d;
    color:#fff;
}

.client-form-delete-action:disabled{
    opacity:.7;
    cursor:default;
}

.client-form-delete-action svg{
    width:15px;
    height:15px;
    stroke:currentColor;
}

.client-form-org-only{
    display:none !important;
}

.client-form-modal[data-entity-type="organization"] .client-form-org-only{
    display:grid !important;
}

.client-form-modal[data-entity-type="organization"] .client-form-person-only,
.client-form-modal[data-entity-type="organization"] .client-form-field:has(#clientMiddleNameInput),
.client-form-modal[data-entity-type="organization"] .client-form-field:has(#clientLastNameInput),
.client-form-modal[data-entity-type="organization"] .client-form-field:has(#clientBirthdayDayInput){
    display:none !important;
}

.client-form-modal[data-entity-type="organization"] label[for="clientPhysicalIdentifierInput"],
.client-form-modal[data-entity-type="organization"] label[for="clientNameInput"]{
    font-size:0;
}

.client-form-modal[data-entity-type="organization"] label[for="clientPhysicalIdentifierInput"]::before{
    content:"Идентификатор компании";
    font-size:12px;
}

.client-form-modal[data-entity-type="organization"] label[for="clientNameInput"]::before{
    content:"Название компании";
    font-size:12px;
}

.client-form-modal[data-entity-type="organization"] label[for="clientNameInput"]::after{
    content:"*";
    color:#d92d20;
    font-size:12px;
}

.client-form-modal[data-entity-type="organization"] .client-form-body{
    display:flex;
    flex-direction:column;
}

.client-form-modal[data-entity-type="organization"] .client-form-general-section{ order:1; }
.client-form-modal[data-entity-type="organization"] .client-form-contact-section{ order:2; }
.client-form-modal[data-entity-type="organization"] .client-form-company-section{ order:3; }
.client-form-modal[data-entity-type="organization"] .client-form-bank-section{ order:4; }
.client-form-modal[data-entity-type="organization"] .client-form-discounts-section{ order:5; }
.client-form-modal[data-entity-type="organization"] .client-form-invited-section{ order:6; }
.client-form-modal[data-entity-type="organization"] .client-form-other-section{ order:7; }
.client-form-modal[data-entity-type="organization"] .client-form-people-section{ order:8; }

.client-form-email-row{
    display:grid;
    grid-template-columns:1fr 42px;
    gap:8px;
    align-items:center;
}

.client-form-email-action{
    min-width:42px;
    min-height:28px;
    padding:0;
    border:1px solid #c7ced8;
    border-radius:3px;
    background:#fff;
    color:#a2abb8;
    font-size:15px;
}

.client-form-email-action:hover{
    background:#f5f7fa;
    color:#7b8491;
}

.client-form-inline-check{
    width:max-content;
    display:flex;
    align-items:center;
    gap:6px;
    margin:3px 0 0;
    color:#344054;
    font-size:12px;
    font-weight:400;
}

.client-form-inline-check input{
    width:13px;
    height:13px;
    margin:0;
    accent-color:#1677ff;
}

.client-form-phone-consents{
    grid-template-columns:auto auto;
    justify-content:flex-start;
    gap:14px;
    margin:1px 0 0;
}

.client-form-phone-consents label{
    display:flex;
    align-items:center;
    gap:6px;
    margin:0;
    color:#344054;
    font-size:12px;
    font-weight:400;
}

.client-form-phone-consents input{
    width:13px;
    height:13px;
    margin:0;
    accent-color:#1677ff;
}

.client-form-modal[data-entity-type="organization"] .client-form-org-btn{
    background:#07984a;
}

.client-form-modal[data-entity-type="organization"] .client-form-org-table{
    grid-template-columns:1fr 1fr;
}

@media (max-width: 760px){
    .client-form-drawer,
    .crm-modal-root.client-drawer-root .crm-modal.client-form-drawer{
        width:100vw;
        min-width:0;
    }

    .client-form-content{
        display:block;
    }

    .client-form-activity{
        display:none;
    }

    .crm-modal-root.client-drawer-root .client-form-footer{
        right:0;
    }

    .clients-toolbar{
        align-items:flex-start;
        flex-direction:column;
    }

    .clients-toolbar-right{
        width:100%;
        justify-content:flex-end;
    }

    .clients-modal-grid{
        grid-template-columns:1fr;
    }

    .client-form-section{
        grid-template-columns:1fr;
        gap:10px;
    }

    .client-form-discount-controls{
        grid-template-columns:1fr 1fr 78px 14px;
    }

    .client-form-org-editor{
        grid-template-columns:1fr;
    }
}

.client-referrer-info{
    display:flex;
    align-items:center;
    gap:8px;
}
.client-referrer-name{
    font-size:14px;
    font-weight:500;
    color:#1e293b;
}
.client-balance-bonus-block{
    display:flex;
    align-items:center;
    gap:8px;
    padding:8px 0;
    border-bottom:1px solid #f1f5f9;
    margin-bottom:8px;
}
.client-balance-bonus-label{
    font-size:13px;
    color:#64748b;
}
.client-balance-bonus-amount{
    font-size:14px;
    font-weight:600;
    color:#16a34a;
}