.clearfix:after {
    content: "";
    display: table;
    clear: both;
}
.fleft{
    float: left;
}
.fright{
    float: right;
}
.nowrap{
    white-space: nowrap;
}
.break {
    flex-basis: 100%;
    height: 0;
}
.row{
    display:block;
}
input, button, select, textarea,
input:focus, button:focus, select:focus, textarea:focus,
input:active, button:active, select:active, textarea:active{
    outline: none;
}
.mw1366{
    max-width: 1600px;
}
.mw1280{
    max-width: 1280px;
}
.mw-full{
    width: 100%;
    max-width:100%;
}
.mr0{
    margin-right: 0 !important;
}
.w150,
.bills-search-form .field-container .input-block.w150{
    width: 150px;
}
.lead-block .input-block.mr0{
    margin-right: 0;
}
.mb20{
    margin-bottom: 20px;
}
.mt20{
    margin-top: 20px;
}
.ml20{
    margin-left: 20px;
}
.pl20{
    padding-left: 20px;
}
.pr20{
    padding-right: 20px;
}
.pt0{
    padding-top: 0 !important;
}
.f7{
    flex: 7 !important;
}
.f73{
    flex: 7.3 !important;
}
.f6{
    flex: 6 !important;
}
.f4{
    flex: 4 !important;
}
.f3{
    flex: 3 !important;
}
.f2{
    flex: 2 !important;
}
.f1-5{
    flex: 1.5 !important;
}
.f07{
    flex: 0.7 !important;
}
.f05{
    flex: 0.5 !important;
}
.f04{
    flex: 0.4 !important;
}
.f03{
    flex: 0.3 !important;
}
.zi10101{
    z-index: 10101 !important;
}
.zi10102{
    z-index: 10102 !important;
}
.zi10111{
    z-index: 10111 !important;
}
.action-disabled{
    opacity: 0.7;
    cursor: not-allowed !important;
}
.overflow-hidden{
    overflow: hidden !important;
}
.action-disabled svg path{
    fill: #CDD4D9;
}
#result-search-list .manager-search.mw1366{
    max-width: 1600px;
}
.al-leeds-page .hide,
.al-client-info .hide{
    display: none;
}
.pointer{
    cursor: pointer;
}
.mb-title{
    display: none;
}
.nowrap{
    white-space: nowrap;
}
.al-popup-fix{
    z-index: 100;
}
.action-line{
    display:flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}
#result-search-list .container-search-result{
    padding-top: 0px;
    padding-bottom:0px;
    background: #fff;
}
#result-search-list h1.title-search-result{
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: normal;
    font-size: 34px;
    line-height: 41px;
}

.favorite-viewed-tab{
    border-bottom: solid 1px #cdd4d9;
    margin: 0 20px 20px;
}
.favorite-viewed-tab a{
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
    color: #FC6B40;
    padding-bottom: 7px;
    display: inline-block;
    margin-right: 20px;
    border-bottom: 2px solid rgba(0,0,0,0);
}
.favorite-viewed-tab a:hover,
.favorite-viewed-tab a.active{
    border-bottom: 2px solid #fc6b40;
    color: #3D445C;
}

.content-block{
    margin: 20px;
}
.content-block h2,
.content-block .h2{
    font-size: 25px;
    margin-top: 3px;
    margin-bottom: 34px;
}
.header-block{
    display: flex;
    flex-flow: row wrap;
}
.search-block{
    flex: 1;
}
.right-block{
    flex: 1;
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-end;
    padding-top: 21px;
}
.show-block{
    margin-right: 13px;
}
.switcher-block{
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-end;
    margin-top: 10px;
}
.switcher-block .switcher-label{
    margin-top: 4px;
    padding-right: 10px;
}

/** apple checkbox */
input[type="checkbox"].ios8-switch {
    position: absolute;
    margin: 8px 0 0 16px;
}
input[type="checkbox"].ios8-switch + label {
    position: relative;
    padding: 5px 0 0 50px;
    line-height: 2.0em;
    cursor: pointer;
}
input[type="checkbox"].ios8-switch + label:before {
    content: "";
    position: absolute;
    display: block;
    left: 0;
    top: 0;
    width: 40px; /* x*5 */
    height: 24px; /* x*3 */
    border-radius: 16px; /* x*2 */
    background: #E8EBED;
    border: 1px solid #d9d9d9;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    cursor: pointer;
}
input[type="checkbox"].ios8-switch + label:after {
    content: "";
    position: absolute;
    display: block;
    left: 0px;
    top: 0px;
    width: 24px; /* x*3 */
    height: 24px; /* x*3 */
    border-radius: 16px; /* x*2 */
    background: #fff;
    border: 1px solid #d9d9d9;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    cursor: pointer;
}
input[type="checkbox"].ios8-switch + label:hover:after {
    box-shadow: 0 0 5px rgba(0,0,0,0.3);
}
input[type="checkbox"].ios8-switch:checked + label:after {
    margin-left: 16px;
}
input[type="checkbox"].ios8-switch:checked + label:before {
    background: #55D069;
}
/** end apple checkbox */


.add-block{
}
form.input-block{
    width: 340px;
}
#leads_search{
    background: /*#F6F7F9*/ white;
    border: 1px solid #CDD4D9;
    box-sizing: border-box;
    border-radius: 3px;
    width: 100%;
    height: 42px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    padding: 0 11px;
}
.clear-search{
    position: absolute;
    right: 15px;
    top: 36px;
    width: 12px;
    height: 12px;
    cursor: pointer;
}
.clear-search.hide{
    display: none;
}
.new-btn, .new-btn-custom{
    /*width: 108px;*/
    height: 42px;
    box-sizing: border-box;
    border-radius: 4px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    padding: 14px 24px;
    text-align: center;
    color: white;
    background: #FC6B40;
    border: none;
    display: inline-block;
}

.def-custom-btn {
    /* Common styles */
    height: 42px;
    box-sizing: border-box;
    border-radius: 4px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    padding: 14px 24px;
    text-align: center;
    background: #FC6B40;
    color: white;
    border: none;
    display: inline-block;
}


.new-btn:hover, .new-btn2-custom:hover{
    color: white;
}

.al-overlay3{
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    background: rgba(29, 29, 33, 0.8);
    z-index: 10001;
}
.sub-overlay{
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    background: rgba(29, 29, 33, 0.8);
    z-index: 10001;
}
.al-overlay3.hide{
    display: none;
}
.lead-add-popup,
.retail-price-edit-popup,
.confirm-popup,
.application-form-popup,
.control-layout-popup,
.multiple-control-layout-popup,
.application-form2-popup,
.bill-add-popup,
.default-popup,
.change-popup{
    width: 600px;
    height: 532px;
    position: fixed;
    left: 50%;
    top: 50%;
    margin-top: -266px;
    margin-left: -300px;
    z-index: 10002;
    border-radius: 10px;
    display: none;
    background: white;
}
.lead-add-popup {
    height: auto;
    margin-top: 0;
    top: 50%;
    transform: translateY(-50%);
}
.confirm-popup{
    width: 440px;
    height: 230px;
    margin-top: -165px;
    margin-left: -220px;
    z-index: 110002;
}
.confirm-popup.alert-mode .confirm-action {
    text-align: right;
}
.confirm-popup.alert-mode a.cancel {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #FC6B40;
    color: #FFFFFF !important;
    border: none;
    border-radius: 4px;
    padding: 10px 30px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.2s;
}
.confirm-popup.alert-mode a.cancel:hover {
    background: #E55A2E;
}
.confirm-popup2{
    width: 440px;
    height: auto;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    z-index: 10002;
    border-radius: 10px;
    display: none;
    background: white;
}
.application-form-popup,
.control-layout-popup,
.application-form2-popup{
    width: 600px;
    height: auto;
    margin:0;
    transform: translateY(-50%)  translateX(-50%);
}

.multiple-control-layout-popup {
    width: 900px;
    height: auto;
    margin:0;
    transform: translateY(-50%)  translateX(-50%);
}

.bill-add-popup{
    width: 600px;
    height: 503px;
    margin-left:0;
    margin-top:0;
    transform: translateX(-50%) translateY(-50%);
}
.change-popup{
    width: 350px;
    height: 240px;
    margin-left:0;
    margin-top:0;
    transform: translateX(-50%) translateY(-50%);
    display:block;
}
.default-popup{
    width:auto;
    height:auto;
    margin-left:0;
    margin-top:0;
    display:block;
    z-index:10102;
    transform: translateX(-50%) translateY(-50%);
}
.default-popup.hide{
    display: none !important;
}
/* Специфичные правила для модалок задач - чтобы они точно скрывались */
#tasks-day-modal.hide,
.task-popup-create.hide,
.task-popup-edit.hide,
.task-postpone-popup.hide,
.task-complete-popup.hide {
    display: none !important;
    visibility: hidden !important;
}
select.change-manager{
    width: 290px;
}
/*.application-form2-popup{
  width: 600px;
  height: 245px;
  margin-left: -300px;
  margin-top: -123px;
}*/
.confirm-popup a,
.confirm-popup2 a,
.application-form-popup a,
.control-layout-popup a,
.multiple-control-layout-popup a,
.application-form2-popup a,
.application-deactivate-popup a,
.bill-add-popup a{
    display: inline-block;
}
.confirm-popup a.yes,
.confirm-popup2 a.yes,
.application-deactivate-popup a.yes{
    color: white;
    width: 111px;
}
.application-form-popup a.yes,
.control-layout-popup a.yes,
.multiple-control-layout-popup a.yes,
.application-form2-popup a.yes,
.bill-add-popup a.yes{
    color: white;
}
.confirm-popup a.cancel,
.confirm-popup2 a.cancel,
.application-form-popup a.cancel,
.control-layout-popup a.cancel,
.multiple-control-layout-popup a.cancel,
.application-form2-popup a.cancel,
.application-deactivate-popup a.cancel,
.bill-add-popup a.cancel{
    color: #FC6B40;
    width: 111px;
}
.lead-add-header,
.confirm-header,
.application-form-header,
.control-layout-header,
.bill-add-header,
.status-header,
.change-popup-header,
.default-popup-header,
.change-sum-header,
.returned-header,
.import-block-header,
.import-block-outdoor-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 70px;
    border-bottom: solid 1px #E8EBF1;
    box-sizing: border-box;
    font-size: 24px;
    padding: 0 30px;
}
.lead-add-header .close,
.confirm-header .close,
.application-form-header .close,
.control-layout-header .close,
.bill-add-header .close,
.status-header .close,
.returned-header .close,
.change-sum-header .close,
.default-popup-header .close,
.change-popup-header .close,
.import-block-header .close,
.import-block-outdoor-header .close-outdoor{
    cursor: pointer;
}
.confirm-body,
.application-form-body,
.control-layout-body,
.bill-add-body,
.status-body,
.returned-body,
.change-sum-body,
.default-popup-body,
.change-popup-body,
.import-block-body,
.import-block-outdoor-body{
    padding: 20px 30px 30px;
}
.application-form-message{
    /*padding-bottom: 20px;*/
}
.confirm-message{
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    padding-bottom: 20px;
}
.lead-add-form,
.contacts-add-form,
.contracts-add-form,
.contacts-edit-form,
.status-form,
.returned-form,
.change-sum-form,
.number-form,
.change-popup-body form{
    padding: 20px 30px 30px;
}
.lead-add-form .field-container,
.status-form .field-container,
.returned-form .field-container,
.change-sum-form .field-container,
.contacts-add-form .field-container,
.contracts-add-form .field-container,
.contacts-edit-form .field-container,
.application-form-popup .field-container,
.application-form2-popup .field-container,
.bill-add-body .field-container,
.bill-add-sideblock .field-container,
.add-supplier-bill .field-container,
.payment-sideblock .field-container,
.photoreports-popup2 .field-container{
    display: flex;
    justify-content: space-between;

}
.align-right{
    text-align: right;
}
.clear-new,
.cancel{
    height:  42px;
    box-sizing: border-box;
    border-radius: 4px;
    border: 1px solid #CDD4D9;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 39px;
    text-align: center;
    color:  #FC6B40;
    background: white;
    padding:  0 14px;
    /*margin-right: 20px;*/
}
/*.leads-progress{
  float: right;
  display: block;
  margin-top: 13px;
}*/

.success-mesage{
    font-size: 13px;
    line-height: 16px;
    padding: 22px 20px;
    background: #FFF0EC;
    border-radius: 10px;
    border: solid 1px #CDD4D9;
    position: fixed;
    bottom: 20px;
    left: 50%;
    opacity: 0;
    transform: translateX(-50%);
}
.success-mesage a{
    color:  #FC6B40;
}
.success-mesage .notify-close{
    position: absolute;
    top: 5px;
    right: 5px;
    cursor: pointer;
    font-size: 20px;
}

.leads-table{
    /*float: left;*/
    box-sizing: border-box;
    /*width: calc(100% - 360px);*/
}

.leads-thead,
.leads-row{
    display: flex;
    overflow: visible;
}
.leads-thead{
    border-bottom: solid 1px #cdd4d9;
}
.leads-thead .leads-col{
    cursor: pointer;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 11px;
    line-height: 13px;
    text-transform: lowercase;
    color: #3D445C;
    padding: 12px 6px;
    display: flex;
    align-items: center;
}
.leads-thead .leads-col svg.up path:nth-child(2){
    fill: white;
}
.leads-thead .leads-col svg.down path:nth-child(1){
    fill: white;
}
.leads-thead .leads-col:hover svg path{
    fill: #3D445C !important;
}
/*.leads-thead .leads-col .al-rotate.up{
  transform: rotate(180deg);
}
.leads-thead .leads-col:hover .al-rotate{
  display: inline;
}
.leads-thead .leads-col.active:hover .al-rotate.down{
  transform: rotate(180deg);
}
.leads-thead .leads-col.active:hover .al-rotate.up{
  transform: rotate(0deg);
}*/
.leads-main-row{
    border-bottom: #CDD4D9 solid 1px;
    overflow: visible;
}
.leads-main-row.current{
    background: #F9F9FA;
}
.leads-main-row.current .up-down svg{
    transform: rotateZ(180deg);
}
.leads-row{
    cursor: pointer;
}
.leads-main-row:nth-child(2n+1) .leads-row{
    /*background: #f4f4f4;*/
}
.leads-row.current,
.leads-main-row:nth-child(2n+1) .leads-row.current{
    /*background: #e0e0e0;*/
}
.leads-col{
    flex: 1;
    min-width: 0;
    overflow: hidden;
    box-sizing: border-box;
    padding: 6px;
    align-items: center;
    align-self: center;
}
.leads-main-row .leads-col{
    padding:  24px 6px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    position: relative;

}
.leads-col.action-col{
    padding: 0 !important;
    flex: 0 0 38px !important;
    text-align: center;
    position: relative;
    overflow: visible;
}

/* Leads row kebab menu (desktop table) */
.leads-row-more {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
    border: 1px solid #CDD4D9;
    border-radius: 4px;
    cursor: pointer;
}
.leads-row-more:hover,
.leads-row-more.active {
    background: #F6F7F9;
}
.leads-row-dropdown {
    display: none;
    position: absolute;
    right: 20px;
    top: 100%;
    width: 205px;
    background: #fff;
    border: 1px solid #E0E4EA;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    z-index: 1000;
}
.leads-row-dropdown.open {
    display: block;
}
.leads-row-dropdown-item {
    display: flex !important;
    align-items: center;
    gap: 8px;
    padding: 10px 16px !important;
    font-size: 14px;
    color: #3D445C;
    text-decoration: none;
    border-bottom: 1px solid #f5f5f5;
    border-left: none !important;
    border-right: none !important;
    border-top: none !important;
    cursor: pointer;
    width: auto !important;
    height: auto !important;
    border-radius: 0 !important;
    position: static !important;
}
.leads-row-dropdown-item:last-child {
    border-bottom: none;
}
.leads-row-dropdown-item:hover {
    background: #F6F7F9;
}
.leads-col.lead-name{
    padding-left: 0;
}
.al-clients-page .leads-col.lead-name {
    position: relative;
    padding-left: 46px !important;
}
.al-clients-page .leads-col.lead-name .up-down {
    position: absolute;
    left: 6px;
    top: 50%;
    transform: translateY(-50%);
    margin-right: 0;
}
.al-leads-page .leads-col.lead-name,
.al-leeds-page .leads-col.lead-name {
    position: relative;
    padding-left: 46px !important;
}
.al-leads-page .leads-col.lead-name .up-down,
.al-leeds-page .leads-col.lead-name .up-down {
    position: absolute;
    left: 6px;
    top: 50%;
    transform: translateY(-50%);
    margin-right: 0;
}
.al-clients-page .leads-col.lead-name .client-name-text {
    flex: 1 1 0;
}
.al-clients-page .leads-col.lead-name .client-class-group {
    margin-top: 0;
}
.al-clients-page .leads-col.lead-name .client-chaport-ai-icon {
    display: inline-block;
}
.al-clients-page .leads-col.lead-name .class-icon {
    margin-top: 4px;
}
.al-clients-page .leads-col.lead-name {
    flex: 1.4 !important;
}
.al-clients-page .leads-col.with-filter {
    flex: 0 0 95px !important;
}
.leads-col.binotel-info.binotel-call-type{
    flex: 0 0 50px;
    text-align: center;
}
.leads-col span.up-down{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    min-width: 30px;
    border: 1px solid #E0E4EA;
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
    margin-right: 10px;
    transition: background 0.15s, border-color 0.15s;
}
.leads-col span.up-down:hover {
    background: #F6F7F9;
    border-color: #C8CDD8;
}
.leads-col span.up-down:active {
    background: #ECEEF2;
    border-color: #B0B6C3;
}
.leads-main-row.current .leads-col span.up-down svg {
    transform: rotate(180deg);
    transition: transform 0.2s;
}
.leads-col a.del_,
.action-col a.del_,
.action-col a.more-action{
    display: inline-block;
    cursor: pointer;
    /*position: absolute;
  top: 16px;
  right: 3px;*/
    width: 30px;
    height: 30px;
    border: solid 1px #CDD4D9;
    border-radius: 4px;
    padding: 5px;
    position: relative;
}
.action-col a.more-action{
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #E0E4EA;
    border-radius: 6px;
    padding: 0;
}
.action-col a.more-action.active{
    background: #F6F7F9;
}
.action-col a.more-action:hover { background: #F6F7F9; border-color: #C8CDD8; }
.action-col a.more-action:active { background: #ECEEF2; border-color: #B0B6C3; }
.leads-col .city-counts{
    background: #CDD4D9;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 4px 0 0;
    border-radius: 4px;
    font-size: 12px;
    line-height: 1;
}
.leads-col a.edit,
.action-col a.edit,
.action-col a.download{
    cursor: pointer;
    /*position: absolute;
  top: 16px;
  right: 29px;*/
    display: inline-block;
    width: 30px;
    height: 30px;
    border: solid 1px #CDD4D9;
    border-radius: 4px;
    padding: 5px;
}
.action-col a.edit,
.action-col a.download{
    margin-right: 10px;
}
.leads-row-selects{
    padding: 0 20px 20px;
    /*border: solid 1px #e0e0e0;*/
    /*border-top: none;*/
    /*background: #fafafa;*/
}
.no-selection{
    background: white;
    text-align: center;
    padding: 43px;
}
.no-selection span{
    color: #8B8F9D;
}
.no-selection span.no-data-title{
    color: #3D445C;
}
.leads-selections{
    background: white;
    padding:  20px;
    padding-bottom: 0;
    margin-bottom: 20px;
}
.selection-item{
    display: flex;
    border-bottom: solid 1px #f0f0f0;
    border-top: none;
    background: white;
    padding:  16px 20px;
}
.selection-item:last-child{
    border: none;
}
.selection-item .selection-col{
    flex: 1;
    padding: 6px;
}
.selection-col-delete .delete-selection {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border: 1px solid #E0E4EA;
    border-radius: 6px;
    background: transparent;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}
.selection-col-delete .delete-selection:hover { background: #F6F7F9; border-color: #C8CDD8; }
.selection-col-delete .delete-selection:active { background: #ECEEF2; border-color: #B0B6C3; }
.selection-head{
    /*background: #f0f0f0;*/
    padding-top: 0;
}
.selection-item.pointer:hover{
    background: #FFF0EC;
}
.leads-selections a:hover{
    color: #3e445b;
}
.no-data{
    background: #F6F7F9;
    border-radius: 4px;
    height: 254px;
    text-align: center;
    box-sizing: border-box;
    padding-top: 54px;
    float: left;
    margin-right: 20px;
    width: /*calc(100% - 360px)*/ 100%;
    margin-top: 20px;
}
.eye{
    margin: 0px auto 17px;
    display: block;
}
.no-data-title{
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 21px;
    text-align: center;
    color: #3D445C;
    margin: 17px auto 9px;
    display: block;
}
.no-data-text{
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    line-height: 16px;
    text-align: center;
    color: #8B8F9D;
}
.to-client{
    text-align: right;
    padding-top: 20px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.to-client-action{
    color: #FC6B40 !important;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 42px;
    padding: 0 16px;
    border: 1px solid #E0E4EA;
    border-radius: 8px;
    background: #fff;
    font-size: 13px;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    white-space: nowrap;
}
.to-client-action:hover{
    color: #FC6B40 !important;
    text-decoration: none;
    background: #FFF0EC;
    border-color: #FC6B40;
}
.to-client-action svg,
.visibility-change svg {
    margin-right: 5px;
    flex-shrink: 0;
}
.no-selection-action{
    display: flex;
    dlex-flow: row wrap;
    justify-content: center;
    align-items: center;
    margin-top: 17px;
}
.add-form-basket,
.go-to-search-for-contragent,
.add-form-file{
    cursor: pointer;
}
.add-form-file-outdoor{
    cursor: pointer;
}
.add-by-id{
    cursor: pointer;
}
.selection-shadow{
    height: 34px;
    background: url(../img/shadow.png) left bottom repeat-x;
    margin-left: -20px;
    margin-right: -20px;
}
.selections-actions-block{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 20px;
}
.selections-actions-block > span{
    display: none;
}
.new-flex-link{
    display: flex;
    align-items: center;
    margin-right: 16px;
    cursor: pointer
}
.new-flex-link svg{
    margin-right: 5px;
}

#result-search-list .result-paginator .btn-show-more-leads {
    width: 100%;
    background: #f76a47;
}
.leads-form{
    float: right;
    width: 340px;
}
.field-container .input-block,
.leads-form .input-block,
.search-block .input-block {
    margin-right: 15px;
    margin-bottom: 15px;
    position: relative;
}
.field-container .input-block {
    margin-right: 0;
    margin-bottom: 20px;
}
.field-container .input-block label,
.leads-form .input-block label,
.search-block .input-block label,
.left-block .input-block label,
.field-container .input-block .error,
.leads-form .input-block .error,
.input-block .error{
    display: block;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #ADB0B9;
    margin-bottom: 5px;
}
.leads-form .input-block .error,
.input-block .error{
    color: #FC6B40;
}
.field-container .input-block input,
.leads-form .input-block input,
.left-block .input-block input  {
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
    box-sizing: border-box;
    border-radius: 3px;
    width: 340px;
    height: 42px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    padding: 0 11px;
}
.field-container .input-block input{
    width: 263px;
}
.field-container .input-block input.data-error,
.leads-form .input-block input.data-error,
.input-block input.data-error,
.input-block .select2.data-error{
    border: solid 1px #FC6B40;
}
.contacts-add-form form .input-block input + span.error{
    color: #FC6B40;
    width: 263px;
}
.field-container .input-block textarea,
.leads-form .input-block textarea{
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
    box-sizing: border-box;
    border-radius: 3px;
    width: 340px;
    height: 126px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    padding: 12px 11px;
}
.field-container .input-block textarea{
    width: 540px;
    height: 80px;
    resize: none;
}
/*select2-container {
  border: 1px solid #CDD4D9;
  box-sizing: border-box;
  border-radius: 3px;
  padding: 0 20px 0 11px;
  width: 340px;
  height: 42px;
  font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
  font-style: normal;
  font-weight: 500;
  font-size: 13px;
  line-height: 16px;
  color: #3D445C;
  background: #F6F7F9;
}*/
.leads-form .input-block .select2-selection__rendered{
    height: auto;
    background: #F6F7F9;
    flex-wrap: wrap;
}
/*.select2-dropdown--below{
  width: 340px !important;
}*/
.leads-form .input-block .select2-selection--multiple{
    width: 340px;
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
}
.leads-form .input-block .select2-selection--multiple.data-error{
    border: solid 1px #FC6B40;
}
.submit,
.yes{
    /*width: 108px;*/
    height:  42px;
    box-sizing: border-box;
    border-radius: 4px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 39px;
    text-align: center;
    color:  #fff;
    background: #FC6B40;
    border: none;
    padding:  0 14px;
}
.submit:hover,
.yes:hover{
    color: white;
}
.lead-add-form .submit{
    padding:  0 24px;
}
#clear_button{
    height:  42px;
    box-sizing: border-box;
    border-radius: 4px;
    border: 1px solid #CDD4D9;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 39px;
    text-align: center;
    color:  #3D445C;
    background: #fff;
    padding:  0 14px;
    margin-right: 20px;
}
.pagination{
    margin-top: 11px;
    margin-bottom: 11px;
}
.page-link{
    height: 42px;
    line-height: 42px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-size: 13px;
    padding-top: 0;
    padding-bottom: 0;
    color: #3D445C;
}
.page-item.active .page-link,
.page-link:hover{
    background: #FC6B40;
    border-color: #FC6B40;
    color: #fff;
}

/* Magnific popup  */
.mfp-bg{
    background: #ccc;
    z-index: 1000;
}
.mfp-wrap{
    z-index: 1002;
}
button.mfp-close{
    z-index: 1003;
}
.mfp-ajax-holder .mfp-content{
    /*overflow-x: scroll;*/
}
.mfp-container{
    padding: 0 20px;
}
.mfp-content{
    background: #fff;
    padding: 20px;
    border-radius: 8px;
}
/* Selection items */
.selection-items-table{
    display: table;
    margin-bottom: 20px;
}
.selection-items-head,
.selection-items-body{
    display: table-header-group
}
.selection-items-row{
    display: table-row;
}
.selection-items-col{
    display: table-cell;
    padding: 5px;
    border-bottom: 1px solid #dee5ec;
}
.col-id{
    width: 100px;
}
/*.break-words{
  width: 200px !important;
}-
.break-words a{
  word-wrap: break-word;
  word-break: break-all;
}*/

/* всякие приблуды */
.image-wrapper {
    position: relative;
    width: max-content;
}
.image-wrapper:hover .light-info {
    opacity: 1;
    visibility: visible;
}
.image-wrapper .light-info{
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    position: absolute;
    bottom: 148%;
    left: calc(-85px + 50%);
    visibility: hidden;
    transition: all 0.4s;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    background-color: white;
    height: 25px;
    width: 170px;
    box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.25);
}
.image-wrapper .light-info:before{
    content: "";
    border-color: transparent #ffffff #ffffff transparent;
    border-style: solid;
    border-width: 5px;
    width: 0;
    height: 0;
    position: absolute;
    top: 80%;
    left: 48%;
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    box-shadow: 1px 1px 2px -1px rgba(0, 0, 0, 0.5)
}
.image-wrapper .light-info span {
    color: #ef7242;
    margin-left: 3px;
}
.col-image .img{
    cursor: pointer;
}
/* Calendar */
.col-busy {
    position: relative;
    overflow: visible !important;
    padding-left: 12px;
    cursor: pointer;
}
.col-busy:hover .busy-calendar{
    display: block;
}
.busy-calendar {
    position: absolute;
    bottom: 80%;
    display: none;
    width: 297px;
    padding: 20px 25px 24px 25px;
    border-radius: 3px;
    background: white;
    box-shadow: 0 4px 20px 1px rgba(177, 177, 177, .5);
    cursor: auto;
    z-index: 100;
}
.busy-calendar::before {
    position: absolute;
    bottom: -13px;
    left: 19px;
    border: 13px solid transparent;
    border-left-color: transparent;
    border-left-style: solid;
    border-left-width: 13px;
    border-left: 10px solid white;
    content: '';
}
.busy-calendar .title-calendar {
    margin-bottom: 8px;
    font-size: 13px;
    font-weight: bold;
}
.busy-calendar .wrapp-busy-table {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
.wrapp-busy-table .month{
    position: relative;
    cursor: pointer;
    width: 16.6%;
    box-sizing: border-box;
    border: 1px solid transparent;
}
.wrapp-busy-table .month a{
    display: block;
    padding: 6px 0;
    text-align: center;
    outline: none;
}
.wrapp-busy-table .month.pre-order {
    background-color: #e6ecf2;
}
.wrapp-busy-table .month.reserve {
    background-color: #fed648;
}
.wrapp-busy-table .month.busy {
    background-color: #e84a56;
}
.wrapp-busy-table .month.free {
    background-color: #55bc4f;
}
.busy-calendar .month:nth-child(1) {
    border-top-left-radius: 3px;
}
.busy-calendar .month {
    position: relative;
    cursor: pointer;
    width: 16.6%;
    box-sizing: border-box;
    border: 1px solid transparent;
}
.wrapp-busy{
    display: flex;
    flex-direction: row;
}
.wrapp-busy .block{
    width: 100%;
    height: 4px;
}
.wrapp-busy .block:first-child {
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
}
.wrapp-busy .block:last-child {
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
}
.wrapp-busy .pre-order{
    background-color: #e6ecf2;
}
.wrapp-busy .reserve{
    background-color: #fed648;
}
.wrapp-busy .busy{
    background-color: #e84a56;
}
.wrapp-busy .free{
    background-color: #55bc4f;
}
.section-items-button{
    height: 42px;
    box-sizing: border-box;
    border-radius: 4px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 39px;
    text-align: center;
    color: #fff;
    background: #FC6B40;
    border: none;
    padding: 0 14px;
}
#toast-container{
    z-index: 1000000;
}
.hoverImg{
    position: relative;
}
.col-image{
    position: relative;
}
.hoverImg ~ .al-popup-image{
    display: none;
    width: 450px;
    height: 200px;
    object-fit: cover;
    position: absolute;
    left: 15px;
    top: 25px;
    z-index: 2;
}
.hoverImg:hover ~ .al-popup-image{
    display: block;
}

/* Export to excel */
.dwn-button{
    height: 42px;
    box-sizing: border-box;
    border-radius: 4px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 39px;
    text-align: center;
    color: #fff;
    background: #FC6B40;
    border: none;
    padding: 0 14px;
}
.dwn-button:hover{
    color: #fff;
}
.excel_setting{
    display: none;
    width: 500px;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 10px;
    z-index: 110002 !important;
    box-shadow: 0 4px 24px rgba(0,0,0,0.15);
}
.export-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 50px;
    border-bottom: solid 1px #E8EBF1;
    box-sizing: border-box;
    padding: 0 20px;
}
.export-header span{
    font-size: 16px;
    font-weight: 600;
    color: #3D445C;
}
.export-header svg{
    fill: #3D445C;
    width: 14px;
    height: 14px;
    cursor: pointer;
}
.excel_setting .checboxes{
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 16px 20px;
    gap: 4px 20px;
    max-height: 50vh;
    overflow-y: auto;
}
.excel_setting .checboxes .checkbox-block{
    width: auto;
    padding: 5px 0;
    display: flex;
    align-items: center;
    gap: 8px;
}
.excel_setting .checboxes .checkbox-block input[type=checkbox]{
    appearance: none;
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    min-width: 18px;
    border: 1px solid #dee5ec;
    border-radius: 3px;
    background: #fafbfc;
    cursor: pointer;
    margin: 0;
    position: relative;
    transition: background 0.2s, border-color 0.2s;
}
.excel_setting .checboxes .checkbox-block input[type=checkbox]:checked{
    background: #FC6B40;
    border-color: #FC6B40;
}
.excel_setting .checboxes .checkbox-block input[type=checkbox]:checked::after{
    content: '';
    position: absolute;
    top: 2px;
    left: 5px;
    width: 5px;
    height: 9px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.excel_setting .checboxes .checkbox-block label{
    font-size: 13px;
    color: #3D445C;
    cursor: pointer;
    white-space: nowrap;
}
.excel_setting .dwn-button{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 180px;
    height: 38px;
    background: #FC6B40;
    color: #fff !important;
    border: none;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.2s;
    margin: 0 20px 16px auto;
}
.excel_setting .dwn-button:hover{
    background: #E55A2E;
}
#result-search-list{
    background: #fff;
}
#result-search-list .manager-search.client-details-container{
    max-width: 1050px;
}
#result-search-list .manager-search.client-details-container .title-search-result{
    padding: 0;
}
.content-block.content-details{
    margin-left: 0;
    margin-right: 0;
}
.details-tabs{
    margin: 0 0 20px;
}
.details-tabs-header{
    margin: 0 0 20px;
    border-bottom: solid 1px #cdd4d9;
}
.details-tabs-header a{
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
    color: #FC6B40;
    padding-bottom: 7px;
    display: inline-block;
    margin-right: 20px;
    border-bottom: 2px solid rgba(0,0,0,0);
}
.details-tabs-header a:hover,
.details-tabs-header a.active{
    border-bottom: 2px solid #fc6b40;
    color: #3D445C;
}
.tab-block .h2{
    font-size: 24px;
    line-height: 28px;
    margin-bottom: 14px;
    display: block;
}
.input-group{
    border-bottom: solid 1px #e6e9ec;
    margin-bottom:  25px;
    padding-bottom: 15px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.input-group .input-block {
    margin-right: 15px;
    margin-bottom: 15px;
    position: relative;
}
.input-group .input-block:nth-child(3n) {
    margin-right: 0;
}
.input-group .input-block.ib-break{
    width: calc(100% - 400px);
}
.input-group .input-block label,
.input-group .input-block .error{
    display: block;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #ADB0B9;
    margin-bottom: 5px;
}
.input-group .input-block .error{
    color: #FC6B40;
}
.input-group .input-block input {
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
    box-sizing: border-box;
    border-radius: 3px;
    width: 340px;
    height: 42px;
    font-family: /*'Helvetica Neue', Helvetica, 'helvetica',*/ Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    padding: 0 11px;
}
.input-group .input-block.w340{
    width: 340px;
}
.input-group .input-block.w680{
    width: 680px;
}
.input-group .input-block input.data-error{
    border: solid 1px #FC6B40;
}
.input-group .input-block input.index{
    width: 150px;
}
.input-group .input-block input.address{
    width: 505px;
    margin-right: 15px;
}
.input-group .input-block input.full_name{
    width: 695px;
}
.buttons-block{

}
.client-details-note{
    float: left;
    font-size: 13px;
    line-height: 39px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
}
.client-details-submit{
    height: 42px;
    width: 180px;
    box-sizing: border-box;
    border-radius: 4px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 39px;
    text-align: center;
    color: #fff;
    background: #FC6B40;
    border: none;
    padding: 0 14px;
    float: right;
}
.lead2client{
    height: 42px;
    box-sizing: border-box;
    border-radius: 4px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 39px;
    text-align: center;
    color: #fff;
    background: #FC6B40;
    border: none;
    padding: 0 29px 0 14px;
    display: inline-block;
    position: relative;
}
.lead2client:hover{
    color: #fff;
}
.lead2client svg{
    position: absolute;
    right:  6px;
    top: 8px;
}
.get-edrpou-start,
.get-edrpou,
.ur2post,
.ncl,
.ncl-2{
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 24px;
    color: #FC6B40 !important;
    display: block;
    cursor: pointer;
    text-decoration: underline !important;
    /*width: 100%;*/
}
.ur2post,
.ncl{
    display: flex;
    align-items: center;
    text-decoration: none !important;
}
.ur2post.hide,
.ncl.hide{
    display: none;
}
.ur2post svg,
.ncl svg{
    margin-right: 5px;
}
.ur2post:hover,
.ncl:hover,
.ncl-2:hover{
    text-decoration: none !important;
}
.get-edrpou-start{
    margin-top: 5px;
}
.tax-status{
    width: 340px;
}
.input-group .input-block.w680 .tax-status,
.input-group .input-block.w680 .select2-container{
    width: 680px !important;
}
#result-search-list .manager-search.client-info-container{
    /*max-width: 1050px;*/
    max-width: 1112px;
}
#result-search-list .manager-search.client-info-container .title-search-result{
    padding: 0;
}
.content-block.content-info{
    margin-left: 0;
    margin-right: 0;
}
.content-info .input-block{
    margin-top: 15px;
}
.crm-button{
    height: 42px;
    box-sizing: border-box;
    border-radius: 4px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 39px;
    text-align: center;
    color: #fff;
    background: #FC6B40;
    border: none;
    padding: 0 14px;
    outline: none;
}
.crm-button[disabled]{
    color: #E2D7D4;
    background: #C5B0AA;
}
.crm-button-default,
.crm-button-cancel{
    border: 1px solid #CDD4D9;
    background: #fff;
    color: #3D445C;
}
.crm-button:focus{
    outline: none;
}
.input-block .crm-button{
    margin-top: 20px;
}
.conacts-list{
    display: flex;
    flex-wrap: wrap;
    position: relative;
}
.contact-item{
    width: 340px;
    margin-right: 15px;
    margin-bottom: 25px;
    position: relative;
}
.contact-item:nth-child(3n){
    margin-right: 0px;
}
.contact-item .input-block{
    margin-bottom: 15px;
}
.contact-item .input-block label,
.contact-item .input-block .error{
    display: block;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #ADB0B9;
    margin-bottom: 5px;
}
.contact-item .input-block .error{
    color: #FC6B40;
}
.contact-item .input-block input {
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
    box-sizing: border-box;
    border-radius: 3px;
    width: 340px;
    height: 42px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    padding: 0 11px;
}
.input-block.buttons{
    text-align: right;
}
.input-block.buttons .crm-button{
    margin-top: 0px;
}
.edit-link{
    cursor: pointer;
    opacity: 0;
}
.al-overlay,
.al-overlay2{
    position: fixed;
    z-index: 10001;
    width: 100%;
    height: 100%;
    background: rgba(204,204,204,0.8);
    /*opacity: 0.8;*/
    left: 0;
    top: 0;
    z-index: 10005;
}
.edrpou-form,
.contact-item-form-add,
#new_contract{
    width: 380px;
    padding:  20px;
    box-sizing: border-box;
    position: fixed;
    left: 50%;
    top: 50%;
    border: solid 1px rgba(0,0,0,0.125);
    background: #fff;
    margin-left: -190px;
    margin-top: -213px;
    z-index: 10005;
}
.edrpou-form{
    margin-top: -72px;
}
.edrpou-form.hide,
.al-overlay.hide,
.al-overlay2.hide{
    display: none;
}
.edrpou-form .mfp-close,
.contact-item-form-add .mfp-close,
#new_contract .mfp-close{
    color: #333;
}
.contact-item-form-add .input-block,
#new_contract .input-block{
    margin-bottom: 15px;
}
.edrpou-form .input-block{
    margin-bottom: 0;
}
.edrpou-form .input-block label,
.edrpou-form .input-block .error,
.contact-item-form-add .input-block label,
.contact-item-form-add .input-block .error,
#new_contract .input-block label,
#new_contract .input-block .error,
.add-service-block .input-block label,
.add-service-block .input-block .error
{
    display: block;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #ADB0B9;
    margin-bottom: 5px;
}
.edrpou-form .input-block .error,
.contact-item-form-add .input-block .error,
#new_contract .input-block .error,
.add-service-block .input-block .error{
    color: #FC6B40;
}
.edrpou-form .input-block input,
.contact-item-form-add .input-block input,
#new_contract .input-block input,
.add-service-block .input-block input{
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
    box-sizing: border-box;
    border-radius: 3px;
    width: 340px;
    height: 42px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    padding: 0 11px;
}
.contacts-add{
    /*margin-top: 36px;*/
}
.del-contact-item{
    position: absolute;
    top: 8px;
    right: 0px;
    color: #f00;
    font-size: 20px;
    font-weight: bold;
    border: none;
    background: #fff;
    display: none;
}
.contact-item:hover .del-contact-item{
    display: block;
}
.contact-item:hover .edit-link{
    opacity: 1;
}
.contacts-block{
    border-bottom: solid 1px #e6e9ec;
    margin-bottom: 25px;
    padding-bottom: 15px;
}
.contact-block{
    border-bottom: solid 1px #cdd4d9;
    margin-bottom: 20px;
}
.contact-block:last-child{
    border-bottom: none;
    margin-bottom: 0px;
}
.contact-block .field-container{
    display:flex;
    justify-content: flex-start;
}
.contact-block .field-container .input-block{
    width: 245px;
    margin-right: 20px;
}
.contact-block .field-container .input-block:last-child{
    margin-right: 0;
}
.details-item{
    padding: 15px 12px;
    backgroud: #fff;
}
.details-item:nth-child(2n){
    background: #f9f9f9;
}
.details-name{
    display: inline-block;
}
.details-edit,
.details-delete{
    display: inline-block;
    float: right;
    margin-left:  15px;
}
a.crm-button{
    display: inline-block;
    margin-top: 15px;
}
a.crm-button:hover{
    color: #fff;
}
.details-del{
    cursor: pointer;
}
.add-contract,
.add-contract:hover{
    cursor: pointer;
    color:  #fff !important;
}
#new_contract #select2-contract_detail_id-container{
    width: 340px;
}
#new_contract #select2-contract_our_detail_id-container{
    width: 340px;
}
/* Проверить почему не одупляет ФФ */
.select2-selection__rendered{
    height: 40px;
}
.select2-selection.select2-selection--single{
    border: 1px solid #CDD4D9;
}
.details-tabs-content .select2-selection__arrow,
#new_contract .select2-selection__arrow{
    background-color: #fafbfc;
    border-bottom: rgb(222, 229, 236) 1px solid;
    height: 41px !important;
}
.select2-results__option{
    box-sizing: content-box;
    padding-top: 7px;
    padding-bottom: 7px;
}
.contract-item{
    display: block;
    padding: 15px 12px;
    /*cursor: pointer;*/
    transition: box-shadow 2s ease-out;
    position: relative;
    /*padding-right: 85px;*/
}
.contract-item:nth-child(2n){
    background: #f9f9f9;
}
.contract-item.new{
    -webkit-box-shadow: 0px 0px 10px 3px rgba(34, 60, 80, 0.2) inset;
    -moz-box-shadow: 0px 0px 10px 3px rgba(34, 60, 80, 0.2) inset;
    box-shadow: 0px 0px 10px 3px rgba(34, 60, 80, 0.2) inset;
}
.contract-item .contract-del{
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
}
.contract-item .dwn-contract{
    position: absolute;
    top: 10px;
    right: 40px;
    cursor: pointer;
}
.contract-item .show-planes{
    position: absolute;
    top: 10px;
    right: 70px;
    cursor: pointer;
}

#result-search-list .manager-search.our-details{
    width: 1050px;
}
#result-search-list .manager-search.our-details .title-search-result{
    padding: 0;
}
#result-search-list .manager-search.our-details .no-data{
    width: 100%;
    float: none;
}
.content-block.content-our-details{
    margin: 20px 0;
}
.our-details .buttons-block{
    text-align: right;
}
.our-details-add:hover{
    color: #fff;
}
.input-group .input-block.mr0{
    margin-right: 0;
}
.input-group .input-block.mr15{
    margin-right: 15px;
}
.our-details .details-item{
    padding:  0;
}
.our-details .details-name{
    display: block;
    padding: 15px 12px;
    cursor: pointer;
}
.our-details .details-data{
    padding:  0 42px 15px 36px;
    border-bottom: solid 1px #f0f0f0;
}
.contract-planes{
    /*padding-top: 15px;*/
}
.contrat-info .contract-planes:first-child{
    margin-top: 10px;
}
.contract-planes .contract-planes-buttons{
    padding-bottom: 15px;
}
.selection-list{
    position: fixed;
    left: 50%;
    top: 50%;
    width: 1000px;
    padding: 20px;
    background: #fff;
    margin-left: -500px;
    margin-top: -150px;
    z-index: 10005;
}
.contract-form-add .mfp-close,
.selection-list .mfp-close{
    color: #000;
}
.ajax-content .hide{
    display: none;
}
.client-price{
    width: 50px;
}
.clinet-price-total{
    width: 50px;
}
.contract-plane-remove{
    cursor: pointer;
}
.contract-plane-remove svg{
    transform: scale(0.8);
    margin-bottom: -5px;
}
.date_from,
.date_to{
    width: 100px;
}
.code-search{
    width: 0;
    overflow: hidden;
    /*transition: width 1s;*/
    margin-left: 15px;
    height: 42px;
}
.code-search.show{
    width: 412px;
}
.code-search .code{
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
    box-sizing: border-box;
    border-radius: 3px;
    width: 340px;
    height: 42px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    padding: 0 11px;
}
.code-search .code:focus{
    outline: none;
}
.create-act{
    margin-left: 15px;
}
.dwn-act.crm-button{
    margin-left: 15px;
    line-height: 42px;
    margin-top: 0;
    line-height: 39px;
    display: inline-block;
}
.dwn-act.crm-button:hover{
    color: #3D445C;
}
.checkable.error{
    border: solid 1px #FC6B40;
}
.add-service{
    margin-left: 15px;
}
.add-service-wrap{
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 102;
    position: fixed;
    outline: none !important;
    -webkit-backface-visibility: hidden;
}
.add-service-container{
    text-align: center;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    padding: 0 20px;
    box-sizing: border-box;
}
.add-service-container:before{
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}
.add-service-block{
    /*position: fixed;
  width: 800px;
  left: 50%;
  top:  50%;
  margin-left: -400px;
  margin-top: -100px;
  padding: 20px;
  background:  #fff;
  z-index: 102;*/
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin: 0 auto;
    text-align: left;
    z-index: 104;
    background: #fff;
    padding: 20px;
}
.add-service-block .mfp-close{
    color: #000;
}
.add-service-block b{
    font-size: 18px;
    display: inline-block;
    margin-bottom: 15px;
}
.block-title{
    font-size: 15px;
    font-weight: bold;
    display: inline-block;
}
.add-service-block .input-block input{
    width: 500px;
}
.add-service-block .input-block input.w100{
    width: 100px;
}
.fields-group .input-group{
    border: none;
    margin: 0;
    padding: 0;
    margin-bottom: 10px;
}
.fields-group .input-group .input-block{
    margin-bottom: 0;
    margin-right: 15px;
}
.add-line{
    cursor: pointer;
    display: inline-block;
    margin: 15px 0;
}
.act-name{
    padding: 15px 10px;
    cursor: pointer;
    /*background: #FFF0EC;*/
}
.remove-line{
    position: relative;
}
.remove-line .remove{
    background: #fff;
    border: none;
    position: absolute;
    bottom: 5px;
    right: -10px;
    color: #FC6B40;
    opacity: 0;
    font-size: 25px;
}
.input-group:hover .remove-line .remove{
    opacity: 1;
}
.contract-services-list{
    margin-bottom: 50px;
}
.contract-services-list span{
    font-weight: bold;
}
.contract-service-header,
.contract-service-line{
    display: table-row;
}
.service-items-col{
    padding: 12px;
    display: table-cell;
    border-bottom: 1px solid #dee5ec;
}
.contract-service-line .service-items-col:first-child{
    width: 100%;
}
.contract-service-line .service-items-col.nowrap{
    white-space: nowrap;
}
.service-item-del svg{
    transform: scale(0.8);
    margin-bottom: -5px;
}
.dwn-bill{
    margin-left: 12px;
    position: relative;
}
a.crm-button.dwn-bill{
    margin-top: 0;
}
.dwn-bill ul{
    position: absolute;
    top: 39px;
    /*left: -14px;*/
    left: 0;
    background: #fff;
    border: 1px solid #CDD4D9;
    display: none;
}
.dwn-bill:hover ul{
    display: block;
}
.dwn-bill ul li{
    white-space: nowrap;
    text-align: left;
    padding:  0 14px;
    cursor: pointer;
}
.dwn-bill ul li:hover{
    background: #FFF0EC;
}
/** ADD **/
.import-block{
    position: fixed;
    left: 50%;
    top: 50%;
    height: auto;
    width: 440px;
    margin-left: -220px;
    margin-top: 0;
    transform: translateY(-50%);
    background: #fff;
    border-radius: 10px;
    z-index: 10002;
}
.import-block.hide{
    display:none;
}

.import-block-outdoor{
    position: fixed;
    left: 50%;
    top: 50%;
    height: auto;
    width: 440px;
    margin-left: -220px;
    margin-top: 0;
    transform: translateY(-50%);
    background: #fff;
    border-radius: 10px;
    z-index: 10002;
}
.import-block-outdoor.hide{
    display:none;
}
#xls-import{
    cursor:pointer;
}
.red-link{
    color: #f76a47;
}
[name=import_file]{
    max-width:260px;
}
[name=import_file_outdoor]{
    max-width:260px;
}
#import-button{
    cursor:pointer;
    color:#fff;
    padding-left: 20px;
    padding-right: 20px;
}
#input_button_outdoor{
    cursor:pointer;
    color:#fff;
    padding-left: 20px;
    padding-right: 20px;
}
a.back{
    margin-top: 30px;
    color: #FC6B40;
    font-weight: 500;
    display: flex;
    align-items: center;
}
a.back svg{
    margin-right: 11px;
}
.al-client-details-step1 h1{
    width: 100%;
    text-align: center;
}
.short-form-block{
    width: 380px;
    margin: 0 auto;
    position: relative;
}
.short-form-block .field-container .input-block{
    margin: 0;
    padding: 0;
    margin-bottom: 200px;
}
.short-form-block .field-container .input-block input{
    width: 380px;
    /*background: white;*/
    outline: none;
}
.edrpou-get{
    position: absolute;
    right: 12px;
    top: 34px;
    cursor: pointer;
    color: #C5B0AA !important;
}
.edrpou-get:hover{
    color: #C5B0AA !important;
}
.right-buttons{
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.right-buttons .btn{
    height: 42px;
    box-sizing: border-box;
    border-radius: 4px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    padding: 14px 24px;
    text-align: center;
    color: white;
    background: #FC6B40;
    border: none;
    display: inline-block;
    line-height: 1;
}
.right-buttons .btn:hover{
    color: white;
}
.right-buttons .cancel,
.right-buttons .save_comment,
.right-block .edit{
    height: 42px;
    box-sizing: border-box;
    border-radius: 4px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    padding: 14px 24px;
    text-align: center;
    color: #3D445C;
    background: white;
    border: solid 1px #CDD4D9;
    display: inline-block;
    line-height: 1;
    margin-right: 20px;
}
.right-block .edit{
    margin-right: 0;
    width: 180px;
    box-sizing: border-box;
}
.right-buttons .cancel:hover,
.right-block .edit:hover{
    color: #3D445C;
}

.new-details-submit{
    background: #FC6B40;
    color: white;
    float: right;
    height: 42px;
    padding: 0 30px;
    border:none;
    line-height: 42px;
    font-size:13px;
    font-weight: 700;
}
.label-block{
    display: flex;
    align-items: center;
    justify-content: center;
}
.short-form-block .field-container .label-block input{
    width: 130px;
    display:  none;
}
.field-container .label-block label{
    margin: 0;
    width: 130px;
    height: 42px;
    box-sizing: border-box;
    border: solid 1px #CDD4D9;
    line-height: 40px;
    text-align: center;
    cursor: pointer;
    font-size: 18px;
    color: #3D445C;
}
.label-block label.first{
    border-radius: 4px 0 0 4px;
}
.label-block label.last{
    border-radius: 0 4px 4px 0 ;
}
.label-block input[type=radio]:checked + label{
    background: #FFF0EC;
    border-color: #FC6B40;
    color: #FC6B40;;
}
.jquery-modal.blocker.current{
    z-index: 10200;
}
.btn-main{
    height: 42px;
    box-sizing: border-box;
    border-radius: 4px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    padding: 14px 24px;
    text-align: center;
    color: white;
    background: #FC6B40;
    border: none;
    display: inline-block;
    line-height: 1;
}
.btn-main:hover{
    color: white;
}
.client-info-header{
    margin-top: 30px;
    margin-bottom: 30px;
    display: flex;
    justify-content: space-between;
}
.mw1280 .client-info-header{
    margin-left:20px;
    margin-right:20px;
}
.client-info-header .left-block{
    display: flex;
    justify-content: flex-start;
    font-size: 13px;
}
.client-info-header .left-block .img{
    margin-right: 20px;
    width: 120px;
    height: 120px;
    border-radius: 60px;
    flex-shrink: 0;
}
.client-info-header .left-block .info{
    padding-top: 25px;
    padding-right: 20px;
}
.client-info-header .left-block .cities-list{
    display: flex;
    align-items: center;
    /*max-width: 280px;*/
    box-sizing: border-box;
    padding-right: 30px;

}
.client-info-header .left-block .cities-list svg{
    flex-shrink: 0;
}
.client-info-header .left-block .nowrap{
    white-space: nowrap;
    display: flex;
    align-items: center;
    margin-right: 30px;
}
.client-info-header .left-block .info h1.client-name{
    font-size: 24px;
    line-height: 28px;
    font-weight: 500;
    margin: 0;
    margin-bottom: 10px;
    padding: 0;
}
.client-info-header .left-block .info h2.client-manager{
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
    margin: 0;
    margin-bottom: 10px;
    padding: 0;
}
.client-info-header .left-block .info .short-info{
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.client-info-header .left-block .info .short-info svg{
    margin-right: 8px;
}
.ml-30{
    margin-left: 30px;
}
.client-info-header .right-block{
    padding-top: 0;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}
.mw1280 .client-navigation{
    margin-left: 20px;
    margin-right: 20px;
}
.client-navigation .favorite-viewed-tab{
    margin: 0;
}
.client-navigation .favorite-viewed-tab a{
    margin-right: 30px;
}
.client-tab-data-block{
    padding-top: 30px;
    padding-bottom: 50px;
}
.client-tab-data-block hr{
    margin:  16px 0;
}
.client-tab-data-block .result-paginator .result-paginator__pages {
    display: flex;
    justify-content: space-between;
    height: 45px;
    margin-top: 10px;
}
.info-block-table .tr{
    display: flex;
    align-items: flex-start;
    padding-bottom: 20px;
}
.info-block-table .tr .td:nth-child(1){
    width: 100px;
    margin-right: 10px;
    flex-shrink: 0;
}
.info-block .info-block-title{
    margin: 0;
    margin-bottom: 20px;
    padding: 0;
    line-height: 24px;
    font-size: 20px;
    font-weight: 500;
    display: flex;
    align-items: center;
}
.info-block .info-block-title .edit-comment {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid #E0E4EA;
    border-radius: 8px;
    color: #ADB0B9;
    flex-shrink: 0;
    transition: border-color 0.2s;
}
.info-block .info-block-title .edit-comment:hover {
    border-color: #FC6B40;
}
.info-block span{
    color: #ADB0B9;
}
.td-comment{
    width: 490px;
}
.client-contacts-header{
    display: flex;
    justify-content: space-between;
}
.client-contacts-header .left-block{
    display: flex;
    align-items: flex-end;
    font-size: 11px;
    padding-left: 0px;
}
.client-contacts-header .left-block form{
    position: relative;
}
.client-contacts-header .left-block form input{
    padding-right: 35px;
}
.client-contacts-header .right-block{
    padding-top: 0;
    /*padding-bottom: 20px;*/
    display: flex;
    align-items: flex-end;
}
.data-table{

}
.data-table .data-tr{
    display: flex;
}
.data-table .data-thead{
    border-bottom: solid 1px #cdd4d9;
}
.data-table .data-thead .data-td{
    flex: 1;
    cursor: pointer;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 11px;
    line-height: 13px;
    text-transform: lowercase;
    color: #3D445C;
    padding: 12px 12px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    align-self: center;
}
.data-table .data-tbody .data-tr{
    border-bottom: solid 1px #cdd4d9;
}
.data-table .data-tbody .data-td{
    flex: 1;
    display: flex;
    align-items: center;
    /*padding: 24px 12px;*/
    padding: 24px 10px;
}
.data-table .data-tbody .data-td.data-post-td span{
    padding: 3px 6px 3px 7px;
    border-radius: 4px;
}
.data-table .data-tbody .data-td.action-col{
    justify-content: flex-end;
    position: relative;
}
.contacts-add-popup,
.contacts-edit-popup,
.status-popup,
.notes-popup,
.notes-status-popup,
.number-popup,
.bill-without-contract-popup,
.change-sum-popup,
.returned-popup{
    position: fixed;
    left: 50%;
    top: 50%;
    z-index: 10002;
    width: 600px;
    min-height: 328px;
    margin-left: -300px;
    transform: translateY(-50%);
    border-radius: 10px;
    background: white;
    display: none;
}
.bill-without-contract-popup{
    z-index: 10102;
    height: 285px;
    margin-top: 0;
}
.contacts-edit-popup{
    display: block;
}
.select2-container{
    z-index: 10005;
}
.status-popup,
.notes-popup,
.notes-status-popup,
.number-popup,
.change-sum-popup,
.returned-popup{
    width:323px;
    height: 245px;
    margin-left: -161px;
    margin-top: -122px;
}
.change-sum-popup,
.returned-popup{
    z-index:10101;
    display: block;
}
.contacts-add-popup .select2-container,
.contacts-edit-popup .select2-container,
.bill-without-contract-popup .select2-container,
.status-popup .select2-container,
.notes-popup .select2-container,
.notes-status-popup .select2-container,
.number-popup input{
    width: 263px !important;
}
.contacts-add-link,
.contracts-add-link{
    width: 180px;
    box-sizing: border-box;
    text-align: center;
}
/* contacts-add/edit popup — flexible fields */
.contacts-add-popup .contacts-add-form .align-right .clear-new,
.contacts-add-popup .contacts-add-form .align-right .submit,
.contacts-edit-popup .align-right .clear-new,
.contacts-edit-popup .align-right .submit{
    min-width: 150px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    line-height: 1;
}
.contacts-add-popup .contacts-add-form .field-container,
.contacts-edit-popup .field-container{
    gap: 12px;
}
.contacts-add-popup .contacts-add-form .field-container .input-block,
.contacts-edit-popup .field-container .input-block{
    flex: 1;
    min-width: 0;
    margin-right: 0;
}
.contacts-add-popup .contacts-add-form .input-block input,
.contacts-add-popup .contacts-add-form .input-block select,
.contacts-edit-popup .input-block input,
.contacts-edit-popup .input-block select{
    width: 100% !important;
    box-sizing: border-box;
}
.contacts-add-popup .select2-container,
.contacts-edit-popup .select2-container{
    width: 100% !important;
}
/* contracts-add-popup — dropdown inside popup */
.contacts-add-popup {
    overflow: visible;
}
.contacts-add-popup .select2-dropdown {
    z-index: 10200 !important;
}
/* contracts-add-popup — desktop: wider modal */
.contacts-add-popup {
    width: 700px;
    margin-left: -350px;
}
/* contracts-add-popup — desktop layout */
.contacts-add-popup .contracts-add-form .field-container,
.bill-without-contract-popup .contracts-add-form .field-container{
    display: flex;
    gap: 12px;
}
.contacts-add-popup .contracts-add-form .field-container .input-block,
.bill-without-contract-popup .contracts-add-form .field-container .input-block{
    flex: 1;
    min-width: 0;
    margin-right: 0;
}
.contacts-add-popup .contracts-add-form .input-block input,
.contacts-add-popup .contracts-add-form .input-block select,
.bill-without-contract-popup .contracts-add-form .input-block input:not([type=checkbox]),
.bill-without-contract-popup .contracts-add-form .input-block select{
    width: 100% !important;
    box-sizing: border-box;
}
.contacts-add-popup .contracts-add-form .select2-container,
.bill-without-contract-popup .contracts-add-form .select2-container{
    width: 100% !important;
}
.contacts-add-popup .contracts-add-form .buttons-block,
.bill-without-contract-popup .contracts-add-form .buttons-block{
    display: flex;
    justify-content: flex-end;
    padding-top: 10px;
}
.contacts-add-popup .contracts-add-form .buttons-block .crm-button{
    min-width: 180px;
}
.bill-without-contract-popup .contracts-add-form .buttons-block .crm-button{
    min-width: 150px;
}
.bill-without-contract-popup .contracts-add-form .field-container.view-fix .input-block{
    display: flex;
    justify-content: flex-start;
}
.bill-without-contract-popup .contracts-add-form .field-container.view-fix .input-block:nth-child(2){
    padding-left: 0;
}
.bill-without-contract-popup .contracts-add-form .field-container.view-fix .input-block label{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    margin-bottom: 0;
}
.bill-without-contract-popup .contracts-add-form .field-container.view-fix .input-block input[type=checkbox]{
    width: 16px !important;
    height: 16px !important;
    flex: 0 0 16px;
    margin: 0;
}
.client-tab-data-block hr.mtb20{
    margin: 20px 0;
}
.client-tab-data-block hr.mb0{
    margin-bottom: 0;
}
.clients-company-data .data-table .data-tbody .data-td.td-name{
    flex: 7;
}
.clients-company-data .data-table .data-tbody .data-td.action-col{
    position: relative;
}
.sub-action,
.acts-popup-sub-action,
.contract-dwn{
    position: absolute;
    right: 15px;
    top: 54px;
    padding: 8px 0;
    background: white;
    justify-content: flex-start;
    min-width: 205px;
    width: auto;
    box-shadow: 0px 4px 16px rgba(61, 68, 92, 0.15);
    border-radius: 8px;
    border: 1px solid #E8EBF1;
    z-index: 2;
}
.sub-action.hide,
.acts-popup-sub-action.hide,
.contract-dwn.hide{
    display: none;
}
.sub-action a,
.acts-popup-sub-action a,
.contract-dwn a{
    text-decoration: none;
    text-align: left;
    display: block;
    padding: 10px 16px;
    color: #3D445C;
    white-space: nowrap;
    font-size: 13px;
    line-height: 1.4;
}
.sub-action a:hover,
.acts-popup-sub-action a:hover,
.contract-dwn a:hover{
    color: #FC6B40;
    background: #FFF0EC;
}
.no-company{
    background: #F6F7F9;
    height: 254px;
    border-radius: 4px;
    text-align: center;
    box-sizing: border-box;
    padding-top: 44px;
}
.no-company.hide{
    display: none;
}
.no-company .title{
    padding-top: 17px;
    font-size: 18px;
    line-height: 21px;
    display: block;
    text-align: center;
}
.details-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.view-edit-btn{
    height: 42px;
    box-sizing: border-box;
    border-radius: 4px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    padding: 14px 24px;
    text-align: center;
    color: #3D445C;
    background: white;
    border: solid 1px #CDD4D9;
    display: inline-block;
    line-height: 1;
}
.view-edit-btn:hover{
    color: #3D445C;
}
.details-header h1{
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 400;
    font-size: 34px;
    line-height: 41px;
    color: #3E445B;
    margin-bottom: 30px;
}
.company-info {
    padding-bottom: 30px;
}
.company-info .block-title{
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    display: block;
    margin-bottom: 20px;
}
.company-info .line{
    display: flex;
}
.company-info .line .title{
    width: 200px;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #ADB0B9;
    margin-bottom: 20px;
}
.company-info .line .value{
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
}
.clients-contracts-data .data-table .data-thead .data-td.td-name,
.clients-contracts-data .data-table .data-tbody .data-td.td-name{
    flex: 5;
}
.clients-contracts-data .up-down{
    margin-right: 13px;
}
.data-td-application.hide{
    display: none;
}
.data-tr-global{
    border-bottom: solid 1px #cdd4d9;
}
.clients-contracts-data .data-table .data-tbody .data-tr-global .data-tr{
    border: none;
}
.data-tr-global.active{
    background: #F9F9FA;
}
.data-tr-global.active svg.info-arrow{
    transform: rotateZ(180deg);
}
.data-td-application{
    padding: 0 20px 20px;
}
.data-td-application .data-table{
    background: white;
}
.data-td-application .data-table.acts-list{
    padding: 0px 20px;
}
.data-td-application .data-table .data-thead{
    padding-top: 8px;
}
.data-td-application .data-table .data-thead .data-td{
    padding: 12px;
}
.add-act-new{
    display: flex;
    align-items: center;
    color: #FC6B40 !important;
    margin-top: 20px;
}
.add-act-new svg{
    margin-right: 5px;
}
.data-contract-item .tr-action{
    transition: background 2s ease-out;
}
.data-contract-item.new .tr-action{
    background: #FFF0EC;
}
.status-info{
    padding: 3px 6px;
    display: inline-block;
    border-radius: 4px;
}
.act-popup-title{
    height: 71px;
    box-sizing: border-box;
    border-bottom: solid 1px #E8EBF1;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-left: -20px;
    margin-right: -20px;
    margin-top: -20px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}
.act-popup-title h2,
.act-popup-title h3{
    display: inline-block;
    margin: 0;
    padding: 0;
    color: #3D445C;
    font-size: 24px;
    line-height: 1;
    font-weight: 400;
}
.act-popup-title h3{
    font-size: 13px;
    margin-left: 16px;
}
.act-popup-menu-block{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 0;
}
.act-popum-menu{
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.act-popum-menu a{
    cursor: pointer;
    display: flex;
    align-items: center;
    color: #FC6B40 !important;
    text-decoration: none;
    margin-right: 15px;
}
.act-popum-menu a svg{
    margin-right: 5px;
}
.act-popum-menu a svg path{
    fill: #FC6B40;
}
.act-popum-menu a:hover,
.act-popum-menu a.active{
    color: #C5B0AA !important;
}
.act-popum-menu a:hover svg path,
.act-popum-menu a.active svg path {
    fill: #C5B0AA;
}

/* Period cell — vertically center the bare "-" text node between the two
   date inputs (defaults baseline-align which sits a bit higher than the input). */
.boards-td-period,
.popup-data .boards-td-period {
    display: flex;
    align-items: center;
}

/* === POPUP-DATA (act popup) — pill-style action buttons (desktop) === */
.popup-data .act-popum-menu {
    gap: 8px;
    flex-wrap: nowrap;
}
.popup-data .act-popum-menu a {
    margin-right: 0;
    height: 36px;
    padding: 0 12px;
    border: 1px solid #E0E4EA;
    border-radius: 8px;
    background: #fff;
    font-size: 13px;
    white-space: nowrap;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
    color: #FC6B40 !important;
}
.popup-data .act-popum-menu a svg {
    flex-shrink: 0;
}
.popup-data .act-popum-menu a svg path {
    fill: #FC6B40;
    transition: fill 0.15s;
}
.popup-data .act-popum-menu a:hover,
.popup-data .act-popum-menu a.active {
    background: #FFF0EC;
    border-color: #FC6B40;
    color: #FC6B40 !important;
}
.popup-data .act-popum-menu a:hover svg path,
.popup-data .act-popum-menu a.active svg path {
    fill: #FC6B40;
}
.popup-data .act-popum-menu > .vertical-line {
    display: none;
}
.popup-data .act-popup-right-wrap {
    margin-left: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
}
.popup-data .act-popup-right-wrap .act-popum-menu.act-popup-right {
    justify-content: flex-end;
}
.popup-data .act-popup-right-wrap .application-nds {
    position: static !important;
    width: auto !important;
    top: auto !important;
    right: auto !important;
    margin: 2px 0 0 !important;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    z-index: auto;
}
.popup-data .act-popup-right-wrap .application-nds b {
    margin-left: 0;
}
.vertical-line{
    height: 16px;
    border-left: solid 1px #CDD4D9;
    margin-right: 15px;
}
.acts-list.hide{
    display: none;
}
.act-dropdown{
    position: relative;
}
.act-dropdown-wrap{
    position: relative;
    display: inline-flex;
}
.popup-data .act-dropdown-wrap > .acts-popup-sub-action{
    top: calc(100% + 6px);
    right: 0;
    left: auto;
    bottom: auto;
}
/* Dropdown items should NOT inherit .act-popum-menu a pill styling (border/height) */
.popup-data .act-popum-menu .acts-popup-sub-action a{
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    height: auto !important;
    padding: 10px 16px !important;
    margin: 0 !important;
    white-space: nowrap;
}
.popup-data .act-popum-menu .acts-popup-sub-action a.bill-acts-submenu{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.popup-data .act-popum-menu .acts-popup-sub-action a.bill-acts-submenu svg{
    flex-shrink: 0;
}
.popup-data .act-popum-menu .acts-popup-sub-action a:hover{
    background: #FFF0EC !important;
    border: none !important;
}
.sub-action .bill-acts-submenu,
.acts-popup-sub-action .bill-acts-submenu,
.sub-action .board-photo-report{
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}
.flex-position-fix{
    width: 0;
    height: 0;
    right: 0;
    position: absolute;
}
.application-tabs.hide{
    display: none;
}
.tabls-list{
    margin: 0;
    padding: 0;
    margin-left: -20px;
    margin-right: -20px;
    list-style: none;
    /*width: 100%;*/
    border-bottom: solid 1px #D9D9D9;
}
.tabls-list li{
    display: inline-block;
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
    color: #FC6B40;
    padding: 6px 0;
    margin-right: 30px;
    margin-bottom: -1px;
    margin-left: 20px;
}
.tabls-list li.active,
.tabls-list li:hover{
    color: #3D445C;
    padding-bottom: 5px;
    border-bottom: solid 2px #FC6B40;;
}
.application-tabs .tabs .tab-item{
    display: none;
}
.application-tabs .tabs .tab-item.active{
    display: block;
}
.boards-table{
    margin-left: -20px;
    margin-right: -20px;
}
.boards-table.hide{
    display: none;
}
.boards-table-tr{
    min-height: 45px;
    padding: 14px 0;
    border-bottom: solid 1px #E8EBF1;
    display: flex;
    align-items: center;
    flex-flow: row wrap;
}
.boards-td{
    padding-right: 20px;
    font-style: normal;
    font-weight: 500;
    font-size: 11px;
    line-height: 13px;
    text-transform: lowercase;
    color: #3D445C;
}
.boards-td-photo{
    width: calc((100vw - 40px)*0.0810);/* ~ 114px (100vw = 1450px)*/
    padding: 5px 20px;
}
.boards-table-tbody .boards-td-photo img{
    width: calc((100vw - 40px)*0.0810 - 40px);
}
.boards-table-tbody .boards-td-side{
    text-transform: uppercase;
}
.boards-td-code{
    width: calc((100vw - 40px)*0.0500);/* ~ 70px; (100vw = 1450px)*/
}
.boards-td-addr{
    width: calc((100vw - 40px)*0.1150);/* ~ 146px; (100vw = 1450px)*/
    text-transform: none;
}
.boards-td-addr-custom{
    text-transform: none;
}
.boards-td-firm{
    width: calc((100vw - 40px)*0.0780);/* 110px; (100vw = 1450px)*/
    text-transform: none;
}
.boards-td-type{
    width: calc((100vw - 40px)*0.0603);/* 85px; (100vw = 1450px)*/
}
.boards-td-updated{
    width: calc((100vw - 40px)*0.0638);/* 90px; (100vw = 1450px)*/
}
.boards-td-side{
    width: calc((100vw - 40px)*0.0461);/* 65px; (100vw = 1450px)*/
    text-align: center;
    /*text-transform: uppercase;*/
}
.boards-td-period{
    width: calc((100vw - 40px)*0.1844);/* 260px; (100vw = 1450px)*/
}
.boards-td-price-in,
.boards-td-price-out,
.boards-td-price-result{
    width: calc((100vw - 40px)*0.0787);/* 125px; (100vw = 1450px)*/
}
.boards-td-action{
    width: calc((100vw - 40px)*0.0355);/* 50px; (100vw = 1450px)*/
}
.boards-table-tbody .boards-td{
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
}
.boards-td-period .date_from,
.boards-td-period .date_to,
.boards-td-price-out .client-price-new,
.boards-td-price-in .owner-price,
.boards-td-price-in .selection-item-price,

.boards-td-price-result .clinet-price-total-new{
    width: 110px;
    height: 30px;
    border: solid 1px #CDD4D9;
    padding: 7px;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    border-radius: 3px;
    outline: none;
}
.boards-td-period .date_from,
.boards-td-period .date_to{
    background: white url(../img/select.png) left top no-repeat;
}
.boards-td-price-out .client-price-new,
.boards-td-price-in .owner-price,
.boards-td-price-in .selection-item-price,
.boards-td-price-result .clinet-price-total-new{
    background: white url(../img/select2.png) left top no-repeat;
}
.selection-wrap,
.manual-boards-wrap{
    margin-left: -20px;
    margin-right: -20px;
}
.selection-wrap h2,
.manual-boards-wrap h2{
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 21px;
    padding-bottom: 20px;
    padding-left: 20px;
    margin-bottom: 0;
    border-bottom: solid 1px #E8EBF1;
}
.selection-top{
    display: flex;
    background: url(../img/left-bg.png) left top repeat-y;
}
.selections-list{
    width: 307px;
}
.selections-data{
    width: calc(100% - 40px - 307px);
}
.selections-list ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
.selections-list ul li{
    list-style: none;
    padding: 14px 20px;
    font-size: 14px;
    line-height: 18px;
    cursor: pointer;
    border-bottom: solid 1px #E8EBF1;
}
.selections-list ul li:hover,
.selections-list ul li.active{
    list-style: none;
    padding: 14px 20px 14px 16px;
    background: #F2F5FB;
    border-left: 4px solid #FC6B40;
    border-bottom: solid 1px #F2F5FB;
}
.application-tabs .selection-shadow{
    margin-left: 0;
    margin-right: 0;
}
.application-tabs .selections-actions-block{
    padding: 10px 20px 0;
}
.selections-actions-block .new-flex-link,
.selections-actions-block .selected-btn{
    margin: 0;
    padding: 0 16px;
    height: 42px;
    background: #fff;
    border: 1px solid #CDD4D9;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    text-decoration: none;
    color: #3D445C;
    display: flex;
    align-items: center;
    gap: 6px;
    box-sizing: border-box;
}
.selections-actions-block .new-flex-link:hover,
.selections-actions-block .selected-btn:hover{
    background: #f7f9fa;
    text-decoration: none;
}
.selections-actions-block .new-flex-link svg{
    margin-right: 0;
    flex-shrink: 0;
}
.selections-actions-block .selected-btn img{
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}
.application-tabs .excel_setting{
    left: 50%;
}
.selection-bottom{
    display: flex;
    justify-content: space-between;
    margin-bottom: -10px;
}
.boards-to-contracts{
    padding-right: 20px;
}
.boards-to-contracts .add-to-contract{
    margin-top: 10px;
    color: white !important;
    cursor: pointer;
}
.selection-items-row.selected-line{
    background: #FFF0EC;
}
.boards-search-form{
    display: flex;
    position:relative;
}
.boards-search-form .input-block{
    width: calc(100vw - 40px - 20px - 105px);
}
.boards-search-form .input-block label{
    margin-bottom: 5px;
}
.boards-search-input{
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
    border-radius: 3px;
    width: calc(100vw - 40px - 40px - 105px);
    height: 42px;
    outline: none;
    padding:  0 13px;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
}
.button-block{
    padding-top: 22px;
}
.button-block button{
    padding: 0 24px;
}
.boards-search-result{
    padding-top: 20px;
}
.boards-search-result .nothing{
    padding: 150px 0;
    text-align: center;
}
.boards-search-result .nothing svg{
    margin-bottom: 25px;
}
.boards-search-result .nothing span{
    display: block;
    font-weight: 400;
    font-size: 18px;
    line-height: 21px;
    text-align: center;
    color: #3E445B;
}
.boards-search-result .result{

}
.boards-search-result .result-action{

}
.boards-search-result .nothing.hide,
.boards-search-result .result.hide,
.boards-search-result .result-action.hide{
    display: none;
}
.boards-td-action{
    position: relative;
}
.boards-td-action .sub-action{
    top: 30px;
    right: calc((100vw - 40px)*0.0355 - 30px);
}
.services-item{
    display: flex;
    margin-bottom: 20px;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
}
.sub-service .services-item{
    margin-bottom:10px;
    margin-top:10px;
}
.sub-service-action{
    width: 100%;
}
.sub-service-action.hide,
.sub-service.hide{
    display:none;
}
.sub-service.error{
    border-color: #FC6B40;
    -webkit-box-shadow: inset 0px 0px 18px 1px rgba(252, 107, 64, 1);
    -moz-box-shadow: inset 0px 0px 18px 1px rgba(252, 107, 64, 1);
    box-shadow: inset 0px 0px 18px 1px rgba(252, 107, 64, 1);
}
.services-item.head-line{
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;;
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #CDD4D9;
    margin-bottom: 5px;
}
.services-item .services-name{
    width: 488px;
    padding-right: 20px;
}
.services-item .services-price_in,
.services-item .services-price{
    /*width: 226px;*/
    width: 132px;
    padding-right: 20px;
}
.services-item .services-count{
    width: 132px;
    padding-right: 20px;
}
.services-item .services-result{
    width: 132px;
    padding-right: 20px;
}
.other-input.hide{
    display: none;
}
.client-price-new.error,
.owner-price.error,
.new-service-input.error,
.services-item input.error{
    border-color: #FC6B40;
    -webkit-box-shadow: inset 0px 0px 18px 10px rgba(252,107,64,1);
    -moz-box-shadow: inset 0px 0px 18px 10px rgba(252,107,64,1);
    box-shadow: inset 0px 0px 18px 10px rgba(252,107,64,1);
}
.services-supplier{
    width: 305px;
}
.services-supplier .services-supplier-dd{
    width: 290px;
    height: 42px;
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
    border-radius: 3px;
    padding: 10px 13px;
    outline: none;
    font-size: 13px;
    line-height: 16px;
    font-weight: 500;
    color: #3D445C;
    margin-right: 15px;
}

.services-item .services-name select{
    width: 468px;
    height: 42px;
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
    border-radius: 3px;
    padding: 10px 13px;
    outline: none;
    font-size: 13px;
    line-height: 16px;
    font-weight: 500;
    color: #3D445C;
}
.popup-data #application-services .services-item .services-name .select2-container,
.bill-without-contract-popup #application-services .services-item .services-name .select2-container{
    width: 468px !important;
    max-width: 100%;
}
.popup-data #application-services .services-item .services-supplier .select2-container,
.bill-without-contract-popup #application-services .services-item .services-supplier .select2-container{
    width: 290px !important;
    max-width: 100%;
}
.services-item input{
    height: 42px;
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
    border-radius: 3px;
    padding: 13px;
    outline: none;
    font-size: 13px;
    line-height: 16px;
    font-weight: 500;
    color: #3D445C;
}
.services-item .services-price_in input,
.services-item .services-price input{
    /*width: 206px;*/
    width: 112px;
}
.services-item .services-count input,
.services-item .services-result input{
    width: 112px;
}
.add-service-line{
    display: flex;
    align-items: center;
    font-size: 13px;
    line-height: 20px;
    color: #FC6B40 !important;
}
.add-service-line svg{
    margin-right: 5px;
}
.services-name .services-dd.short{
    width: 200px;
    margin-right: 20px;
}
.services-name .other-input{
    height: 42px;
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
    border-radius: 3px;
    padding: 13px;
    outline: none;
    font-size: 13px;
    line-height: 16px;
    font-weight: 500;
    color: #3D445C;
    width: 238px;
}
.services-table {
    margin-left: -20px;
    margin-right: -20px;
    display: table;
}
.services-table.hide{
    display: none;
}
.services-table-thead,
.services-table-tbody{
    display: table-header-group;;
}
.services-table-tr{
    /*display: flex;*/
    display: table-row;
    align-items: center;
    border-bottom: 1px solid #E8EBF1;
}
.services-table-thead .services-td{
    font-weight: 500;
    font-size: 11px;
    line-height: 13px;
    text-transform: lowercase;
    padding: 10px 20px;
}
.services-td{
    padding: 20px;
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    display: table-cell;
}
.services-td-name{
    width:100%;
    /*width: calc((100vw - 40px)*0.5872);/*6787*/
}
.services-td-count{
    /*width: calc((100vw - 40px)*0.0878);*/
}
.services-td-price{
    /*width: calc((100vw - 40px)*0.1001);/* 136px / 1366px */
}
.services-td-result{
    /*width: calc((100vw - 40px)*0.1001);*/
}
.services-td-action{
    padding-left: 0;
    vertical-align: middle;
}
.services-td-action svg{
    width: 30px;
    height: 30px;
    border: solid 1px #CDD4D9;
    border-radius: 4px;
    padding: 5px;
    cursor: pointer;
}
.bill-acts-submenu{

}
.bills-month-list.hide{
    display: none;
}
.bills-month-list{
    width: 205px;
    padding: 5px;
    background: white;
    left: -415px;
    top: -41px;
    box-shadow: 0px 5px 20px rgb(61 68 92 / 10%);
    border-radius: 3px;
    z-index: 3;
    position: absolute;
}
.bills-month-list ul{
    margin: 0;
    padding: 0;
}
.bills-month-list ul li{
    font-size: 13px;
    line-height: 15px;
    padding: 13px;
    cursor: pointer;
    text-align: left;
}
.bills-month-list ul li:hover{
    color: #FC6B40;
}
.manual-boards-list{
    margin: 0 20px 20px;
}
.manual-boards-list-item{
    background: white;
    border-bottom: 1px solid #CDD4D9;
}
.manual-boards-list-item.active{
    background: #F9F9FA;
}

.manual-boards-list-item .item-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    cursor: pointer;
}
.manual-boards-list-item .item-header .board-title{
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
}
.manual-boards-list-item .item-header .board-title span.up-down{
    margin-right: 14px;
}
.manual-boards-list-item.active .item-header .board-title span.up-down svg{
    transform: rotateZ(180deg);
}
.manual-boards-list-item .form{
    display: none;
    background: white;
    padding: 20px;
    margin: 0 20px 20px;
}
.manual-boards-list-item.active .form{
    display: block;
}
.manual-boards-list-item .form span.informer{
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    margin-bottom: 10px;
    display: inline-block;
}
.manual-boards-list-item .form .field-container{
    display: flex;
    flex-wrap: wrap;
    border-bottom: solid 1px #CDD4D9;
}
.manual-boards-list-item .form input{
    outline: none;
}
/* w1278 */
.manual-boards-list-item .form .field-container .input-block{
    margin-right: 20px;
}
.manual-boards-list-item .form .field-container .manual_code{
    width: 130px;
}
.manual-boards-list-item .form .field-container .manual_city{
    width: 340px;
}
.manual-boards-list-item .form .field-container .manual_addr{
    width: 340px;
}
.manual-boards-list-item .form .field-container .manual_firm{
    width: 340px;
}
.manual-boards-list-item .form .field-container .manual_type{
    width: 130px;
}
.manual-boards-list-item .form .field-container .manual_format{
    width: 130px;
}
.manual-boards-list-item .form .field-container .manual_side{
    width: 130px;
}
.manual-boards-list-item .form .field-container .manual_light{
    width: 130px;
}
.manual-boards-list-item .form .field-container .manual_date_from,
.manual-boards-list-item .form .field-container .manual_date_to{
    width: 160px;
    background: white url(../img/calendar.png) left top no-repeat;
}
.manual-boards-list-item .form .field-container .input-block input.price-input{
    width: 200px;
    background: white url(../img/price-input.png) left top no-repeat;
}
.manual-boards-list .form-action{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: 20px;
}
.manual-boards-list .form-action .manual-board-form-item-add{
    color: #FC6B40;
    display: flex;
    align-items: center;
}
.manual-boards-list .form-action .manual-board-form-item-add svg{
    margin-right: 5px;
}
.manual-add-boards-form-clear{
    color: #FC6B40 !important;
    margin-right: 15px;
}
.manual-add-boards-form-submit{
    color: white !important;
}
.manual-boards-list-item .form .field-container .input-block input[type=file]{
    background: none;
    border: none;
    width: auto;
    height: auto;
}
.search-form .field-container{
    display: flex;
}
.search-form .field-container .input-block{
    margin: 0 20px 20px 0;
}
#type-search{
    width: 130px;
}

.form_toggle {
    display: inline-block;
    overflow: hidden;
}
.form_toggle-item {
    float: left;
    display: inline-block;
}
.form_toggle-item input[type=radio] {
    display: none;
}
.input-block .form_toggle-item label {
    display: inline-block;
    padding: 0px/* 15px*/;
    line-height: 42px;
    border: 1px solid #CDD4D9;
    border-right: none;
    cursor: pointer;
    user-select: none;
    width: 90px;
    height: 42px;
    box-sizing: border-box;
    background: #fff;

    font-family: Helvetica Neue;
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    text-align: center;
    color: #3D445C;

}

.form_toggle .item-1 label {
    border-radius: 4px 0 0 4px;
}
.form_toggle .item-2 label {
    border-radius: 0 4px 4px 0;
    border-right: 1px solid #CDD4D9 !important;
}

/* Checked */
.form_toggle .item-1 input[type=radio]:checked + label {
    background: #FFD0EC;
    border: 1px solid #FC6B40;
}
.form_toggle .item-2 input[type=radio]:checked + label {
    background: #FFD0EC;
    border: 1px solid #FC6B40;
    border-right: 1px solid #FC6B40 !important;
}
.to-add-service{
    display: flex;
    padding: 20px 0;
}
.to-add-service .add-service-link{
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    color: #FC6B40 !important;
}
.to-add-service .add-service-link svg{
    margin-right: 5px;
}
.first_month_pay_date.hide{
    display: none;
}
.contract-dwn{
    top: 54px;
    right: 54px;
}
.posts-block{
    position: relative;
}
#result-search-list .manager-search.our-details.posts-block{
    width: 960px;
}
#result-search-list .manager-search.our-details.posts-block h1.title-search-result{
    /*padding-left: 20px;*/
}
#result-search-list .manager-search.our-details.posts-block .posts-block{
    margin-left: 0;
    margin-right: 0;
}
.posts-block .data-table .data-tbody .data-tr{
    background: #fff;
}
.posts-block .data-table .data-tbody .data-td span {
    padding: 3px 6px 3px 7px;
    border-radius: 4px;
}
.posts-block .field-container{
    display: flex;
}
.posts-block .field-container.right {
    justify-content: flex-end;
}
.posts-block .input-block {
    margin-right: 25px;
    margin-bottom: 15px;
    position: relative;
}
.posts-block .input-block:nth-child(3n){
    margin-right: 0px;
}
.posts-block .input-block input{
    width: 320px;
}
.posts-block .hr {
    margin: 5px 0 25px;
    border-bottom: solid 1px #e6e9ec;
    width: 100%;
}
.abs-top-right{
    position: absolute;
    right: 0;
    top: /*39px;*/ 104px;
}
.action-col a.edit.mr0{
    margin-right: 0;
}
#result-search-list .manager-search.our-details.details-block{
    width: 960px;
    position: relative;
}
.global-data-tr.active .up-down svg{
    transform: rotateZ(180deg);
}
.details-data .info-block-table .tr .td:nth-child(1){
    width: 240px;
}
.steps{
    height: 59px;
    width: 100%;
    background: #F9F9FA;
}
.steps .container{
    margin: 0 auto;
    padding: 0;
    height: 59px;
    width: 810px;
    display: flex;
    align-items: center;
}
.step{
    color: #8B8F9D;
}
.step.current{
    color: #3D445C;
}
.step .round{
    background: #E8EBF1;
    width: 24px;
    height: 24px;
    border-radius: 12px;
    line-height: 24px;
    display: inline-block;
    text-align: center;
    color: #ADB0B9;
    font-size: 13px;
    margin-right: 10px;
}
.step.current .round{
    background: #FC6B40;
    color: #fff;
}
.steps .line{
    margin: 0 8px;
    height: 2px;
    background: #E8EBF1;
    width: 32px;
}
.bottom-action{
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}
.bottom-action .back{
    margin-top: 0;
}
.bottom-action .buttons-block{
    padding-bottom: 0;
    display:flex;
    align-items: center;
}
.photo-container{
    display: flex;
    align-items: center;
    margin-bottom: 25px;
}
.photo-container .photo{
    width: 120px;
    height: 120px;
    background: #FFF0EC;
    border-radius: 60px;
    overflow: hidden;
    margin-right: 20px;
}
.photo-container .photo-actions{
    display: flex;
}
.photo-container .upload-photo{
    background: #FFFFFF;
    border: 1px solid #CDD4D9;
    border-radius: 4px;
    font-family: 'Helvetica Neue';
    font-style: normal;
    font-weight: 700;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    padding: 12px 24px;
    margin-right: 13px;
}
.photo-container .delete-photo{
    background: #FFFFFF;
    border: 1px solid #CDD4D9;
    border-radius: 4px;
    padding: 0 12px;
    height: 42px;
    width: 42px;
    /*line-height: 40px;*/
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
}
.photo-container .upload-photo:hover{
    color: #3D445C;
}
.photo-container input{
    display: none;
}
#result-search-list .manager-search .title-search-result{
    padding:  0 20px;
}
.data-table .data-thead .data-td.f7{
    flex: 7;
}
.input-block.mr0{
    margin-right: 0;
}
.vars{
    margin-top: 25px;
}
.vars h2{
    font-size: 25px;
    font-weight: 50;
    margin-bottom: 20px;
}
.vars .vars-block{
    display: flex;
    justify-content: space-between;
}
.vars .info-block-table .tr{
    padding-bottom: 12px;
}
.vars .info-block-table .tr .td:first-child{
    width: 180px;
    font-weight: bold;
}
.vars .info-block-table .tr .td:nth-child(2){
    width: 250px;
}
.system-info-tabs{
    margin-right: 0;
    margin-left: 0;
}
.get-mfo{
    color: #FC6B40 !important;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    margin-top: 5px;
}
.note{
    margin-bottom: 15px;
}
.note .btn{
    color: #FC6B40 !important;
}
.lds-ellipsis2,
.lds-ellipsis3 {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 100%;
}

.lds-ellipsis2 div,
.lds-ellipsis3 div {
    position: absolute;
    top: calc(50% - 6.5px);
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: #FC6B40;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.lds-ellipsis2.hide,
.lds-ellipsis3.hide{
    display: none;
}
.lds-ellipsis2 div:nth-child(1),
.lds-ellipsis3 div:nth-child(1)  {
    left: 8px;
    animation: lds-ellipsis1 0.6s infinite;
}
.lds-ellipsis2 div:nth-child(2),
.lds-ellipsis3 div:nth-child(2)   {
    left: 8px;
    animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis2 div:nth-child(3),
.lds-ellipsis3 div:nth-child(3)   {
    left: 32px;
    animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis2 div:nth-child(4),
.lds-ellipsis3 div:nth-child(4)   {
    left: 56px;
    animation: lds-ellipsis3 0.6s infinite;
}
.boards-search-form .lds-ellipsis3{
    position:absolute;
    right: 120px;
    top: 10px;
}

.iframe-popup{
    width: 1040px;
    height: calc(100vh - 40px);
    position: fixed;
    left: 50%;
    top: 50%;
    /*margin-top: calc(0 - 50vh + 20px);*/
    margin-left: -520px;
    z-index: 10002;
    border-radius: 10px;
    display: none;
    background: white;
}
.iframe-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 70px;
    border-bottom: solid 1px #E8EBF1;
    box-sizing: border-box;
    font-size: 24px;
    padding: 0 30px;
}
.iframe-header .close{
    cursor: pointer;
}
.iframe-body{
    padding: 20px 30px 30px;
}
.edit-contract:hover{
    color: #FC6B40 !important;
}
.edit-act-date:hover{
    color: #FC6B40 !important;
}
/* BILLS */
.container-base.bills-page{
    width: 1061px;
    max-width: 1061px;
}
.container-base.bookkeeper-bills-page{
    width: 1260px;
    max-width: 1260px;
}
.bills-switcher{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: 15px;
    width: 100%;
}
.bills-switcher a{
    padding: 8px 16px;
    font-family: 'Helvetica Neue';
    font-style: normal;
    font-weight: 700;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    text-decoration: none;
    margin-right: 10px;
    display: inline-block;
}
.bills-switcher a:hover,
.bills-switcher a.active{
    background: #FFF0EC;
    border-radius: 1000px;
    color: #FC6B40;
}
.bills-search-form{
    border-bottom: solid 1px #CDD4D9;
}
.bills-search-form [type=submit].hide{
    display: none;
}
.bills-search-form .field-container{
    margin-top: 15px;
    display: flex;
    /*justify-content: space-between;*/
}
.bills-search-form .field-container .input-block{
    width: 227px;
    margin-right: 20px;
}
.bills-search-form .field-container .input-block input{
    width: 227px;
}
.bills-search-form .field-container .input-block .bills-status-select{
    width: 227px;
}
.bills-search-form .field-container .input-block .bills-year-select,
.bills-search-form .field-container .input-block .bills-month-select{
    width: 150px;
}
.left-block.bills-stat{
    align-items: center;
    justify-content: flex-start;
}
.left-block.bills-stat span{
    font-family: 'Helvetica Neue';
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #3D445C;
    padding-right: 15px;
    margin-right: 15px;
    border-right: solid 1px #CDD4D9;
}
.left-block.bills-stat span:nth-child(4){
    border-right: 0;
}
.left-block.bills-stat span b{
    font-weight: 700;
}
.bills-add-link{
    width: 180px;
    text-align: center;
    box-sizing: border-box;
}
.bills-table-thead{
    border-top: solid 1px #CDD4D9;
}
.bills-table-tbody{

}
.bills-table-tbody .data-td{
    font-size: 13px;
    line-height: 19px;
}
.data-table .data-thead .data-td.bill-payer,
.data-table .data-tbody .data-td.bill-payer{
    flex: 1.4;
    font-size:12px;
}
.data-table .data-thead .data-td.bill-status-td,
.data-table .data-tbody .data-td.bill-status-td{
    flex: 1.3;
    white-space:nowrap;
}
.data-table .data-thead .data-td.bill-action,
.data-table .data-tbody .data-td.bill-action{
    flex: 0.6;
}
.bill-status-td span.wait{
    padding: 3.5px 4px; /* 3.5 6 */
    background: #FCE9E4;
    border-radius: 4px;
    color: #FC6B40;
}
.bill-status-td span.paid{
    padding: 3.5px 4px; /* 3.5 6 */
    background: #adf8ad; /*#EDF7ED;*/
    border-radius: 4px;
    color: #27a227; /*#17d80f;*/ /*#4FB14B;*/
}
.bill-download:hover{
    color: #FC6B40 !important;
}
.zi10101 .select2-container{
    z-index: 10105;
}

.bill-add-body select{
    width: 263px;
}
.bills-table-tbody .data-tr.hide{
    display:none;
}
.payment-sideblock-body .ib2{
    width:100%;
}
.bill-add-body .ib2{
    width:100%;
}
.bill-add-tabs .form_toggle{
    width: 100%;
}
.bill-add-tabs .form_toggle .form_toggle-item{
    width:50%;
}
.bill-add-tabs .form_toggle .form_toggle-item label{
    width: 100%;
    font-weight:bold;
}
.bill-add-tabs .form_toggle .form_toggle-item input[disabled] + label{
    cursor: default;
}
.application-actions{
    position:relative;
    cursor: pointer;
}
.application-actions .application-sub-action{
    position: absolute;
    left: 0 ;
    top: 24px;
    padding: 5px;
    background: white;
    justify-content: flex-start;
    width: 305px;
    box-shadow: 0px 5px 20px rgb(61 68 92 / 10%);
    border-radius: 3px;
    z-index: 2;
}
.application-actions .application-sub-action.hide{
    display: none;
}
.application-actions .application-sub-action li{
    margin:0;
    padding: 0;
}
.application-actions .application-sub-action li span{
    text-decoration: none;
    text-align: left;
    display: block;
    padding: 10px 0 10px 13px;
    color: #3D445C;
    cursro:pointer;
}
.application-actions .application-sub-action li span:hover{
    color:#FC6B40;
}
.bill-add-sideblock,
.add-supplier-bill,
.payment-sideblock{
    width: 520px;
    height: 100%;
    /*min-height: 935px;*/
    position: fixed;
    right:0;
    top:0;
    overflow: hidden auto;
    outline: none !important;
    -webkit-backface-visibility: hidden;
    background:#fff;
    display:none;
}
.add-supplier-bill{
    width: 700px;
}
.supplier-bill-file-view{
    width: 700px;
    height: 100%;
    position: fixed;
    left:0;
    top:0;
    overflow: hidden auto;
    outline: none !important;
    -webkit-backface-visibility: hidden;
    background:#fff;
    display:none;
}
.bill-add-sideblock-header,
.add-supplier-bill-header,
.add-supplier-bill-file-header,
.payment-sideblock-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 70px;
    border-bottom: solid 1px #E8EBF1;
    box-sizing: border-box;
    font-size: 24px;
    padding: 0 30px;
}
.bill-add-sideblock-header .close,
.add-supplier-bill-header .close,
.add-supplier-bill-bill-header .close,
.payment-sideblock-header .close{
    cursor: pointer;
}
.bill-add-sideblock-body,
.add-supplier-bill-body,
.payment-sideblock-body{
    width:520px;
    padding: 30px;
}
.add-supplier-bill-body{
    width: 700px;
}
.bill-add-sideblock-body .tab-selector,
.payment-sideblock-body .tab-selector{
    margin:0;
    margin-bottom: 20px;
    padding:0;
    border-bottom: solid 1px #CDD4D9;

}
.bill-add-sideblock-body .tab-selector li,
.payment-sideblock-body .tab-selector li{
    font-family: 'Helvetica Neue';
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    color: #FC6B40;
    margin: 0 20px 0 0;
    display: inline-block;
}
.bill-add-sideblock-body .tab-selector li.active,
.bill-add-sideblock-body .tab-selector li:hover,
.payment-sideblock-body .tab-selector li.active,
.payment-sideblock-body .tab-selector li:hover{
    color: #3D445C;
    border-bottom: 2px solid #FC6B40;
    cursor:pointer;
}
.bill-add-sideblock-body .tab-item,
.payment-sideblock-body .tab-item {
    display:none;
}
.bill-add-sideblock-body .tab-item.active,
.payment-sideblock-body .tab-item.active{
    display:block;
}
.bill-add-sideblock-body .tab-item .input-block input,
.bill-add-sideblock-body .tab-item .input-block select,
.payment-sideblock-body .tab-item .input-block input,
.payment-sideblock-body .tab-item .input-block select{
    width: 220px;
}
.bill-add-sideblock-body .tab-item .input-block.ib2,
.bill-add-sideblock-body .tab-item .input-block.ib2 input,
.bill-add-sideblock-body .tab-item .input-block.ib2 select,
.payment-sideblock-body .input-block.ib2,
.payment-sideblock-body .input-block.ib2 select,
.payment-sideblock-body .tab-item .input-block.ib2,
.payment-sideblock-body .tab-item .input-block.ib2 input,
.payment-sideblock-body .tab-item .input-block.ib2 select{
    width:460px;
}
.bill-add-sideblock-body .field-container .input-block input.datepicker,
.payment-sideblock-body .field-container .input-block input.datepicker,
.bill-details-info .field-container .bill-date-datepicker,
.bill-details-info .field-container .bill-pay-date-datepicker{
    background: #F6F7F9 url(../img/calendar.png) right top no-repeat;
}
#bill-form-add .select2-selection__choice.al-select2-count,
.lead-add-form .select2-selection__choice.al-select2-count,
.al-supplier-form-page .select2-selection__choice.al-select2-count{
    padding-left: 10px;
    padding-right: 10px;
}

.radio-button{
    position: relative;
}
.radio-button input{
    display: none;
}
.field-container .input-block .radio-button label,
.info-row .radio-button label{
    padding-left: 24px;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    background: url(../img/radio-button.png) left top no-repeat;
    cursor:pointer;
}
.field-container .input-block .radio-button input:checked + label,
.info-row .radio-button input:checked + label{
    background: url(../img/radio-button-checked.png) left top no-repeat;
}
.bill-add-sideblock .cancel,
.payment-sideblock .cancel{
    border: none;
    color: #FC6B40 !important;
    padding: 14px 0px;
}
.bill-add-sideblock .buttons-block.right-buttons .cancel,
.bill-add-sideblock .buttons-block.right-buttons .crm-button {
    width: 150px;
    box-sizing: border-box;
    text-align: center;
}
.bill-add-sideblock .buttons-block.right-buttons .cancel {
    background: #FFFFFF;
    color: #3D445C;
    border: 1px solid #E5E5E5 !important;
    border-radius: 4px;
    font-weight: 600;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 42px;
    line-height: 1;
}
.bill-add-sideblock .buttons-block.right-buttons .cancel:hover {
    border-color: #FC6B40 !important;
    color: #FC6B40;
}
.select2-container--default .select2-selection--multiple{
    border-color: #CDD4D9;
}
.al-power-tip{
    padding: 2px 5px;
    font-weight: 500;
    font-size: 13px;
    line-height: 18px;
    color: #3D445C;
    background: #CDD4D9;
    border-radius: 2px;
    display: inline-block;
}
.appications-list-data{
    width:100%;
    margin-bottom: 12px;
}
.app-list-line{
    border-bottom: solid 1px #E8EBF1;
    padding: 12px 0;
    display: flex;
}
.app-list-line div{
    font-size:13px;
    color: #3D445C;
    flex: 1;
}
.app-list-line div.line-title{
    font-weight: 500;
    font-size: 11px;
    text-transform: lowercase;
}
.tab-item .notification{
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 9px 13px;
    gap: 10px;
    background: #FFF0EC;
    border: 1px solid #EC5F35;
    border-radius: 3px;
    font-size: 13px;
    line-height: 19px;
    color: #FC6B40;
}
.for-hide.hide,
.tab-item .notification.hide{
    display: none;
}
.price-notice{
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #8B8F9D;
    margin-top:5px;
    display: inline-block;
}
#bookkeeper-bill-search .bills-year-select,
#bookkeeper-bill-search .bills-month-select{
    width:207px;
}
#bookkeeper-bill-search .report_period-select{
    width:227px;
}
.bill-details-info h3{
    font-size:20px;
    line-height: 25px;
    padding: 20px 0px;
    text-align: left;
    margin: 0;
}
.text-info-block{
    display:table;
}
.text-info-line{
    display: table-row;
}
.text-info-title{
    display: table-cell;
    padding: 5px;
}
.text-info-value{
    display: table-cell;
    padding:5px;
    width:100%;
}
.bill-details-info .number-block{
    width:110px;
}
.bill-details-info .number-block input{
    width:110px;
}
.bill-details-info .name-block{
    /*width:900px;*/
    width:100%;
}
.bill-details-info .name-block input{
    /*width:900px;*/
    width:100%;
}
.bill-details-info .field-container{
    display: table-row;
}
.bill-details-info .field-container .input-block{
    display: table-cell;
    padding: 5px 20px 5px 0;
}
.result-line{
    display: table-row;
}
.result-line .text{
    display: table-cell;
    width: 100%;
    padding:10px;
    text-align:right;
}
.result-line .value{
    display: table-cell;
    width:110px !important;
    padding:10px;
    padding-right:20px;
    white-space: nowrap;
}
.notifications-date{
    font-family: 'Helvetica Neue';
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
    color: #8B8F9D;
    padding-top:30px;
    padding-bottom:12px;
    border-bottom: solid 1px #E8EBF1;
}
.wide-filter{
    justify-content: space-between;
}
.search-right-block{
    display: flex;
}
.bills-search-form .field-container .input-block.filter-btn-block,
.bills-search-form .field-container .input-block.wa{
    width: auto;
}
.bk-filter-btn{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 12px 24px;
    gap: 10px;
    width: 136px;
    height: 42px;
    background: #fff;
    border: 1px solid #CDD4D9;
    border-radius: 4px;
    cursor: pointer;
    margin-top:20px;
    font-size: 13px;
    font-weight: 600;
    color: #3D445C;
}

.bk-filter-btn.has-filters {
    background: #FFF0EC;
    border-color: #FC6B40;
    color: #FC6B40;
}

.bk-filter-actions {
    display: flex;
    gap: 10px;
    align-items: stretch;
    width: 100%;
    margin-top: 16px;
}

.bk-filter-actions .crm-button {
    flex: 1;
}

.bk-filter-reset-btn {
    flex: 1;
    height: 42px;
    padding: 0 14px;
    background: #FFFFFF;
    color: #3D445C;
    border: 1px solid #E5E5E5;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
    box-sizing: border-box;
}

.bk-filter-reset-btn:hover {
    border-color: #FC6B40;
    color: #FC6B40;
}

/* Кастомный класс для кнопки фильтра в задачах */
.tasks-filter-btn{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 12px 24px;
    gap: 10px;
    width: 136px;
    height: 42px;
    background: transparent;
    border: 1px solid #E5E5E5;
    border-radius: 4px;
    cursor: pointer;
    margin-top:20px;
    transition: all 0.2s;
}

.tasks-filter-btn svg path {
    fill: #3D445C;
    transition: fill 0.2s;
}

.tasks-filter-btn:hover:not(.has-filters) {
    border-color: #FC6B40;
}

.tasks-filter-btn:hover:not(.has-filters) svg path {
    fill: #FC6B40;
}

.tasks-filter-btn.has-filters{
    background: #FFF0EC;
    border: 1px solid #FC6B40;
}

.tasks-filter-btn.has-filters svg path {
    fill: #FC6B40;
}


.bk-filter-block{
    position: fixed;
    right:0;
    top:0;
    width: 440px;
    height: 100vh;
    background: #fff;
    overflow: hidden auto;
    outline: none !important;
    -webkit-backface-visibility: hidden;
    display:none;
    z-index: 10102;
}

.bk-filter-block-custom{
    position: fixed;
    right:0;
    top:0;
    width: 440px;
    height: 100vh;
    background: #fff;
    overflow: hidden auto;
    outline: none !important;
    -webkit-backface-visibility: hidden;
    display:none;
    z-index: 10102;
}

.bk-filter-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 70px;
    border-bottom: solid 1px #E8EBF1;
    box-sizing: border-box;
    font-size: 24px;
    padding: 0 20px;
}
.bk-filter-fields{
    padding: 20px 24px;
}
.bills-search-form .bk-filter-fields .field-container{
    margin-top: 0;
}
.bills-search-form .bk-filter-fields .field-container input[type=text],
.bills-search-form .bk-filter-fields .field-container .input-block .bills-status-select,
#bookkeeper-bill-search .bk-filter-fields .report_period-select,
.bills-search-form .bk-filter-fields .field-container .input-block select{
    width: 392px;
}

/* === Filter panel fields for Leads & Clients === */
.al-leads-page .bk-filter-fields .field-container,
.al-clients-page .bk-filter-fields .field-container {
    margin-bottom: 0;
}
/* Override global input-block margins/widths inside filter panel */
.al-leads-page .bk-filter-fields .input-block,
.al-clients-page .bk-filter-fields .input-block {
    margin-bottom: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
}
.al-leads-page .bk-filter-fields .input-block select,
.al-leads-page .bk-filter-fields .input-block input[type=text],
.al-clients-page .bk-filter-fields .input-block select,
.al-clients-page .bk-filter-fields .input-block input[type=text] {
    width: 100% !important;
    max-width: 100%;
    box-sizing: border-box;
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
    height: 42px;
    border-radius: 3px;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    padding: 0 11px;
}
.al-leads-page .bk-filter-fields .form-group select,
.al-clients-page .bk-filter-fields .form-group select {
    width: 100% !important;
    box-sizing: border-box;
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
    height: 42px;
    border-radius: 3px;
    font-size: 13px;
    color: #3D445C;
    padding: 0 11px;
}
.al-leads-page .bk-filter-fields .form-group.input-block,
.al-clients-page .bk-filter-fields .form-group.input-block {
    width: 100%;
}
.al-leads-page .bk-filter-fields .select2-container,
.al-clients-page .bk-filter-fields .select2-container {
    width: 100% !important;
}
.al-leads-page .bk-filter-btn,
.al-clients-page .bk-filter-btn {
    margin-top: 0;
}
/* Leads search form: remove right margin from search, filter, and submit buttons */
.al-leads-page .search-form .input-block.w260,
.al-leads-page .search-form .input-block.filter-btn-block,
.al-leads-page .search-form .input-block.leads-search-submit-block {
    margin-right: 0;
}
/* Clients search form: remove right margin from search, filter, and submit buttons */
.al-clients-page .search-form .input-block:first-of-type,
.al-clients-page .search-form .input-block.filter-btn-block,
.al-clients-page .search-form .input-block.clients-search-submit-block {
    margin-right: 0;
}
/* select2 dropdown z-index fix: default 1051 is below al-overlay3 (10001) */
.select2-dropdown {
    z-index: 10200 !important;
}
/* Style select2 widget in filter panel to match native CRM select appearance */
.bk-filter-fields .select2-container {
    width: 100% !important;
    box-sizing: border-box;
}
.bk-filter-fields .select2-container--default .select2-selection--single {
    background: #F6F7F9 !important;
    border: none !important;
    height: 100% !important;
    border-radius: 3px !important;
}
.bk-filter-fields .select2-container--default .select2-selection--single .select2-selection__rendered {
    height: 40px !important;
    line-height: 40px !important;
    font-size: 13px !important;
    color: #3D445C !important;
    padding-left: 11px !important;
    background: #F6F7F9 !important;
}
.bk-filter-fields .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100% !important;
    background: transparent !important;
    border: none !important;
}
/* Filter panel dropdown (dropdownParent = .bk-filter-block) */
.bk-filter-block .select2-dropdown {
    border: 1px solid #CDD4D9 !important;
    border-radius: 0 0 3px 3px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
    max-height: none !important;
}
.bk-filter-block .select2-results__options {
    max-height: 260px;
    overflow-y: auto;
}
.bk-filter-block .select2-results__option {
    height: auto !important;
    min-height: 36px;
    padding: 8px 16px !important;
    border-bottom: none !important;
    font-size: 13px !important;
    display: flex;
    align-items: center;
}
.bk-filter-block .select2-search--dropdown {
    padding: 8px !important;
}
.bk-filter-block .select2-search--dropdown .select2-search__field {
    height: 36px !important;
    border: 1px solid #CDD4D9 !important;
    border-radius: 3px !important;
    padding: 0 8px !important;
    font-size: 13px !important;
    outline: none;
}

/* Select2 in lead-change-status-form — match native select appearance */
/* Container width (inline width override) */
.lead-change-status-form .select2-container {
    width: 100% !important;
    box-sizing: border-box;
}
/* Inner selection: NO border (outer .select2-container already has border from inline <style>) */
.lead-change-status-form .select2-container--default .select2-selection--single {
    border: none !important;
    background: #F6F7F9 !important;
    height: 100% !important;
}
.lead-change-status-form .select2-container--default .select2-selection--single .select2-selection__rendered {
    height: 40px !important;
    line-height: 40px !important;
    font-size: 13px !important;
    color: #3D445C !important;
    padding-left: 11px !important;
    background: #F6F7F9 !important;
}
.lead-change-status-form .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100% !important;
    background: transparent !important;
    border: none !important;
}
/* Search input on leads/clients — match select appearance */
.al-leads-page #leads_search,
.al-clients-page #leads_search {
    background: #F6F7F9 !important;
    border: 1px solid #CDD4D9 !important;
    border-radius: 3px !important;
    font-size: 13px;
    color: #3D445C;
    height: 42px;
    padding: 0 11px;
    box-sizing: border-box;
}

/* "Change" button in status tab — half width */
.lead-change-status-form .align-right .submit,
.client-change-status-form .align-right .submit {
    width: 50%;
}

.comment-update-form .align-right .submit {
    width: 180px;
}

/* Gap between status and class selects in status tab */
.lead-change-status-form .class_status_custom_id {
    margin-top: 12px;
}

/* Comment textarea in status tab — match select appearance */
.lead-change-status-form .comment-container textarea,
.client-change-status-form .comment-container textarea {
    background: #F6F7F9 !important;
    border: 1px solid #CDD4D9 !important;
    border-radius: 3px !important;
    font-size: 13px;
    color: #3D445C;
    padding: 10px 11px;
    box-sizing: border-box;
}

/* Select2 dropdown: override main_mngr.css to match native select look */
/* Options: compact height, no separators */
.select2-container--default .select2-results__option {
    box-sizing: border-box;
    height: auto !important;
    min-height: 36px;
    padding: 8px 16px !important;
    border-bottom: none !important;
    font-size: 14px !important;
    display: flex;
    align-items: center;
}
/* Selected option: blue background (override main_mngr.css gray #ddd) */
.select2-container--default .select2-results__option--selected {
    background-color: #2563EB !important;
    color: #fff !important;
}
/* Highlighted (hover/keyboard) on non-selected item: light gray */
.select2-container--default .select2-results__option--highlighted:not(.select2-results__option--selected) {
    background-color: #F6F7F9 !important;
    color: #3D445C !important;
}
/* Highlighted on selected item: keep blue */
.select2-container--default .select2-results__option--highlighted.select2-results__option--selected {
    background-color: #2563EB !important;
    color: #fff !important;
}

.al-leads-page .bk-filter-fields .input-block.mr0,
.al-clients-page .bk-filter-fields .input-block.mr0 {
    width: 50% !important;
    margin-left: auto !important;
}
.al-leads-page .bk-filter-fields .field-container:has(.bk-filter-actions),
.al-clients-page .bk-filter-fields .field-container:has(.bk-filter-actions) {
    width: 100% !important;
    margin-left: 0 !important;
}
.al-leads-page .bk-filter-fields .input-block.mr0 .crm-button,
.al-clients-page .bk-filter-fields .input-block.mr0 .crm-button {
    width: 100%;
    box-sizing: border-box;
}

/* === Filter panel fields for Photoreports (client view) === */
.al-client-view-page .bk-filter-block .bk-filter-fields .field-container {
    margin-bottom: 0;
}
.al-client-view-page .bk-filter-block .bk-filter-fields .input-block {
    margin-bottom: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
}
.al-client-view-page .bk-filter-block .bk-filter-fields .input-block select,
.al-client-view-page .bk-filter-block .bk-filter-fields .input-block input[type=text] {
    width: 100% !important;
    max-width: 100%;
    box-sizing: border-box;
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
    height: 42px;
    border-radius: 3px;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    padding: 0 11px;
}
.al-client-view-page .bk-filter-block .bk-filter-fields .input-block label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    color: #8D95A5;
}
.al-client-view-page .bk-filter-block .bk-filter-fields .field-container + .field-container {
    margin-top: 16px;
}
.al-client-view-page .bk-filter-block .bk-filter-fields .input-block.mr0 {
    width: 50% !important;
    margin-left: auto !important;
    margin-top: 16px;
}
.al-client-view-page .bk-filter-block .bk-filter-fields .input-block.mr0 .crm-button {
    width: 100%;
    box-sizing: border-box;
}
.al-client-view-page .bk-filter-block .bk-filter-fields .select2-container {
    width: 100% !important;
}
.al-client-view-page .bk-filter-block .bk-filter-fields .select2-container--default .select2-selection--single {
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
    height: 42px;
    border-radius: 3px;
}
.al-client-view-page .bk-filter-block .bk-filter-fields .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 42px;
    font-size: 13px;
    color: #3D445C;
    padding-left: 11px;
}
.al-client-view-page .bk-filter-block .bk-filter-fields .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 42px;
}
.bk-filter-fields .switcher-block {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #f0f0f0;
    width: auto !important;
    flex-direction: row-reverse !important;
    flex-wrap: nowrap !important;
    margin-bottom: 0 !important;
}
.bk-filter-fields .switcher-block .switcher-label {
    flex: 1;
    min-width: 0;
    white-space: normal;
    font-size: 14px;
    color: #3D445C;
    padding-left: 12px;
}




/* === Export button row for Leads & Clients === */
.export-btn-wrap {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    margin-top: 16px;
}
.export-btn {
    height: 42px !important;
    padding: 14px 24px !important;
    font-size: 13px !important;
    font-weight: bold !important;
    line-height: 1 !important;
    color: white !important;
    box-sizing: border-box;
    text-align: center;
}

.photoreport-filter-block{
    border-bottom: none;
    padding-top:20px;
    margin-bottom: 12px;
}
.mw1280 .field-container,
.mw1366 .field-container,
.mw960 .field-container
{
    display:flex;
}
.mw1280 .field-container{
    justify-content:center;
}
.mw960 .field-container{
    align-items: flex-start;
}
.mw1280 .field-container .input-block{
    width: 400px;
    margin-right: 20px;
}
.mw1366 .field-container .input-block{
    width: 340px;
    margin-right: 20px;
}
.mw1280 .field-container .input-block:last-child,
.mw1366 .field-container .input-block:last-child{
    margin-right: 0px;
}
.mw1280 .field-container .input-block input,
.mw1280 .field-container .input-block select{
    width: 400px;
}
.mw1366 .field-container .input-block input,
.mw1366 .field-container .input-block select{
    width: 340px;
}
.photoreport-filter-block .select2-container{
    z-index: 100;
}

.photoreport-filter-action-block{
    /*border-bottom: solid 1px #E8EBF1;*/
    padding: 20px 0;
    display:flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px 0;
}
.mw1280 .photoreport-filter-action-block,
.mw1280 .create-block{
    width: 1240px;
    margin: 0 auto;
}
.mw1280 .create-block{
    margin-bottom: 20px;
}
.mw1280 .photoreport-filter-block{
    width: 1240px;
    margin: 0 auto;
}
.mw1366 .photoreport-filter-action-block,
.mw1366 .create-block{
    width: 1326px;
    margin: 0 auto;
}
.mw1366 .create-block{
    margin-bottom: 20px;
}
.mw1366 .photoreport-filter-block{
    width: 1326px;
    margin: 0 auto;
}
.photoreport-filter-action-block .switcher-block{
    margin-top: 0px;
    justify-content: flex-start;
}
.photoreport-filter-action-block .switcher-block input[type="checkbox"].ios8-switch + label{
    line-height: 20px;
}
.photoreport-filter-action-block .search-button{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 150px;
    margin-top: 0;
}
.photoreport-filter-action-block .header-styles .al-selected-filter {
    width: 100%;
}
.photoreport-filter-action-block .header-styles .field-container .input-block {
    margin-bottom: 0;
}
.photoreport-filter-action-block .header-styles .photoreports-search-button {
    margin-bottom: 0;
    flex-shrink: 0;
}
.photoreport-filter-action-block .header-styles:last-child {
    align-items: center;
    padding-top: 21px;
}
.photoreport-filter-action-block .header-styles .switcher-block {
    flex-wrap: nowrap;
}
.photoreport-filter-action-block .header-styles .filter-btn-block {
    flex-shrink: 0;
}
.photoreport-filter-action-block .header-styles .bk-filter-btn {
    margin-top: 0;
    width: 150px;
    box-sizing: border-box;
    justify-content: center;
}
.photoreport-filter-action-block .search-button svg{
    margin-right: 8px;
}
.create-block .right-block{
    /*padding-top:20px;*/
    padding-top:0;
}
.photoreport-add-link{

}


.photoreports-table{
    width: 100%;
    display: table;
    table-layout: fixed;
    border-top: solid 1px #E8EBF1;
}
.photoreports-thead{
    display: table-header-group;
}
.photoreports-tbody{
    display: table-header-group;
}
.photoreports-row{
    display: table-row;
}
.photoreports-col{
    display: table-cell;
    align-content: center;
    padding: 20px 5px;
    vertical-align: top;
    border-bottom: solid 1px #CDD4D9;
    overflow-wrap: break-word;
    word-wrap: break-word;
}
.photoreports-col:first-child{
    padding-left:0;
}
.design-col{
    text-align: center;
}
.photo-col{
    white-space: nowrap;
    text-align: center;
}
.photo-col a{
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.photo-col svg{
    margin-right: 5px;
}
.photoreports-popup,
.photoreports-popup2{
    position: fixed;
    width: 630px;
    left: 50%;
    top:50%;
    z-index: 10002;
    transform: translateX(-50%) translateY(-50%);
    border-radius: 10px;
    background: white;
    display: none;
}
.popup-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 70px;
    border-bottom: solid 1px #E8EBF1;
    box-sizing: border-box;
    font-size: 24px;
    padding: 0 30px;
}
.popup-header .close{
    cursor: pointer;
}
.popup-body{
    padding: 20px 30px 30px;
}
.popup-body .information-title{
    display: block;
    padding-bottom: 15px;
    font-size: 16px;
    line-height: 19px;
    color: #000000;
}
.popup-body .information-block .info-row{
    display: flex;
    justify-content: flex-start;
    margin-bottom: 10px;
}
.popup-body .information-block .row-title{
    font-size: 13px;
    line-height: 16px;
    color: #8B8F9D;
    flex: 0 0 93px;
}
.popup-body .information-block .row-value{
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
}
.popup-body .cancel{
    margin-top: 15px;
    border:none;
    padding:14px 0px;
    color:#FC6B40 !important;
    cursor:pointer !important;
}
.popup-body .crm-button{
    color:#fff !important;
    cursor:pointer !important;
}
.photoreports-popup .photo-block,
.photoreports-popup2 .photo-block{
    width: 100%;
    height: 106px;
    background: #FFF0EC;
    border: 1px dashed #FC6B40;
    border-radius: 3px;
}
.photoreports-popup .photo-block .upload-info-div,
.photoreports-popup2 .photo-block .upload-info-div{
    color: #FC6B40;
    align-items: center;
    justify-content: center;
    padding-top: 44px;
    display:flex;
    flex-wrap: wrap;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    position:absolute;
    z-index:1;
    width:570px;
}
.photoreports-popup .photo-block .upload-info-div svg,
.photoreports-popup2 .photo-block .upload-info-div svg{
    margin-right:12px;
}
.photoreports-popup .photo-block .upload-info-div .notice,
.photoreports-popup2 .photo-block .upload-info-div .notice{
    margin-top:11px;
    color:#3D445C;
}
.photoreports-popup .photo-block .dz-size,
.photoreports-popup .photo-block .dz-filename,
.photoreports-popup2 .photo-block .dz-size,
.photoreports-popup2 .photo-block .dz-filename{
    display:none;
}
.photoreports-popup .photo-block .dz-remove,
.photoreports-popup2 .photo-block .dz-remove{
    display: block;
    position: absolute;
    width: 28px;
    height: 28px;
    top: 46px;
    left: 50%;
    transform: translateX(-50%);
    background: url(../img/trash-img.svg);
    content: "";
    z-index: 100;
    opacity:0;
}
.photoreports-popup .photo-block .dz-preview:hover .dz-remove,
.photoreports-popup2 .photo-block .dz-preview:hover .dz-remove{
    opacity:1;
}
.photoreports-popup .photo-list{
    display: flex;
}
.photoreports-popup .photo-list-item{
    width: 136px;
    margin-right: 9px;
}
.photoreports-popup .photo-list-item .my-file-uploader,
.photoreports-form .photo-list-item .my-file-uploader,
.photoreports-popup2 .photo-list-item .my-file-uploader{
    width: 136px;
    height: 106px;
    background: #FFF0EC;
    border: 1px dashed #FC6B40;
    border-radius: 3px;
    text-align:center;
    position: relative;
    font-size: 11px;
    line-height: 13px;
}
.photoreports-popup .photo-list-item .my-file-uploader svg,
.photoreports-form .photo-list-item .my-file-uploader svg,
.photoreports-popup2 .photo-list-item .my-file-uploader svg{
    margin-top: 16px;
}
.photoreports-popup .photo-list-item .my-file-uploader .red,
.photoreports-form .photo-list-item .my-file-uploader .red,
.photoreports-popup2 .photo-list-item .my-file-uploader .red{
    color: #FC6B40;
}
.photoreports-popup .photo-list-item .my-file-uploader .img-div,
.photoreports-form .photo-list-item .my-file-uploader .img-div,
.photoreports-popup2 .photo-list-item .my-file-uploader .img-div {
    position: absolute;
    left: -1px;
    top: -1px;
    width: 136px;
    height: 106px;
    padding-top: 39px;
    background-size: cover;
    background-position: center;
    border-radius: 4px;
    overflow: hidden;
}

.photoreports-popup .photo-list-item .my-file-uploader .img-div .upload-file-ico,
.photoreports-popup .photo-list-item .my-file-uploader .img-div .trash-file-ico,
.photoreports-form .photo-list-item .my-file-uploader .img-div .upload-file-ico,
.photoreports-form .photo-list-item .my-file-uploader .img-div .trash-file-ico,
.photoreports-popup2 .photo-list-item .my-file-uploader .img-div .upload-file-ico,
.photoreports-popup2 .photo-list-item .my-file-uploader .img-div .trash-file-ico {
    display: none;
    cursor: pointer;
    position: absolute;
    width: 20px;
    height: 20px;
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 3px;
    padding: 2px;
    z-index: 2;
    transition: transform 0.2s ease;
}

.photoreports-popup .photo-list-item .my-file-uploader .img-div .upload-file-ico,
.photoreports-form .photo-list-item .my-file-uploader .img-div .upload-file-ico,
.photoreports-popup2 .photo-list-item .my-file-uploader .img-div .upload-file-ico {
    top: 5px;
    left: 5px;
}

.photoreports-popup .photo-list-item .my-file-uploader .img-div .trash-file-ico,
.photoreports-form .photo-list-item .my-file-uploader .img-div .trash-file-ico,
.photoreports-popup2 .photo-list-item .my-file-uploader .img-div .trash-file-ico {
    top: 5px;
    right: 5px;
}

.photoreports-popup .photo-list-item .my-file-uploader .img-div:hover .upload-file-ico,
.photoreports-popup .photo-list-item .my-file-uploader .img-div:hover .trash-file-ico,
.photoreports-form .photo-list-item .my-file-uploader .img-div:hover .upload-file-ico,
.photoreports-form .photo-list-item .my-file-uploader .img-div:hover .trash-file-ico,
.photoreports-popup2 .photo-list-item .my-file-uploader .img-div:hover .upload-file-ico,
.photoreports-popup2 .photo-list-item .my-file-uploader .img-div:hover .trash-file-ico {
    display: inline-block;
}

.photoreports-popup .photo-list-item .my-file-uploader .img-div .upload-file-ico:hover,
.photoreports-popup .photo-list-item .my-file-uploader .img-div .trash-file-ico:hover,
.photoreports-form .photo-list-item .my-file-uploader .img-div .upload-file-ico:hover,
.photoreports-form .photo-list-item .my-file-uploader .img-div .trash-file-ico:hover,
.photoreports-popup2 .photo-list-item .my-file-uploader .img-div .upload-file-ico:hover,
.photoreports-popup2 .photo-list-item .my-file-uploader .img-div .trash-file-ico:hover {
    transform: scale(1.1);
}

.photo-list-item select{
    width: 136px;
    height: 42px;
    margin-top: 4px;
    border: solid 1px #CDD4D9;
    border-radius: 4px;
}
.photo-list-item > div{
    position: relative;
}
.photo-list-item .select2-container{
    width: 100% !important;
    max-width: 100%;
    box-sizing: border-box;
    margin-top: 4px;
}
.photo-list-item .select2-dropdown{
    width: 100% !important;
    max-width: 100%;
    box-sizing: border-box;
}
/* Dropdown for photo-type selects (appended to body so z-index must beat modal 10002) */
.select2-container.photo-type-container{
    z-index: 10003 !important;
}
.select2-dropdown.photo-type-dropdown{
    box-sizing: border-box;
    z-index: 10003 !important;
}
.select2-dropdown.photo-type-dropdown .select2-search{
    display: none !important;
    height: 0 !important;
    padding: 0 !important;
    position: static !important;
}
.photo-list-item .file-form{
    display: none;
}

.photoreports-form .field-container .input-block{
    width: 275px;
    margin-right: 20px;
}
.photoreports-form .field-container .input-block:last-child{
    margin-right: 0;
}

.photoreports-form .field-container .input-block select{
    width: 275px;
}
.select2-container--disabled{
    opacity:0.4;
}
.photoreports-form .field-container .input-block.w570{
    width: 100%;
    margin-right: 0;
}
.photoreports-form .field-container .input-block.w570 select{
    width: 570px;
}
/*.select2-dd-fix*/ .select2-selection__arrow{
                        background: #fff;
                        height:40px !important;
                    }
.photoreports-form .photo-list{
    display: flex;
}
.photoreports-form .photo-list-item{
    width: 136px;
    margin-right: 9px;
}
.photoreports-form .photo-list-item.hide{
    display:none;
}
.photoreports-data .photo-list-item.hide{
    display:none;
}
.photoreports-form .photo-list-item select,
.photoreports-data .photo-list-item select{
    background: #fff;
}
.photoreports-tabs-switch{
    margin: 0;
    margin-bottom: 20px;
    padding: 0;
    border-bottom: solid 1px #CDD4D9;
}
.photoreports-tabs-switch li{
    font-family: 'Helvetica Neue';
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    color: #FC6B40;
    margin: 0 20px 0 0;
    display: inline-block;
    cursor: pointer;
}
.photoreports-tabs-switch li.active,
.photoreports-tabs-switch li:hover{
    color: #3D445C;
    border-bottom: 2px solid #FC6B40;
    cursor: pointer;
}
.photoreports-tabs-switch li.disabled {
    color: #AAB2BD;
    border-bottom: none;
    cursor: default;
    pointer-events: none;
    opacity: 0.6;
}

.popup-tab.hide{
    display:none;
}
.kved-table{
    height: 120px;
    overflow: hidden;
    position: relative;
    cursor:pointer;
}
.kved-table:after{
    height: 20px;
    top: 100px;
    width: 100%;
    content: " ";
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
    display: block;
    position: absolute;
    z-index: 100;
}

.for-radio{
    display:flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-flow: row wrap;
}
.for-radio .radio-button{
    margin-right: 10px;
}
.photoreports-col.action-col.nowrap .actions{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-flow: row nowrap;
    position: relative;
}
.photoreports-col.action-col.nowrap .sub-action{
    top:35px;
    right: 0px;
}

/* Bill without contract */
.bills-add-without-contract-link{
    color:#fff !important;
    margin-left: 15px;
}
.act-generate-full.hide{
    display: none;
}

/* Unknown payments*/
.operations-slider{
    margin: 20px auto 10px;
    position:relative;
    height: 77px;
    overflow: hidden;
}
.operations-slider .loading{
    position: absolute;
    left:0;
    top: 0;
    width: 100%;
    height: 77px;
    background: #FFF0EC;
    z-index: 100;
}
.operations-slider .slick-initialized .slick-slide{
    justify-content: flex-start;
}
.operations-slider .slick-arrow{
    /*display: none !important;*/
}
.operation-item{
    margin:0;
    padding:4px;
    position:relative;
    background: #FFF0EC;
    border-radius: 4px;
    list-style: none;
}
.operation-item:after{
    width:4px;
    height: 46px;
    background: #FC6B40;
    left:4px;
    top:4px;
    position:absolute;
    content: " ";
}
.operation-info{
    width:100%;
    min-height:46px;
    padding: 0 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.left-info{
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.left-info span{
    margin-left:8px;
}
.right-action{
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.right-action .action-button{
    width:103px;
    height:30px;
    display:inline-block;
    margin-left: 8px;
    margin-top: 0;
    text-align: center;
    line-height: 28px;
}
.right-action .action-button.cancel{
    border: 1px solid #CDD4D9;
    color: #3D445C;
}
.right-action .action-button.cancel:hover{
    color:#FC6B40;
}
.operations-slider .operations-count{
    position:absolute;
    bottom: 4px;
    left: calc(50% + 70px);
    font-family: 'Helvetica Neue';
    font-style: normal;
    font-weight: 700;
    font-size: 12px;
    line-height: 15px;
    color: #FC6B40;
    cursor:pointer;
}


/* Application NDS */
#price-type-change{
    margin:0;
    margin-left: 8px;
    color: #fff;
}
.application-nds b{
    font-size:16px;
    margin-left: 4px;
}
.price-type-popup{
    box-shadow: 0 0 5px rgba(0,0,0,0.3);
    width:300px;
    height: 170px;
    margin-left: -150px;
    margin-top: -85px;
}
.price-type-popup-body{
    padding: 20px;
}
.price-type-popup-body .input-block{
    width: 180px;
    margin: 0 auto;
}
.price-type-popup.hide{
    display:none;
}
.price-note{
    margin-top:5px;
    color:#FC6B40;
    display: flex;
    align-items: center;
    justify-content: center;
}
#application-view{
    position: relative;
    padding-top: 7px;
}
.application-nds{
    position:absolute;
    top:130px;
    right: 5px;
    width:230px;
    display: flex;
    align-items: center;
    z-index:100;
}
.application-nds span{
    display: inline-block;
}

.new-service-input{
    width: 110px;
    height: 30px;
    border: solid 1px #CDD4D9;
    padding: 7px;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    border-radius: 3px;
    outline: none;
    background: white url(../img/select2.png) left top no-repeat;
}
.notification-scroller{
    height: 200px;
    overflow-y: scroll;
}
.notification-scroller::-webkit-scrollbar {
    width: 4px;
    background-color: transparent;
}
.notification-scroller::-webkit-scrollbar-thumb {
    background-color: #E4EAEF;
    border-radius: 20px;
}
.change-manager-action,
.change-type-action,
.merge-user-action,
.visibility-change {
    color:#FC6B40 !important;
    display: flex;
    align-items: center;
    cursor: pointer;
}
.lead-actions-container{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 25px;
    margin-bottom: 10px;
}
.lead-actions-container > a {
    margin: 0 !important;
    padding: 10px 16px;
    background: #fff;
    border: 1px solid #CDD4D9;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}
.lead-actions-container > a:hover {
    background: #f7f9fa;
    text-decoration: none;
}

.change-popup-body .change-type[name=supplier_id]{
    width: 405px;
}

/* GLOBAL */
.action-right-button{
    display: inline-block;
    width: 30px;
    height: 30px;
    border: solid 1px #CDD4D9;
    border-radius: 4px;
    padding: 5px;
}
.mr10{
    margin-right:10px;
}
.popup-form,
.popup-form-export,
.switch-contact-form{
    width: auto;
    position: fixed;
    left: 50%;
    top:50%;
    transform: translateX(-50%) translateY(-50%);
    z-index: 10002;
    border-radius: 10px;
    background: white;
}
.popup-form-export,
.switch-contact-form{
    display: none;
}
.switch-contact-form{
    width: 400px;
    box-sizing: border-box;
}
.switch-contact-form .field-container > div{
    width: 100%;
}
.switch-contact-form select,
.switch-contact-form .select2-container{
    width: 100% !important;
    box-sizing: border-box;
}
.switch-contact-form .select2-selection__arrow{
    background: #fff;
    height: 40px !important;
    border-left: 1px solid #CDD4D9;
}
.popup-form-export label{
    display:flex;
    align-items: center;;
}
.popup-form-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 70px;
    border-bottom: solid 1px #E8EBF1;
    box-sizing: border-box;
    font-size: 24px;
    padding: 0 30px;
}
.popup-form-body{
    padding: 20px 30px 30px;
}
.popup-form-body .field-container{
    display: flex;
    justify-content: space-between;
}
.popup-form-body .field-container .input-block:first-child{
    margin-right: 10px;
}
/* Export data popup — date fields side by side */
.popup-form.zi10102 .popup-form-body .field-container .input-block,
.popup-form-export.zi10102 .popup-form-body .field-container .input-block{
    flex: 1;
    min-width: 0;
}
.popup-form.zi10102 .popup-form-body .field-container .input-block.mb-0 input,
.popup-form-export.zi10102 .popup-form-body .field-container .input-block.mb-0 input{
    width: 100%;
    box-sizing: border-box;
}
/* Export data popup — tighter gap between date "С" and "по" fields
   (.mb-0 marks the date row in this modal). */
.popup-form.zi10102 .popup-form-body .field-container .input-block.mb-0:first-child,
.popup-form-export.zi10102 .popup-form-body .field-container .input-block.mb-0:first-child{
    margin-right: 6px;
}
/* Export data popup — checkbox columns */
.popup-form.zi10102 .popup-form-body .field-container > div[style],
.popup-form-export.zi10102 .popup-form-body .field-container > div[style]{
    width: 50% !important;
}
.popup-form.zi10102 .popup-form-body .field-container br,
.popup-form-export.zi10102 .popup-form-body .field-container br{
    display: none;
}
.popup-form.zi10102 .popup-form-body .field-container label,
.popup-form-export.zi10102 .popup-form-body .field-container label{
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 2px 0;
    font-size: 13px;
    color: #3D445C;
    cursor: pointer;
}
.popup-form.zi10102 .popup-form-body .field-container label input[type=checkbox],
.popup-form-export.zi10102 .popup-form-body .field-container label input[type=checkbox]{
    appearance: none;
    -webkit-appearance: none;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px;
    flex: 0 0 18px;
    display: inline-block;
    border: 1px solid #dee5ec;
    border-radius: 3px;
    background: #fafbfc;
    cursor: pointer;
    margin: 0;
    padding: 0;
    position: relative;
    transition: background 0.2s, border-color 0.2s;
}
.popup-form.zi10102 .popup-form-body .field-container label input[type=checkbox]:checked,
.popup-form-export.zi10102 .popup-form-body .field-container label input[type=checkbox]:checked{
    background: #FC6B40;
    border-color: #FC6B40;
}
.popup-form.zi10102 .popup-form-body .field-container label input[type=checkbox]:checked::after,
.popup-form-export.zi10102 .popup-form-body .field-container label input[type=checkbox]:checked::after{
    content: '';
    position: absolute;
    top: 2px;
    left: 5px;
    width: 5px;
    height: 9px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
/* Export data popup — datepicker overflow fix */
.popup-form.zi10102 .popup-form-body .field-container .input-block:last-child .qs-datepicker-container,
.popup-form-export.zi10102 .popup-form-body .field-container .input-block:last-child .qs-datepicker-container{
    right: 0;
    left: auto !important;
}
/* Export data popup — toggle fix */
.popup-form.zi10102 .form_toggle-item label,
.popup-form-export.zi10102 .form_toggle-item label{
    display: flex;
    align-items: center;
    justify-content: center;
}
/* Bills export popup — Download button always white text (orange bg) */
.popup-form-export.zi10102 .align-right .crm-button,
.popup-form-export.zi10102 .align-right .crm-button:hover,
.popup-form-export.zi10102 .align-right .crm-button:visited{
    color: #fff;
}
/* popup-form: fixed-width buttons on desktop/tablet */
.popup-form .popup-form-body .align-right .clear-new,
.popup-form .popup-form-body .align-right .cancel,
.popup-form .popup-form-body .align-right .submit,
.popup-form-export.zi10102 .popup-form-body .align-right .crm-button{
    display: inline-block;
    width: 150px;
    box-sizing: border-box;
}
.popup-form.payment-notification-popup{
    height: 90vh;
    overflow: hidden;
}
.popup-payments-list{
    width:740px;
}
.popup-payments-list li{
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 12px 16px;
    gap: 24px;
    width: 740px;
    height: 56px;
    border: 1px solid #E8EBF1;
    border-radius: 4px;
    margin-bottom: 20px;
}
.popup-form.payment-notification-popup .popup-form-body{
    height: calc(90vh - 70px - 20px - 30px);
    overflow-y: scroll;
}
.popup-form.payment-notification-popup .popup-form-body .accept-payment-button{
    color:#fff;
}
.bills-search-form .field-container .input-block input[type=checkbox]{
    width: 15px;
    height: 15px;
    display:inline-block;
}
.bills-search-form .field-container .input-block .checkbox-label{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-right: -100px;
    margin-top:10px;
}
.bill-months{

}
.bill-months.hide{
    display: none;
}
.bill-months .input-block{
    display: block;
}
.payment-sideblock-body .tab-item .bill-months .input-block label{
    display:flex;
    align-items: center;
    justify-content: flex-start;
}
.payment-sideblock-body .tab-item .bill-months .input-block input[type=checkbox]{
    width: 17px;
    height:17px;
    margin-right: 5px;
}
.placing-bill{
    background: #f0f0f0;
}
.bill-detials-1,
.bill-detials-8{
    background: /*#FFE6D0;*/ rgba(0, 255, 0, 0.1);
}
.bill-detials-2{
    background: /*#F7E1FF;*/ rgba(255, 255, 0, 0.1)
}
.bill-detials-6{
    background: /*#F7E1FF;*/ /*rgba(255, 168, 0, 0.2)*/ /*#FFF0EC*/ rgba(255, 240, 236, 0.7);
}
.bill-detials-9{
    background: #ccffff;
}
.bill-detials-10{
    background: rgba(255, 172, 172, 0.35);
}
.input-block span.error.error-link{
    color: #3e445b;
}
.error-link a{
    color: #FC6B40;
}
.field-container .input-block input[type=checkbox]{
    width: 16px;
    height: 16px;
}
.field-container.view-fix .input-block{
    flex: 1;
}
.field-container.view-fix .input-block:nth-child(2){
    padding-left: 15px;
}
.field-container.view-fix .input-block label{
    display: flex;
}
.bills-table .data-td{
    position: relative;
}
.bills-table .data-thead .data-td svg{
    position: absolute;
    right: 0;
    top: 10px;
}
.bills-table .data-thead .data-td svg.up path:nth-child(2){
    fill: white;
}
.bills-table .data-thead .data-td svg.down path:nth-child(1){
    fill: white;
}
.bills-table .data-thead .data-td:hover svg path{
    fill: #3D445C !important;
}

.global-loader {
    color: #FC6B40;
    font-size: 10px;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    position: fixed;
    left:35px;
    top:35px;
    z-index:101111;
    text-indent: -9999em;
    animation: mulShdSpin 1.3s infinite linear;
    transform: translateZ(0);
}
span.edit{
    cursor: pointer;
    /*position: absolute;
  top: 16px;
  right: 29px;*/
    display: inline-block;
    width: 30px;
    height: 30px;
    border: solid 1px #CDD4D9;
    border-radius: 4px;
    padding: 5px;
}
.leads-main-row.current span.edit svg{
    transform: rotateZ(180deg);
}
.row-inner-tabs{

}
.row-inner-tabs-nav{
    border-bottom: solid 1px #CDD4D9;
}
.row-inner-tabs-nav ul{
    list-style: none;
    margin: 0;
    margin-bottom: -1px;
    padding: 0;
}
.row-inner-tabs-nav ul li{
    display: inline-block;
    border-bottom: solid 2px rgba(0,0,0,0);
    color: #FC6B40;
    cursor: pointer;
    margin-right: 24px;
    padding-bottom: 10px;
    font-family: 'Helvetica Neue';
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
}
.row-inner-tabs-nav ul li.active,
.row-inner-tabs-nav ul li:hover{
    display: inline-block;
    border-bottom: solid 2px #FC6B40;
    color: #3D445C;
}
.row-inner-tabs .tabs-content .tabs-item{
    display: none;
}
.row-inner-tabs .tabs-content .tabs-item.active{
    display: block;
}
.row-inner-tabs .tabs-content .tabs-item.message-tab{
    padding:20px;
    background: #fff;
}
.row-inner-tabs .tabs-content .tabs-item.message-tab .info-table{

}
.row-inner-tabs .tabs-content .tabs-item.message-tab .info-table .info-tr{
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 15px;
    padding-bottom: 15px;
}
.row-inner-tabs .tabs-content .tabs-item.message-tab .info-table .info-tr .info-td{
    font-family: 'Helvetica Neue';
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    color: #8B8F9D;
}
.row-inner-tabs .tabs-content .tabs-item.message-tab .info-table .info-tr .info-td:nth-child(1){
    flex: 0.5;
}
.row-inner-tabs .tabs-content .tabs-item.message-tab .info-table .info-tr .info-td:nth-child(2){
    flex: 1.5;
    color: #3D445C;
    word-break: break-all;
    overflow-wrap: break-word;
}
.row-inner-tabs .tabs-content .tabs-item.message-tab .info-table .info-tr .info-td a{
    color: #FC6B40;
}
.bills-search-form .field-container .input-block.small-input-block,
.mw1366 .field-container .input-block.small-input-block,
.input-block.small-input-block input[type=text]{
    width: 150px;
}
.bookkeeper-bills-page .data-table .data-tr.bills-item.hide{
    display:none;
}
.short_select{
    width: 150px !important;
}
.bills-search-form .field-container .input-block.small-input-block .short_select + span{
    width: 150px !important;
}
.contract-client-details{
    position: absolute;
    right: 250px;
    top: 110px;
}
.posts-block .input-block input.setting-input{
    width: 450px;
}
.data-table .contract-info{
    flex-flow: column;
}
.ib-1-5{
    width: 468px;
}
.posts-block .input-block.ib-1-5 input{
    width: 468px;
}
.comment-value.editable{
    min-height: 20px;
    border: solid 1px rgba(0,0,0,0.1);
    padding:5px;
    outline: none;
}
.payment-info-table{

}
.payment-info-table td{
    border: solid 1px #CDD4D9;
    padding: 12px;
}
.payment-info-table-header td{
    font-style: normal;
    font-weight: 500;
    font-size: 11px;
    line-height: 13px;
    text-transform: lowercase;
}

span.fs15{
    display: block;
    margin-top: 20px;
    font-size: 18px;
    font-weight: 500;
}

.cancel-border{
    margin-right: 15px;
    border: solid 1px #CDD4D9;
}
.suppliers-thead{
    border-top: solid 1px #CDD4D9;
    border-bottom: solid 1px #CDD4D9;
}
.delete-operation{
    display: flex;
    align-items: center;
    background: #fff;
    padding: 5px 4px;
    border-radius: 4px;
    border: 1px solid #CDD4D9;
    margin-left: 8px;
}
.content-details .right-block{
    padding: 0;
}
.new-cancel-button{
    border: 1px solid #CDD4D9;
    margin-right: 8px;
    min-width: 150px;
    box-sizing: border-box;
    text-align: center;
}
.up-down-new{
    display: inline-block;
    width: 30px;
    height: 30px;
    border: solid 1px #CDD4D9;
    border-radius: 4px;
    padding: 5px;
}
.up-down-new2{
    display: inline-block;
    width: 30px;
    height: 30px;
    border: solid 1px #CDD4D9;
    border-radius: 4px;
    padding: 5px;
}
.supplier-block.current .up-down-new svg{
    transform: rotateZ(180deg);
}
.select-in-title-block {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 20px;
}
.select-in-title-block .info-block-title {
    margin-bottom: 0 !important;
}
.select-in-title-block .select2 {
    margin: 0;
}
#supplier-clients-placement-period{
    width: 250px;
}

/** calls **/
.messages-tab{
    height: 33px;
    margin-bottom: 15px;
}
.messages-tab .tab-selector{
    margin-right: 8px;
    padding: 8px 16px;
    font-size: 13px;
    font-weight: bold;
    line-height: 17px;
    color: #3D445C;
}
.messages-tab .tab-selector.active,
.messages-tab .tab-selector:hover{
    color: #FC6B40;
    background: #FFF0EC;
    border-radius: 16px;
}
.client-messages-data .tab-item{
    display:none;
}
.client-messages-data .tab-item.active{
    display: block;
}

/* --- Chat message bubbles --- */
.chat-messages {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 4px 0;
}
.chat-msg {
    display: flex;
    width: 100%;
}
.chat-msg--visitor { justify-content: flex-start; }
.chat-msg--agent   { justify-content: flex-start; padding-left: 300px; }
.chat-bubble {
    max-width: 65%;
    padding: 10px 14px;
    border-radius: 12px;
    font-size: 13px;
    line-height: 1.5;
    word-break: break-word;
    overflow-wrap: break-word;
}
.chat-msg--visitor .chat-bubble {
    background: #F0F2F5;
    border-bottom-left-radius: 4px;
    color: #3D445C;
}
.chat-msg--agent .chat-bubble {
    background: #FFF0EC;
    border-bottom-right-radius: 4px;
    color: #3D445C;
}
.chat-bubble .chat-author {
    font-size: 11px;
    font-weight: 700;
    margin-bottom: 4px;
}
.chat-msg--visitor .chat-bubble .chat-author { color: #8B8F9D; }
.chat-msg--agent   .chat-bubble .chat-author { color: #FC6B40; }
.chat-bubble .chat-text { font-size: 13px; }
.chat-bubble .chat-time {
    font-size: 10px;
    color: #ABABAB;
    margin-top: 5px;
    text-align: right;
}
.chat-session-sep {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 6px 0;
    color: #B0B5C4;
    font-size: 11px;
}
.chat-session-sep::before,
.chat-session-sep::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #E8EBF1;
}
.chat-session-sep span {
    white-space: nowrap;
}

.call-item{
    display: flex;
    /*align-items: center;*/
    justify-content: flex-start;
    padding: 20px;
    border-top: solid 1px #E8EBF1;
}
.call-item .call-ico{
    margin-right: 16px;
    /*display: flex;*/
}
.call-item .user-info {
    width: 235px;
    margin-right: 15px;
}
.call-item .user-info .manager-name{
    font-size: 13px;
    color:#3D445C;
}
.call-item .user-info .call-date{
    font-size: 13px;
    color:#8B8F9D;
}
.call-item .user-post{
    width: 235px;
    margin-right: 15px;
    font-size: 13px;
    color:#3D445C;
}
.call-item .phone{
    width: 235px;
    margin-right: 15px;
    font-size: 13px;
    color: #FC6B40;
}
.call-item .billsec{
    flex: 0 0 235px;
    margin-right: 15px;
    font-size: 13px;
    color:#8B8F9D;
}
.billsec-item {
    display: block;
}
.call-item .link2file{
    font-size: 13px;
}
.call-item .link2file a{
    font-size: 13px;
    color: #FC6B40;
}
.external-call,
.external-call-form{
    width: 180px;
    height: 42px;
    color:#fff !important;
    background: #4FB14B;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 13px;
    line-height: 17px;
    font-weight: bold;
    cursor: pointer;
    border-radius: 4px;
    padding: 0 12px;
}
.binotel-get-call{
    cursor: pointer;
}
.link2file audio{
    width: 250px;
}
.call-details-row {
    display: flex;
    margin-bottom: 15px;
}
.call-details-row .link2file {
    flex: 0 0 250px;
}
.call-employee {
    flex: 0 0 235px;
    padding-left: 10px;
    margin-right: 15px;
    box-sizing: border-box;
}
.call-details-row .link2file a.binotel-get-call,
.call-item > .link2file a.binotel-get-call,
.transcription-col a.show-transcription {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    padding: 0 20px;
    box-sizing: border-box;
    border-radius: 4px;
    border: 1px solid #FC6B40;
    background: #fff;
    color: #FC6B40;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.call-details-row .link2file a.binotel-get-call:hover,
.call-item > .link2file a.binotel-get-call:hover,
.transcription-col a.show-transcription:hover {
    background: #FC6B40;
    color: #fff;
}
/** Calls in client  **/
.message-item .slide-up-down span{
    display: inline-block;
    width: 14px;
    height: 14px;
    cursor: pointer;
}
.message-item.open .slide-up-down span{
    transform: rotate(180deg);
}
.messages-block{
    display:block;
    padding: 0 20px 20px;
}
.messages-block.hide{
    display:none;
}
.messages-block div{
    width: 460px;
    background: #F9F9FA;
    border-radius: 8px 8px 8px 0px;
    padding:10px;
}
.messages-block div.right-side{
    margin-left: auto;
    text-align:right;
    background: #F2F5FB;
    border-radius: 8px 8px 0px 8px;
}
.messages-block div strong{
    font-size: 14px;
    line-height: 17px;
    font-weight: 500;
}
.messages-block div sapn.date{
    color: #AAADB1;
    font-size: 13px;
    line-height: 18px;
}
.posts-block .input-block.binotel-manager-options{
    margin:0;
}
.binotel-manager-options label{
    width:320px;
}
.binotel-manager-options input[type=radio]{
    position:relative;
    opacity: 1;
    width: 13px;
    height:13px;
}
.binotel-manager-options select.manager-list{
    height: 40px;
    border: 1px solid #CDD4D9;
    border-radius:4px;
    margin-left: 15px;
    padding: 0 5px;
}
select.manager-list2{
    height: 100px;
    border: 1px solid #CDD4D9;
    border-radius:4px;
    margin-left: 15px;
    padding: 0 5px;
    width:320px;
}
/** END CALLS **/
.informer.editable{
    cursor: pointer;
}
.informer2.editable{
    cursor: pointer;
}
.payment-status{
    width: 263px;
}
.payments-group-header{
    padding: 10px 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.tab-btn{
    margin-right: 8px;
    padding: 8px 16px;
    font-size: 13px;
    font-weight: bold;
    line-height: 17px;
    color: #3D445C;
    cursor:pointer;
}
.tab-btn:hover,
.tab-btn.active{
    color: #FC6B40;
    background: #FFF0EC;
    border-radius: 16px;
}
.payments-tabs .tab{
    display:none;
}
.payments-tabs .tab.active{
    display:block;
}
.client-company-title{
    padding:10px;
    font-weight: 600;
}
.spc-fc .input-block{
    margin-right: 10px;
}
.spc-fc .input-block [type=text]{
    background:#fff;
}
.spc-fc .btn-style{
    height: 42px;
    padding: 0 15px;
}
#supplier-payment-form select{
    display: none;
}

.with-filter{
    position: relative;
}
.row-filter{
    position: absolute;
    left: 0;
    top: 40px;
    background: #fff;
    z-index: 10;
    padding: 15px;
    border: solid 1px #ccc;
}
.row-filter.hide{
    display: none;
}
.filter-ico{
    margin-left:10px;
}
.leads-col.with-filter{
    position: relative;
    overflow: visible;
}
.row-filter label{
    display: flex;
    align-items: center;
    font-size: 14px;
    white-space: nowrap;
    margin-bottom:10px;
}
.row-filter label input[type=checkbox]{
    margin-right: 10px;
}
.leads-apply-filter{
    padding: 0 20px;
}
.client-contact-select{
    width:360px;
}
.select2-dropdown--below.w350{
    width:350px !important;
}
.supplier-row input.owner-price,
.supplier-row input.supplier-price{
    width: 50px;
}
.bank-details-block{
    position: relative;
    padding-bottom: 60px;
}
.bank-details-line{
    display:flex;
    flex-direction: row;
    flex-wrap: wrap;
    position: relative;
}
.bank-details-add{
    position: absolute;
    right: 0px;
    bottom: 10px;
    min-width: 150px;
    width: auto;
    height: 42px;
    line-height: 42px;
    box-sizing: border-box;
    border-radius: 4px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    text-align: center;
    cursor:pointer;
    background: #FC6B40;
    border: none;
    padding: 0 14px;
    color:#fff;
}
.bank-details-del{
    position: absolute;
    right: -35px;
    top: 7px;
    width: 30px;
    height: 30px;
    border: 1px solid #CDD4D9;
    display: flex;
    align-items: center;
    justify-content: space-around;
    border-radius: 3px;
    background: #fff;
    cursor:pointer;
}
.addition-contact-del{
    position: absolute;
    right: -35px;
    top: 7px;
    width: 30px;
    height: 30px;
    border: 1px solid #CDD4D9;
    display: flex;
    align-items: center;
    justify-content: space-around;
    border-radius: 3px;
    background: #fff;
    cursor:pointer;
}
.bank-details-line:first-child .bank-details-del{
    top:27px;
}
.bank-details-add.hide{
    display:none;
}
#export-supplier{
    background: #fff;
    margin-right: 10px;
    border: 1px solid #CDD4D9;
    padding-top:0px;
    padding-bottom:0px;
    line-height: 42px;
}

.manager-calls-header{
    margin-top: 10px;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
}
.manager-calls-header .call-tab-selector{
    margin-right: 8px;
    padding: 8px 16px;
    font-size: 13px;
    font-weight: bold;
    line-height: 17px;
    color: #3D445C;
    margin-bottom:10px;
}
.manager-calls-header .call-tab-selector.active,
.manager-calls-header .call-tab-selector:hover{
    color: #FC6B40;
    background: #FFF0EC;
    border-radius: 16px;
}
.manager-calls.hide{
    display: none;
}

/*KANBAN*/
.kanban{
    overflow-x: scroll;
    overflow-y: hidden;
    position: relative;
    background: #e7ebee;
    border-left: solid 5px #e7ebee;
    border-right: solid 5px #e7ebee;
    border-top: solid 5px #e7ebee;
}
.kanban-body{
    height: 649px;
    width: 2850px;
    cursor: move;
    /*background: #e7ebee;*/
    /*display: flex;
    flex-direction: row;
    justify-content: space-between;*/

}
#kanban_col-7{
    margin-right: 0;
}
.kanban-item{
    width: 360px;
    background: #f6f7f9;
    padding: 13px;
    border-radius: 3px;
    float: left;
    margin-right: 16px;
    cursor: default;
    /*position: absolute;*/
}
#kanban_col-1.colored{
    background: rgba(255,255,0,0.25);
}
#kanban_col-2.colored{
    background: rgba(0,255,0,0.25);
}
#kanban_col-3.colored{
    background: rgba(0,255,255,0.25);
}
#kanban_col-4.colored{
    background: rgba(74,134,232,0.25);
}
#kanban_col-5.colored{
    background: rgba(0,0,255,0.25);
}
#kanban_col-6.colored{
    background: rgba(153,0,255,0.25);
}
#kanban_col-7.colored{
    background: rgba(255,0,0,0.25);
}
#kanban_col-8.colored{
    background: rgba(0,0,255,0.25);
}
#kanban_col-9.colored{
    background: rgba(0,255,0,0.25);
}
#kanban_col-10.colored{
    background: rgba(0,255,0,0.25);
}
#kanban_col-11.colored{
    background: rgba(255,0,0,0.25);
}
#kanban_col-12.colored{
    background: rgba(0,255,0,0.25);
}
#kanban_col-13.colored{
    background: rgba(0,255,0,0.25);
}
#kanban_col-14.colored{
    background: rgba(0,255,0,0.25);
}
#kanban_col-1.colored.opacity-05,
#kanban_col-2.colored.opacity-05,
#kanban_col-3.colored.opacity-05,
#kanban_col-4.colored.opacity-05,
#kanban_col-5.colored.opacity-05,
#kanban_col-6.colored.opacity-05,
#kanban_col-7.colored.opacity-05,
#kanban_col-8.colored.opacity-05
{
    background: #f6f7f9;
}
.kanban-item-header{
    border: solid 1px #e8ebf1;
    background:#fff;
    padding: 8px 16px;
    color: #0A274D;
    font-size: 15px;
    font-weight: 500;
    line-height: 18px;
    font-family: "helvetica-neue", sans-serif;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}
.kanban-item-header .opener{
    margin-right: 13px;
    cursor:pointer;
}
.kanban-item-header .opener.closed svg{
    transform: rotateZ(180deg);
}
.kanban-item-header .item-name{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
}
.kanban-item-header .item-name .count{
    font-size: 13px;
    font-weight: 500;
    line-height: 18px;
    background: #F2F5FB;
    color: #8B8F9D;
    padding: 2px 5px;
    border-radius: 4px;
    margin-left: 8px;
}
.kanban-item-header .item-add{
    margin-left: 13px;
}
.kanban-item-leads{
    margin-top:8px;
    max-height: 574px;
    overflow-y: auto;
    /*scrollbar-width: thin;*/
}
.kanban-item-leads::-webkit-scrollbar {
    width: 4px;
    background-color: #e8ebf1;
}
.kanban-item-leads::-webkit-scrollbar-thumb {
    background-color: #cdd4d9;
    border-radius: 20px;
}
.lead-item{
    padding: 15px;
    margin-bottom: 10px;
    border: solid 1px #e8ebf1;
    background: #fff;
    width:332px;
    position: relative;
}
.lead-item .lead-title{
    height: 30px;
    width: 288px;
    overflow: hidden;
    padding: 5px 5px 5px 0;
    color: #3D445C;
    font-size: 13px;
    line-height: 18px;
    font-weight: 500;

    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;

    margin-bottom: 5px;
}
.lead-item .lead-title .lead-opener{
    margin-right: 5px;
    cursor: pointer;
    display: flex;
    align-items: center;
}
.lead-item .lead-title .lead-opener.closed svg{
    transform: rotateX(180deg) rotateY(180deg);
}
.lead-item .lead-title .lead-name{
    width:231px;
    display: flex;
    align-items: center;
}
.lead-item .lead-title .lead-name .lead-favorite{
    width: 18px;
    height: 18px;
    cursor:pointer;
    margin-right: 5px;
}
.client-favorite{
    width: 18px;
    height: 18px;
    cursor:pointer;
    margin-right: 5px;
}
.lead-item .lead-data span{
    display:block;
    width: 286px;
    min-height: 18px;
    margin-bottom: 8px;
    color: #3D445C;
    font-size: 13px;
    line-height: 18px;
    padding-left: 28px;
}
.lead-item .lead-data .lead-info-phone{
    background: url("/assets/img/kanban/phone-2.png") left top no-repeat;
}
.lead-item .lead-data .lead-info-email{
    background: url("/assets/img/kanban/mail.png") left top no-repeat;
}
.lead-item .lead-data .lead-info-city{
    background: url("/assets/img/kanban/location.png") left top no-repeat;
}
.lead-item .lead-data .lead-info-created_at{
    background: url("/assets/img/kanban/clock.png") left top no-repeat;
}
.lead-item .lead-data .lead-info-source{
    background: url("/assets/img/kanban/source.png") left top no-repeat;
}
.lead-item .lead-data .lead-info-manager{
    background: url("/assets/img/kanban/user.png") left top no-repeat;
}
.lead-item .lead-data .lead-info-telegram{
    background: url("/assets/img/kanban/telegram.svg") left top no-repeat;
}
.lead-item .lead-data .lead-info-avg-check {
    background: url("/assets/img/kanban/money.svg") left top no-repeat;
}

.lead-item .lead-data .lead-info-call-me {
    background: url("/assets/img/kanban/alarm.svg") left top no-repeat;
    padding-left: 24px;
    display: block;
    font-size: 12px;
    color: #666;
    margin-bottom: 4px;
    font-weight: 500;
    min-height: 20px;
    line-height: 20px;
}

.lead-item .lead-data .lead-info-call-me-overdue {
    color: #DC2626;
    font-weight: 600;
}

/* Import by ID Modal Styles */
.fancybox__container {
    z-index: 99999 !important;
}

.import-by-id-modal {
    position: fixed;
    top: 5%;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    border-radius: 10px;
    width: 1200px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
    z-index: 10001;
}

.import-by-id-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 70px;
    border-bottom: solid 1px #E8EBF1;
    box-sizing: border-box;
    font-size: 24px;
    padding: 0 30px;
}

.import-by-id-modal-header .close-outdoor {
    cursor: pointer;
}

.import-by-id-modal-body {
    padding: 20px 30px 30px;
}

.entry-header_add_by_id {
    display: flex;
    gap: 10px;
    font-weight: bold;
    padding: 0 5px 10px;
    color: #666;
}

.entry-header_add_by_id span {
    width: 10%;
    text-align: left;
}

.id-entry-group_add_by_id .entry_add_by_id {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid #ddd;
}

.entry_add_by_id input {
    padding: 8px 10px;
    border: 1px solid #ccc;
    border-radius: 6px;
    width: 10%;
}

.board-code_add_by_id,
.board-city_add_by_id,
.board-side_add_by_id,
.board-type_add_by_id,
.board-address_add_by_id {
    width: 10%;
    font-size: 14px;
    color: #333;
}

.board-photo_add_by_id {
    width: 10%;
}

.board-photo_add_by_id img {
    max-width: 100px;
    border-radius: 6px;
}

.remove-board-entry_add_by_id {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    background: transparent;
    border: 1px solid #E0E4EA;
    border-radius: 6px;
    cursor: pointer;
    padding: 0;
    flex-shrink: 0;
    transition: background 0.15s, border-color 0.15s;
}

.remove-board-entry_add_by_id:hover {
    background: #F6F7F9;
    border-color: #C8CDD8;
}

.remove-board-entry_add_by_id:active {
    background: #ECEEF2;
    border-color: #B0B6C3;
}

.import-by-id-buttons {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 20px;
}

.btn-style_add_by_id {
    width: 180px;
    height: 42px;
    box-sizing: border-box;
    border-radius: 4px;
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 13px;
    line-height: 39px;
    text-align: center;
    padding: 0 14px;
    cursor: pointer;
}

.btn-primary_add_by_id {
    background: #FC6B40;
    color: #fff;
    border: none;
}

.btn-primary_add_by_id:hover {
    color: white;
}

.btn-style_add_by_id:disabled {
    background: #9ca3af;
    cursor: not-allowed;
}

.btn-secondary_add_by_id {
    background: white;
    color: #FC6B40;
    border: 1px solid #CDD4D9;
}

.board-not-found_add_by_id {
    color: red;
    font-style: italic;
}

/* --- import-by-id inline alert --- */
.import-by-id-alert {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
}
.import-by-id-alert.hide {
    display: none;
}
.import-by-id-alert__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.7);
    border-radius: 16px;
}
.import-by-id-alert__box {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 400px;
    max-width: calc(100% - 32px);
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
    z-index: 1;
}
.import-by-id-alert__box .default-popup-header {
    height: 56px;
    font-size: 18px;
    padding: 0 20px;
}
.import-by-id-alert__box .default-popup-body {
    padding: 16px 20px 20px;
}
.import-by-id-alert__box .default-popup-body p {
    margin: 0 0 16px;
    font-size: 14px;
    color: #3D445C;
}

.close-outdoor {
    position: absolute;
    top: 15px;
    right: 20px;
    cursor: pointer;
}

.close-outdoor svg {
    width: 18px;
    height: 18px;
}

.kanban-item.item-collapse{
    width: 78px;
    height: 355px;
}
.kanban-item.item-collapse .kanban-item-header{
    height: 316px;
    display: block;
    padding: 8px 11px;
}
.kanban-item.item-collapse .kanban-item-header .opener{
    margin-bottom: 8px;
}
.kanban-item.item-collapse .kanban-item-header .item-name{
    display: block;
    height: 225px;
    writing-mode: vertical-lr;
    padding-left: 5px;
}
.kanban-item.item-collapse .kanban-item-header .item-name .count{
    padding: 5px 2px;
    margin-top: 8px;
    margin-left: 0;
    display: inline-block;
}
.kanban-item.item-collapse .kanban-item-header .item-add{
    margin-left: 0;
}

.dots{
    width: 30px;
    height: 30px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-around;
    border: solid 1px #CDD4D9;
    border-radius: 3px;
    margin-left: 5px;
    cursor: pointer;
}
.dots.active{
    background: #F6F7F9;
}
.lead-action-menu-items{
    display: none;
    position: absolute;
    top: 58px;
    right: 11px;
    width:205px;
    background:#fff;
    border-radius: 2px;
    -webkit-box-shadow: 0px 5px 20px 0px rgba(61,68,92,0.4);
    -moz-box-shadow: 0px 5px 20px 0px rgba(61,68,92,0.4);
    box-shadow: 0px 5px 20px 0px rgba(61,68,92,0.4);
    padding:5px;
    z-index: 1;
}
.lead-action-menu-items.active{
    display: block;
}
.lead-action-menu-items .item{
    height:36px;
    display: flex;
    align-items: center;
    justify-content: flex-start;;
}
.lead-action-menu-items .item a{
    margin-left: 13px;
    font-size: 13px;
    color: #3D445C;
}
.zi10100{
    z-index: 10100;
}
.zi10000{
    z-index: 10000 !important;
}
.default-popup.view-lead-popup{
    z-index: 10002;
}
.leads-view-type{
    position: absolute;
    width: 83px;
    height:42px;
    right:20px;
    top:0;
}
.view-item{
    height: 42px;
    width: 42px;
    border: solid 1px #CDD4D9;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    z-index: 1;
    cursor: pointer;
}
.view-item.active,
.view-item:hover{
    border: solid 1px #FC6B40;
    background: #FFF0EC;
    z-index: 2;
}
.view-item:hover{
    z-index:3
}
.view-item.active svg path,
.view-item:hover svg path{
    stroke: #FC6B40;
}
.line-view{
    left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
.box-view{
    right: 0;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}
.row-inner-tabs .tabs-content .tabs-item.status-tab.active,
.status-tab{
    display: flex;
    justify-content: space-between;
}
.status-tab .status-div{
    width: 540px
}
#lead-status-form button[disabled],
.lead-change-status-form button[disabled],
.client-change-status-form button[disabled]{
    opacity: 0.4;
}
.lead-change-status-form,
.client-change-status-form{
    width: 540px;
}
.mw1366 .field-container.call-me-block,
.call-me-block{
    display: block;
}
.call-me-block label.radio-label,
.lead-off-reason label.radio-label{
    padding-left: 28px;
    height: 20px;
    line-height: 20px;
    background: url(/assets/img/kanban/radio.png) left -20px no-repeat;
    font-size: 14px;
    color: #3D445C;
    cursor: pointer;
}
.call-me-block label.radio-label input,
.lead-off-reason label.radio-label input{
    display:none;
}
.call-me-block label.radio-label.checked,
.lead-off-reason label.radio-label.checked{
    background: url(/assets/img/kanban/radio.png) left top no-repeat;
}
.lead-name a:hover{
    color: #FC6B40;
}
.field-container.fd-column{
    flex-direction: column;
}
.new-created-at{
    color: #8B8F9D;
    font-size: 13px;
    font-family: "helvetica-neue", sans-serif;
}
.new-lead-email{
    color: #FC6B40;
    font-size: 13px;
    font-family: "helvetica-neue", sans-serif;
}
.leads-new-name-col,
.leads-contacts-col{
    flex: 1.75;
}
.chaport-ai-icon {
    display: inline-block;
    width: 24px;
    height: 24px;
    border-radius: 3px;
    vertical-align: middle;
}
.lead-class-group {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
    width: fit-content;
}
.new-name-item .class-icon,
.new-name-item > svg {
    vertical-align: middle;
}
.leads-status-col{
    flex: 1.5;
}
.status-bar {
    display: inline-flex;
    width: 132px;
    height: 4px;
    gap: 1px;
    line-height: 0;
    vertical-align: middle;
}
.status-bar-segment {
    flex: 1 1 0;
    height: 3px;
    background: #E8EBF1;
}
.status-bar-segment.is-filled {
    background: #FC6B40;
}
.status-bar-segment:first-child {
    border-radius: 2px 0 0 2px;
}
.status-bar-segment:last-child {
    border-radius: 0 2px 2px 0;
}
.new-name-items{
    display: flex;
    flex-direction: row;
    align-items: center;
}
.lead-block .input-block label.services-label{
    display: flex;
}
.lead-block .input-block label.services-label > input{
    margin-right: 5px;
}

@keyframes mulShdSpin {
    0%,
    100% {
        box-shadow: 0 -3em 0 0.2em,
        2em -2em 0 0em, 3em 0 0 -1em,
        2em 2em 0 -1em, 0 3em 0 -1em,
        -2em 2em 0 -1em, -3em 0 0 -1em,
        -2em -2em 0 0;
    }
    12.5% {
        box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em,
        3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em,
        -2em 2em 0 -1em, -3em 0 0 -1em,
        -2em -2em 0 -1em;
    }
    25% {
        box-shadow: 0 -3em 0 -0.5em,
        2em -2em 0 0, 3em 0 0 0.2em,
        2em 2em 0 0, 0 3em 0 -1em,
        -2em 2em 0 -1em, -3em 0 0 -1em,
        -2em -2em 0 -1em;
    }
    37.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em,
        3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em,
        -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }
    50% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em,
        3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em,
        -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }
    62.5% {
        box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em,
        3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0,
        -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
    }
    75% {
        box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em,
        3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em,
        -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
    }
    87.5% {
        box-shadow: 0em -3em 0 0, 2em -2em 0 -1em,
        3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em,
        -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
    }
}
/* JQUERY POWERTIP */
/**
 * PowerTip
 * https://stevenbenner.github.io/jquery-powertip/
 *
 * Stylesheet for the monochrome (default) theme.
 */

#powerTip {
    cursor: default;
    background-color: #333;
    background-color: rgba(0, 0, 0, 0.8);
    border-color: #333;
    border-color: rgba(0, 0, 0, 0.8);
    border-radius: 6px;
    color: #fff;
    display: none;
    padding: 10px;
    position: absolute;
    white-space: nowrap;
    z-index: 2147483647;
}
#powerTip:before {
    content: attr(class) " ";
    position: absolute;
    height: 0;
    width: 0;
    text-indent: 100%;
    overflow: hidden;
}
#powerTip.n:before, #powerTip.s:before {
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    left: 50%;
    margin-left: -5px;
}
#powerTip.e:before, #powerTip.w:before {
    border-bottom: 5px solid transparent;
    border-top: 5px solid transparent;
    margin-top: -5px;
    top: 50%;
}
#powerTip.n:before,
#powerTip.ne:before, #powerTip.nw:before {
    bottom: -10px;
}
#powerTip.n:before,
#powerTip.ne:before, #powerTip.nw:before ,
#powerTip.nw-alt:before, #powerTip.ne-alt:before {
    border-top-color: inherit;
    border-top-style: solid;
    border-top-width: 10px;
}
#powerTip.e:before {
    border-right-color: inherit;
    border-right-style: solid;
    border-right-width: 10px;
    left: -10px;
}
#powerTip.s:before,
#powerTip.se:before, #powerTip.sw:before {
    top: -10px;
}
#powerTip.s:before,
#powerTip.se:before, #powerTip.sw:before ,
#powerTip.sw-alt:before, #powerTip.se-alt:before {
    border-bottom-color: inherit;
    border-bottom-style: solid;
    border-bottom-width: 10px;
}
#powerTip.w:before {
    border-left-color: inherit;
    border-left-style: solid;
    border-left-width: 10px;
    right: -10px;
}
#powerTip.ne:before, #powerTip.se:before {
    border-right: 10px solid transparent;
    border-left: 0;
    left: 10px;
}
#powerTip.nw:before, #powerTip.sw:before {
    border-left: 10px solid transparent;
    border-right: 0;
    right: 10px;
}
#powerTip.nw-alt:before, #powerTip.ne-alt:before,
#powerTip.sw-alt:before, #powerTip.se-alt:before {
    bottom: -10px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    left: 10px;
}
#powerTip.ne-alt:before {
    left: auto;
    right: 10px;
}
#powerTip.sw-alt:before, #powerTip.se-alt:before {
    border-top: none;
    bottom: auto;
    top: -10px;
}
#powerTip.se-alt:before {
    left: auto;
    right: 10px;
}
/* Litvinenko */
.occupancy-div-percent {
    display: inline-block;
    position: relative;
}

.occupancy-span-percent {
    display: inline-block;
    background: #ccc;
    color: #000;
    text-align: center;
    border-radius: 50%;
    padding: 50% 0;
    width: 100%;
    position: absolute;
    transform: translateY(-50%);
}

.occupancy-text-percent {
    position: relative;
    top: -.5em;
    padding: 0em 0.65em;
}
.occupancy-td{
    height: 50px;
    text-align: center;
}
.occupancy-td-header-text{
    padding-bottom: 20px;
    font-size: medium;
}
.all-occupancy-table,.all-occupancy-td,.all-occupancy-tr{
    width: 100%;
    border: 1px solid black;
    border-collapse: collapse;
    height: 50px;
    padding: 5px;
    text-align: center;
}
.occupancy-table{
    width: 100%;
}
.mfp-close-outdoor {
    color: #333;
}
button.mfp-close-outdoor {
    z-index: 1003;
}
button.mfp-close-outdoor, button.mfp-arrow {
    overflow: visible;
    cursor: pointer;
    background: transparent;
    border: 0;
    -webkit-appearance: none;
    display: block;
    outline: none;
    padding: 0;
    z-index: 1046;
    box-shadow: none;
    touch-action: manipulation;
}

.mfp-close-outdoor {
    width: 44px;
    height: 44px;
    line-height: 44px;
    position: absolute;
    right: 0;
    top: 0;
    text-decoration: none;
    text-align: center;
    opacity: 0.65;
    padding: 0 0 18px 10px;
    font-style: normal;
    font-size: 28px;
    font-family: Arial, Baskerville, monospace;
}
.mfp-close-outdoor {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}
.add-to-contract-from-exist{
    color: white !important;
    cursor: pointer;
    width: 180px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}
.input-block-exist{
    padding-top: 0px;
}
.excel-file-ads{
    padding: 10px;
    text-align: left;
    width: 99%;
    display: inline-block;
}
.forloadads{
    width: 300px;
}
.supplier-type-item{
    display: flex;
    flex-direction: row;
    margin-bottom: 10px;
}
.supplier-type-item input{
    margin-right: 10px;
}
.services-supplier .supplier-type-item input{
    height: auto;
}
.addition-agreements .data-tr{
    padding-left: 30px;
    background: left center url("/assets/img/dots.png") no-repeat;
}

.class-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 3px;
    font-size: 12px;
    flex-shrink: 0;
}

.call-transcription {
    margin-left: 10px;
    padding: 10px;
}
.call-transcription p {
    margin: 5px 0; /* Отступы между абзацами */
    font-weight: normal; /* Обычный вес шрифта */
    font-family: Arial, sans-serif; /* Шрифт */
    line-height: 1.5; /* Межстрочный интервал */
    color: #333; /* Цвет текста */
}

#application_month {
    width: 100%;
    min-height: 38px;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 5px;
}

.multiple-control-layout-popup .control-layout-header,
.control-layout-popup .control-layout-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 16px;
    border-bottom: 1px solid #e0e0e0;
}

.multiple-control-layout-popup .control-layout-title
.control-layout-popup .control-layout-title {
    font-size: 18px;
    font-weight: bold;
    color: #3d445c;
}

.multiple-control-layout-popup .control-layout-body,
.control-layout-popup .control-layout-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 16px;
}

.multiple-control-layout-popup .field-container,
.control-layout-popup .field-container {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.multiple-control-layout-popup .input-block label,
.control-layout-popup .input-block label {
    font-size: 14px;
    font-weight: 500;
    color: #3d445c;
}

.multiple-control-layout-popup .input-block input,
.multiple-control-layout-popup .input-block select,
.control-layout-popup .input-block input,
.control-layout-popup .input-block select {
    width: 100%;
    padding: 8px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.multiple-control-layout-popup .input-block select[multiple],
.control-layout-popup .input-block select[multiple] {
    height: auto;
}

.control-layout-image-popup {
    position: fixed;
    top: 41%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    padding: 15px;
    z-index: 99999; /* popup выше overlay */
    border-radius: 10px;
    display: none;
}

.popup-content, .custom-popup-content {
    position: relative;
    text-align: center;
}

.popup-content img {
    max-width: 100%;
    max-height: 80vh;
}

.custom-popup-content img {
    min-width: 1000px;
    max-width: 100%;
    max-height: 80vh;
}

.nav-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(0, 0, 0, 0.5);
    color: white;
    border: none;
    padding: 10px;
    font-size: 20px;
    cursor: pointer;
    z-index: 10;
    transition: background-color 0.3s;
}

#layout-prev-image {
    left: 10px;
}

#layout-next-image {
    right: 10px;
}

.nav-btn:hover {
    background-color: rgba(0, 0, 0, 0.8);
}
/* Thumbnails Container at the Bottom */
.image-thumbnails-container {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.7); /* Dark background for better visibility */
    padding: 10px 0;
    z-index: 100000;
    overflow-x: hidden; /* Hide horizontal scroll */
    display: flex;
    flex-wrap: wrap; /* Allow thumbnails to wrap */
    justify-content: center;
}
.image-thumbnails-container.hide{
    display: none;
}

/* Thumbnails List Styling */
.thumbnails-list {
    display: flex;
    gap: 8px;
    padding: 0;
    list-style: none;
    flex-wrap: wrap; /* Allow wrapping of thumbnails */
    justify-content: flex-start; /* Align thumbnails to the left */
}

.thumbnails-list li {
    width: 80px;
    height: 80px;
    cursor: pointer;
    opacity: 0.6;
    transition: opacity 0.3s;
}

.thumbnails-list li.active {
    opacity: 1;
    border: 2px solid #ffa500; /* Orange border for active thumbnail */
}

.thumbnails-list img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.thumbnails-list li:hover {
    opacity: 1;
}





.close-popup {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    font-size: 24px;
}


.multiple-control-layout-popup .bg-white {
    border-radius: 1rem;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
    max-width: 100%;
}

.multiple-control-layout-popup .multiple-control-layout-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e5e7eb;
    padding: 1rem;
}

.multiple-control-layout-popup .multiple-control-layout-title {
    font-size: 1.25rem;
    font-weight: 600;
    color: #2d3748;
}

.multiple-control-layout-popup .close {
    cursor: pointer;
    color: #4b5563;
    transition: color 0.3s ease;
}

.multiple-control-layout-popup .close:hover {
    color: #e11d48;
}

.multiple-control-layout-popup .multiple-control-layout-body {
    padding: 1rem;
    background-color: #ffffff;
}

.multiple-control-layout-popup .applications-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.multiple-control-layout-popup .applications-list p {
    color: #9ca3af;
    font-size: 0.875rem;
}

.multiple-control-layout-popup .application-form-action {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 1rem;
    background-color: white;
    border-top: 1px solid #e5e7eb;
}

.layout-applications-table {
    width: 100%;
    border-collapse: collapse;
}

.layout-applications-table th, .layout-applications-table td {
    border: 1px solid #e5e7eb;
    padding: 0.75rem;
}

.layout-applications-table th {
    background-color: #f3f4f6;
    font-weight: 600;
    text-align: left;
}

.layout-applications-table td {
    text-align: left;
}

.layout-applications-table tbody tr:hover {
    background-color: #f9fafb;
}

.custom-bubble-image-container {
    position: absolute;
    display: inline-block;
}
.boards-td .custom-bubble-image-container {
    position: static;
    display: block;
    text-align: center;
}
.boards-td-photoreport {
    text-align: center;
}

.custom-bubble-image-container img {
    transition: opacity 0.3s ease;
}

.custom-bubble-image-container .hover-image {
    display: none;
    position: absolute;
    top: -250%; /* To center the image relative to the cursor */
    right: +250%; /* Make sure the image appears to the left of the cursor */
    z-index: 10;
    width: 400px; /* Increased width */
    height: auto; /* Proportional height */
    max-height: 600px; /* Max height to keep it within reasonable bounds */
    transition: left 0.1s ease, top 0.1s ease;
}

.custom-bubble-image-container:hover .hover-image {
    display: block;
}

.transcription-col a{
    cursor:pointer;
    color: #f76a47 !important;
}
.transcription-col{
    flex: 0 0 180px;
    padding-left: 40px;
    box-sizing: border-box;
}
.transcription-block{
    padding: 0 20px 20px;
    display:none;
}
.show-transcription-text{
    cursor: pointer;
    color: #f76a47 !important;
    margin: 25px 0 0;
    display: inline-block;
}
.transcription-text{
    display:none;
}
.service-detailing{
    background: #FC6B40;
    padding: 10px;
    color: #fff !important;
    border-radius: 3px;
}

#file_list {
    list-style-type: none;
    padding: 0;
}

#file_list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.al-selected-filter {
    display: flex;
    align-items: center;
    flex-flow: row wrap;
}

.al-selected-filter .selected-filter-item {
    padding: 5px 10px;
    border-radius: 5px;
    background: #FFF0EC;
    margin-right: 10px;
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.al-selected-filter .selected-filter-item img {
    margin-left: 10px;
    cursor: pointer;
}



.app-without-detailed-services{
    background: rgba(255, 255, 0, 0.5);
}

.photo-report-checkbox-col {
    width: 40px;
    text-align: center;
}

.photo-report-checkbox-col input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
    appearance: none;
    background-color: white;
    border: 2px solid #FC6B40;
    border-radius: 4px;
    position: relative;
}

.photo-report-checkbox-col input[type="checkbox"]:checked {
    background-color: #FC6B40;
    border-color: #FC6B40;
}

.photo-report-checkbox-col input[type="checkbox"]::before {
    content: "✔";
    font-size: 14px;
    color: white;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: none;
}

.photo-report-checkbox-col input[type="checkbox"]:checked::before {
    display: block;
}
.modified-alert{
    flex-basis: 100%;
    display: flex;
    color: #FC6B40;
    font-size: 18px;
    justify-content: center;
}

.offer-link-container{
    width: 500px;
}
.new-refund{
    width: 1000px;
    height: auto;
    transform: translate(calc(-50% + 161px), calc(-50% + 122px));
}
.new-refund table td{
    padding: 10px;
}
.new-refund table td .refund-input{
    width: 110px;
}
.kanban-tabs .tab-item {
    padding: 8px 16px;
    background: #f3f4f6;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 500;
    color: #3D445C;
    transition: background 0.3s;
}

.kanban-tabs .tab-item:hover {
    background: #e0e0e0;
}

.kanban-tabs .tab-item.active {
    background: #FC6B40;
    color: white;
}
.confirm-documents {
    position: fixed;
    left: 50%;
    top: 50%;
    width: 420px; /* немного уже */
    max-width: 90%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
    z-index: 10002;
    display: none;
    padding: 18px 22px; /* уменьшенные отступы */
}
.confirm-documents .popup-body p {
    font-size: 15px;
    margin: 0;
    padding: 6px 0 10px;
    color: #333;
    text-align: center;
    line-height: 1.4;
}
.confirm-documents .buttons {
    display: flex;
    gap: 10px;
    justify-content: center; /* кнопки по центру */
    margin-top: 16px;
}
/* Communications*/
.lead-block .four-items .input-block,
.lead-block .four-items .input-block input{
    width: 251px;
}

.regeneration-warning-banner.hide {
    display: none;
}


/* Financial indicators */
.fi-row {
    background: #f8f9fa;
    border-top: 1px dashed #dee2e6;
    padding: 6px 15px;
    font-size: 11px;
}
.fi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 4px 12px;
}
.fi-cell {
    padding: 3px 6px;
}
.fi-cell--debug {
    background: #fff3cd;
    padding: 3px 6px;
    border-radius: 3px;
}
.fi-label {
    color: #6c757d;
    font-size: 10px;
}
.fi-label--debug {
    color: #856404;
    font-size: 10px;
}
.fi-value {
    font-weight: 600;
    color: #3d445c;
}
.fi-value--debug {
    font-weight: 600;
    color: #533f03;
}
/* Client card - financial debug row */
.fi-debug-row {
    background: #fff3cd;
}
/* Inline financial columns in contracts table */
.clients-contracts-data .data-table.has-fi-cols .data-thead .data-td.td-name,
.clients-contracts-data .data-table.has-fi-cols .data-tbody .data-td.td-name {
    flex: 4;
    min-width: 0;
}
.clients-contracts-data .data-table.has-fi-cols .data-tbody .data-td.td-name .contract_title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-word;
    line-height: 1.4;
}
.data-table .data-td.fi-col-td {
    font-weight: 600;
    font-size: 12px;
    color: #3d445c;
    padding: 24px 6px;
}
.data-table .data-thead .data-td.fi-col-td {
    font-weight: 500;
    font-size: 10px;
    white-space: nowrap;
    padding: 12px 6px;
}
/* Fix alignment of financial columns in contracts table */
.clients-contracts-data .data-table.has-fi-cols .data-td.fi-col-td {
    flex: 0 0 100px;
    text-align: center;
    justify-content: center;
}
.clients-contracts-data > .data-table.has-fi-cols > .data-thead .data-td.action-col,
.clients-contracts-data .data-table.has-fi-cols .data-tr.tr-action > .data-td.action-col {
    flex: 0 0 240px;
    flex-wrap: wrap;
}
.clients-contracts-data .data-table.has-fi-cols .data-td.f2 {
    flex: 1 !important;
}
.clients-contracts-data .data-table.has-fi-cols .data-tr.tr-action > .data-td.action-col > .data-td.action-col {
    flex: 0 0 auto;
}
/* Markup toggle (actual / planned) */
.fi-markup-planned { display: none; }
.fi-markup-header { user-select: none; }
.fi-markup-header:hover .fi-markup-toggle-icon { opacity: 1 !important; }
/* Analytics 3-column grid on client view */
.analytics-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
}
.analytics-col {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.analytics-col--debug {
    background: #fff3cd;
    border-radius: 6px;
    padding: 0 10px;
}
.analytics-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 4px 0;
}
.analytics-row .analytics-label {
    color: #6c757d;
    font-size: 12px;
}
.analytics-row .analytics-value {
    font-weight: 600;
    font-size: 13px;
    color: #3d445c;
}
.analytics-row .analytics-value--debug {
    font-weight: 600;
    font-size: 13px;
    color: #533f03;
}
.fi-value--profitability {
    color: #b8860b !important;
}
.fi-value--bonus {
    color: #2563eb !important;
}
/* Planned analytics section on client view */
.analytics-planned-section {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px dashed #dee2e6;
}
.analytics-planned-title {
    font-size: 14px;
    font-weight: 600;
    color: #2563eb;
    margin: 0 0 2px 0;
}
.analytics-planned-hint {
    font-size: 11px;
    color: #6c757d;
    margin-bottom: 8px;
}
.analytics-col--planned-debug {
    background: #dbeafe;
    border-radius: 6px;
    padding: 0 10px;
}
/* Popup financial tab */
.act-popup-sub-title .custom-popup-fi {
    margin-left: 20px;
    font-weight: bold;
    cursor: pointer;
}
.act-popup-sub-title .custom-popup-fi::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 7px 7px 0 7px;
    border-color: transparent transparent transparent transparent;
    transition: border-color 0.3s ease, border-width 0.3s ease;
    z-index: -1;
}
.act-popup-sub-title .custom-popup-fi.active::after {
    border-bottom-color: orange;
}
.act-popup-sub-title .custom-popup-fi.active {
    color: orange;
}
.custom-fi-popup .fi-popup-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 16px;
    padding: 12px 5px;
}
.custom-fi-popup .fi-popup-cell {
    padding: 6px 8px;
}
.custom-fi-popup .fi-popup-cell--debug {
    background: #fff3cd;
    padding: 6px 8px;
    border-radius: 4px;
}
.custom-fi-popup .fi-popup-label {
    color: #6c757d;
    font-size: 10px;
    margin-bottom: 2px;
}
.custom-fi-popup .fi-popup-value {
    font-weight: 600;
    font-size: 13px;
    color: #3d445c;
}
.custom-fi-popup .fi-popup-section-title {
    font-weight: 700;
    font-size: 12px;
    color: #3d445c;
    padding: 0 5px;
    margin-top: 4px;
}
.custom-fi-popup .fi-popup-section-hint {
    font-size: 10px;
    color: #9ca3af;
    padding: 0 5px 4px;
    font-style: italic;
}
.custom-fi-popup .fi-popup-grid--planned {
    background: #eff6ff;
    border-radius: 6px;
    border: 1px solid #bfdbfe;
}
.custom-fi-popup .fi-popup-cell--planned {
    padding: 6px 8px;
}
.custom-fi-popup .fi-breakdown-board {
    margin: 6px 5px 0;
}
.custom-fi-popup .fi-breakdown-board-title {
    font-weight: 600;
    font-size: 11px;
    color: #3d445c;
    padding: 2px 0;
}
.custom-fi-popup .fi-breakdown-prices {
    font-weight: 400;
    color: #9ca3af;
    font-size: 10px;
}
.custom-fi-popup .fi-breakdown-table {
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid #e5e7eb;
    font-size: 11px;
    margin-bottom: 2px;
}
.custom-fi-popup .fi-breakdown-row {
    display: flex;
    border-top: 1px solid #e5e7eb;
}
.custom-fi-popup .fi-breakdown-row:first-child {
    border-top: none;
}
.custom-fi-popup .fi-breakdown-row--paid {
    background: #f0fdf4;
}
.custom-fi-popup .fi-breakdown-row--unpaid {
    background: #fef2f2;
}
.custom-fi-popup .fi-breakdown-cell {
    padding: 3px 8px;
    color: #3d445c;
    flex: 1;
}
.application-deactivate-popup .input-block,
#deactivate_note{
    /*width: 263px;*/
    width: 100%;
}
.aac{
    display: block;
    padding: 7px;
    border: solid 1px #cdd4d9;
    cursor: pointer;
    background: #fff;
    border-radius: 3px;
    font-size: 15px;
    font-weight: bold;
    text-align: center;
}
.aac:hover{
    background: #FC6B40;
    border-color:#FC6B40;
    color: #fff;
}

/* Task modals - общие стили для модалок задач */
.task-popup-create,
.task-popup-edit,
.task-postpone-popup,
.task-complete-popup {
    width: 800px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
}

.task-popup-create .default-popup-body,
.task-popup-edit .default-popup-body,
.task-postpone-popup .default-popup-body,
.task-complete-popup .default-popup-body {
    overflow-y: auto;
    flex: 1;
    max-height: calc(90vh - 60px);
}

.task-popup-edit .default-popup-body.task-modal-tab-content {
    display: none;
}

.task-popup-edit .default-popup-body.task-modal-tab-content.active {
    display: block;
}

/* Task modal tabs */
.task-modal-tabs {
    display: flex;
    border-bottom: 2px solid #E5E5E5;
    padding: 0 30px;
    background: #fff;
    flex-shrink: 0;
}

.task-modal-tab {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 16px;
    margin-bottom: -2px;
    border-bottom: 2px solid transparent;
    color: #8B8F9D;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.15s;
    user-select: none;
}

.task-modal-tab:hover {
    color: #3D445C;
}

.task-modal-tab.active {
    color: #3D445C;
    border-bottom-color: #FC6B40;
    font-weight: 600;
}

.task-modal-tab-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: #E5E5E5;
    color: #8B8F9D;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
}

.task-modal-tab.active .task-modal-tab-count {
    background: #FFF0EC;
    color: #FC6B40;
}

/* Entity tasks tab bar (leads/clients inner panel) */
.tasks-container .tasks-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}
.tasks-container .entity-tasks-tabs {
    display: flex;
    gap: 4px;
    align-items: center;
    flex-wrap: wrap;
    background: #fff;
}
.tasks-container .entity-tasks-tab {
    display: inline-flex;
    align-items: center;
    padding: 8px 16px;
    text-decoration: none;
    color: #8B8F9D;
    font-size: 13px;
    font-weight: normal;
    border-radius: 16px;
    cursor: pointer;
    white-space: nowrap;
    transition: color 0.15s, background 0.15s;
}
.tasks-container .entity-tasks-tab.active {
    color: #FC6B40;
    background: #FFF0EC;
    font-weight: 600;
}
.tasks-container .entity-tasks-tab:hover {
    color: #FC6B40;
    background: #FFF0EC;
}
.tasks-container .add-task-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: #FC6B40;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Max height adjustment for edit modal with tabs */
.task-popup-edit .task-modal-tab-content {
    max-height: calc(90vh - 110px);
}

.task-popup-edit .task-modal-tab-content[data-modal-tab-content="edit"] .align-right {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.task-popup-edit .task-modal-tab-content[data-modal-tab-content="edit"] .align-right .clear-new,
.task-popup-edit .task-modal-tab-content[data-modal-tab-content="edit"] .align-right .submit {
    min-width: 180px;
    margin: 0;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

@media (min-width: 769px) and (max-width: 1365px) {
    .task-popup-edit .task-modal-tab-content[data-modal-tab-content="edit"] .align-right .clear-new,
    .task-popup-edit .task-modal-tab-content[data-modal-tab-content="edit"] .align-right .submit {
        min-width: 150px;
    }
}

@media (max-width: 768px) {
    .task-popup-edit .task-modal-tab-content[data-modal-tab-content="edit"] .align-right {
        justify-content: stretch;
        gap: 10px;
    }

    .task-popup-edit .task-modal-tab-content[data-modal-tab-content="edit"] .align-right .clear-new,
    .task-popup-edit .task-modal-tab-content[data-modal-tab-content="edit"] .align-right .submit {
        flex: 1 1 0;
        min-width: 0;
        width: calc(50% - 5px);
    }
}

/* Modal notes styles */
.task-modal-tab-content[data-modal-tab-content="notes"] {
    overflow: hidden !important;
}

.task-modal-tab-content[data-modal-tab-content="notes"].active {
    display: flex !important;
    flex-direction: column;
}

.modal-notes-container {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.modal-notes-list {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
    margin-bottom: 12px;
}

.modal-note-form {
    border-top: 1px solid #ECEDF0;
    padding-top: 12px;
    flex-shrink: 0;
}

.modal-note-textarea {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #CDD4D9;
    border-radius: 6px;
    font-size: 13px;
    color: #3D445C;
    resize: vertical;
    min-height: 50px;
    max-height: 150px;
    font-family: inherit;
    box-sizing: border-box;
}

.modal-note-textarea:focus {
    outline: none;
    border-color: #FC6B40;
}

.modal-note-form-actions {
    display: flex;
    gap: 8px;
    margin-top: 8px;
}

/* =============================================
   Task notes — shared styles (row + modal)
   ============================================= */

/* Task info + notes two-column layout (task-row inline) */
.task-info-notes-wrapper {
    display: flex;
    gap: 0;
    margin-top: 15px;
    min-height: 0;
}

.task-info-section {
    flex: 1;
    min-width: 0;
    padding-right: 20px;
    border-right: 1px solid #E5E5E5;
}

.task-info-section .task-info-table {
    margin-top: 0;
}

.task-info-table tr td:first-child {
    color: #8B8F9D;
    font-size: 13px;
}

.task-info-table tr td {
    padding: 6px 0;
}

/* Task history */
.history-row {
    padding: 6px 0;
}

.history-time {
    font-weight: 600;
}

.task-description-text {
    word-wrap: break-word;
    overflow-wrap: break-word;
    white-space: pre-wrap;
    max-width: 100%;
}

.task-notes-section {
    flex: 1;
    min-width: 0;
    padding-left: 20px;
    display: flex;
    flex-direction: column;
}

.task-notes-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.task-notes-title {
    font-size: 13px;
    font-weight: 600;
    color: #3D445C;
}

.task-notes-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 10px;
    background: #E5E5E5;
    color: #8B8F9D;
    font-size: 11px;
    font-weight: 600;
}

.task-notes-list {
    flex: 1;
    overflow-y: auto;
    max-height: 300px;
    margin-bottom: 10px;
}

.task-notes-empty {
    color: #8B8F9D;
    font-size: 13px;
    font-style: italic;
    padding: 10px 0;
}

.task-note-item {
    padding: 8px 10px;
    margin-bottom: 6px;
    background: #F9F9FA;
    border-radius: 6px;
    border: 1px solid #ECEDF0;
    position: relative;
}

.task-note-item:hover {
    border-color: #CDD4D9;
}

.task-note-item:hover .task-note-actions {
    opacity: 1;
}

.task-note-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}

.task-note-author {
    font-size: 12px;
    font-weight: 600;
    color: #3D445C;
}

.task-note-date {
    font-size: 11px;
    color: #8B8F9D;
}

.task-note-edited {
    font-size: 11px;
    color: #B0B5BF;
    font-style: italic;
}

.task-note-content {
    font-size: 13px;
    color: #3D445C;
    line-height: 1.5;
    word-wrap: break-word;
    overflow-wrap: break-word;
    white-space: pre-wrap;
}

.task-note-actions {
    position: absolute;
    top: 8px;
    right: 8px;
    display: flex;
    gap: 6px;
    opacity: 0;
    transition: opacity 0.15s;
}

.task-note-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 4px;
    transition: background 0.15s;
}

.task-note-actions a:hover {
    background: #E5E5E5;
}

.task-note-actions a:hover svg path {
    stroke: #FC6B40;
    fill: #FC6B40;
}

.task-note-add-wrapper {
    padding-top: 6px;
    border-top: 1px solid #ECEDF0;
}

.task-note-add-wrapper a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #FC6B40;
    font-size: 13px;
    text-decoration: none;
    padding: 4px 0;
    transition: opacity 0.15s;
}

.task-note-add-wrapper a:hover {
    opacity: 0.8;
}

.task-note-form {
    padding-top: 8px;
}

.task-note-textarea {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #CDD4D9;
    border-radius: 6px;
    font-size: 13px;
    color: #3D445C;
    background: #F6F7F9;
    resize: vertical;
    min-height: 60px;
    max-height: 200px;
    font-family: inherit;
    box-sizing: border-box;
}

.task-note-textarea:focus {
    outline: none;
    border-color: #FC6B40;
}

.task-note-form-actions {
    display: flex;
    gap: 8px;
    margin-top: 6px;
    justify-content: flex-end;
}

.task-note-form-actions .task-note-save-btn {
    width: 50%;
}

.task-note-save-btn {
    padding: 5px 16px;
    font-size: 12px;
    background: #FC6B40;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: opacity 0.15s;
}

.task-note-save-btn:hover {
    opacity: 0.9;
}

.task-note-cancel-btn {
    padding: 5px 16px;
    font-size: 12px;
    background: #fff;
    color: #8B8F9D;
    border: 1px solid #CDD4D9;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s;
}

.task-note-cancel-btn:hover {
    border-color: #8B8F9D;
    color: #3D445C;
}

.task-note-item.editing .task-note-content {
    display: none;
}

.task-note-edit-textarea {
    width: 100%;
    padding: 6px 8px;
    border: 1px solid #CDD4D9;
    border-radius: 4px;
    font-size: 13px;
    color: #3D445C;
    resize: vertical;
    min-height: 50px;
    max-height: 200px;
    font-family: inherit;
    box-sizing: border-box;
    margin-top: 4px;
}

.task-note-edit-textarea:focus {
    outline: none;
    border-color: #FC6B40;
}

.task-note-edit-actions {
    display: flex;
    gap: 6px;
    margin-top: 4px;
}

@media (max-width: 1200px) {
    .task-info-notes-wrapper {
        flex-direction: column;
    }
    .task-info-section {
        padding-right: 0;
        border-right: none;
        border-bottom: 1px solid #E5E5E5;
        padding-bottom: 15px;
        margin-bottom: 15px;
    }
    .task-notes-section {
        padding-left: 0;
    }
}

/* Модалка списка задач на день */
#tasks-day-modal {
    width: 500px;
    max-height: 80vh;
}

.tasks-day-modal-task {
    padding: 12px;
    border-bottom: 1px solid #E5E5E5;
    cursor: pointer;
    transition: background 0.2s;
}

.tasks-day-modal-task:hover {
    background: #F9F9FA;
}

.tasks-day-modal-task:last-child {
    border-bottom: none;
}

.tasks-day-modal-task-title {
    font-size: 14px;
    font-weight: 600;
    color: #3D445C;
    margin-bottom: 4px;
}

.tasks-day-modal-task-meta {
    font-size: 12px;
    color: #8B8F9D;
}

/* Стили для задач в табах лидов/клиентов */
.tasks-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.task-item {
    background: #fff;
    border: 1px solid #E5E5E5;
    border-radius: 8px;
    padding: 16px;
    transition: box-shadow 0.2s;
}

.task-item:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.task-item-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 12px;
}

.task-item-title {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    flex: 1;
}

.task-title-text {
    font-weight: 600;
    font-size: 14px;
    color: #3D445C;
}

.task-type-badge,
.task-priority-badge,
.task-status-badge {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 500;
    white-space: nowrap;
}

.task-priority-badge.priority-low {
    background: #E8F5E9;
    color: #4CAF50;
}

.task-priority-badge.priority-normal {
    background: #E3F2FD;
    color: #2196F3;
}

.task-priority-badge.priority-high {
    background: #FFF3E0;
    color: #FF9800;
}

.task-priority-badge.priority-critical {
    background: #FFEBEE;
    color: #F44336;
}

.task-item-actions {
    display: flex;
    gap: 8px;
}

.task-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    cursor: pointer;
    border-radius: 4px;
    transition: background 0.2s;
}

.task-action-btn:hover {
    background: #F5F5F5;
}

.task-item-body {
    margin-bottom: 12px;
}

.task-description {
    font-size: 13px;
    color: #8B8F9D;
    margin-bottom: 12px;
    line-height: 1.5;
}

.task-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    font-size: 12px;
}

.task-meta-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

.task-meta-label {
    color: #8B8F9D;
    font-weight: 500;
}

.task-overdue {
    color: #F44336;
    font-weight: 600;
}

.task-item-footer {
    display: flex;
    gap: 16px;
    padding-top: 12px;
    border-top: 1px solid #F5F5F5;
}

.task-action-link {
    display: inline-flex;
    align-items: center;
    color: #FC6B40;
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    transition: opacity 0.2s;
}

.task-action-link:hover {
    opacity: 0.8;
}

.task-complete-link {
    background: #FC6B40;
    color: #fff;
    padding: 6px 12px;
    border-radius: 4px;
}

.task-complete-link:hover {
    background: #E55A2E;
    color: #fff;
    opacity: 1;
}

.no-tasks {
    text-align: center;
    padding: 40px 20px;
}

/* Стили для быстрого выбора времени в модалках задач */
.task-time-quick-select {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 20px;
    margin-top: -4px;
    margin-bottom: 4px;
}

.time-quick-btn {
    padding: 0;
    border: none;
    background: transparent;
    font-size: 14px;
    color: #FC6B40;
    cursor: pointer;
    transition: opacity 0.2s;
    white-space: nowrap;
    text-decoration: none;
    font-weight: 400;
}

.time-quick-btn:hover {
    opacity: 0.7;
    text-decoration: underline;
}

/* Стили для полей дат/времени с иконками */
.task-input-with-icon {
    position: relative;
    width: 100%;
}

.task-input-with-icon input {
    padding-right: 35px !important;
}

.task-input-icon {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
}

.task-input-icon svg {
    width: 16px;
    height: 16px;
}
.bill-deleted{
    background:#ffb4b4;
}
.clients-contracts-boards-duplicate-alert{
    position: fixed;
    left: 10px;
    bottom: 10px;
    border-radius: 5px;
    z-index: 999999;
    pointer-events: none;
    overflow: hidden;
    margin: 0 0 6px;
    padding: 15px 15px 15px 50px;
    width: 300px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    background-position: 15px center;
    background-repeat: no-repeat;
    -moz-box-shadow: 0 0 12px #999;
    -webkit-box-shadow: 0 0 12px #999;
    box-shadow: 0 0 12px #999;
    color: #fff;
    opacity: 0.8;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    filter: alpha(opacity=80);
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=) !important;
    background-color: #f89406;
}
.deactivation-table{
    width: 700px;
}
.deactivation-table td{
    padding: 5px;
}

/* Tasks tab badges in leads/clients */
.tasks-main-tab-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    margin-left: 4px;
    background: #FFF5F2;
    color: #FC6B40;
    vertical-align: middle;
}
.tasks-main-tab-overdue {
    display: inline-flex;
    align-items: center;
    margin-left: 3px;
    vertical-align: middle;
    animation: tasks-overdue-pulse 2s ease-in-out infinite;
}
@keyframes tasks-overdue-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* === LEADS MOBILE: desktop hide === */
.leads-card-header,
.leads-card-dropdown,
.act-row-card-dropdown,
.mobile-buttons-row {
    display: none;
}
.leads-created-at-col {
    display: none;
}

/* === Signers action-col: kebab button (all screen sizes) === */
.al-client-view-page .data-table .action-col {
    position: relative;
}
.al-client-view-page .data-table .action-col .leads-card-more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px; height: 30px;
    background: none;
    border: 1px solid #E0E4EA;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}
.al-client-view-page .data-table .action-col .leads-card-more:hover { background: #F6F7F9; border-color: #C8CDD8; }
.al-client-view-page .data-table .action-col .leads-card-more:active { background: #ECEEF2; border-color: #B0B6C3; }
.al-client-view-page .data-table .action-col .leads-card-dropdown {
    display: none;
    position: absolute;
    right: 0; top: calc(100% + 4px);
    width: 160px; background: #fff;
    border: 1px solid #E0E4EA; border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    z-index: 200;
}
.al-client-view-page .data-table .action-col .leads-card-dropdown.open { display: block; }
.al-client-view-page .data-table .action-col .leads-card-dropdown-item {
    display: flex; align-items: center;
    padding: 10px 16px; font-size: 14px;
    color: #3D445C; text-decoration: none;
    border-bottom: 1px solid #f5f5f5; cursor: pointer;
}
.al-client-view-page .data-table .action-col .leads-card-dropdown-item:last-child { border-bottom: none; }
.al-client-view-page .data-table .action-col .leads-card-dropdown-item:hover { background: #F6F7F9; }

/* === LEADS TABLET: grid cards === */
@media screen and (min-width: 769px) and (max-width: 1365px) {

    /* --- Search form: remove right margins from search, filter, submit --- */
    .al-leads-page .search-form .input-block.w260,
    .al-leads-page .search-form .input-block.filter-btn-block,
    .al-leads-page .search-form .input-block.leads-search-submit-block {
        margin-right: 0 !important;
    }

    /* --- Clients search form: remove right margins --- */
    .al-clients-page .search-form .input-block:first-of-type,
    .al-clients-page .search-form .input-block.filter-btn-block,
    .al-clients-page .search-form .input-block.clients-search-submit-block {
        margin-right: 0 !important;
    }

    /* --- Operations slider: hide arrows on tablet --- */
    .operations-slider .slick-arrow {
        display: none !important;
    }

    /* --- City column: center-align text and badge --- */
    .al-leads-page .leads-col[data-label="місто"] {
        align-items: center;
    }
    .al-leads-page .leads-col .city-counts {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin: 0 0 0 6px;
        flex-shrink: 0;
    }

    /* --- Thead: hide --- */
    .al-leads-page .leads-thead { display: none; }

    /* --- Grid layout on tbody --- */
    .al-leads-page .leads-tbody {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        gap: 12px;
    }

    .al-leads-page .content-block {
        margin: 20px 36px;
    }

    #result-search-list .manager-search .title-search-result {
        padding: 0 36px;
    }

    /* --- Row → Card --- */
    .al-leads-page .leads-main-row {
        position: relative;
        border-bottom: none;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        overflow: visible;
    }
    .al-leads-page .leads-row {
        flex-direction: column;
        cursor: default;
        padding: 0;
        background-image: none !important;
    }
    .al-leads-page .leads-col {
        flex: unset !important;
        width: 100%;
        padding: 4px 16px;
        display: flex;
        align-items: flex-start;
        font-size: 13px;
        line-height: 18px;
    }

    /* --- Labels via data-label --- */
    .al-leads-page .leads-col[data-label]::before {
        content: attr(data-label);
        display: inline-block;
        min-width: 120px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }

    /* --- Phone/email: separate rows --- */
    .al-leads-page .leads-contacts-col {
        flex-wrap: wrap;
    }
    .al-leads-page .leads-contacts-col .lead-phone-group {
        flex: 1;
        min-width: 0;
    }
    .al-leads-page .leads-contacts-col .new-lead-email {
        flex-basis: 100%;
        padding-left: 120px;
        box-sizing: border-box;
        margin-top: 2px;
    }

    /* --- Hide action-col, show card header --- */
    .al-leads-page .leads-col.action-col { display: none; }

    /* --- Date col: show separately, hide inline date in name col --- */
    .al-leads-page .leads-created-at-col { display: flex !important; }
    .al-leads-page .leads-col.lead-name .new-created-at { display: none; }

    /* --- Fix binotel-call-type label alignment --- */
    .al-leads-page .leads-col.binotel-info.binotel-call-type { text-align: left !important; }

    .al-leads-page .leads-card-header {
        display: flex !important;
        justify-content: space-between;
        align-items: center;
        padding: 12px 16px 4px;
    }
    .al-leads-page .leads-card-header button {
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA; background: transparent;
        cursor: pointer; padding: 0;
        display: flex; align-items: center; justify-content: center;
        border-radius: 6px;
        transition: background 0.15s, border-color 0.15s;
    }
    .al-leads-page .leads-card-header button:hover { background: #F6F7F9; border-color: #C8CDD8; }
    .al-leads-page .leads-card-header button:active { background: #ECEEF2; border-color: #B0B6C3; }
    .al-leads-page .leads-main-row.current .leads-card-toggle svg {
        transform: rotate(180deg); transition: transform 0.2s;
    }

    /* --- Kebab dropdown --- */
    .al-leads-page .leads-card-dropdown {
        position: absolute; right: 16px; top: 48px;
        width: 205px; background: #fff;
        border: 1px solid #E0E4EA; border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 100; display: none;
    }
    .al-leads-page .leads-card-dropdown.open { display: block; }
    .al-leads-page .leads-card-dropdown-item {
        display: flex; align-items: center; gap: 8px;
        padding: 10px 16px; font-size: 14px;
        color: #3D445C; text-decoration: none;
        border-bottom: 1px solid #f5f5f5; cursor: pointer;
    }
    .al-leads-page .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-leads-page .leads-card-dropdown-item:hover,
    .al-leads-page .leads-card-dropdown-item:active { background: #F6F7F9; }

    /* --- Name column --- */
    .al-leads-page .new-name-items {
        flex-direction: column; width: 100%; align-items: flex-start;
    }
    .al-leads-page .new-name-items .new-name-item:first-child { display: none; }
    .al-leads-page .leads-new-name-col {
        display: flex; align-items: flex-start;
    }
    .al-leads-page .leads-new-name-col .new-name-items {
        flex: 1; min-width: 0;
    }
    .al-leads-page .new-name-item .class-icon,
    .al-leads-page .new-name-item > svg { vertical-align: middle; }

    /* --- Status bar --- */
    .al-leads-page .leads-status-col { flex-wrap: wrap; align-items: center; }
    .al-leads-page .leads-status-col.has-status-text .status-bar {
        flex-basis: 100%; padding-left: 120px; box-sizing: border-box; line-height: 0;
    }
    .al-leads-page .leads-col.binotel-info img { width: 18px; height: 18px; }

    /* --- Expanded card: in-place (grid row stretches) --- */

    /* --- Expandable section --- */
    .al-leads-page .leads-row-selects { padding: 0 16px 16px; }
    .al-leads-page .row-inner-tabs-nav ul {
        display: flex; overflow-x: auto; white-space: nowrap;
        -webkit-overflow-scrolling: touch; scrollbar-width: none; gap: 0;
        cursor: grab;
    }
    .al-leads-page .row-inner-tabs-nav ul::-webkit-scrollbar { display: none; }
    .al-leads-page .row-inner-tabs-nav ul li {
        flex-shrink: 0; padding: 10px 12px; font-size: 13px; margin-right: 0;
    }

    /* --- Status tab --- */
    .al-leads-page .status-tab,
    .al-leads-page .row-inner-tabs .tabs-content .tabs-item.status-tab.active {
        flex-direction: column; gap: 16px;
    }
    .al-leads-page .status-tab .status-div { width: 100%; }
    .al-leads-page .lead-change-status-form { width: 100%; }
    .al-leads-page .lead-change-status-form select.w540 { width: 100%; }
    .al-leads-page .status-tab .status-div select.w540,
    .al-leads-page .status-tab .status-div input { width: 100%; }
    .al-leads-page .field-container.lead-off-reason .input-block { width: 100% !important; }
    .al-leads-page .field-container.lead-off-reason label.radio-label {
        white-space: normal; height: auto; line-height: 1.4;
        padding-top: 2px; padding-bottom: 2px;
    }
    .al-leads-page .field-container.call-me-block .input-block { width: 100% !important; }
    .al-leads-page .field-container.call-me-block .input-block input { width: 100% !important; box-sizing: border-box; }
    .xdsoft_datetimepicker { left: 32px !important; right: auto !important; max-width: calc(100vw - 64px); }

    /* --- Selections --- */
    .al-leads-page .leads-selections { overflow-x: unset; padding: 0; }
    .al-leads-page .leads-selections a { display: block; }
    .al-leads-page .selection-head { display: none; }
    .al-leads-page .selection-item {
        min-width: unset; flex-direction: column;
        border: 1px solid #f0f0f0; border-radius: 8px;
        margin-bottom: 8px; padding: 12px; position: relative;
    }
    .al-leads-page .selection-item .selection-col {
        display: flex; align-items: flex-start; padding: 4px 0; font-size: 13px;
    }
    .al-leads-page .selection-item .selection-col[data-label]::before {
        content: attr(data-label); min-width: 110px; flex-shrink: 0;
        color: #8B8F9D; font-size: 13px; font-weight: 400;
    }

    /* --- Clients: Selections --- */
    .al-clients-page .leads-selections,
    .view-client-popup .leads-selections { overflow-x: unset; padding: 0; }
    .al-clients-page .leads-selections a,
    .view-client-popup .leads-selections a { display: block; }
    .al-clients-page .selection-head,
    .view-client-popup .selection-head { display: none; }
    .al-clients-page .selection-item,
    .view-client-popup .selection-item {
        min-width: unset; flex-direction: column;
        border: 1px solid #f0f0f0; border-radius: 8px;
        margin-bottom: 8px; padding: 12px; position: relative;
    }
    .al-clients-page .selection-item:last-child,
    .view-client-popup .selection-item:last-child {
        border: 1px solid #f0f0f0;
    }
    .al-clients-page .selection-item .selection-col,
    .view-client-popup .selection-item .selection-col {
        display: flex; align-items: flex-start; padding: 4px 0; font-size: 13px;
        flex: unset !important;
    }
    .al-clients-page .selection-item .selection-col[data-label]::before,
    .view-client-popup .selection-item .selection-col[data-label]::before {
        content: attr(data-label); min-width: 110px; flex-shrink: 0;
        color: #8B8F9D; font-size: 13px; font-weight: 400;
    }
    .al-clients-page .selection-col-delete,
    .view-client-popup .selection-col-delete {
        position: absolute; top: 12px; right: 12px; flex: none !important;
    }
    .al-clients-page .selection-col-delete .delete-selection,
    .view-client-popup .selection-col-delete .delete-selection {
        display: flex; align-items: center; justify-content: center;
        width: 30px; height: 30px; border: 1px solid #E0E4EA; border-radius: 6px;
        background: transparent; cursor: pointer;
        transition: background 0.15s, border-color 0.15s;
    }
    .al-clients-page .selection-col-delete .delete-selection:hover,
    .view-client-popup .selection-col-delete .delete-selection:hover { background: #F6F7F9; border-color: #C8CDD8; }
    .al-clients-page .action-line,
    .view-client-popup .action-line {
        display: grid; grid-template-columns: 1fr 1fr;
        gap: 8px; padding: 12px 0 4px;
    }
    .al-clients-page .action-line .to-client-action,
    .view-client-popup .action-line .to-client-action {
        height: 42px; padding: 0 12px; white-space: nowrap;
    }
    .al-clients-page .no-selection,
    .view-client-popup .no-selection { padding: 24px 16px; }
    .al-clients-page .no-selection-action,
    .view-client-popup .no-selection-action {
        display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
    }
    .al-clients-page .no-selection-action .to-client-action,
    .view-client-popup .no-selection-action .to-client-action {
        height: 42px; padding: 0 12px; white-space: nowrap;
    }

    /* --- Comments tab --- */
    .al-leads-page .comment-container .input-block { width: 100% !important; }
    .al-leads-page .comment-container .input-block textarea { width: 100% !important; }
    .al-clients-page .comment-update-form .align-right .submit,
    .view-client-popup .comment-update-form .align-right .submit { width: 50%; }

    /* --- Info table --- */
    .al-leads-page .info-table .info-tr { flex-direction: column; gap: 4px; }
    .al-leads-page .info-table .info-tr .info-td:nth-child(1) { flex: unset; }
    .al-leads-page .info-table .info-tr .info-td:nth-child(2) { flex: unset; word-break: break-all; }

    /* --- Chat bubbles (tablet) --- */
    .al-leads-page .chat-bubble,
    .al-clients-page .chat-bubble,
    .view-client-popup .chat-bubble { max-width: 80%; font-size: 12px; }
    .al-leads-page .chat-bubble .chat-text,
    .al-clients-page .chat-bubble .chat-text,
    .view-client-popup .chat-bubble .chat-text { font-size: 12px; }
    .al-leads-page .chat-msg--agent,
    .al-clients-page .chat-msg--agent,
    .view-client-popup .chat-msg--agent { padding-left: 0; justify-content: flex-end; }

    .al-leads-page .messages-block div,
    .al-clients-page .messages-block div,
    .view-client-popup .messages-block div {
        width: auto;
        max-width: 70%;
    }
    .al-leads-page .messages-block div.right-side,
    .al-clients-page .messages-block div.right-side,
    .view-client-popup .messages-block div.right-side {
        margin-left: auto;
    }

    /* --- Lead actions --- */
    .al-leads-page .lead-actions-container {
        display: grid; grid-template-columns: 1fr 1fr;
        gap: 8px; padding-left: 0; margin-top: 16px;
    }
    .al-leads-page .lead-actions-container a {
        font-size: 12px; justify-content: flex-start; align-items: center; margin-left: 0 !important;
        padding: 0 10px; white-space: normal; box-sizing: border-box; width: 100%; height: 42px; overflow: hidden;
    }

    /* --- Filters: desktop-like but wrapping toggles --- */
    .al-leads-page .right-block {
        flex-wrap: wrap;
    }
    .al-leads-page .show-block {
        flex-wrap: wrap;
    }

    /* --- CLIENTS TABLET --- */

    /* --- Thead: hide --- */
    .al-clients-page .leads-thead { display: none; }

    /* --- Grid layout on tbody --- */
    .al-clients-page .leads-tbody {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        gap: 12px;
    }

    .al-clients-page .content-block {
        margin: 20px 36px;
    }

    #result-search-list .manager-search.client-details-container .title-search-result,
    #result-search-list .manager-search.client-info-container .title-search-result {
        padding: 0 36px;
    }

    /* --- Row → Card --- */
    .al-clients-page .leads-main-row {
        position: relative;
        border-bottom: none;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        overflow: visible;
    }
    .al-clients-page .leads-row {
        flex-direction: column;
        cursor: pointer;
        padding: 0;
        background-image: none !important;
    }
    .al-clients-page .leads-col {
        flex: unset !important;
        width: 100%;
        padding: 4px 16px;
        display: flex;
        align-items: flex-start;
        font-size: 13px;
        line-height: 18px;
    }

    /* --- Override inline styles on columns --- */
    .al-clients-page .leads-row .leads-col {
        overflow: visible !important;
        text-overflow: unset !important;
        white-space: normal !important;
    }

    /* --- Labels via data-label --- */
    .al-clients-page .leads-col[data-label]::before {
        content: attr(data-label);
        display: inline-block;
        min-width: 140px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }

    /* --- Hide action-col, name label --- */
    .al-clients-page .leads-col.action-col { display: none; }
    .al-clients-page .leads-col.lead-name .up-down { display: none; }
    .al-clients-page .leads-col.lead-name::before { display: none; }

    /* --- Name column padding override --- */
    .al-clients-page .leads-col.lead-name {
        padding: 4px 16px !important;
        flex-wrap: wrap;
        align-items: flex-start;
    }
    .al-clients-page .leads-col.lead-name .client-name-text {
        flex: 1 1 100%;
    }
    .al-clients-page .leads-col.lead-name .client-class-group {
        margin-top: 4px;
    }
    .al-clients-page .leads-col.lead-name .class-icon {
        margin-left: 0;
        margin-top: 0;
        flex-shrink: 0;
    }
    .al-clients-page .leads-col.lead-name .client-chaport-ai-icon {
        display: inline-block;
    }
    .al-clients-page .leads-main-row.has-chaport-ai {
        background-image: none !important;
    }

    /* --- Card header + kebab --- */
    .al-clients-page .leads-card-header {
        display: flex !important;
        justify-content: space-between;
        align-items: center;
        padding: 12px 16px 4px;
    }
    .al-clients-page .leads-card-header button,
    .al-clients-page .leads-card-goto {
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA; background: transparent;
        cursor: pointer; padding: 0;
        display: flex; align-items: center; justify-content: center;
        border-radius: 6px;
        transition: background 0.15s, border-color 0.15s;
    }
    .al-clients-page .leads-card-header button:hover,
    .al-clients-page .leads-card-goto:hover { background: #F6F7F9; border-color: #C8CDD8; }
    .al-clients-page .leads-card-header button:active,
    .al-clients-page .leads-card-goto:active { background: #ECEEF2; border-color: #B0B6C3; }

    /* --- Kebab dropdown --- */
    .al-clients-page .leads-card-dropdown {
        position: absolute; right: 16px; top: 48px;
        width: 205px; background: #fff;
        border: 1px solid #E0E4EA; border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 100; display: none;
    }
    .al-clients-page .leads-card-dropdown.open { display: block; }
    .al-clients-page .leads-card-dropdown-item {
        display: flex; align-items: center; gap: 8px;
        padding: 10px 16px; font-size: 14px;
        color: #3D445C; text-decoration: none;
        border-bottom: 1px solid #f5f5f5; cursor: pointer;
    }
    .al-clients-page .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-clients-page .leads-card-dropdown-item:hover,
    .al-clients-page .leads-card-dropdown-item:active { background: #F6F7F9; }

    /* --- Binotel icons --- */
    .al-clients-page .leads-col.binotel-info img { width: 18px; height: 18px; }
    /* --- Fix binotel-call-type label alignment --- */
    .al-clients-page .leads-col.binotel-info.binotel-call-type { text-align: left !important; }
    /* --- City counts badge vertical align --- */
    .al-clients-page .leads-col[data-label="Місто"] {
        align-items: center;
    }
    .al-clients-page .leads-col .city-counts {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin: 0 0 0 6px;
        flex-shrink: 0;
    }
    /* --- Long label gap fix --- */
    .al-clients-page .leads-col {
        gap: 6px;
    }
    .al-clients-page .leads-col[data-label]::before {
        min-width: 160px;
    }

    /* --- Filters: wrapping toggles --- */
    .al-clients-page .right-block { flex-wrap: wrap; }
    .al-clients-page .show-block { flex-wrap: wrap; }

    /* --- Clients: Expandable section --- */
    .al-clients-page .leads-row-selects,
    .view-client-popup .leads-row-selects { padding: 0 16px 16px; overflow: hidden; }
    .al-clients-page .row-inner-tabs,
    .view-client-popup .row-inner-tabs { min-width: 0; overflow: hidden; }
    .al-clients-page .row-inner-tabs-nav,
    .view-client-popup .row-inner-tabs-nav { overflow: hidden; }
    .al-clients-page .row-inner-tabs-nav ul,
    .view-client-popup .row-inner-tabs-nav ul {
        display: flex; overflow-x: auto; white-space: nowrap;
        -webkit-overflow-scrolling: touch; scrollbar-width: none; gap: 0;
        cursor: grab;
    }
    .al-clients-page .row-inner-tabs-nav ul::-webkit-scrollbar,
    .view-client-popup .row-inner-tabs-nav ul::-webkit-scrollbar { display: none; }
    .al-clients-page .row-inner-tabs-nav ul li,
    .view-client-popup .row-inner-tabs-nav ul li {
        flex-shrink: 0; padding: 10px 12px; font-size: 13px; margin-right: 0;
    }

    /* --- Clients: Status tab --- */
    .al-clients-page .status-tab,
    .al-clients-page .row-inner-tabs .tabs-content .tabs-item.status-tab.active,
    .view-client-popup .status-tab,
    .view-client-popup .row-inner-tabs .tabs-content .tabs-item.status-tab.active {
        flex-direction: column; gap: 16px;
    }
    .al-clients-page .status-tab .status-div,
    .view-client-popup .status-tab .status-div { width: 100%; }
    .al-clients-page .client-change-status-form,
    .view-client-popup .client-change-status-form { width: 100%; }
    .al-clients-page .client-change-status-form select.w540,
    .view-client-popup .client-change-status-form select.w540 { width: 100%; }
    .al-clients-page .status-tab .status-div select.w540,
    .al-clients-page .status-tab .status-div input,
    .view-client-popup .status-tab .status-div select.w540,
    .view-client-popup .status-tab .status-div input { width: 100%; }
    .al-clients-page .field-container.call-me-block .input-block,
    .view-client-popup .field-container.call-me-block .input-block { width: 100% !important; }
    .al-clients-page .field-container.call-me-block .input-block input,
    .view-client-popup .field-container.call-me-block .input-block input { width: 100% !important; box-sizing: border-box; }
    .al-clients-page .client-change-status-form .comment-container .input-block,
    .view-client-popup .client-change-status-form .comment-container .input-block { width: 100% !important; }
    .al-clients-page .client-change-status-form .comment-container textarea,
    .view-client-popup .client-change-status-form .comment-container textarea { width: 100% !important; box-sizing: border-box; }

    /* --- Popups: width constraint for tablet --- */
    .lead-add-popup,
    .confirm-popup,
    .confirm-popup2,
    .default-popup,
    .change-popup,
    .import-block,
    .import-block-outdoor,
    .contacts-add-popup,
    .contacts-edit-popup,
    .status-popup,
    .notes-popup,
    .notes-status-popup,
    .bill-without-contract-popup,
    .returned-popup,
    .photoreports-popup,
    .photoreports-popup2,
    .popup-form,
    .popup-form-export.zi10102 {
        max-width: calc(100vw - 32px) !important;
        box-sizing: border-box;
    }

    /* popup-form: fixed-width buttons on tablet */
    .popup-form .popup-form-body .align-right .clear-new,
    .popup-form .popup-form-body .align-right .cancel,
    .popup-form .popup-form-body .align-right .submit,
    .popup-form-export.zi10102 .popup-form-body .align-right .crm-button{
        display: inline-block;
        width: 150px;
        box-sizing: border-box;
    }

    /* --- change-popup: select2 overflow fix --- */
    .change-popup-body .change-type[name=supplier_id],
    .change-popup-body .select2-container {
        width: 100% !important;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* --- import-by-id-modal: tablet card layout --- */
    .import-by-id-modal {
        width: calc(100vw - 32px);
        max-width: 700px;
        max-height: 90vh;
        overflow-y: auto;
        padding: 0;
        box-sizing: border-box;
    }
    .import-by-id-modal .entry-header_add_by_id {
        display: none;
    }
    .import-by-id-modal .id-entry-group_add_by_id .entry_add_by_id {
        flex-wrap: wrap;
        position: relative;
        background: #f8f9fa;
        border: 1px solid #e0e3ea;
        border-radius: 8px;
        padding: 10px 44px 10px 10px;
        gap: 8px;
        margin-bottom: 12px;
        min-width: 0;
    }
    .import-by-id-modal .remove-board-entry_add_by_id {
        position: absolute;
        top: 10px;
        right: 8px;
        width: 30px;
        height: 30px;
        min-width: 30px;
        padding: 0;
    }
    .import-by-id-modal .board-id-input_add_by_id,
    .import-by-id-modal .board-price-input_add_by_id {
        width: calc(50% - 4px) !important;
        box-sizing: border-box;
        min-width: 0;
    }
    .import-by-id-modal .board-code_add_by_id,
    .import-by-id-modal .board-city_add_by_id,
    .import-by-id-modal .board-side_add_by_id,
    .import-by-id-modal .board-type_add_by_id {
        width: calc(50% - 4px) !important;
        font-size: 13px;
        box-sizing: border-box;
        min-width: 0;
    }
    .import-by-id-modal .board-address_add_by_id {
        width: 100% !important;
        font-size: 13px;
        box-sizing: border-box;
    }
    .import-by-id-modal .board-photo_add_by_id {
        width: 100% !important;
    }
    .import-by-id-modal .board-photo_add_by_id img {
        max-width: 100%;
        height: auto;
    }
    .import-by-id-modal .board-code_add_by_id:not(:empty)::before {
        display: block;
        content: "Код";
        font-size: 10px;
        font-weight: 600;
        color: #999;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        margin-bottom: 2px;
    }
    .import-by-id-modal .board-city_add_by_id:not(:empty)::before {
        display: block;
        content: "Город";
        font-size: 10px;
        font-weight: 600;
        color: #999;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        margin-bottom: 2px;
    }
    .import-by-id-modal .board-side_add_by_id:not(:empty)::before {
        display: block;
        content: "Сторона";
        font-size: 10px;
        font-weight: 600;
        color: #999;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        margin-bottom: 2px;
    }
    .import-by-id-modal .board-type_add_by_id:not(:empty)::before {
        display: block;
        content: "Тип";
        font-size: 10px;
        font-weight: 600;
        color: #999;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        margin-bottom: 2px;
    }
    .import-by-id-modal .board-address_add_by_id:not(:empty)::before {
        display: block;
        content: "Адрес";
        font-size: 10px;
        font-weight: 600;
        color: #999;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        margin-bottom: 2px;
    }
    .import-by-id-modal .board-photo_add_by_id:not(:empty)::before {
        display: block;
        content: "Фото";
        font-size: 10px;
        font-weight: 600;
        color: #999;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        margin-bottom: 4px;
    }
    .import-by-id-modal .import-by-id-modal-body {
        padding: 16px 20px 24px;
    }
    .import-by-id-modal .btn-style_add_by_id {
        width: 150px;
    }

    /* --- Entity tasks tabs: tablet layout --- */
    .tasks-container .tasks-header {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }
    .tasks-container .add-task-btn {
        align-self: center;
    }
    .tasks-container .entity-tasks-tabs {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        flex-wrap: nowrap;
    }
    .tasks-container .entity-tasks-tabs::-webkit-scrollbar {
        display: none;
    }

    /* === CLIENT VIEW TABLET === */

    /* Container padding */
    .al-client-view-page .container.container-base_ {
        padding: 0 24px;
    }

    /* Overflow protection */
    .al-client-view-page,
    .al-client-view-page .container-fluid-base {
        overflow-x: hidden;
    }
    .operations-slider {
        overflow: hidden;
    }

    /* Header */
    .al-client-view-page .client-info-header {
        flex-wrap: wrap;
        gap: 16px;
    }
    .al-client-view-page .client-info-header .left-block .info h1.client-name {
        font-size: 20px;
        line-height: 24px;
    }
    .al-client-view-page .client-info-header .left-block .info .short-info {
        flex-wrap: wrap;
        gap: 8px;
    }
    .al-client-view-page .client-info-header .left-block .nowrap {
        margin-right: 16px;
    }

    /* Header buttons */
    .al-client-view-page .client-info-header .right-block {
        flex: 0 0 auto !important;
        align-self: flex-start;
        margin-left: auto;
    }
    .al-client-view-page .client-info-header .right-block .btn.edit {
        width: 150px;
    }
    .al-client-view-page .client-info-header .right-block .external-call,
    .al-client-view-page .client-info-header .right-block .external-call-form {
        width: 150px;
    }

    /* Navigation tabs — horizontal scroll */
    .al-client-view-page .client-navigation .favorite-viewed-tab {
        display: flex;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .al-client-view-page .client-navigation .favorite-viewed-tab::-webkit-scrollbar {
        display: none;
    }
    .al-client-view-page .client-navigation .favorite-viewed-tab a {
        flex-shrink: 0;
        margin-right: 20px;
    }

    /* Analytics grid — 2 columns */
    .al-client-view-page .analytics-grid {
        grid-template-columns: 1fr 1fr !important;
    }
    .al-client-view-page .analytics-grid--planned {
        grid-template-columns: 1fr 1fr !important;
    }

    /* Selections — cards */
    .al-client-view-page .leads-selections {
        overflow-x: unset;
        padding: 0;
    }
    .al-client-view-page .selection-head {
        display: none;
    }
    .al-client-view-page .selection-item {
        min-width: unset;
        flex-direction: column;
        border: 1px solid #f0f0f0;
        border-radius: 8px;
        margin-bottom: 8px;
        padding: 12px;
        position: relative;
    }
    .al-client-view-page .selection-item:last-child {
        border: 1px solid #f0f0f0;
    }
    .al-client-view-page .selection-item .selection-col {
        display: flex;
        align-items: flex-start;
        padding: 4px 0;
        font-size: 13px;
        flex: unset !important;
    }
    .al-client-view-page .selection-item .selection-col[data-label]::before {
        content: attr(data-label);
        min-width: 120px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-client-view-page .selection-col-delete {
        position: absolute;
        top: 12px;
        right: 12px;
        flex: none !important;
    }

    /* Selection action buttons */
    .al-client-view-page .selection-actions {
        flex-wrap: wrap;
        gap: 8px;
    }

    /* Status form */
    .al-client-view-page .message-tab {
        flex-direction: column !important;
        gap: 16px;
    }
    .al-client-view-page .client-status-log-div,
    .al-client-view-page .client-status-div {
        width: 100%;
    }
    .al-client-view-page .client-change-status-form {
        width: 100%;
    }
    .al-client-view-page .client-change-status-form select {
        width: 100% !important;
    }
    .al-client-view-page .client-change-status-form textarea {
        width: 100% !important;
        box-sizing: border-box;
    }
    .al-client-view-page .field-container.call-me-block .input-block input {
        width: 100% !important;
        box-sizing: border-box;
    }

    /* Additional info */
    .al-client-view-page .additional-information .info-block-table .tr {
        max-width: 100%;
        overflow: hidden;
    }
    .al-client-view-page .additional-information .info-block-table .tr .td:nth-child(1) {
        width: 160px !important;
    }
    .al-client-view-page .additional-information .info-block-table .tr .td {
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .al-client-view-page .additional-information .info-block-table .tr .td a.elipses-link {
        max-width: calc(100vw - 240px) !important;
        display: block;
        word-break: break-all;
        overflow-wrap: break-word;
        white-space: normal;
    }

    /* === CLIENT TABS TABLET === */

    /* Container padding for all client tab pages */
    .al-client-view-page .container.container-base {
        padding: 0 24px;
    }

    /* Search + button header row */
    .al-client-view-page .client-contacts-header {
        flex-wrap: wrap;
        gap: 10px;
    }
    .al-client-view-page .bills-add-link {
        width: 150px;
    }

    /* --- Generic card layout for data-table tabs --- */
    .al-client-view-page .data-table .data-thead { display: none !important; }
    .al-client-view-page .data-table .data-tbody {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        gap: 12px;
    }
    .al-client-view-page .data-table .data-tbody > .data-tr {
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 0;
        position: relative;
    }
    .al-client-view-page .data-table .data-tbody > .data-tr > .data-td {
        display: flex;
        align-items: flex-start;
        padding: 4px 16px;
        font-size: 13px;
        flex: unset !important;
        width: auto !important;
        min-width: 0 !important;
    }
    .al-client-view-page .data-table .data-tbody .data-td[data-label]::before {
        content: attr(data-label);
        min-width: 120px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-client-view-page .data-table .data-tbody .data-td.action-col { display: none !important; }

    /* Card header — visible on tablet */
    .al-client-view-page .data-table .leads-card-header {
        display: flex !important;
        justify-content: flex-end;
        align-items: center;
        padding: 12px 16px 4px;
    }
    .al-client-view-page .data-table .leads-card-header button {
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA; background: transparent;
        cursor: pointer; padding: 0;
        display: flex; align-items: center; justify-content: center;
        border-radius: 6px;
        transition: background 0.15s, border-color 0.15s;
    }
    .al-client-view-page .data-table .leads-card-header button:hover { background: #F6F7F9; border-color: #C8CDD8; }
    .al-client-view-page .data-table .leads-card-header button:active { background: #ECEEF2; border-color: #B0B6C3; }

    /* Kebab dropdown */
    .al-client-view-page .data-table .leads-card-dropdown {
        position: absolute; right: 16px; top: 48px;
        width: 205px; background: #fff;
        border: 1px solid #E0E4EA; border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 100; display: none;
    }
    .al-client-view-page .data-table .leads-card-dropdown.open { display: block; }

    /* Client tabs mobile: cards with tablet-like border + spacing */
    .al-client-view-page .clients-company-data .data-table .data-tbody,
    .al-client-view-page .clients-contacts-data .data-table .data-tbody {
        display: flex !important;
        flex-direction: column;
        gap: 12px;
    }
    .al-client-view-page .clients-company-data .data-table .data-tbody > .data-tr,
    .al-client-view-page .clients-contacts-data .data-table .data-tbody > .data-tr {
        border: 1px solid #E8EBF1 !important;
        border-radius: 8px !important;
        padding: 12px 0 !important;
        margin: 0 !important;
    }

    .al-client-view-page .clients-contracts-data .data-table .data-tbody {
        display: flex !important;
        flex-direction: column;
        gap: 12px;
    }
    .al-client-view-page .clients-contracts-data .data-tr-global {
        border: 1px solid #E8EBF1 !important;
        border-radius: 8px !important;
        overflow: hidden;
        margin: 0 !important;
    }
    .al-client-view-page .clients-contracts-data .data-tr-global > .data-tr {
        border: none !important;
        border-radius: 0 !important;
        padding: 12px 0 !important;
    }

    .al-client-view-page .bills-table .bills-table-tbody {
        display: flex !important;
        flex-direction: column;
        gap: 12px;
    }
    .al-client-view-page .bills-table .bills-table-tbody > .data-tr {
        border: 1px solid #E8EBF1 !important;
        border-radius: 8px !important;
        padding: 12px 0 !important;
        margin: 0 !important;
    }
    .al-client-view-page .suppliers-table .suppliers-tbody {
        display: flex !important;
        flex-direction: column;
        gap: 12px;
    }
    .al-client-view-page .suppliers-table .supplier-block {
        border: 1px solid #E8EBF1 !important;
        border-radius: 8px !important;
        margin: 0 !important;
    }

    .al-client-view-page .clients-docs-data .data-table .data-tbody {
        display: flex !important;
        flex-direction: column;
        gap: 12px;
    }
    .al-client-view-page .clients-docs-data .data-table .data-tbody > .data-tr {
        border: 1px solid #E8EBF1 !important;
        border-radius: 8px !important;
        padding: 12px 0 !important;
        margin: 0 !important;
    }

    .al-client-view-page .boards-table .boards-table-tbody {
        display: flex !important;
        flex-direction: column;
        gap: 12px;
    }
    .al-client-view-page .boards-table .boards-table-tbody .boards-table-tr {
        border: 1px solid #E8EBF1 !important;
        border-radius: 8px !important;
        padding: 12px 0 !important;
        margin: 0 !important;
    }

    .al-client-view-page .photoreports-table .photoreports-tbody {
        display: flex !important;
        flex-direction: column;
        gap: 12px;
    }
    .al-client-view-page .photoreports-table .photoreports-tbody > .photoreports-row {
        border: 1px solid #E8EBF1 !important;
        border-radius: 8px !important;
        padding: 12px 0 !important;
        margin: 0 !important;
    }
    .al-client-view-page .data-table .leads-card-dropdown-item {
        display: flex; align-items: center; gap: 8px;
        padding: 10px 16px; font-size: 14px;
        color: #3D445C; text-decoration: none;
        border-bottom: 1px solid #f5f5f5; cursor: pointer;
    }
    .al-client-view-page .data-table .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-client-view-page .data-table .leads-card-dropdown-item:hover,
    .al-client-view-page .data-table .leads-card-dropdown-item:active { background: #F6F7F9; }

    /* --- Suppliers card layout --- */
    .al-client-view-page .suppliers-table .suppliers-thead { display: none !important; }
    .al-client-view-page .suppliers-table .suppliers-tbody {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        gap: 12px;
    }
    .al-client-view-page .suppliers-table .supplier-block {
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        position: relative;
    }
    .al-client-view-page .suppliers-table .supplier-data-row {
        flex-direction: column;
    }
    .al-client-view-page .suppliers-table .supplier-col {
        display: flex;
        align-items: center;
        padding: 4px 16px;
        font-size: 13px;
        flex: unset !important;
        width: 100%;
        box-sizing: border-box;
    }
    .al-client-view-page .suppliers-table .supplier-col[data-label]::before {
        content: attr(data-label);
        width: 110px;
        min-width: 110px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-client-view-page .suppliers-table .supplier-col.action-col { display: none !important; }
    .al-client-view-page .suppliers-table .leads-card-header {
        display: flex !important;
        justify-content: flex-end;
        align-items: center;
        padding: 12px 16px 4px;
    }
    .al-client-view-page .suppliers-table .leads-card-header button {
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA; background: transparent;
        cursor: pointer; padding: 0;
        display: flex; align-items: center; justify-content: center;
        border-radius: 6px;
    }
    .al-client-view-page .suppliers-table .leads-card-dropdown {
        position: absolute; right: 16px; top: 48px;
        width: 205px; background: #fff;
        border: 1px solid #E0E4EA; border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 100; display: none;
    }
    .al-client-view-page .suppliers-table .leads-card-dropdown.open { display: block; }
    .al-client-view-page .suppliers-table .leads-card-dropdown-item {
        display: flex; align-items: center; gap: 8px;
        padding: 10px 16px; font-size: 14px;
        color: #3D445C; text-decoration: none;
        border-bottom: 1px solid #f5f5f5; cursor: pointer;
    }
    .al-client-view-page .suppliers-table .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-client-view-page .suppliers-table .leads-card-dropdown-item:hover,
    .al-client-view-page .suppliers-table .leads-card-dropdown-item:active { background: #F6F7F9; }
    /* --- Supplier-row-selects: inner board/service card layout (tablet) --- */
    .al-client-view-page .supplier-row-selects {
        overflow-x: visible;
        padding: 16px 12px;
        border-top: 2px solid #E8EBF1;
        background: #F9F9FA;
        border-radius: 0 0 8px 8px;
    }
    .al-client-view-page .supplier-row-selects .suppliers-thead {
        display: none !important;
    }
    .al-client-view-page .supplier-row-selects .supplier-row {
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 12px 0;
        margin-bottom: 8px;
        background: #fff;
    }
    .al-client-view-page .supplier-row-selects .supplier-col {
        display: block !important;
        position: relative;
        padding: 4px 16px 4px 156px !important; /* 16px + 140px label */
        width: 100%;
        box-sizing: border-box;
        flex: unset !important;
        min-height: 24px;
    }
    .al-client-view-page .supplier-row-selects .supplier-col[data-label]::before {
        content: attr(data-label);
        position: absolute;
        left: 16px;
        top: 4px;
        width: 140px;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-client-view-page .supplier-row-selects .supplier-col.f3,
    .al-client-view-page .supplier-row-selects .supplier-col.f03,
    .al-client-view-page .supplier-row-selects .supplier-col.f07,
    .al-client-view-page .supplier-row-selects .supplier-col.f73 {
        flex: unset !important;
        width: 100%;
    }
    .al-client-view-page .supplier-row-selects input.owner-price,
    .al-client-view-page .supplier-row-selects input.supplier-price {
        width: 120px;
    }
    .al-client-view-page .supplier-row-selects .informer,
    .al-client-view-page .supplier-row-selects .informer2 { margin-right: 5px; }
    .al-client-view-page .supplier-row-selects .informer-date { margin-right: 4px; }
    .al-client-view-page .supplier-row-selects .informer-form { margin-left: 2px; }
    .al-client-view-page .supplier-row-selects .client-company-title {
        margin: 12px 0 4px;
        padding: 0 4px;
        font-weight: 600;
        font-size: 14px;
    }
    .al-client-view-page .supplier-row-selects > b {
        display: block;
        margin: 16px 0 8px;
        font-size: 14px;
    }

    /* --- Boards card layout (HTML table) --- */
    .al-client-view-page .boards-table {
        display: block !important;
        min-width: unset !important;
    }
    .al-client-view-page .boards-table .boards-table-thead { display: none !important; }
    .al-client-view-page .boards-table .boards-table-tbody {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        gap: 12px;
    }
    .al-client-view-page .boards-table .boards-table-tbody .boards-table-tr {
        display: flex;
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        position: relative;
    }
    .al-client-view-page .boards-table .boards-table-tbody .boards-td {
        display: flex;
        align-items: flex-start;
        width: 100%;
        padding: 4px 16px;
        font-size: 13px;
        line-height: 18px;
        height: auto !important;
        text-transform: none !important;
        text-align: left;
        box-sizing: border-box;
    }
    .al-client-view-page .boards-table .boards-table-tbody .boards-td a,
    .al-client-view-page .boards-table .boards-table-tbody .boards-td > div {
        color: #3D445C;
        text-decoration: none;
        min-width: 0;
        word-break: break-word;
        text-align: left;
    }
    .al-client-view-page .boards-table .boards-table-tbody .boards-td[data-label]::before {
        content: attr(data-label);
        min-width: 120px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
        text-transform: lowercase;
    }
    .al-client-view-page .boards-table .boards-td-photo {
        justify-content: flex-start;
        padding: 8px 16px;
    }
    .al-client-view-page .boards-table .boards-table-tbody .boards-td-photo a {
        flex: unset !important;
    }
    .al-client-view-page .boards-table .boards-td-photo img {
        width: 120px !important;
        height: 80px !important;
        object-fit: cover;
        border-radius: 4px;
    }
    .al-client-view-page .boards-table .boards-td-photo[data-label]::before { display: none; }
    .al-client-view-page .boards-table .boards-td-header {
        display: flex !important;
        justify-content: flex-end;
        align-items: center;
        width: 100%;
        padding: 12px 16px 4px;
        box-sizing: border-box;
    }
    .al-client-view-page .boards-table .boards-td-header button {
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA; background: transparent;
        cursor: pointer; padding: 0;
        display: flex; align-items: center; justify-content: center;
        border-radius: 6px;
        transition: background 0.15s, border-color 0.15s;
    }
    .al-client-view-page .boards-table .boards-td-header button:hover {
        background: #F6F7F9; border-color: #C8CDD8;
    }
    .al-client-view-page .boards-table .boards-td-header button:active {
        background: #ECEEF2; border-color: #B0B6C3;
    }
    .al-client-view-page .boards-table .leads-card-dropdown {
        position: absolute; right: 16px; top: 48px;
        width: 205px; background: #fff;
        border: 1px solid #E0E4EA; border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 100; display: none;
    }
    .al-client-view-page .boards-table .leads-card-dropdown.open { display: block; }
    .al-client-view-page .boards-table .leads-card-dropdown-item {
        display: flex; align-items: center; gap: 8px;
        padding: 10px 16px; font-size: 14px;
        color: #3D445C; text-decoration: none;
        border-bottom: 1px solid #f5f5f5; cursor: pointer;
    }
    .al-client-view-page .boards-table .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-client-view-page .boards-table .leads-card-dropdown-item:hover,
    .al-client-view-page .boards-table .leads-card-dropdown-item:active { background: #F6F7F9; }
    .al-client-view-page .boards-table .boards-table-tbody .boards-td:last-child { display: none !important; }

    /* --- Bills card layout --- */
    .al-client-view-page .bills-table .bills-table-thead { display: none !important; }
    .al-client-view-page .bills-table {
        min-width: unset !important;
    }
    .al-client-view-page .bills-table .bills-table-tbody {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        gap: 12px;
    }
    .al-client-view-page .bills-table .bills-table-tbody > .data-tr {
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 0;
        position: relative;
    }
    .al-client-view-page .bills-table .bills-table-tbody > .data-tr > .data-td {
        display: flex;
        align-items: flex-start;
        padding: 4px 16px;
        font-size: 13px;
        flex: unset !important;
        width: auto !important;
        min-width: 0 !important;
    }
    .al-client-view-page .bills-table .bills-table-tbody .data-td[data-label]::before {
        content: attr(data-label);
        min-width: 140px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-client-view-page .bills-table .bills-table-tbody .data-td.bill-action { display: none !important; }
    .al-client-view-page .bills-table .data-td.contract-info .leads-card-more {
        display: flex !important;
        position: absolute;
        top: 12px; right: 16px;
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA; background: transparent;
        cursor: pointer; padding: 0;
        align-items: center; justify-content: center;
        border-radius: 6px;
        z-index: 2;
    }
    .al-client-view-page .bills-table .data-td.contract-info .leads-card-more:hover { background: #F6F7F9; border-color: #C8CDD8; }
    .al-client-view-page .bills-table .data-td.contract-info .leads-card-more:active { background: #ECEEF2; border-color: #B0B6C3; }
    .al-client-view-page .bills-table .data-td.contract-info .contract-info-text {
        padding-right: 46px;
    }
    .al-client-view-page .bills-table .leads-card-dropdown {
        position: absolute; right: 16px; top: 48px;
        width: 205px; background: #fff;
        border: 1px solid #E0E4EA; border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 100; display: none;
    }
    .al-client-view-page .bills-table .leads-card-dropdown.open { display: block; }
    .al-client-view-page .bills-table .leads-card-dropdown-item {
        display: flex; align-items: center; gap: 8px;
        padding: 10px 16px; font-size: 14px;
        color: #3D445C; text-decoration: none;
        border-bottom: 1px solid #f5f5f5; cursor: pointer;
    }
    .al-client-view-page .bills-table .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-client-view-page .bills-table .leads-card-dropdown-item:hover,
    .al-client-view-page .bills-table .leads-card-dropdown-item:active { background: #F6F7F9; }

    /* --- Contracts card layout (data-tr-global wrapper) --- */
    .al-client-view-page .clients-contracts-data .data-table .data-tbody {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        gap: 12px;
    }
    .al-client-view-page .clients-contracts-data .data-tr-global {
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        overflow: hidden;
        position: relative;
    }
    .al-client-view-page .clients-contracts-data .data-tr-global > .data-tr {
        border: none;
        border-radius: 0;
    }

    /* --- Photoreports card layout --- */
    .al-client-view-page .photoreports-table { border-top: none !important; }
    .al-client-view-page .photoreports-table .photoreports-thead { display: none !important; }
    .al-client-view-page .photoreports-table .photoreports-tbody {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        gap: 12px;
    }
    .al-client-view-page .photoreports-table .photoreports-tbody > .photoreports-row {
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 0;
        position: relative;
    }
    .al-client-view-page .photoreports-table .photoreports-tbody > .photoreports-row > .photoreports-col {
        display: flex;
        align-items: flex-start;
        padding: 4px 16px;
        font-size: 13px;
        flex: unset !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        text-align: left !important;
    }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col[data-label]::before {
        content: attr(data-label);
        min-width: 140px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.photo-report-checkbox-col { display: none !important; }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.action-col { display: none !important; }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.photo-col a { margin-left: 0 !important; }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.photo-col .custom-bubble-image-container { margin-top: 0 !important; display: flex !important; align-items: center; gap: 6px; }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.photo-col .custom-bubble-image-container > div { margin-top: 0 !important; }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.photo-col .custom-bubble-image-container .hover-image,
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.photo-col .custom-bubble-image-container:hover .hover-image,
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.design-col .custom-bubble-image-container .hover-image,
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.design-col .custom-bubble-image-container:hover .hover-image { display: none !important; }
    .al-client-view-page .photoreports-table .leads-card-header {
        display: flex !important;
        justify-content: flex-end;
        align-items: center;
        padding: 12px 16px 4px;
    }
    .al-client-view-page .photoreports-table .leads-card-header button {
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA; background: transparent;
        cursor: pointer; padding: 0;
        display: flex; align-items: center; justify-content: center;
        border-radius: 6px;
    }
    .al-client-view-page .photoreports-table .leads-card-dropdown {
        position: absolute; right: 16px; top: 48px;
        width: 205px; background: #fff;
        border: 1px solid #E0E4EA; border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 100; display: none;
    }
    .al-client-view-page .photoreports-table .leads-card-dropdown.open { display: block; }
    .al-client-view-page .photoreports-table .leads-card-dropdown-item {
        display: flex; align-items: center; gap: 8px;
        padding: 10px 16px; font-size: 14px;
        color: #3D445C; text-decoration: none;
        border-bottom: 1px solid #f5f5f5; cursor: pointer;
    }
    .al-client-view-page .photoreports-table .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-client-view-page .photoreports-table .leads-card-dropdown-item:hover,
    .al-client-view-page .photoreports-table .leads-card-dropdown-item:active { background: #F6F7F9; }

    /* Photoreport filter: toggle + filter button on separate wrapping line */
    .al-client-view-page .photoreport-filter-action-block .header-styles {
        flex-wrap: wrap;
    }
    .al-client-view-page .photoreport-filter-action-block .header-styles:last-child {
        width: 100%;
        padding-top: 0;
    }

    /* Bills search form — row 1: search+bill_number; row 2: status+year+month+checkbox */
    .al-client-view-page .bills-search-form .field-container {
        flex-wrap: wrap;
        gap: 12px 10px;
    }
    .al-client-view-page .bills-search-form .field-container .input-block:nth-child(1),
    .al-client-view-page .bills-search-form .field-container .input-block:nth-child(2) {
        flex: 1 1 calc(50% - 5px);
        max-width: calc(50% - 5px);
        width: auto !important;
        margin-right: 0;
        box-sizing: border-box;
    }
    .al-client-view-page .bills-search-form .field-container .input-block:nth-child(3),
    .al-client-view-page .bills-search-form .field-container .input-block:nth-child(4),
    .al-client-view-page .bills-search-form .field-container .input-block:nth-child(5),
    .al-client-view-page .bills-search-form .field-container .input-block:nth-child(6) {
        flex: 1 1 140px;
        width: auto !important;
        margin-right: 0;
        box-sizing: border-box;
    }
    .al-client-view-page .bills-search-form .field-container .input-block input,
    .al-client-view-page .bills-search-form .field-container .input-block select {
        width: 100% !important;
        box-sizing: border-box;
    }
    .al-client-view-page .bills-search-form .select2-container {
        width: 100% !important;
    }

    /* Bills stat row */
    .al-client-view-page .bills-stat {
        flex-wrap: wrap;
        gap: 6px;
    }

    /* Select in title block */
    .al-client-view-page .select-in-title-block {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 10px;
        margin-bottom: 20px;
    }
    .al-client-view-page .select-in-title-block .info-block-title {
        margin-bottom: 0 !important;
    }

    .contacts-add-link,
    .contracts-add-link{
        width: 150px;
    }

    /* Popups — fit tablet */
    .contacts-add-popup,
    .contacts-edit-popup,
    .status-popup,
    .bill-without-contract-popup {
        width: 500px;
        margin-left: -250px;
    }
    /* contracts popup — tablet: wider modal + reset JS-injected height/margin */
    .contacts-add-popup {
        width: 650px !important;
        margin-left: -325px !important;
        height: auto !important;
        margin-top: 0 !important;
    }
    .contacts-add-popup .contracts-add-form .field-container,
    .bill-without-contract-popup .contracts-add-form .field-container {
        display: flex !important;
        gap: 12px !important;
    }
    .contacts-add-popup .contracts-add-form .field-container .input-block,
    .bill-without-contract-popup .contracts-add-form .field-container .input-block {
        flex: 1 !important;
        min-width: 0 !important;
        margin-right: 0 !important;
    }
    .contacts-add-popup .contracts-add-form .input-block input,
    .contacts-add-popup .contracts-add-form .input-block select,
    .bill-without-contract-popup .contracts-add-form .input-block input:not([type=checkbox]),
    .bill-without-contract-popup .contracts-add-form .input-block select {
        width: 100% !important;
        box-sizing: border-box !important;
    }
    .contacts-add-popup .contracts-add-form .select2-container,
    .bill-without-contract-popup .contracts-add-form .select2-container {
        width: 100% !important;
    }
    .contacts-add-popup .contracts-add-form .buttons-block,
    .bill-without-contract-popup .contracts-add-form .buttons-block {
        display: flex !important;
        justify-content: flex-end !important;
        padding-top: 10px !important;
    }
    .contacts-add-popup .contracts-add-form .buttons-block .crm-button {
        min-width: 150px !important;
    }
    .bill-without-contract-popup .contracts-add-form .buttons-block .crm-button {
        min-width: 150px !important;
    }

    /* === COMPANY EDIT FORM: TABLET === */
    #result-search-list .client-details-container {
        padding: 0 24px !important;
        box-sizing: border-box;
    }
    .client-details-container .input-group {
        gap: 0 15px;
        overflow: hidden;
    }
    .client-details-container .input-group .input-block {
        flex: 1 1 calc(50% - 7.5px);
        min-width: 280px;
        max-width: 100%;
        margin-right: 0 !important;
        overflow: hidden;
    }
    .client-details-container .input-group .input-block input,
    .client-details-container .input-group .input-block select,
    .client-details-container .tax-status {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }
    .client-details-container .input-group .input-block .select2-container {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }
    .client-details-container .input-group .input-block:has(.tax-status),
    .client-details-container .input-group .input-block:has(input[name=ur_office]),
    .client-details-container .input-group .input-block:has(input[name=post_office]),
    .client-details-container .input-group .input-block:has(input[name=mfo]),
    .client-details-container .input-group .input-block:has(input[name=based_on]),
    .client-details-container .input-group .input-block:has(input[name=domain]),
    .client-details-container .input-group .input-block:has(input[name=document_send]) {
        flex: 0 1 calc(50% - 7.5px) !important;
    }
    .client-details-container .bank-details-block .bank-details-line {
        gap: 0 15px;
        width: 100%;
    }
    .client-details-container .input-group .input-block.ib-break,
    .client-details-container .input-group .input-block.w680,
    .client-details-container .input-group .input-block.w340 {
        width: auto;
        flex: 1 1 calc(50% - 7.5px);
    }
    .client-details-container .input-group .input-block input.index,
    .client-details-container .input-group .input-block input.address,
    .client-details-container .input-group .input-block input.full_name {
        width: 100% !important;
    }
    .client-details-container .input-group .input-block input[name=ur_city],
    .client-details-container .input-group .input-block input[name=post_city],
    .client-details-container [name="document_send"] {
        width: 100% !important;
    }
    .client-details-container .client-details-submit {
        width: 150px;
    }

    /* === COMPANY VIEW: TABLET === */
    .client-details-block .details-header {
        flex-wrap: wrap;
        gap: 12px;
        margin-bottom: 20px;
    }
    .client-details-block .details-header .view-edit-btn {
        width: 150px;
        text-align: center;
    }
    .company-info .line .title {
        width: 160px;
        min-width: 160px;
    }

    /* === CLIENT ADD TABLET === */

    /* Container padding */
    .al-client-add-page .container.container-base {
        padding: 0 24px;
    }

    /* Fields: 2 per row (0,0,4,0 to beat inline nth-child(3n) at 0,0,3,0) */
    .al-client-add-page .lead-block-info .field-container .input-block {
        width: calc(50% - 8px);
        margin-right: 15px !important;
        margin-bottom: 15px;
    }
    .al-client-add-page .lead-block-info .field-container .input-block:nth-child(2n) {
        margin-right: 0 !important;
    }
    .al-client-add-page .lead-block-info .field-container .input-block select,
    .al-client-add-page .lead-block-info .field-container .input-block input {
        width: 100%;
        box-sizing: border-box;
    }
    .al-client-add-page .lead-block-info .field-container .input-block.wide-select {
        width: 100%;
        margin-right: 0;
    }
    .al-client-add-page .lead-block-info .field-container .input-block.wide-select select,
    .al-client-add-page .lead-block-info .field-container .input-block.wide-select .select2-container {
        width: 100% !important;
    }
    /* Textarea: full width */
    .al-client-add-page .lead-block-info .textarea-block {
        width: 100%;
    }
    .al-client-add-page .lead-block-info .textarea-block textarea {
        width: 100%;
        box-sizing: border-box;
    }

    /* Buttons */
    .al-client-add-page .lead-block-info .cancel,
    .al-client-add-page .lead-block-info .submit {
        min-width: 150px;
    }

    /* Photo section */
    .al-client-add-page .photo-container {
        width: 100%;
    }
}

/* === LEADS MOBILE: @media === */
@media screen and (max-width: 768px) {

    /* --- 1. Overflow protection --- */
    body, .al-leeds-page {
        overflow-x: hidden;
    }
    .operations-slider .slick-arrow {
        display: none !important;
    }

    /* --- City column: center-align text and badge --- */
    .al-leads-page .leads-col[data-label="місто"] {
        align-items: center;
    }
    .al-leads-page .leads-col .city-counts {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin: 0 0 0 6px;
        flex-shrink: 0;
    }

    .content-block.clearfix {
        display: flex;
        flex-direction: column;
        margin-left: 0;
        margin-right: 0;
    }
    .container-base.mw1366 {
        padding: 0 16px;
    }

    /* --- 2. Filters (generic — applies to leads & clients) --- */
    .header-block {
        flex-direction: column;
    }
    .search-form.field-container {
        width: 100% !important;
        flex-wrap: wrap;
    }
    .search-form .input-block.w260,
    .search-form .input-block,
    .search-form .form-group {
        width: 100% !important;
        margin-right: 0 !important;
        box-sizing: border-box;
    }
    .search-form .input-block select,
    .search-form .input-block input,
    .search-form .form-group select,
    .search-form .form-group input {
        width: 100% !important;
        box-sizing: border-box;
    }
    .search-form .select2-container {
        width: 100% !important;
    }
    #leads_search {
        width: 100% !important;
        margin-bottom: 0 !important;
    }
    .right-block {
        flex-direction: column;
        width: 100%;
        padding-top: 0;
    }
    .show-block {
        width: 100% !important;
        max-width: 100%;
        overflow: hidden;
        margin-right: 0;
    }
    .switcher-block {
        flex-direction: row-reverse !important;
        flex-wrap: nowrap !important;
        justify-content: flex-start !important;
        align-items: flex-start !important;
        gap: 10px !important;
        width: auto !important;
        max-width: 100%;
    }
    .switcher-block .switcher {
        flex-shrink: 0;
    }
    .switcher-block .switcher-label {
        flex: 1;
        min-width: 0;
        white-space: normal;
        word-wrap: break-word;
    }

    /* Clients search field margin (leads uses .w260:first-of-type rule below) */
    .search-form .input-block:not(.w260) {
        margin-bottom: 12px !important;
    }

    /* --- 2b. Leads/clients: search field full width on mobile --- */
    .search-form .input-block.w260:first-of-type,
    .al-clients-page .search-form .input-block:first-of-type {
        display: block !important;
        width: 100% !important;
        margin-right: 0 !important;
        box-sizing: border-box;
    }
    .search-form .input-block.w260:first-of-type > label {
        display: none;
    }
    .add-block {
        display: none;
    }
    /* Hide original filter btn and add block on leads/clients mobile — replaced by .mobile-buttons-row */
    .al-leads-page .add-block,
    .al-clients-page .add-block {
        display: none !important;
    }
    .al-leads-page .search-form .filter-btn-block,
    .al-clients-page .search-form .filter-btn-block {
        display: none !important;
    }
    .al-leads-page .search-form .leads-search-submit-block,
    .al-clients-page .search-form .clients-search-submit-block {
        width: 100% !important;
        margin-bottom: 12px !important;
    }
    .al-leads-page .search-form .leads-search-submit-block .crm-button,
    .al-clients-page .search-form .clients-search-submit-block .crm-button {
        width: 100%;
        height: 42px;
        box-sizing: border-box;
        justify-content: center;
    }
    /* Mobile buttons row: Filter + Add in one line */
    .mobile-buttons-row {
        display: flex !important;
        gap: 8px;
        width: 100%;
        margin-bottom: 12px;
    }
    .mobile-buttons-row .mobile-filter-btn {
        flex: 1;
        height: 42px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        border: 1px solid #CDD4D9;
        border-radius: 4px;
        background: #fff;
        font-size: 13px;
        font-weight: 600;
        color: #3D445C;
        cursor: pointer;
        text-decoration: none;
    }
    .mobile-buttons-row .mobile-filter-btn svg {
        flex-shrink: 0;
    }
    .mobile-buttons-row .mobile-add-btn {
        flex: 1;
        height: 42px;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        box-sizing: border-box;
        font-size: 13px;
        font-weight: 600;
        text-decoration: none;
        border-radius: 4px;
    }
    /* Filter panel full width on mobile */
    .bk-filter-block {
        width: 100vw;
    }
    .al-leeds-page .select2-container {
        width: 100% !important;
    }
    select[name=date_range] {
        width: 100% !important;
    }

    /* --- 3. Hide table header --- */
    .leads-thead {
        display: none;
    }

    /* --- 4. Row → Card --- */
    .leads-table {
        padding-left: 16px;
        padding-right: 16px;
    }
    .leads-main-row {
        position: relative;
        border: none;
        border-bottom: 1px solid #E8EBF1;
        margin-bottom: 0;
        border-radius: 0;
        overflow: visible;
        padding-bottom: 12px;
    }
    .leads-main-row:first-child {
        border-top: 1px solid #E8EBF1;
    }
    .leads-row {
        flex-direction: column;
        cursor: default;
        padding: 0;
    }
    .leads-col {
        flex: unset !important;
        width: 100%;
        padding: 4px 16px;
        display: flex;
        align-items: flex-start;
        font-size: 13px;
        line-height: 18px;
    }
    .leads-main-row .leads-col {
        padding: 4px 16px;
    }
    .leads-col.lead-name {
        padding-left: 16px;
    }

    /* --- 5. Labels via data-label --- */
    .leads-col[data-label]::before {
        content: attr(data-label);
        display: inline-block;
        min-width: 120px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }

    /* --- 5b. Phone/email: separate rows --- */
    .leads-contacts-col {
        flex-wrap: wrap;
    }
    .leads-contacts-col .lead-phone-group {
        flex: 1;
        min-width: 0;
    }
    .leads-contacts-col .new-lead-email {
        flex-basis: 100%;
        padding-left: 120px;
        box-sizing: border-box;
        margin-top: 2px;
    }

    /* --- 6. Hide unnecessary columns --- */
    .al-leads-page .leads-col.action-col {
        display: none;
    }
    .leads-col.binotel-info img {
        width: 18px;
        height: 18px;
    }

    /* --- 6b. Clients: action-col & card fixes --- */
    .al-clients-page .leads-col.action-col {
        display: none;
    }
    .al-clients-page .leads-col.lead-name .up-down {
        display: none;
    }
    .al-clients-page .leads-col.lead-name {
        padding: 12px 16px !important;
        flex-wrap: wrap;
        align-items: flex-start;
    }
    .al-clients-page .leads-col.lead-name .client-name-text {
        flex: 1 1 100%;
    }
    .al-clients-page .leads-col.lead-name .client-class-group {
        margin-top: 4px;
    }
    .al-clients-page .leads-main-row {
        border-radius: 0;
        cursor: pointer;
        padding-bottom: 12px;
        border: none;
        border-bottom: 1px solid #E8EBF1;
        margin-bottom: 0;
    }
    .al-clients-page .leads-main-row:first-child {
        border-top: 1px solid #E8EBF1;
    }
    .al-clients-page .leads-col.lead-name .class-icon {
        margin-left: 0;
        margin-top: 0;
        flex-shrink: 0;
    }
    .al-clients-page .leads-col.lead-name .client-chaport-ai-icon {
        display: inline-block;
    }
    .al-clients-page .leads-main-row.has-chaport-ai {
        background-image: none !important;
    }
    /* --- Fix binotel-call-type label alignment --- */
    .al-clients-page .leads-col.binotel-info.binotel-call-type { text-align: left !important; }
    /* --- City counts badge vertical align --- */
    .al-clients-page .leads-col[data-label="Місто"] {
        align-items: center;
    }
    .al-clients-page .leads-col .city-counts {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin: 0 0 0 6px;
        flex-shrink: 0;
    }
    /* --- Long label gap fix --- */
    .al-clients-page .leads-col {
        gap: 6px;
    }
    .al-clients-page .leads-col[data-label]::before {
        min-width: 160px;
    }
    .al-clients-page .leads-table {
        padding-left: 0;
        padding-right: 0;
    }
    .al-clients-page .header-block {
        padding-left: 16px;
        padding-right: 16px;
    }
    .al-clients-page .leads-card-header {
        justify-content: space-between;
    }
    .leads-card-goto {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 30px;
        border: 1px solid #E0E4EA;
        border-radius: 6px;
        transition: background 0.15s, border-color 0.15s;
    }
    .leads-card-goto:hover { background: #F6F7F9; border-color: #C8CDD8; }
    .leads-card-goto:active { background: #ECEEF2; border-color: #B0B6C3; }

    /* --- Mobile cards: keep tablet-like border + spacing for leads/clients --- */
    .al-leads-page .leads-tbody,
    .al-clients-page .leads-tbody {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }
    .al-leads-page .leads-main-row,
    .al-clients-page .leads-main-row {
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        margin-bottom: 0;
        padding-bottom: 0;
    }
    .al-leads-page .leads-main-row:first-child,
    .al-clients-page .leads-main-row:first-child {
        border-top: 1px solid #E8EBF1;
    }

    /* --- 7. Name column restructuring --- */
    .new-name-items {
        flex-direction: column;
        width: 100%;
        align-items: flex-start;
    }
    .new-name-items .new-name-item:first-child {
        display: none;
    }
    .leads-row {
        background-image: none !important;
    }
    .leads-new-name-col {
        display: flex;
        align-items: flex-start;
    }
    .leads-new-name-col .new-name-items {
        flex: 1;
        min-width: 0;
    }
    .new-name-item .class-icon,
    .new-name-item > svg { vertical-align: middle; }
    /* --- Status bar alignment --- */
    .leads-status-col {
        flex-wrap: wrap;
        align-items: center;
    }
    .leads-status-col.has-status-text .status-bar {
        flex-basis: 100%;
        padding-left: 120px;
        box-sizing: border-box;
        line-height: 0;
    }
    /* --- Date col: show separately, hide inline date in name col --- */
    .al-leads-page .leads-created-at-col { display: flex !important; }
    .al-leads-page .leads-col.lead-name .new-created-at { display: none; }

    /* --- Fix binotel-call-type label alignment --- */
    .al-leads-page .leads-col.binotel-info.binotel-call-type { text-align: left !important; }

    /* --- 8. Card header (mobile-only) --- */
    .leads-card-header {
        display: flex !important;
        justify-content: space-between;
        align-items: center;
        padding: 12px 16px 4px;
    }
    .leads-card-header button {
        width: 30px;
        height: 30px;
        border: 1px solid #E0E4EA;
        background: transparent;
        cursor: pointer;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 6px;
        transition: background 0.15s, border-color 0.15s;
    }
    .leads-card-header button:hover { background: #F6F7F9; border-color: #C8CDD8; }
    .leads-card-header button:active {
        background: #ECEEF2;
        border-color: #B0B6C3;
    }
    .leads-main-row.current .leads-card-toggle svg {
        transform: rotate(180deg);
        transition: transform 0.2s;
    }

    /* --- 9. Kebab dropdown --- */
    .leads-card-dropdown {
        position: absolute;
        right: 16px;
        top: 48px;
        width: 205px;
        background: #fff;
        border: 1px solid #E0E4EA;
        border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 100;
        display: none;
    }
    .leads-card-dropdown.open {
        display: block;
    }
    .leads-card-dropdown-item {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 10px 16px;
        font-size: 14px;
        color: #3D445C;
        text-decoration: none;
        border-bottom: 1px solid #f5f5f5;
        cursor: pointer;
    }
    .leads-card-dropdown-item:last-child {
        border-bottom: none;
    }
    .leads-card-dropdown-item:hover,
    .leads-card-dropdown-item:active {
        background: #F6F7F9;
    }

    /* --- 10. Expandable section --- */
    .leads-row-selects {
        padding: 0 16px 16px;
    }
    .row-inner-tabs-nav ul {
        display: flex;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        gap: 0;
        cursor: grab;
    }
    .row-inner-tabs-nav ul::-webkit-scrollbar {
        display: none;
    }
    .row-inner-tabs-nav ul li {
        flex-shrink: 0;
        padding: 10px 12px;
        font-size: 13px;
        margin-right: 0;
    }

    /* --- 11. Status tab layout --- */
    .status-tab,
    .row-inner-tabs .tabs-content .tabs-item.status-tab.active {
        flex-direction: column;
        gap: 16px;
    }
    .status-tab .status-div {
        width: 100%;
    }
    .lead-change-status-form,
    .client-change-status-form {
        width: 100%;
    }
    .lead-change-status-form select.w540,
    .client-change-status-form select.w540 {
        width: 100%;
    }
    .field-container .input-block textarea {
        width: 100%;
    }
    .status-tab .status-div select.w540,
    .status-tab .status-div input {
        width: 100%;
    }
    .field-container.lead-off-reason .input-block {
        width: 100% !important;
    }
    .field-container.lead-off-reason label.radio-label {
        white-space: normal;
        height: auto;
        line-height: 1.4;
        padding-top: 2px;
        padding-bottom: 2px;
    }
    .field-container.call-me-block .input-block {
        width: 100% !important;
    }
    .field-container.call-me-block .input-block input {
        width: 100% !important;
        box-sizing: border-box;
    }
    .xdsoft_datetimepicker {
        left: 32px !important;
        right: auto !important;
        max-width: calc(100vw - 64px);
    }

    /* --- 12. Selections table --- */
    .leads-selections {
        overflow-x: unset;
        padding: 0;
    }
    .leads-selections a {
        display: block;
    }
    .selection-head {
        display: none;
    }
    .selection-item {
        min-width: unset;
        flex-direction: column;
        border: 1px solid #f0f0f0;
        border-radius: 8px;
        margin-bottom: 8px;
        padding: 12px;
        position: relative;
    }
    .selection-item:last-child {
        border: 1px solid #f0f0f0;
    }
    .selection-item .selection-col {
        display: flex;
        align-items: flex-start;
        padding: 4px 0;
        font-size: 13px;
    }
    .selection-item .selection-col[data-label]::before {
        content: attr(data-label);
        min-width: 110px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .selection-col-delete {
        position: absolute;
        top: 12px;
        right: 12px;
        flex: none !important;
    }
    .selection-col-delete .delete-selection {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 30px;
        border: 1px solid #E0E4EA;
        border-radius: 6px;
        background: transparent;
        cursor: pointer;
        transition: background 0.15s, border-color 0.15s;
    }
    .selection-col-delete .delete-selection:hover { background: #F6F7F9; border-color: #C8CDD8; }
    .selection-col-delete .delete-selection:active { background: #ECEEF2; border-color: #B0B6C3; }

    /* --- 12a. Action line (selection buttons) --- */
    .action-line {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
        padding: 12px 0 4px;
    }
    .action-line .to-client-action {
        height: 42px;
        padding: 0 12px;
        white-space: nowrap;
        font-size: 12px;
    }
    .no-selection {
        padding: 24px 16px;
    }
    .no-selection-action {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }
    .no-selection-action .to-client-action {
        height: 42px;
        padding: 0 12px;
        white-space: nowrap;
        font-size: 12px;
    }

    /* --- 12b. Tasks tab: mobile layout --- */
    .tasks-container {
        padding: 8px !important;
    }
    .tasks-container .tasks-header {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
    }
    .tasks-container .entity-tasks-tabs {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        flex-wrap: nowrap !important;
        background: #fff;
    }
    .tasks-container .entity-tasks-tabs::-webkit-scrollbar {
        display: none;
    }
    .tasks-container .entity-tasks-tab {
        flex-shrink: 0;
    }
    .tasks-container .add-task-btn {
        align-self: center;
    }

    /* --- 13. Messages / Calls tab --- */
    .messages-tab {
        height: auto;
        display: flex;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        white-space: nowrap;
        flex-wrap: nowrap;
        gap: 0;
        margin-bottom: 12px;
        background: #fff;
        align-items: center;
    }
    .messages-tab::-webkit-scrollbar {
        display: none;
    }
    .messages-tab .tab-selector {
        padding: 8px 12px;
        font-size: 12px;
        flex-shrink: 0;
        white-space: nowrap;
    }

    /* --- Chat bubbles (mobile) --- */
    .chat-bubble { max-width: 88%; font-size: 12px; padding: 8px 12px; }
    .chat-bubble .chat-text { font-size: 12px; }
    .chat-msg--agent { padding-left: 0; justify-content: flex-end; }

    .messages-block div {
        width: auto !important;
        max-width: 85% !important;
    }
    .messages-block div.right-side {
        margin-left: auto !important;
    }

    /* --- 14. Comment tab --- */
    .comment-update-form .input-block {
        width: 100% !important;
    }
    .comment-update-form .input-block textarea[name="comment"] {
        background: #F6F7F9 !important;
        border: 1px solid #CDD4D9;
    }
    .comment-update-form .input-block {
        margin-bottom: 0 !important;
    }
    .comment-update-form .align-right .submit {
        width: 50%;
    }

    /* === CLIENT VIEW MOBILE === */

    /* Overflow protection */
    body {
        overflow-x: hidden;
    }
    .al-client-view-page,
    .al-client-view-page .container-fluid-base {
        overflow-x: hidden;
    }
    .operations-slider {
        overflow: hidden;
    }

    /* Container padding */
    .al-client-view-page .container.container-base_ {
        padding: 0 16px;
    }
    .al-client-view-page .client-tab-data-block {
        padding-top: 16px;
        padding-bottom: 30px;
    }

    /* Header — vertical stack */
    .al-client-view-page .client-info-header {
        flex-direction: column;
        gap: 12px;
        margin-top: 16px;
        margin-bottom: 16px;
    }
    .al-client-view-page .client-info-header .left-block {
        display: block !important;
    }
    .al-client-view-page .client-info-header .left-block .img {
        float: left;
        width: 80px;
        height: 80px;
        margin: 0 12px 8px 0;
    }
    .al-client-view-page .client-info-header .left-block .img svg {
        width: 80px;
        height: 80px;
    }
    .al-client-view-page .client-info-header .left-block .info {
        padding-top: 0;
        padding-right: 0;
        overflow: hidden;
    }
    .al-client-view-page .client-info-header .left-block .info h1.client-name {
        font-size: 18px;
        line-height: 22px;
        font-weight: 600;
    }
    .al-client-view-page .client-info-header .left-block .info h1.client-name span {
        display: block;
        font-size: 13px !important;
        line-height: 18px;
        margin-top: 2px;
    }
    .al-client-view-page .client-info-header .left-block .info h2.client-manager {
        font-size: 14px;
        margin-bottom: 6px;
    }
    .al-client-view-page .client-info-header .left-block .info .short-info {
        flex-wrap: wrap;
        gap: 6px;
        clear: left;
    }
    .al-client-view-page .client-info-header .left-block .info .short-info svg {
        width: 18px;
        height: 18px;
    }
    .al-client-view-page .client-info-header .left-block .nowrap {
        margin-right: 0;
    }
    .al-client-view-page .client-info-header .left-block .cities-list {
        padding-right: 0;
    }
    .al-client-view-page .client-info-header .left-block .channel {
        font-size: 12px;
        clear: left;
        color: #666;
        line-height: 18px;
    }
    /* Buttons row */
    .al-client-view-page .client-info-header .right-block {
        display: flex !important;
        flex-flow: row nowrap !important;
        gap: 10px;
        width: 100%;
        padding-top: 0;
        justify-content: stretch;
    }
    .al-client-view-page .client-info-header .right-block .btn.edit {
        flex: 1 1 0 !important;
        width: auto !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
        height: 42px !important;
        box-sizing: border-box;
        margin-right: 0 !important;
        padding: 0 !important;
    }
    .al-client-view-page .client-info-header .right-block .external-call,
    .al-client-view-page .client-info-header .right-block .external-call-form {
        flex: 1 1 0 !important;
        width: auto !important;
        height: 42px !important;
        justify-content: center;
        margin-left: 0 !important;
        box-sizing: border-box;
    }

    /* Navigation tabs — horizontal scroll */
    .al-client-view-page .client-navigation .favorite-viewed-tab {
        display: flex;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        gap: 0;
        border-bottom: 1px solid #E8EBF1;
        padding-bottom: 0;
    }
    .al-client-view-page .client-navigation .favorite-viewed-tab::-webkit-scrollbar {
        display: none;
    }
    .al-client-view-page .client-navigation .favorite-viewed-tab a {
        flex-shrink: 0;
        margin-right: 0;
        padding: 10px 14px;
        font-size: 13px;
    }

    /* Info block table — label above value */
    .al-client-view-page .info-block-table .tr {
        flex-direction: column;
        gap: 2px;
        padding-bottom: 12px;
    }
    .al-client-view-page .info-block-table .tr .td:nth-child(1) {
        width: auto !important;
        margin-right: 0;
    }
    .al-client-view-page .info-block-table .tr .td {
        width: auto !important;
        max-width: 100%;
        min-width: 0;
    }

    /* Analytics — single column */
    .al-client-view-page .analytics-grid {
        grid-template-columns: 1fr !important;
        gap: 12px;
    }
    .al-client-view-page .analytics-grid--planned {
        grid-template-columns: 1fr !important;
    }

    /* Contacts — full width */
    .al-client-view-page .contact-block .field-container {
        flex-direction: column;
        gap: 8px;
    }
    .al-client-view-page .contact-block .field-container .input-block {
        width: 100% !important;
        margin-right: 0;
    }

    /* Selection action buttons */
    .al-client-view-page .selection-actions {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }
    .al-client-view-page .selection-actions .to-client-action {
        font-size: 12px;
        height: 42px;
        white-space: nowrap;
        width: 100%;
        box-sizing: border-box;
    }

    /* Additional info — label above value */
    .al-client-view-page .additional-information .info-block-table .tr {
        flex-direction: column;
        gap: 2px;
        max-width: 100%;
        overflow: hidden;
    }
    .al-client-view-page .additional-information .info-block-table .tr .td:nth-child(1) {
        width: auto !important;
    }
    .al-client-view-page .additional-information .info-block-table .tr .td {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: hidden;
        text-overflow: ellipsis;
        box-sizing: border-box;
    }
    .al-client-view-page .additional-information .info-block-table .tr .td a.elipses-link {
        max-width: 100% !important;
        display: block;
        word-break: break-all;
        overflow-wrap: break-word;
        white-space: normal;
    }

    /* Comments */
    .al-client-view-page .info-block-table .tr .td.td-comment {
        width: 100% !important;
        max-width: 100%;
    }

    /* Status form */
    .al-client-view-page .message-tab {
        flex-direction: column !important;
        gap: 16px;
    }
    .al-client-view-page .client-status-log-div,
    .al-client-view-page .client-status-div {
        width: 100%;
    }
    .al-client-view-page .client-change-status-form .align-right .submit {
        width: 100%;
    }

    /* KVED table */
    .al-client-view-page .kved-table .tr {
        flex-direction: column;
        gap: 2px;
    }
    .al-client-view-page .kved-table .tr .td:nth-child(1) {
        width: auto !important;
    }

    /* Merge history */
    .al-client-view-page .custom-info-block-table .tr {
        flex-direction: column;
        gap: 4px;
        padding: 8px 0;
    }
    .al-client-view-page .custom-info-block-table .tr:first-child {
        display: none;
    }

    /* Contact popup */
    .al-client-view-page .switch-contact-form {
        width: 90vw !important;
    }
    .al-client-view-page .switch-contact-form .field-container > div {
        width: 100% !important;
    }

    /* --- Call items (mobile card layout) --- */
    .call-item {
        flex-direction: column;
        padding: 14px 12px 14px 36px;
        gap: 2px;
        position: relative;
        background: #F8F9FB;
        border-radius: 8px;
        margin-bottom: 8px;
        border-top: none;
    }
    .call-item .call-ico {
        position: absolute;
        top: 16px;
        left: 10px;
    }
    .call-item .call-ico img {
        width: 18px;
        height: 18px;
    }
    .call-item .user-info {
        width: auto;
        margin-right: 0;
        padding-left: 0;
    }
    .call-item .user-info .manager-name {
        font-size: 13px;
        color: #3D445C;
    }
    .call-item .user-info .call-date {
        font-size: 12px;
        color: #A0A4B0;
    }
    .call-item .phone {
        width: auto;
        margin: 2px 0 4px 0;
        font-size: 14px;
        font-weight: 600;
        letter-spacing: 0.3px;
    }
    .call-item > div:last-child {
        width: 100%;
    }
    .call-details-row {
        flex-wrap: wrap;
        gap: 6px;
        margin-bottom: 8px !important;
        padding-left: 0;
    }
    .call-details-row .billsec {
        order: 1;
        width: 100%;
        margin-right: 0;
        font-size: 12px;
    }
    .call-item .billsec .billsec-item {
        display: inline;
    }
    .call-item .billsec .billsec-item:first-child::after {
        content: " \00B7  ";
        color: #A0A4B0;
    }
    .call-details-row .call-employee {
        order: 2;
        width: 100%;
        padding-left: 0 !important;
        font-size: 12px;
        color: #8B8F9D;
    }
    .call-details-row .link2file {
        order: 3;
        min-width: unset !important;
        width: auto;
    }
    .call-details-row .transcription-col {
        order: 4;
        padding-left: 0 !important;
    }
    .call-details-row .link2file a.binotel-get-call,
    .call-details-row .transcription-col a.show-transcription {
        height: 28px;
        padding: 0 14px;
        font-size: 12px;
    }
    /* --- Clients page: direct children of .call-item (no .call-details-row wrapper) --- */
    .call-item > .billsec {
        flex: 0 0 auto;
        width: 100%;
        margin-right: 0;
        font-size: 12px;
    }
    .call-item > .billsec .billsec-item {
        display: inline;
    }
    .call-item > .billsec .billsec-item:first-child::after {
        content: " \00B7  ";
        color: #A0A4B0;
    }
    .call-item > .user-post {
        width: auto;
        margin-right: 0;
        font-size: 12px;
        color: #8B8F9D;
    }
    .call-item > .link2file {
        flex: 0 0 auto;
        width: auto;
        min-width: unset;
        margin-top: 6px;
    }
    .call-item > .transcription-col {
        flex: 0 0 auto;
        width: auto;
        padding-left: 0;
        margin-top: 8px;
    }
    .call-item > .link2file a.binotel-get-call,
    .call-item > .transcription-col a.show-transcription {
        height: 28px;
        padding: 0 14px;
        font-size: 12px;
    }
    .call-transcription {
        margin-left: 0;
        width: 100%;
    }
    .transcription-block {
        padding: 0 0 15px 0;
    }
    .link2file audio {
        width: 100%;
        max-width: 100%;
    }

    /* --- 13b. Comments tab --- */
    .comment-container .input-block {
        width: 100% !important;
    }
    .comment-container .input-block textarea {
        width: 100% !important;
    }
    .comment-container .input-block button.submit {
        position: relative !important;
        right: auto !important;
        margin-top: 8px;
    }

    /* --- 13c. Popups: mobile sizing --- */
    .lead-add-popup,
    .confirm-popup,
    .confirm-popup2,
    .default-popup,
    .change-popup,
    .import-block,
    .import-block-outdoor,
    .contacts-add-popup,
    .contacts-edit-popup,
    .status-popup,
    .notes-popup,
    .notes-status-popup,
    .bill-without-contract-popup,
    .returned-popup,
    .photoreports-popup,
    .photoreports-popup2,
    .popup-form,
    .popup-form-export.zi10102 {
        width: 90vw !important;
        left: 5vw !important;
        margin-left: 0 !important;
        margin-top: 0 !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        box-sizing: border-box;
    }
    .bill-without-contract-popup {
        height: auto !important;
        max-height: calc(100vh - 32px) !important;
        overflow-y: auto;
    }

    /* --- popup-form: mobile single-column fields + half-width buttons --- */
    .popup-form .popup-form-body .field-container,
    .popup-form-export.zi10102 .popup-form-body .field-container{
        flex-direction: column;
    }
    .popup-form .popup-form-body .field-container .input-block,
    .popup-form-export.zi10102 .popup-form-body .field-container .input-block{
        width: 100% !important;
        margin-right: 0 !important;
    }
    .popup-form .popup-form-body .field-container .input-block input,
    .popup-form .popup-form-body .field-container .input-block select,
    .popup-form .popup-form-body .field-container .input-block textarea,
    .popup-form-export.zi10102 .popup-form-body .field-container .input-block input,
    .popup-form-export.zi10102 .popup-form-body .field-container .input-block select,
    .popup-form-export.zi10102 .popup-form-body .field-container .input-block textarea{
        width: 100% !important;
        box-sizing: border-box;
    }
    .popup-form .popup-form-body .align-right,
    .popup-form-export.zi10102 .popup-form-body .align-right{
        display: flex;
        gap: 12px;
        margin-top: 16px;
        text-align: center;
    }
    .popup-form .popup-form-body .align-right .clear-new,
    .popup-form .popup-form-body .align-right .cancel{
        flex: 1;
        box-sizing: border-box;
    }
    .popup-form .popup-form-body .align-right .submit,
    .popup-form-export.zi10102 .popup-form-body .align-right .crm-button{
        flex: 1;
        width: auto !important;
        box-sizing: border-box;
    }

    /* --- Export data popup mobile — checkbox columns stack 1-per-row --- */
    .popup-form.zi10102 .popup-form-body .field-container > div[style],
    .popup-form-export.zi10102 .popup-form-body .field-container > div[style]{
        width: 100% !important;
    }
    .popup-form.zi10102 .popup-form-body,
    .popup-form-export.zi10102 .popup-form-body{
        padding: 16px 20px 20px;
        max-height: 70vh;
        overflow-y: auto;
    }
    /* --- Export data popup mobile — selects (e.g. status) full-width --- */
    .popup-form-export.zi10102 .popup-form-body .field-container > div[style] select,
    .popup-form-export.zi10102 .popup-form-body .field-container > div[style] .select2-container{
        width: 100% !important;
        box-sizing: border-box;
    }

    /* --- 14. Lead-add popup --- */
    .lead-add-popup {
        width: 90vw;
        left: 5vw;
        margin-left: 0 !important;
        height: auto !important;
        max-height: 90vh !important;
        overflow: hidden !important;
    }
    .lead-add-popup .lead-add-form {
        max-height: calc(90vh - 70px);
        overflow-y: auto;
    }
    .lead-add-popup .lead-add-form .field-container {
        gap: 12px;
    }
    .lead-add-popup .lead-add-form .input-block {
        flex: 1 1 0;
        min-width: 0;
        width: auto;
    }
    .lead-add-popup .lead-add-form .input-block input,
    .lead-add-popup .lead-add-form .input-block textarea,
    .lead-add-popup .lead-add-form .input-block .select2-container,
    .lead-add-popup .lead-add-form .input-block .select2-container .select2-selection--multiple {
        width: 100% !important;
        box-sizing: border-box;
    }

    /* --- 15. Info table mobile --- */
    .info-table .info-tr {
        flex-direction: column;
        gap: 4px;
    }
    .info-table .info-tr .info-td:nth-child(1) {
        flex: unset;
    }
    .info-table .info-tr .info-td:nth-child(2) {
        flex: unset;
        word-break: break-all;
    }

    /* --- 16. Lead actions container --- */
    .lead-actions-container {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
        padding-left: 0;
        margin-top: 16px;
    }
    .lead-actions-container a {
        font-size: 12px;
        justify-content: flex-start;
        align-items: center;
        margin-left: 0 !important;
        padding: 0 10px;
        white-space: normal;
        box-sizing: border-box;
        width: 100%;
        height: 42px;
        overflow: hidden;
    }

    /* --- clear search icon --- */
    .search-form .input-block.w260:first-of-type input {
        margin-bottom: 0 !important;
    }
    .search-form .input-block.w260:first-of-type {
        margin-bottom: 4px !important;
    }
    .search-form.filters-open .input-block,
    .search-form.filters-open .input-block.w260,
    .search-form.filters-open .form-group {
        margin-bottom: 12px !important;
    }
    .clear-search {
        top: 50%;
        transform: translateY(-50%);
    }

    /* --- 17. Pagination --- */
    .result-paginator {
        flex-direction: column;
        align-items: center;
        gap: 12px;
    }

    /* --- 18. Export button --- */
    .export-data {
        display: block !important;
        width: fit-content;
        margin-left: auto;
        margin-right: 16px;
    }

    /* --- change-popup: select2 overflow fix --- */
    .change-popup-body .change-type[name=supplier_id],
    .change-popup-body .select2-container {
        width: 100% !important;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* --- import-by-id-modal: mobile card layout --- */
    .import-by-id-modal {
        width: 90vw;
        left: 5vw;
        transform: none;
        top: 5%;
        max-height: 90vh;
        overflow-y: auto;
        padding: 0;
        box-sizing: border-box;
    }
    /* Скрываем заголовок таблицы */
    .import-by-id-modal .entry-header_add_by_id {
        display: none;
    }
    /* Каждая строка = карточка */
    .import-by-id-modal .id-entry-group_add_by_id .entry_add_by_id {
        flex-wrap: wrap;
        position: relative;
        background: #f8f9fa;
        border: 1px solid #e0e3ea;
        border-radius: 8px;
        padding: 10px 44px 10px 10px;
        gap: 8px;
        margin-bottom: 12px;
        min-width: 0;
    }
    /* Кнопка удаления — в правом верхнем углу карточки */
    .import-by-id-modal .remove-board-entry_add_by_id {
        position: absolute;
        top: 10px;
        right: 8px;
        width: 30px;
        height: 30px;
        min-width: 30px;
        padding: 0;
    }
    /* ID и Цена — два поля рядом в одной строке */
    .import-by-id-modal .board-id-input_add_by_id,
    .import-by-id-modal .board-price-input_add_by_id {
        width: calc(50% - 4px) !important;
        box-sizing: border-box;
        min-width: 0;
    }
    /* Код + Город — попарно */
    .import-by-id-modal .board-code_add_by_id,
    .import-by-id-modal .board-city_add_by_id,
    .import-by-id-modal .board-side_add_by_id,
    .import-by-id-modal .board-type_add_by_id {
        width: calc(50% - 4px) !important;
        font-size: 13px;
        box-sizing: border-box;
        min-width: 0;
    }
    /* Адрес — полная ширина */
    .import-by-id-modal .board-address_add_by_id {
        width: 100% !important;
        font-size: 13px;
        box-sizing: border-box;
    }
    /* Фото — полная ширина */
    .import-by-id-modal .board-photo_add_by_id {
        width: 100% !important;
    }
    .import-by-id-modal .board-photo_add_by_id img {
        max-width: 100%;
        height: auto;
    }
    /* Лейблы перед заполненными ячейками */
    .import-by-id-modal .board-code_add_by_id:not(:empty)::before {
        display: block;
        content: "Код";
        font-size: 10px;
        font-weight: 600;
        color: #999;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        margin-bottom: 2px;
    }
    .import-by-id-modal .board-city_add_by_id:not(:empty)::before {
        display: block;
        content: "Город";
        font-size: 10px;
        font-weight: 600;
        color: #999;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        margin-bottom: 2px;
    }
    .import-by-id-modal .board-side_add_by_id:not(:empty)::before {
        display: block;
        content: "Сторона";
        font-size: 10px;
        font-weight: 600;
        color: #999;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        margin-bottom: 2px;
    }
    .import-by-id-modal .board-type_add_by_id:not(:empty)::before {
        display: block;
        content: "Тип";
        font-size: 10px;
        font-weight: 600;
        color: #999;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        margin-bottom: 2px;
    }
    .import-by-id-modal .board-address_add_by_id:not(:empty)::before {
        display: block;
        content: "Адрес";
        font-size: 10px;
        font-weight: 600;
        color: #999;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        margin-bottom: 2px;
    }
    .import-by-id-modal .board-photo_add_by_id:not(:empty)::before {
        display: block;
        content: "Фото";
        font-size: 10px;
        font-weight: 600;
        color: #999;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        margin-bottom: 4px;
    }
    /* Кнопки формы на мобиле */
    .import-by-id-modal .import-by-id-buttons {
        flex-direction: column;
        gap: 8px;
    }
    .import-by-id-modal .import-by-id-buttons .btn-style_add_by_id {
        width: 100%;
        box-sizing: border-box;
        text-align: center;
    }
    .import-by-id-modal .import-by-id-modal-header {
        height: 56px;
        padding: 0 16px;
        font-size: 18px;
    }
    .import-by-id-modal .import-by-id-modal-body {
        padding: 12px 16px 20px;
    }

    /* === CLIENT TABS MOBILE === */

    /* Container padding for all client tab pages */
    .al-client-view-page .container.container-base {
        padding: 0 16px;
    }

    /* Search + button header — vertical stack */
    .al-client-view-page .client-contacts-header {
        flex-direction: column;
        gap: 10px;
    }
    .al-client-view-page .client-contacts-header .left-block {
        width: 100%;
    }
    .al-client-view-page .client-contacts-header .left-block form {
        width: 100%;
    }
    .al-client-view-page .client-contacts-header .left-block form input {
        width: 100%;
        box-sizing: border-box;
    }
    .al-client-view-page .client-contacts-header .right-block {
        width: 100%;
    }
    .al-client-view-page .client-contacts-header .right-block .btn {
        width: 100%;
        text-align: center;
        box-sizing: border-box;
    }

    /* --- Generic card layout for data-table tabs --- */
    .al-client-view-page .data-table .data-thead { display: none !important; }
    .al-client-view-page .data-table .data-tbody {
        display: flex !important;
        flex-direction: column;
    }
    .al-client-view-page .data-table .data-tbody > .data-tr {
        flex-direction: column;
        border: none;
        border-bottom: 1px solid #E8EBF1;
        border-radius: 0;
        padding: 12px 0;
        position: relative;
    }
    .al-client-view-page .data-table .data-tbody > .data-tr > .data-td {
        display: flex;
        align-items: flex-start;
        padding: 4px 16px;
        font-size: 13px;
        flex: unset !important;
        width: auto !important;
        min-width: 0 !important;
    }
    .al-client-view-page .data-table .data-tbody .data-td[data-label]::before {
        content: attr(data-label);
        min-width: 120px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-client-view-page .data-table .data-tbody .data-td.action-col { display: none !important; }

    /* Card header — visible on mobile */
    .al-client-view-page .data-table .leads-card-header {
        display: flex !important;
        justify-content: flex-end;
        align-items: center;
        padding: 0 16px 4px;
    }
    .al-client-view-page .data-table .leads-card-header button {
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA; background: transparent;
        cursor: pointer; padding: 0;
        display: flex; align-items: center; justify-content: center;
        border-radius: 6px;
    }
    .al-client-view-page .data-table .leads-card-header button:hover { background: #F6F7F9; border-color: #C8CDD8; }
    .al-client-view-page .data-table .leads-card-header button:active { background: #ECEEF2; border-color: #B0B6C3; }

    /* Kebab dropdown */
    .al-client-view-page .data-table .leads-card-dropdown {
        position: absolute; right: 16px; top: 40px;
        width: 205px; background: #fff;
        border: 1px solid #E0E4EA; border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 100; display: none;
    }
    .al-client-view-page .data-table .leads-card-dropdown.open { display: block; }
    .al-client-view-page .data-table .leads-card-dropdown-item {
        display: flex; align-items: center; gap: 8px;
        padding: 10px 16px; font-size: 14px;
        color: #3D445C; text-decoration: none;
        border-bottom: 1px solid #f5f5f5; cursor: pointer;
    }
    .al-client-view-page .data-table .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-client-view-page .data-table .leads-card-dropdown-item:hover,
    .al-client-view-page .data-table .leads-card-dropdown-item:active { background: #F6F7F9; }

    /* --- Suppliers card layout --- */
    .al-client-view-page .suppliers-table .suppliers-thead { display: none !important; }
    .al-client-view-page .suppliers-table .suppliers-tbody {
        display: flex !important;
        flex-direction: column;
    }
    .al-client-view-page .suppliers-table .supplier-block {
        border: none;
        border-bottom: 1px solid #E8EBF1;
        padding: 12px 0;
        position: relative;
    }
    .al-client-view-page .suppliers-table .supplier-data-row {
        flex-direction: column;
    }
    .al-client-view-page .suppliers-table .supplier-col {
        display: flex;
        align-items: center;
        padding: 4px 16px;
        font-size: 13px;
        flex: unset !important;
        width: 100%;
        box-sizing: border-box;
    }
    .al-client-view-page .suppliers-table .supplier-col[data-label]::before {
        content: attr(data-label);
        width: 110px;
        min-width: 110px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-client-view-page .suppliers-table .supplier-col.action-col { display: none !important; }
    .al-client-view-page .suppliers-table .leads-card-header {
        display: flex !important;
        justify-content: flex-end;
        align-items: center;
        padding: 0 16px 4px;
    }
    .al-client-view-page .suppliers-table .leads-card-header button {
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA; background: transparent;
        cursor: pointer; padding: 0;
        display: flex; align-items: center; justify-content: center;
        border-radius: 6px;
    }
    .al-client-view-page .suppliers-table .leads-card-dropdown {
        position: absolute; right: 16px; top: 40px;
        width: 205px; background: #fff;
        border: 1px solid #E0E4EA; border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 100; display: none;
    }
    .al-client-view-page .suppliers-table .leads-card-dropdown.open { display: block; }
    .al-client-view-page .suppliers-table .leads-card-dropdown-item {
        display: flex; align-items: center; gap: 8px;
        padding: 10px 16px; font-size: 14px;
        color: #3D445C; text-decoration: none;
        border-bottom: 1px solid #f5f5f5; cursor: pointer;
    }
    .al-client-view-page .suppliers-table .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-client-view-page .suppliers-table .leads-card-dropdown-item:hover,
    .al-client-view-page .suppliers-table .leads-card-dropdown-item:active { background: #F6F7F9; }

    /* --- Supplier-row-selects: inner board/service card layout (mobile) --- */
    .al-client-view-page .supplier-row-selects {
        padding: 0 !important;
        overflow-x: visible;
        border-top: 2px solid #CDD4D9;
        background: #F2F4F6;
    }
    .al-client-view-page .supplier-row-selects .suppliers-thead {
        display: none !important;
    }
    .al-client-view-page .supplier-row-selects .supplier-row {
        flex-direction: column;
        border: none;
        border-radius: 8px;
        padding: 8px 0;
        margin: 8px;
        background: #fff;
    }
    .al-client-view-page .supplier-row-selects .supplier-row:last-child {
        margin-bottom: 8px;
    }
    .al-client-view-page .supplier-row-selects .supplier-col {
        display: block !important;
        position: relative;
        padding: 4px 16px 4px 126px !important; /* 16px + 110px label */
        width: 100%;
        box-sizing: border-box;
        flex: unset !important;
        min-height: 24px;
    }
    .al-client-view-page .supplier-row-selects .supplier-col[data-label]::before {
        content: attr(data-label);
        position: absolute;
        left: 16px;
        top: 4px;
        width: 110px;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-client-view-page .supplier-row-selects .supplier-col.f3,
    .al-client-view-page .supplier-row-selects .supplier-col.f03,
    .al-client-view-page .supplier-row-selects .supplier-col.f07,
    .al-client-view-page .supplier-row-selects .supplier-col.f73 {
        flex: unset !important;
        width: 100%;
    }
    .al-client-view-page .supplier-row-selects input.owner-price,
    .al-client-view-page .supplier-row-selects input.supplier-price {
        width: 100%;
        max-width: 200px;
        padding: 8px;
        font-size: 16px;
        box-sizing: border-box;
    }
    .al-client-view-page .supplier-row-selects .informer,
    .al-client-view-page .supplier-row-selects .informer2 { margin-right: 5px; }
    .al-client-view-page .supplier-row-selects .informer-date { margin-right: 4px; }
    .al-client-view-page .supplier-row-selects .informer-form { margin-left: 2px; }
    .al-client-view-page .supplier-row-selects .client-company-title {
        margin: 12px 0 4px;
        padding: 0 4px;
        font-weight: 600;
        font-size: 13px;
    }
    .al-client-view-page .supplier-row-selects > b {
        display: block;
        margin: 16px 0 8px;
        font-size: 13px;
    }
    .al-client-view-page .supplier-row-selects .supplier-info .supplier-info-item {
        width: 100% !important;
    }

    /* --- Boards card layout (HTML table) --- */
    .al-client-view-page .boards-table {
        display: block !important;
        min-width: unset !important;
    }
    .al-client-view-page .boards-table .boards-table-thead { display: none !important; }
    .al-client-view-page .boards-table .boards-table-tbody {
        display: flex !important;
        flex-direction: column;
    }
    .al-client-view-page .boards-table .boards-table-tbody .boards-table-tr {
        display: flex;
        flex-direction: column;
        border: none;
        border-bottom: 1px solid #E8EBF1;
        padding: 12px 0;
        position: relative;
    }
    .al-client-view-page .boards-table .boards-table-tbody .boards-td {
        display: flex;
        align-items: flex-start;
        width: 100%;
        padding: 4px 16px;
        font-size: 13px;
        line-height: 18px;
        height: auto !important;
        text-transform: none !important;
        text-align: left;
        box-sizing: border-box;
    }
    .al-client-view-page .boards-table .boards-table-tbody .boards-td a,
    .al-client-view-page .boards-table .boards-table-tbody .boards-td > div {
        color: #3D445C;
        text-decoration: none;
        min-width: 0;
        word-break: break-word;
        text-align: left;
    }
    .al-client-view-page .boards-table .boards-table-tbody .boards-td[data-label]::before {
        content: attr(data-label);
        min-width: 120px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
        text-transform: lowercase;
    }
    .al-client-view-page .boards-table .boards-td-photo {
        justify-content: flex-start;
        padding: 8px 16px;
    }
    .al-client-view-page .boards-table .boards-table-tbody .boards-td-photo a {
        flex: unset !important;
    }
    .al-client-view-page .boards-table .boards-td-photo img {
        width: 120px !important;
        height: 80px !important;
        object-fit: cover;
        border-radius: 4px;
    }
    .al-client-view-page .boards-table .boards-td-photo[data-label]::before { display: none; }
    .al-client-view-page .boards-table .boards-td-header {
        display: flex !important;
        justify-content: flex-end;
        align-items: center;
        width: 100%;
        padding: 8px 16px 4px;
        box-sizing: border-box;
    }
    .al-client-view-page .boards-table .boards-td-header button {
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA; background: transparent;
        cursor: pointer; padding: 0;
        display: flex; align-items: center; justify-content: center;
        border-radius: 6px;
        transition: background 0.15s, border-color 0.15s;
    }
    .al-client-view-page .boards-table .boards-td-header button:hover {
        background: #F6F7F9; border-color: #C8CDD8;
    }
    .al-client-view-page .boards-table .boards-td-header button:active {
        background: #ECEEF2; border-color: #B0B6C3;
    }
    .al-client-view-page .boards-table .leads-card-dropdown {
        position: absolute; right: 16px; top: 40px;
        width: 205px; background: #fff;
        border: 1px solid #E0E4EA; border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 100; display: none;
    }
    .al-client-view-page .boards-table .leads-card-dropdown.open { display: block; }
    .al-client-view-page .boards-table .leads-card-dropdown-item {
        display: flex; align-items: center; gap: 8px;
        padding: 10px 16px; font-size: 14px;
        color: #3D445C; text-decoration: none;
        border-bottom: 1px solid #f5f5f5; cursor: pointer;
    }
    .al-client-view-page .boards-table .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-client-view-page .boards-table .leads-card-dropdown-item:hover,
    .al-client-view-page .boards-table .leads-card-dropdown-item:active { background: #F6F7F9; }
    .al-client-view-page .boards-table .boards-table-tbody .boards-td:last-child { display: none !important; }

    /* --- Bills card layout --- */
    .al-client-view-page .bills-table .bills-table-thead { display: none !important; }
    .al-client-view-page .bills-table {
        min-width: unset !important;
    }
    .al-client-view-page .bills-table .bills-table-tbody {
        display: flex !important;
        flex-direction: column;
    }
    .al-client-view-page .bills-table .bills-table-tbody > .data-tr {
        flex-direction: column;
        border: none;
        border-bottom: 1px solid #E8EBF1;
        padding: 12px 0;
        position: relative;
    }
    .al-client-view-page .bills-table .bills-table-tbody > .data-tr > .data-td {
        display: flex;
        align-items: flex-start;
        padding: 4px 16px;
        font-size: 13px;
        flex: unset !important;
        width: auto !important;
        min-width: 0 !important;
    }
    .al-client-view-page .bills-table .bills-table-tbody .data-td[data-label]::before {
        content: attr(data-label);
        min-width: 140px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-client-view-page .bills-table .bills-table-tbody .data-td.bill-action { display: none !important; }
    /* Hide low-priority columns on mobile */
    .al-client-view-page .bills-table .bills-table-tbody .data-td.bill-payer { display: none !important; }
    .al-client-view-page .bills-table .bills-table-tbody .data-td.bill-recipient { display: none !important; }
    .al-client-view-page .bills-table .bills-table-tbody .data-td.bill-pay-form { display: none !important; }
    .al-client-view-page .bills-table .bills-table-tbody .data-td.bill-pay-date { display: none !important; }
    .al-client-view-page .bills-table .data-td.contract-info .leads-card-more {
        display: flex !important;
        position: absolute;
        top: 12px; right: 16px;
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA; background: transparent;
        cursor: pointer; padding: 0;
        align-items: center; justify-content: center;
        border-radius: 6px;
        z-index: 2;
    }
    .al-client-view-page .bills-table .data-td.contract-info .leads-card-more:hover { background: #F6F7F9; border-color: #C8CDD8; }
    .al-client-view-page .bills-table .data-td.contract-info .leads-card-more:active { background: #ECEEF2; border-color: #B0B6C3; }
    .al-client-view-page .bills-table .data-td.contract-info .contract-info-text {
        padding-right: 46px;
    }
    .al-client-view-page .bills-table .leads-card-dropdown {
        position: absolute; right: 16px; top: 40px;
        width: 205px; background: #fff;
        border: 1px solid #E0E4EA; border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 100; display: none;
    }
    .al-client-view-page .bills-table .leads-card-dropdown.open { display: block; }
    .al-client-view-page .bills-table .leads-card-dropdown-item {
        display: flex; align-items: center; gap: 8px;
        padding: 10px 16px; font-size: 14px;
        color: #3D445C; text-decoration: none;
        border-bottom: 1px solid #f5f5f5; cursor: pointer;
    }
    .al-client-view-page .bills-table .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-client-view-page .bills-table .leads-card-dropdown-item:hover,
    .al-client-view-page .bills-table .leads-card-dropdown-item:active { background: #F6F7F9; }

    /* --- Contracts card layout --- */
    .al-client-view-page .clients-contracts-data .data-table .data-tbody {
        display: flex !important;
        flex-direction: column;
    }
    .al-client-view-page .clients-contracts-data .data-tr-global {
        border: none;
        border-bottom: 1px solid #E8EBF1;
        padding: 12px 0;
        position: relative;
    }
    .al-client-view-page .clients-contracts-data .data-tr-global > .data-tr {
        border: none;
        border-radius: 0;
    }
    /* Hide FI columns on mobile */
    .al-client-view-page .clients-contracts-data .data-td.fi-col-td { display: none !important; }

    /* --- Docs: hide low-value columns --- */
    .al-client-view-page .clients-docs-data .data-td.docs-col-edrpou { display: none !important; }
    .al-client-view-page .clients-docs-data .data-td.docs-col-our-firm { display: none !important; }

    /* --- Photoreports card layout --- */
    .al-client-view-page .photoreports-table { border-top: none !important; }
    .al-client-view-page .photoreports-table .photoreports-thead { display: none !important; }
    .al-client-view-page .photoreports-table .photoreports-tbody {
        display: flex !important;
        flex-direction: column;
    }
    .al-client-view-page .photoreports-table .photoreports-tbody > .photoreports-row {
        flex-direction: column;
        border: none;
        border-bottom: 1px solid #E8EBF1;
        padding: 12px 0;
        position: relative;
    }
    .al-client-view-page .photoreports-table .photoreports-tbody > .photoreports-row > .photoreports-col {
        display: flex;
        align-items: flex-start;
        padding: 4px 16px;
        font-size: 13px;
        flex: unset !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        text-align: left !important;
    }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col[data-label]::before {
        content: attr(data-label);
        min-width: 140px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.photo-report-checkbox-col { display: none !important; }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.action-col { display: none !important; }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.photo-col a { margin-left: 0 !important; }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.photo-col .custom-bubble-image-container { margin-top: 0 !important; display: flex !important; align-items: center; gap: 6px; }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.photo-col .custom-bubble-image-container > div { margin-top: 0 !important; }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.photo-col .custom-bubble-image-container .hover-image,
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.photo-col .custom-bubble-image-container:hover .hover-image,
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.design-col .custom-bubble-image-container .hover-image,
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.design-col .custom-bubble-image-container:hover .hover-image { display: none !important; }
    /* Hide low-priority columns on mobile */
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.pr-col-contract { display: none !important; }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.pr-col-application { display: none !important; }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.pr-col-firm { display: none !important; }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.pr-col-firm-code { display: none !important; }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.pr-col-contractor-code { display: none !important; }
    .al-client-view-page .photoreports-table .photoreports-tbody .photoreports-col.pr-col-rental-period { display: none !important; }
    .al-client-view-page .photoreports-table .leads-card-header {
        display: flex !important;
        justify-content: flex-end;
        align-items: center;
        padding: 0 16px 4px;
    }
    .al-client-view-page .photoreports-table .leads-card-header button {
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA; background: transparent;
        cursor: pointer; padding: 0;
        display: flex; align-items: center; justify-content: center;
        border-radius: 6px;
    }
    .al-client-view-page .photoreports-table .leads-card-dropdown {
        position: absolute; right: 16px; top: 40px;
        width: 205px; background: #fff;
        border: 1px solid #E0E4EA; border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 100; display: none;
    }
    .al-client-view-page .photoreports-table .leads-card-dropdown.open { display: block; }
    .al-client-view-page .photoreports-table .leads-card-dropdown-item {
        display: flex; align-items: center; gap: 8px;
        padding: 10px 16px; font-size: 14px;
        color: #3D445C; text-decoration: none;
        border-bottom: 1px solid #f5f5f5; cursor: pointer;
    }
    .al-client-view-page .photoreports-table .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-client-view-page .photoreports-table .leads-card-dropdown-item:hover,
    .al-client-view-page .photoreports-table .leads-card-dropdown-item:active { background: #F6F7F9; }

    /* Bills search form — each filter on its own row */
    .al-client-view-page .bills-search-form .field-container {
        flex-direction: column;
    }
    .al-client-view-page .bills-search-form .field-container .input-block,
    .al-client-view-page .bills-search-form .field-container .input-block.w150 {
        width: 100% !important;
        flex: none;
        margin-right: 0;
        box-sizing: border-box;
    }
    .al-client-view-page .bills-search-form .field-container .input-block input,
    .al-client-view-page .bills-search-form .field-container .input-block select,
    .al-client-view-page .bills-search-form .field-container .input-block .bills-status-select,
    .al-client-view-page .bills-search-form .field-container .input-block .bills-year-select,
    .al-client-view-page .bills-search-form .field-container .input-block .bills-month-select {
        width: 100% !important;
        box-sizing: border-box;
    }
    /* select2 inline width override */
    .al-client-view-page .bills-search-form .select2-container {
        width: 100% !important;
    }
    /* Checkbox row — наследует глобальное правило display:flex + display:contents на span */

    /* Bills stat row */
    .al-client-view-page .bills-stat {
        flex-wrap: wrap;
        gap: 4px 12px;
        font-size: 12px;
    }

    /* Contracts search form */
    .al-client-view-page .client-contacts-header .left-block form.search-form {
        flex-direction: column !important;
        gap: 8px !important;
        width: 100%;
    }
    .al-client-view-page .client-contacts-header .left-block .input-block {
        width: 100%;
    }
    .al-client-view-page .client-contacts-header .left-block .input-block select {
        width: 100% !important;
        box-sizing: border-box;
    }

    /* Select in title block — wrap */
    .al-client-view-page .select-in-title-block {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        margin-bottom: 0;
    }
    .al-client-view-page .select-in-title-block .info-block-title {
        margin-bottom: 0 !important;
        font-size: 16px;
    }
    .al-client-view-page .select-in-title-block br {
        display: none;
    }
    .al-client-view-page .select-in-title-block .search-form-select {
        width: 100%;
    }
    .al-client-view-page .select-in-title-block .select2 {
        width: 100% !important;
        margin: 0;
    }

    /* Popups — fit mobile screen */
    .contacts-add-popup,
    .contacts-edit-popup,
    .status-popup,
    .bill-without-contract-popup,
    .change-sum-popup,
    .returned-popup {
        width: 90vw !important;
        left: 5vw !important;
        margin-left: 0 !important;
        min-height: auto !important;
    }
    .bill-without-contract-popup {
        height: auto !important;
        max-height: calc(100vh - 32px) !important;
        overflow-y: auto;
    }
    .contacts-add-popup .contacts-add-form .field-container,
    .contacts-edit-popup .field-container {
        flex-direction: column;
        gap: 0;
    }
    .contacts-add-popup .contacts-add-form .input-block,
    .contacts-edit-popup .input-block {
        width: 100%;
    }
    .contacts-add-popup .contacts-add-form .input-block input,
    .contacts-add-popup .contacts-add-form .input-block select,
    .contacts-edit-popup .input-block input,
    .contacts-edit-popup .input-block select {
        width: 100% !important;
        box-sizing: border-box;
    }
    .contacts-add-popup .contacts-add-form .align-right,
    .contacts-edit-popup .align-right {
        display: flex;
        gap: 12px;
        text-align: center;
    }
    .contacts-add-popup .contacts-add-form .align-right .clear-new,
    .contacts-add-popup .contacts-add-form .align-right .submit,
    .contacts-edit-popup .align-right .clear-new,
    .contacts-edit-popup .align-right .submit {
        flex: 1;
        min-width: 0;
        box-sizing: border-box;
    }
    .contacts-add-popup .select2-container,
    .contacts-edit-popup .select2-container {
        width: 100% !important;
    }
    /* contracts popup — mobile: reset JS-injected height/margin */
    .contacts-add-popup {
        height: auto !important;
        margin-top: 0 !important;
    }
    .contacts-add-popup .contracts-add-form .field-container {
        flex-direction: column !important;
        gap: 0 !important;
    }
    .contacts-add-popup .contracts-add-form .field-container .input-block {
        flex: none !important;
        width: 100% !important;
        min-width: 0 !important;
        margin-right: 0 !important;
        margin-bottom: 8px !important;
    }
    .contacts-add-popup .contracts-add-form .input-block input,
    .contacts-add-popup .contracts-add-form .input-block select {
        width: 100% !important;
        box-sizing: border-box !important;
    }
    .contacts-add-popup .contracts-add-form .select2-container {
        width: 100% !important;
    }
    .contacts-add-popup .contracts-add-form .buttons-block {
        display: flex !important;
        justify-content: center !important;
        padding-top: 10px !important;
    }
    .contacts-add-popup .contracts-add-form .buttons-block .crm-button {
        width: 100% !important;
        box-sizing: border-box !important;
    }
    .bill-without-contract-popup .contracts-add-form .field-container {
        flex-direction: column !important;
        gap: 0 !important;
    }
    .bill-without-contract-popup .contracts-add-form .field-container .input-block {
        flex: none !important;
        width: 100% !important;
        min-width: 0 !important;
        margin-right: 0 !important;
        margin-bottom: 8px !important;
    }
    .bill-without-contract-popup .contracts-add-form .input-block input:not([type=checkbox]),
    .bill-without-contract-popup .contracts-add-form .input-block select,
    .bill-without-contract-popup .contracts-add-form .select2-container {
        width: 100% !important;
        box-sizing: border-box !important;
    }
    .bill-without-contract-popup .contracts-add-form .buttons-block {
        display: flex !important;
        justify-content: flex-end !important;
        padding-top: 10px !important;
    }
    .bill-without-contract-popup .contracts-add-form .buttons-block .crm-button {
        width: auto !important;
        min-width: 150px !important;
        box-sizing: border-box !important;
    }

    /* Deactivate popup */
    .default-popup.deactivate-client-form {
        width: 90vw !important;
        left: 5vw !important;
        margin-left: 0 !important;
        transform: translateY(-50%) !important;
    }
    .default-popup .field-container {
        flex-direction: column;
    }
    .default-popup .field-container .input-block {
        width: 100%;
        margin-right: 0 !important;
    }

    /* Photoreport filter block */
    .al-client-view-page .photoreport-filter-action-block {
        flex-wrap: wrap;
    }
    .al-client-view-page .photoreport-filter-action-block .header-styles {
        flex-wrap: wrap;
    }
    .al-client-view-page .photoreport-filter-action-block .header-styles {
        width: 100%;
        padding-top: 0;
    }
    .al-client-view-page .photoreport-filter-action-block .header-styles:last-child {
        padding-top: 0 !important;
    }
    .al-client-view-page .photoreport-filter-action-block .header-styles .field-container {
        width: 100% !important;
        flex: unset !important;
    }
    .al-client-view-page .photoreport-filter-action-block .header-styles .field-container .input-block {
        margin-right: 0 !important;
        width: 100% !important;
    }
    .al-client-view-page .photoreport-filter-action-block .header-styles .photoreports-search-button {
        width: 100% !important;
    }
    .al-client-view-page .photoreport-filter-action-block .header-styles .photoreports-search-button .search-button {
        width: 100% !important;
        justify-content: center;
        box-sizing: border-box;
    }
    .al-client-view-page .photoreport-filter-action-block .header-styles .filter-btn-block {
        width: 100% !important;
    }
    .al-client-view-page .photoreport-filter-action-block .header-styles .filter-btn-block .bk-filter-btn {
        width: 100% !important;
        justify-content: center;
        box-sizing: border-box;
    }

    /* Chat container — ensure full width */
    .al-client-view-page #bb-chat-container {
        min-height: 60vh;
    }

    /* === COMPANY EDIT FORM: MOBILE === */
    #result-search-list .client-details-container {
        padding: 0 16px !important;
        box-sizing: border-box;
        max-width: 100%;
    }
    .client-details-container .input-group {
        flex-direction: column;
    }
    .client-details-container .input-group .input-block {
        width: 100% !important;
        margin-right: 0;
    }
    .client-details-container .input-group .input-block input,
    .client-details-container .input-group .input-block select,
    .client-details-container .tax-status {
        width: 100% !important;
        box-sizing: border-box;
    }
    .client-details-container .input-group .input-block.ib-break,
    .client-details-container .input-group .input-block.w680,
    .client-details-container .input-group .input-block.w340 {
        width: 100% !important;
    }
    .client-details-container .input-group .input-block input.index,
    .client-details-container .input-group .input-block input.address,
    .client-details-container .input-group .input-block input.full_name {
        width: 100% !important;
    }
    .client-details-container .input-group .input-block input[name=ur_city],
    .client-details-container .input-group .input-block input[name=post_city] {
        width: 100% !important;
    }
    .client-details-container [name="document_send"] {
        width: 100% !important;
    }
    .client-details-container .details-tabs-header a {
        font-size: 15px;
        margin-right: 12px;
    }
    .client-details-container .buttons-block .btn {
        width: 100%;
        box-sizing: border-box;
    }
    .client-details-container .buttons-block .new-cancel-button {
        margin-right: 0;
        margin-bottom: 10px;
    }

    /* === COMPANY VIEW: MOBILE === */
    .client-details-block .details-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        margin-bottom: 20px;
    }
    .client-details-block .details-header h1 {
        font-size: 22px;
        line-height: 28px;
        margin-bottom: 10px;
    }
    .client-details-block .details-header .view-edit-btn {
        width: 100%;
        text-align: center;
        box-sizing: border-box;
    }
    .company-info .line .title {
        width: 120px;
        min-width: 120px;
    }

}

@media screen and (max-width: 500px) {
    .lead-add-popup .lead-add-form .field-container {
        flex-direction: column;
        gap: 0;
    }
    .lead-add-popup .lead-add-form .input-block {
        flex: none;
        width: 100%;
    }
    .lead-add-popup .lead-add-form .input-block input,
    .lead-add-popup .lead-add-form .input-block textarea,
    .lead-add-popup .lead-add-form .input-block .select2-container,
    .lead-add-popup .lead-add-form .input-block .select2-container .select2-selection--multiple {
        width: 100% !important;
        box-sizing: border-box;
    }
}

@media (min-width: 100px) and (max-width: 1000px) {
    #result-search-list .container-search-result {
        padding-right: 0;
        padding-left: 0;
    }
}

@media screen and (max-width: 768px) {
    /* --- Operations slider mobile --- */
    .title-search-result {
        margin-top: 0;
    }
    .operations-slider {
        height: auto;
        overflow: hidden;
        margin: 0;
        max-height: 0;
    }
    .operations-slider:has(.slick-initialized) {
        max-height: none;
        overflow: visible;
    }
    .operations-slider .loading {
        height: 60px;
    }
    .operation-info {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        padding: 8px 12px;
    }
    .left-info {
        flex-wrap: nowrap;
        align-items: flex-start;
    }
    .left-info svg {
        flex-shrink: 0;
    }
    .left-info span {
        flex: 1;
        min-width: 0;
    }
    .right-action {
        width: 100%;
        justify-content: flex-end;
        flex-wrap: wrap;
        gap: 8px;
    }
    .right-action .action-button {
        width: auto;
        min-width: 110px;
        height: 36px;
        line-height: 34px;
        padding: 0 16px;
    }
    .right-action .delete-operation {
        width: 36px;
        height: 36px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .operations-slider .slick-dotted.slick-slider {
        margin-bottom: 0 !important;
    }
    .operations-slider .operations-count {
        left: auto;
        right: 16px;
        bottom: 4px;
    }
    .operation-item::after {
        height: calc(100% - 8px);
    }
}

/* =====================================================================
   Selection items table — Tablet (769px-1365px)
   ===================================================================== */
@media screen and (min-width: 769px) and (max-width: 1365px) {

    /* Popup container */
    .mfp-container {
        padding: 0 12px;
    }
    .mfp-content {
        max-width: 100%;
        padding-top: 48px !important;
        box-sizing: border-box;
    }

    /* Hide table header row */
    .selection-items-head {
        display: none;
    }

    /* Table → block */
    .selection-items-table {
        display: block;
    }
    .selection-items-body {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        gap: 12px;
    }

    /* Row → card */
    .selection-items-row {
        display: flex;
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 12px 16px;
        position: relative;
        box-sizing: border-box;
    }

    /* Col → flex label:value row */
    .selection-items-col {
        display: flex;
        align-items: flex-start;
        width: 100%;
        max-width: none !important;
        padding: 4px 0;
        border-bottom: none;
        margin-bottom: 0;
        font-size: 13px;
        line-height: 18px;
        box-sizing: border-box;
    }

    /* Labels via data-label */
    .selection-items-col[data-label]::before {
        content: attr(data-label);
        display: inline-block;
        min-width: 140px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }

    /* Hide existing .mb-title spans (superseded by data-label) */
    .selection-items-col .mb-title {
        display: none;
    }

    /* Checkbox: top-right corner of card */
    .selection-items-col.col-checkbox {
        position: absolute;
        top: 6px;
        right: 8px;
        width: auto;
        padding: 0;
    }
    .selection-items-col.col-checkbox .item-checkbox {
        width: 20px;
        height: 20px;
        min-width: 20px;
        cursor: pointer;
        padding: 8px;
        box-sizing: content-box;
    }

    /* Busy bar: fill available width in flex row */
    .selection-items-col.col-busy .wrapp-busy {
        flex: 1;
        min-width: 0;
    }

    /* Price inputs — fixed 110px like desktop */
    .selection-items-col .selection-item-price,
    .selection-items-col .custom-selection-item-price {
        width: 110px;
        box-sizing: border-box;
    }

    /* Hide hover popup image on touch */
    .selection-items-col .al-popup-image {
        display: none !important;
    }

    /* --- Call items (tablet — same as mobile) --- */
    .call-item {
        flex-direction: column;
        padding: 14px 12px 14px 36px;
        gap: 0;
        position: relative;
        background: #F8F9FB;
        border-radius: 8px;
        margin-bottom: 8px;
        border-top: none;
    }
    .call-item .call-ico {
        position: absolute;
        top: 16px;
        left: 10px;
    }
    .call-item .call-ico img {
        width: 18px;
        height: 18px;
    }
    .call-item .user-info {
        width: auto;
        margin-right: 0;
        padding-left: 0;
    }
    .call-item .user-info .call-date {
        font-size: 12px;
        color: #A0A4B0;
    }
    .call-item .phone {
        width: auto;
        margin: 2px 0 6px 0;
        font-size: 14px;
        font-weight: 600;
        letter-spacing: 0.3px;
    }
    .call-item > div:last-child {
        width: 100%;
    }
    .call-details-row {
        flex-wrap: wrap;
        gap: 6px;
        margin-bottom: 8px !important;
        padding-left: 0;
    }
    .call-details-row .billsec {
        order: 1;
        width: 100%;
        margin-right: 0;
        font-size: 12px;
    }
    .call-item .billsec .billsec-item {
        display: inline;
    }
    .call-item .billsec .billsec-item:first-child::after {
        content: " \00B7  ";
        color: #A0A4B0;
    }
    .call-details-row .call-employee {
        order: 2;
        width: 100%;
        padding-left: 0 !important;
        font-size: 12px;
        color: #8B8F9D;
    }
    .call-details-row .link2file {
        order: 3;
        min-width: unset !important;
        width: auto;
    }
    .call-details-row .transcription-col {
        order: 4;
        padding-left: 0 !important;
    }
    .call-details-row .link2file a.binotel-get-call,
    .call-details-row .transcription-col a.show-transcription {
        height: 28px;
        padding: 0 14px;
        font-size: 12px;
    }
    /* --- Clients page: direct children of .call-item --- */
    .call-item > .billsec {
        flex: 0 0 auto;
        width: 100%;
        margin-right: 0;
        font-size: 12px;
    }
    .call-item > .link2file {
        flex: 0 0 auto;
        width: auto;
        min-width: unset;
    }
    .call-item > .user-post {
        width: auto;
        margin-right: 0;
        font-size: 12px;
        color: #8B8F9D;
    }
    .call-item > .transcription-col {
        flex: 0 0 auto;
        width: auto;
        padding-left: 0;
        margin-top: 8px;
    }
    .call-item > .link2file a.binotel-get-call,
    .call-item > .transcription-col a.show-transcription {
        height: 28px;
        padding: 0 14px;
        font-size: 12px;
    }
    .call-transcription {
        margin-left: 0;
        width: 100%;
    }
    .transcription-block {
        padding: 0 0 15px 0;
    }
    .link2file audio {
        width: 100%;
        max-width: 100%;
    }

    /* Selection tab (#application-selection) — list + cards side-by-side */
    .selection-top {
        display: flex;
        align-items: flex-start;
        gap: 12px;
    }
    .selection-top .selections-list {
        width: 240px;
        flex-shrink: 0;
    }
    .selection-top .selections-data {
        width: auto;
        flex: 1 1 auto;
        min-width: 0;
        box-sizing: border-box;
    }
    /* Single-column card list inside selections-data on tablet */
    .selection-top .selections-data .selection-items-body {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }
    /* Card: wrap image/photo icons inside their value area */
    .selection-top .selection-items-col.col-image {
        flex-wrap: wrap;
    }
    .selection-top .selection-items-col.col-image .img {
        max-width: 100%;
    }
    /* Kill decorative left-bg.png vertical line on tablet */
    .popup-data .selection-top {
        background: none;
    }
    /* Breathing room on the right so card doesn't touch modal edge */
    .popup-data .selection-wrap .selection-top,
    .popup-data .selection-wrap .selection-shadow,
    .popup-data .selection-wrap .selection-bottom {
        padding-left: 20px;
        padding-right: 20px;
        box-sizing: border-box;
    }

}

/* =====================================================================
   Selection items table — Mobile (≤768px)
   ===================================================================== */
@media screen and (max-width: 768px) {

    /* Popup container */
    .mfp-container {
        padding: 0 4px;
    }
    .mfp-content {
        max-width: 100%;
        padding: 48px 12px 16px !important;
        box-sizing: border-box;
    }

    /* Hide table header row */
    .selection-items-head {
        display: none;
    }

    /* Table → block */
    .selection-items-table {
        display: block;
    }
    .selection-items-body {
        display: block;
    }

    /* Row → card (mirrors tablet appearance) */
    .selection-items-row {
        display: flex;
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 12px 16px;
        margin-bottom: 10px;
        position: relative;
        box-sizing: border-box;
    }
    .selection-items-row:last-child {
        margin-bottom: 0;
    }

    /* Col → flex label:value row */
    .selection-items-col {
        display: flex;
        align-items: flex-start;
        width: 100%;
        max-width: none !important;
        padding: 4px 0;
        border-bottom: none;
        margin-bottom: 0;
        font-size: 13px;
        line-height: 18px;
        box-sizing: border-box;
    }

    /* Labels via data-label */
    .selection-items-col[data-label]::before {
        content: attr(data-label);
        display: inline-block;
        min-width: 120px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }

    /* Hide existing .mb-title spans */
    .selection-items-col .mb-title {
        display: none;
    }

    /* Checkbox: top-right corner */
    .selection-items-col.col-checkbox {
        position: absolute;
        top: 12px;
        right: 12px;
        width: auto;
        padding: 0;
    }
    .selection-items-col.col-checkbox .item-checkbox {
        width: 20px;
        height: 20px;
        min-width: 20px;
        cursor: pointer;
        padding: 8px;
        box-sizing: content-box;
    }

    /* Busy bar: fill available width in flex row */
    .selection-items-col.col-busy .wrapp-busy {
        flex: 1;
        min-width: 0;
    }

    /* Price inputs — fixed 110px like desktop */
    .selection-items-col .selection-item-price,
    .selection-items-col .custom-selection-item-price {
        width: 110px;
        box-sizing: border-box;
    }
    .selection-items-col .boards-td {
        width: 100%;
    }

    /* Hide hover popup image */
    .selection-items-col .al-popup-image {
        display: none !important;
    }

    /* Address: allow wrapping */
    .selection-items-col.break-words a {
        word-break: break-word;
    }

    /* Actions block: vertical stack on mobile */
    .selections-actions-block {
        flex-direction: column;
        align-items: flex-start;
    }

    /* Excel settings panel */
    .excel_setting {
        width: calc(100% - 32px);
        max-width: 440px;
        box-sizing: border-box;
    }
    .excel_setting .checboxes {
        grid-template-columns: 1fr;
        max-height: 60vh;
    }
    .excel_setting .dwn-button {
        width: calc(100% - 40px);
        margin: 0 20px 16px;
        box-sizing: border-box;
    }

    /* Selection tab (#application-selection) — stack list above cards */
    .selection-top {
        display: flex;
        flex-direction: column;
        gap: 12px;
        background: none;
    }
    .selection-top .selections-list,
    .selection-top .selections-data {
        width: 100%;
        box-sizing: border-box;
    }
    .selection-top .selections-list ul li,
    .selection-top .selections-list ul li:hover,
    .selection-top .selections-list ul li.active {
        padding: 12px 16px;
    }
    .selection-top .selections-data .selection-items-body {
        display: block;
    }
    .selection-top .selection-items-col.col-image {
        flex-wrap: wrap;
    }
    .selection-top .selection-items-col.col-image .img {
        max-width: 100%;
    }
    /* Neutralize negative margins that assumed 20px modal padding —
       mobile modal has only 12px, so -20px overflowed the popup */
    .popup-data .selection-wrap,
    .popup-data .manual-boards-wrap,
    .popup-data .tabls-list,
    .popup-data .boards-table {
        margin-left: 0;
        margin-right: 0;
    }
    /* Hide decorative shadow strip below cards list on mobile */
    .popup-data .selection-wrap .selection-shadow,
    .popup-data .boards-search-result .selection-shadow {
        display: none;
    }
    /* Active list row no longer overflows because parent is 100% wide,
       but guard against long labels pushing width */
    .popup-data .selection-top .selections-list,
    .popup-data .selection-top .selections-data,
    .popup-data .selection-top .selection-items-row {
        max-width: 100%;
        box-sizing: border-box;
    }
}

/* =====================================================================
   Contracts list — data-tr.tr-action adaptation (tablet 769px-1365px)
   ===================================================================== */
@media screen and (min-width: 769px) and (max-width: 1365px) {

    /* Override grid layout from earlier tablet block → single-column list like mobile */
    .al-client-view-page .clients-contracts-data .data-table .data-tbody {
        display: flex !important;
        flex-direction: column !important;
        grid-template-columns: none !important;
        gap: 0 !important;
    }
    .al-client-view-page .clients-contracts-data .data-tr-global {
        border: none !important;
        border-bottom: 1px solid #E8EBF1 !important;
        border-radius: 0 !important;
        overflow: visible !important;
        padding: 12px 0 !important;
    }
    .al-client-view-page .clients-contracts-data .data-tr-global > .data-tr {
        border: none !important;
        border-radius: 0 !important;
    }

    /* Hide thead — fields shown as label:value in cards */
    .al-client-view-page .clients-contracts-data .data-table .data-thead {
        display: none !important;
    }

    /* Contract row → vertical card */
    .al-client-view-page .clients-contracts-data .data-tr.tr-action {
        flex-direction: column !important;
        padding: 0 !important;
        position: relative;
    }

    /* Show toggle + "…" button */
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .leads-card-header {
        display: flex !important;
        justify-content: space-between;
        align-items: center;
        padding: 10px 16px 4px;
    }
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .leads-card-header button {
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA; background: transparent;
        cursor: pointer; padding: 0;
        display: flex; align-items: center; justify-content: center;
        border-radius: 6px;
        transition: background 0.15s, border-color 0.15s;
    }
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .leads-card-header button:hover {
        background: #F6F7F9; border-color: #C8CDD8;
    }
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .leads-card-header button:active {
        background: #ECEEF2; border-color: #B0B6C3;
    }
    .al-client-view-page .clients-contracts-data .data-tr-global.active .leads-card-toggle svg {
        transform: rotate(180deg); transition: transform 0.2s;
    }
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .up-down {
        display: none !important;
    }

    /* Contract name — full-width header */
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .data-td.td-name {
        flex: unset !important;
        width: 100%;
        padding: 4px 16px 8px;
        font-size: 14px;
        font-weight: 500;
        box-sizing: border-box;
    }

    /* Date & status — label:value rows */
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .data-td:not(.td-name):not(.action-col):not(.fi-col-td) {
        flex: unset !important;
        width: 100%;
        padding: 4px 16px;
        font-size: 13px;
        display: flex;
        align-items: flex-start;
        box-sizing: border-box;
    }
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .data-td[data-label]:not(.td-name):not(.action-col):not(.fi-col-td)::before {
        content: attr(data-label);
        display: inline-block;
        min-width: 130px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }

    /* Padding bottom on last visible data-td */
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .data-td:not(.td-name):not(.action-col):not(.fi-col-td):last-of-type {
        padding-bottom: 10px;
    }

    /* Hide action buttons — replaced by dropdown */
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .data-td.action-col {
        display: none !important;
    }
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .data-td.fi-col-td {
        display: none !important;
    }

    /* Dropdown */
    .al-client-view-page .clients-contracts-data .leads-card-dropdown {
        position: absolute; right: 16px; top: 44px;
        width: 205px; background: #fff;
        border: 1px solid #E0E4EA; border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 100; display: none;
    }
    .al-client-view-page .clients-contracts-data .leads-card-dropdown.open { display: block; }
    .al-client-view-page .clients-contracts-data .leads-card-dropdown-item {
        display: block; padding: 10px 16px; font-size: 14px;
        color: #3D445C; text-decoration: none;
        border-bottom: 1px solid #f5f5f5; cursor: pointer;
    }
    .al-client-view-page .clients-contracts-data .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-client-view-page .clients-contracts-data .leads-card-dropdown-item:hover,
    .al-client-view-page .clients-contracts-data .leads-card-dropdown-item:active { background: #F6F7F9; }

    /* application-form-popup — tablet width constraint */
    .application-form-popup,
    .control-layout-popup,
    .application-form2-popup,
    .multiple-control-layout-popup {
        max-width: calc(100vw - 32px) !important;
        box-sizing: border-box;
    }

    /* photoreports-popup — tablet width constraint */
    .photoreports-popup,
    .photoreports-popup2 {
        max-width: calc(100vw - 32px) !important;
        max-height: 90vh !important;
        overflow-y: auto !important;
        box-sizing: border-box;
    }
    .photoreports-popup .photo-list {
        flex-wrap: wrap;
        gap: 8px;
    }
    .photoreports-popup .photo-list-item {
        width: calc(25% - 6px) !important;
        margin-right: 0 !important;
    }
    .photoreports-popup .photo-list-item .my-file-uploader {
        width: 100% !important;
    }
    .photoreports-popup .photo-list-item .my-file-uploader .img-div {
        width: calc(100% + 2px) !important;
    }
    .photoreports-popup .photo-list-item select {
        width: 100% !important;
    }

    /* === APP ROW (заявки всередині договору) — TABLET === */
    .al-client-view-page .clients-contracts-data .acts-list .data-thead { display: none !important; }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr {
        flex-direction: column !important;
        padding: 0 !important;
        position: relative;
        border-bottom: 1px solid #E8EBF1;
        margin-bottom: 0;
    }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .act-row-card-header {
        display: flex !important;
        justify-content: flex-end;
        align-items: center;
        padding: 10px 16px 4px;
    }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .act-row-card-header button {
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA; background: transparent;
        cursor: pointer; padding: 0;
        display: flex; align-items: center; justify-content: center;
        border-radius: 6px;
        transition: background 0.15s, border-color 0.15s;
    }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .act-row-card-header button:hover { background: #F6F7F9; border-color: #C8CDD8; }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .data-td:not(.action-col):not(.fi-col-td) {
        flex: unset !important;
        width: 100%;
        padding: 4px 16px;
        font-size: 13px;
        display: flex !important;
        align-items: flex-start;
        box-sizing: border-box;
    }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .data-td.td-number {
        padding-top: 0;
        font-weight: 500;
        font-size: 14px;
    }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .data-td[data-label]:not(.action-col):not(.fi-col-td)::before {
        content: attr(data-label);
        display: inline-block;
        min-width: 130px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .data-td.td-number::before { display: none; }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .data-td.action-col { display: none !important; }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .data-td.fi-col-td { display: none !important; }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .data-td:not(.action-col):not(.fi-col-td):last-of-type { padding-bottom: 10px; }
    /* Dropdown for act-row */
    .al-client-view-page .clients-contracts-data .acts-list .act-row-card-dropdown {
        position: absolute; right: 16px; top: 44px;
        width: 220px; background: #fff;
        border: 1px solid #E0E4EA; border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 101; display: none; max-height: 60vh; overflow-y: auto;
    }
    .al-client-view-page .clients-contracts-data .acts-list .act-row-card-dropdown.open { display: block; }
    .al-client-view-page .clients-contracts-data .acts-list .act-row-card-dropdown .leads-card-dropdown-item {
        display: block; padding: 10px 16px; font-size: 14px;
        color: #3D445C; text-decoration: none;
        border-bottom: 1px solid #f5f5f5; cursor: pointer;
    }
    .al-client-view-page .clients-contracts-data .acts-list .act-row-card-dropdown .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-client-view-page .clients-contracts-data .acts-list .act-row-card-dropdown .leads-card-dropdown-item:hover { background: #F6F7F9; }
    /* Hide desktop sub-action + chat button from act row */
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .sub-action,
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .more-action { display: none !important; }
}

/* =====================================================================
   Contracts list — data-tr.tr-action adaptation (mobile ≤768px)
   ===================================================================== */
@media screen and (max-width: 768px) {

    /* Hide thead */
    .al-client-view-page .clients-contracts-data .data-table .data-thead {
        display: none !important;
    }

    /* Contract row → vertical card */
    .al-client-view-page .clients-contracts-data .data-tr.tr-action {
        flex-direction: column;
        padding: 0;
        position: relative;
    }

    /* Show toggle + "…" button */
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .leads-card-header {
        display: flex !important;
        justify-content: space-between;
        align-items: center;
        padding: 10px 16px 4px;
    }
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .leads-card-header button {
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA; background: transparent;
        cursor: pointer; padding: 0;
        display: flex; align-items: center; justify-content: center;
        border-radius: 6px;
        transition: background 0.15s, border-color 0.15s;
    }
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .leads-card-header button:hover {
        background: #F6F7F9; border-color: #C8CDD8;
    }
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .leads-card-header button:active {
        background: #ECEEF2; border-color: #B0B6C3;
    }
    .al-client-view-page .clients-contracts-data .data-tr-global.active .leads-card-toggle svg {
        transform: rotate(180deg); transition: transform 0.2s;
    }
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .up-down {
        display: none !important;
    }

    /* Contract name — full width */
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .data-td.td-name {
        flex: unset !important;
        width: 100%;
        padding: 4px 16px 8px;
        font-size: 14px;
        font-weight: 500;
        box-sizing: border-box;
    }

    /* Date & status — label:value rows */
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .data-td:not(.td-name):not(.action-col):not(.fi-col-td) {
        flex: unset !important;
        width: 100%;
        padding: 4px 16px;
        font-size: 13px;
        display: flex;
        align-items: flex-start;
        box-sizing: border-box;
    }
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .data-td[data-label]:not(.td-name):not(.action-col):not(.fi-col-td)::before {
        content: attr(data-label);
        display: inline-block;
        min-width: 120px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .data-td:not(.td-name):not(.action-col):not(.fi-col-td):last-of-type {
        padding-bottom: 10px;
    }

    /* Hide action buttons */
    .al-client-view-page .clients-contracts-data .data-tr.tr-action .data-td.action-col {
        display: none !important;
    }

    /* Dropdown */
    .al-client-view-page .clients-contracts-data .leads-card-dropdown {
        position: absolute; right: 16px; top: 44px;
        width: 205px; background: #fff;
        border: 1px solid #E0E4EA; border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 100; display: none;
    }
    .al-client-view-page .clients-contracts-data .leads-card-dropdown.open { display: block; }
    .al-client-view-page .clients-contracts-data .leads-card-dropdown-item {
        display: block; padding: 10px 16px; font-size: 14px;
        color: #3D445C; text-decoration: none;
        border-bottom: 1px solid #f5f5f5; cursor: pointer;
    }
    .al-client-view-page .clients-contracts-data .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-client-view-page .clients-contracts-data .leads-card-dropdown-item:hover,
    .al-client-view-page .clients-contracts-data .leads-card-dropdown-item:active { background: #F6F7F9; }

    /* ---------------------------------------------------------------
       application-form-popup / control-layout-popup — mobile sizing
       --------------------------------------------------------------- */
    .application-form-popup,
    .control-layout-popup,
    .application-form2-popup,
    .multiple-control-layout-popup {
        width: 90vw !important;
        left: 50% !important;
        margin-left: 0 !important;
        margin-top: 0 !important;
        top: 50% !important;
        transform: translateX(-50%) translateY(-50%) !important;
        box-sizing: border-box;
        max-height: 90vh !important;
        overflow-y: auto !important;
    }
    /* Stack field-containers vertically */
    .application-form-popup .field-container,
    .control-layout-popup .field-container,
    .application-form2-popup .field-container {
        flex-direction: column;
    }
    .application-form-popup .field-container .input-block,
    .control-layout-popup .field-container .input-block,
    .application-form2-popup .field-container .input-block {
        width: 100% !important;
        flex: none !important;
        box-sizing: border-box;
    }
    .application-form-popup .field-container .input-block input,
    .control-layout-popup .field-container .input-block input,
    .application-form2-popup .field-container .input-block input {
        width: 100% !important;
        box-sizing: border-box;
    }
    /* Header font-size */
    .application-form-header {
        font-size: 18px;
        padding: 0 20px;
    }

    /* Buttons: remove fixed width, let padding define size */
    .application-form-popup a.cancel,
    .application-form-popup a.yes,
    .control-layout-popup a.cancel,
    .control-layout-popup a.yes,
    .application-form2-popup a.cancel,
    .application-form2-popup a.yes {
        width: auto !important;
        padding: 0 24px;
    }
    .application-form-action,
    .control-layout-popup .align-right {
        display: flex;
        justify-content: flex-end;
        gap: 12px;
        align-items: center;
    }

    /* === PHOTOREPORTS POPUP — MOBILE === */
    .photoreports-popup,
    .photoreports-popup2 {
        width: 90vw !important;
        max-height: 90vh !important;
        overflow-y: auto !important;
        box-sizing: border-box;
    }
    .photoreports-popup .popup-body,
    .photoreports-popup2 .popup-body {
        padding: 16px !important;
    }
    .photoreports-popup .popup-header,
    .photoreports-popup2 .popup-header {
        font-size: 18px;
        padding: 0 16px;
    }
    .photoreports-popup .photo-list {
        flex-wrap: wrap;
        gap: 8px;
    }
    .photoreports-popup .photo-list-item {
        width: calc(50% - 4px) !important;
        margin-right: 0 !important;
    }
    .photoreports-popup .photo-list-item .my-file-uploader {
        width: 100% !important;
    }
    .photoreports-popup .photo-list-item .my-file-uploader .img-div {
        width: calc(100% + 2px) !important;
    }
    .photoreports-popup .photo-list-item select {
        width: 100% !important;
    }

    /* === APP ROW (заявки всередині договору) — MOBILE === */
    .al-client-view-page .clients-contracts-data .acts-list .data-thead { display: none !important; }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr {
        flex-direction: column !important;
        padding: 0 !important;
        position: relative;
        border-bottom: 1px solid #E8EBF1;
    }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .act-row-card-header {
        display: flex !important;
        justify-content: flex-end;
        align-items: center;
        padding: 10px 16px 4px;
    }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .act-row-card-header button {
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA; background: transparent;
        cursor: pointer; padding: 0;
        display: flex; align-items: center; justify-content: center;
        border-radius: 6px;
    }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .data-td:not(.action-col):not(.fi-col-td) {
        flex: unset !important;
        width: 100%;
        padding: 4px 16px;
        font-size: 13px;
        display: flex !important;
        align-items: flex-start;
        box-sizing: border-box;
    }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .data-td.td-number {
        padding-top: 0;
        font-weight: 500;
        font-size: 14px;
    }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .data-td[data-label]:not(.action-col):not(.fi-col-td)::before {
        content: attr(data-label);
        display: inline-block;
        min-width: 120px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .data-td.td-number::before { display: none; }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .data-td.action-col { display: none !important; }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .data-td.fi-col-td { display: none !important; }
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .data-td:not(.action-col):not(.fi-col-td):last-of-type { padding-bottom: 10px; }
    /* Dropdown */
    .al-client-view-page .clients-contracts-data .acts-list .act-row-card-dropdown {
        position: absolute; right: 16px; top: 44px;
        width: 220px; background: #fff;
        border: 1px solid #E0E4EA; border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 101; display: none; max-height: 60vh; overflow-y: auto;
    }
    .al-client-view-page .clients-contracts-data .acts-list .act-row-card-dropdown.open { display: block; }
    .al-client-view-page .clients-contracts-data .acts-list .act-row-card-dropdown .leads-card-dropdown-item {
        display: block; padding: 10px 16px; font-size: 14px;
        color: #3D445C; text-decoration: none;
        border-bottom: 1px solid #f5f5f5; cursor: pointer;
    }
    .al-client-view-page .clients-contracts-data .acts-list .act-row-card-dropdown .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-client-view-page .clients-contracts-data .acts-list .act-row-card-dropdown .leads-card-dropdown-item:hover { background: #F6F7F9; }
    /* Hide desktop sub-action + chat */
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .sub-action,
    .al-client-view-page .clients-contracts-data .acts-list .act-tr .more-action { display: none !important; }
}

/* === CONTRACT LOGS POPUP GLOBAL === */
.popup-data .boards-table {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* === CONTRACT LOGS POPUP TABLET === */
@media screen and (min-width: 769px) and (max-width: 1365px) {
    .mfp-ajax-holder .mfp-content { width: 80vw !important; }

    .popup-data .boards-table-thead { display: none !important; }

    .popup-data .custom-boards-table-tr {
        flex-direction: column !important;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        margin-bottom: 8px;
        padding: 4px 0;
    }

    .popup-data .custom-boards-td {
        flex: none !important;
        width: 100%;
        box-sizing: border-box;
        padding: 6px 12px;
        border-bottom: 1px solid #F2F4F8;
    }

    .popup-data .custom-boards-td:last-child { border-bottom: none; }

    .popup-data .custom-boards-td[data-label]::before {
        content: attr(data-label);
        display: block;
        font-size: 10px;
        color: #9199AF;
        font-weight: 600;
        text-transform: uppercase;
        margin-bottom: 2px;
    }

    .popup-data .log-divider { display: none; }
}

/* === CONTRACT LOGS POPUP MOBILE === */
@media screen and (max-width: 768px) {
    .mfp-ajax-holder .mfp-content { width: 92vw !important; }

    .popup-data .boards-table-thead { display: none !important; }

    .popup-data .custom-boards-table-tr {
        flex-direction: column !important;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        margin-bottom: 8px;
        padding: 4px 0;
    }

    .popup-data .custom-boards-td {
        flex: none !important;
        width: 100%;
        box-sizing: border-box;
        padding: 6px 12px;
        border-bottom: 1px solid #F2F4F8;
    }

    .popup-data .custom-boards-td:last-child { border-bottom: none; }

    .popup-data .custom-boards-td[data-label]::before {
        content: attr(data-label);
        display: block;
        font-size: 10px;
        color: #9199AF;
        font-weight: 600;
        text-transform: uppercase;
        margin-bottom: 2px;
    }

    .popup-data .log-divider { display: none; }

    .popup-data .act-popup-title h2 { font-size: 16px !important; }

    #logs-container { max-height: 60vh; }
}

/* === PHOTOREPORTS POPUP2 TABLET === */
@media screen and (min-width: 769px) and (max-width: 1365px) {
    .photoreports-popup2 {
        width: min(630px, calc(100vw - 48px)) !important;
    }

    .photoreports-form .field-container .input-block {
        width: auto !important;
        flex: 1 1 0 !important;
        min-width: 0 !important;
        overflow: hidden;
    }

    .photoreports-form .field-container .input-block select,
    .photoreports-form .field-container .input-block.w570 select {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* select2 берёт ширину inline из JS — перебиваем */
    .photoreports-popup2 .select2-container {
        width: 100% !important;
    }

    /* photo-list: per-card layout */
    .photoreports-popup2 .photo-list,
    .photoreports-form .photo-list {
        flex-wrap: wrap;
        gap: 8px;
    }
    .photoreports-popup2 .photo-list-item,
    .photoreports-form .photo-list-item {
        width: calc(25% - 6px) !important;
        margin-right: 0 !important;
    }
    .photoreports-popup2 .photo-list-item .my-file-uploader,
    .photoreports-form .photo-list-item .my-file-uploader {
        width: 100% !important;
    }
    .photoreports-popup2 .photo-list-item .my-file-uploader .img-div,
    .photoreports-form .photo-list-item .my-file-uploader .img-div {
        width: calc(100% + 2px) !important;
    }
    .photoreports-popup2 .photo-list-item select,
    .photoreports-form .photo-list-item select {
        width: 100% !important;
    }
}

/* === PHOTOREPORTS POPUP2 MOBILE === */
@media screen and (max-width: 768px) {
    .photoreports-popup2 {
        width: calc(100vw - 32px) !important;
        left: 16px !important;
        max-height: 90vh;
        overflow-y: auto;
    }

    .photoreports-popup2 .popup-header {
        padding: 0 16px !important;
        font-size: 18px !important;
        height: 56px !important;
    }

    .photoreports-popup2 .popup-body {
        padding: 16px !important;
    }

    .photoreports-popup2 .field-container {
        flex-direction: column !important;
    }

    .photoreports-form .field-container .input-block,
    .photoreports-form .field-container .input-block:last-child {
        width: 100% !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    .photoreports-form .field-container .input-block select,
    .photoreports-form .field-container .input-block.w570 select {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* select2 берёт ширину inline из JS — перебиваем */
    .photoreports-popup2 .select2-container {
        width: 100% !important;
    }

    /* photo-list: per-card layout 2x2 */
    .photoreports-popup2 .photo-list,
    .photoreports-form .photo-list {
        flex-wrap: wrap;
        gap: 8px;
    }
    .photoreports-popup2 .photo-list-item,
    .photoreports-form .photo-list-item {
        width: calc(50% - 4px) !important;
        margin-right: 0 !important;
    }
    .photoreports-popup2 .photo-list-item .my-file-uploader,
    .photoreports-form .photo-list-item .my-file-uploader {
        width: 100% !important;
    }
    .photoreports-popup2 .photo-list-item .my-file-uploader .img-div,
    .photoreports-form .photo-list-item .my-file-uploader .img-div {
        width: calc(100% + 2px) !important;
    }
    .photoreports-popup2 .photo-list-item select,
    .photoreports-form .photo-list-item select {
        width: 100% !important;
    }

    .photoreports-popup .right-buttons,
    .photoreports-popup2 .right-buttons {
        flex-wrap: wrap;
        gap: 8px;
    }

    .photoreports-popup .right-buttons .cancel,
    .photoreports-popup .right-buttons .crm-button,
    .photoreports-popup2 .right-buttons .cancel,
    .photoreports-popup2 .right-buttons .crm-button {
        flex: 1 1 auto !important;
        text-align: center;
    }

    .photoreports-popup .right-buttons .cancel,
    .photoreports-popup2 .right-buttons .cancel {
        border: 1px solid #CDD4D9 !important;
        border-radius: 4px;
    }
}

/* === PHOTOREPORTS POPUPS DESKTOP/TABLET BUTTONS === */
.photoreports-popup .right-buttons,
.photoreports-popup2 .right-buttons {
    gap: 8px;
}

.photoreports-popup .right-buttons .cancel,
.photoreports-popup .right-buttons .crm-button,
.photoreports-popup2 .right-buttons .cancel,
.photoreports-popup2 .right-buttons .crm-button {
    min-width: 150px;
}

.photoreports-popup .right-buttons .cancel,
.photoreports-popup2 .right-buttons .cancel {
    border: 1px solid #CDD4D9 !important;
    border-radius: 4px;
    margin-right: 0 !important;
    padding: 0 14px !important;
    line-height: 39px;
    height: 42px;
}

/* === BILLS SEARCH FORM: checkbox size 1.2x === */
.al-client-view-page .bills-search-form .field-container .input-block input.show-deleted {
    width: 16px !important;
    height: 16px !important;
    transform: scale(1.2);
    cursor: pointer;
    flex-shrink: 0;
}

/* === BILLS SEARCH FORM: checkbox row always on new line (all screens) === */
.al-client-view-page .bills-search-form .field-container {
    flex-wrap: wrap;
}
.al-client-view-page .bills-search-form .field-container .input-block.mr0 {
    flex: 0 0 100%;
    width: 100% !important;
    margin-right: 0;
    box-sizing: border-box;
    display: flex !important;
    align-items: center;
    gap: 8px;
    padding-top: 8px;
    padding-bottom: 8px;
}
/* span: сбрасываем ВСЕ (включая inline style) и ставим заново */
.al-client-view-page .bills-search-form .field-container .input-block.mr0 > span {
    all: unset !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

/* === BILL ADD SIDEBLOCK DESKTOP/TABLET === */
@media screen and (min-width: 769px) {
    .bill-add-sideblock-body .tab-item .input-block input:not([type="checkbox"]),
    .bill-add-sideblock-body .tab-item .input-block select {
        width: 220px !important;
    }
    .bill-add-sideblock-body .tab-item .input-block.ib2,
    .bill-add-sideblock-body .tab-item .input-block.ib2 input:not([type="checkbox"]),
    .bill-add-sideblock-body .tab-item .input-block.ib2 select {
        width: 460px !important;
    }
}

/* === BILL ADD SIDEBLOCK MOBILE === */
@media screen and (max-width: 768px) {
    .bill-add-sideblock {
        width: 100vw !important;
    }
    .bill-add-sideblock-header {
        padding: 0 16px !important;
        font-size: 18px !important;
        height: 56px !important;
    }
    .bill-add-sideblock-body {
        width: 100% !important;
        padding: 16px !important;
        box-sizing: border-box !important;
    }
    .bill-add-sideblock .field-container {
        flex-direction: column !important;
        gap: 0 !important;
    }
    .bill-add-sideblock .field-container .input-block {
        margin-bottom: 15px !important;
    }
    .bill-add-sideblock-body .tab-item .input-block {
        width: 100% !important;
    }
    .bill-add-sideblock-body .tab-item .input-block input:not([type="checkbox"]),
    .bill-add-sideblock-body .tab-item .input-block select {
        width: 100% !important;
        box-sizing: border-box !important;
    }
    .bill-add-sideblock-body .tab-item .input-block.ib2,
    .bill-add-sideblock-body .tab-item .input-block.ib2 input:not([type="checkbox"]),
    .bill-add-sideblock-body .tab-item .input-block.ib2 select {
        width: 100% !important;
        box-sizing: border-box !important;
    }
    .bill-add-sideblock .select2-container {
        width: 100% !important;
    }
    .bill-add-sideblock .field-container.view-fix .input-block label {
        gap: 6px;
        align-items: center;
    }
    .bill-add-sideblock .field-container.view-fix .input-block input[type="checkbox"] {
        width: 16px !important;
        height: 16px !important;
        transform: scale(1.2);
        flex-shrink: 0;
        cursor: pointer;
    }
    /* Кнопки: по половине ширины с гепом */
    .bill-add-sideblock .buttons-block.right-buttons {
        display: flex !important;
        justify-content: space-between !important;
        gap: 10px !important;
        margin-top: 8px;
    }
    /* Cancel — стиль как у bk-filter-reset-btn */
    .bill-add-sideblock .right-buttons .cancel {
        width: calc(50% - 5px) !important;
        flex: none !important;
        height: 42px !important;
        padding: 0 !important;
        margin-right: 0 !important;
        background: #FFFFFF !important;
        color: #3D445C !important;
        border: 1px solid #E5E5E5 !important;
        border-radius: 4px !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }
    .bill-add-sideblock .right-buttons .cancel:hover {
        border-color: #FC6B40 !important;
        color: #FC6B40 !important;
    }
    .bill-add-sideblock .right-buttons .crm-button {
        width: calc(50% - 5px) !important;
        flex: none !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }

    /* === CLIENT ADD MOBILE === */

    /* Container padding */
    .al-client-add-page .container.container-base {
        padding: 0 16px;
    }

    /* All fields single column, full width */
    .al-client-add-page .lead-block-info .input-block {
        width: 100% !important;
        margin-right: 0 !important;
    }
    .al-client-add-page .lead-block-info .input-block select,
    .al-client-add-page .lead-block-info .input-block input {
        width: 100% !important;
        box-sizing: border-box;
    }
    .al-client-add-page .lead-block-info .input-block.wide-select {
        width: 100% !important;
    }
    .al-client-add-page .lead-block-info .input-block.wide-select select,
    .al-client-add-page .lead-block-info .input-block.wide-select .select2-container {
        width: 100% !important;
    }
    .al-client-add-page .lead-block-info .textarea-block {
        width: 100%;
    }
    .al-client-add-page .lead-block-info .textarea-block textarea {
        width: 100% !important;
        box-sizing: border-box;
    }

    /* Buttons: half width with gap */
    .al-client-add-page .lead-block-info .field-container.right {
        justify-content: center;
    }
    .al-client-add-page .lead-block-info .buttons-block {
        display: flex;
        width: 100%;
        gap: 10px;
    }
    .al-client-add-page .lead-block-info .buttons-block .cancel {
        flex: 1;
        margin-right: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
    }
    .al-client-add-page .lead-block-info .buttons-block .submit {
        flex: 1;
        box-sizing: border-box;
    }

    /* Photo section */
    .al-client-add-page .photo-container {
        width: 100%;
        flex-direction: column;
        align-items: center;
    }

    /* Title */
    .al-client-add-page h1.title {
        font-size: 20px;
    }
}

/* === BILLS: drawer filter actions (desktop/tablet) — both buttons grouped
   at the right edge of the panel with a gap. Mobile overrides below. === */
.al-bills-page .bk-filter-actions {
    display: flex;
    justify-content: stretch;
    align-items: center;
    gap: 10px;
    width: 100%;
    margin-top: 16px;
}
.al-bills-page .bk-filter-actions .bk-filter-reset-btn {
    flex: 1 1 0;
    width: auto;
    height: 42px;
    padding: 0 14px;
    min-width: 0;
}
.al-bills-page .bk-filter-actions .crm-button {
    flex: 1 1 0;
    width: auto;
    height: 42px;
    min-width: 0;
}
.al-bills-page .bk-filter-fields .input-block {
    width: 100% !important;
    max-width: 100% !important;
}
.al-bills-page .bk-filter-fields .input-block select,
.al-bills-page .bk-filter-fields .input-block input[type=text] {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
}
.al-bills-page .bk-filter-fields .input-block .select2-container {
    width: 100% !important;
}

/* === BILLS: period badge vertical alignment — inline-block padding on
   .al-power-tip shifts its baseline; use vertical-align: middle so "+N" sits
   on the same visual line as "травень 2026". + small gap from preceding text
   on tablet/mobile (markup has no space between text and span). === */
.al-bills-page .bill-period .al-power-tip {
    vertical-align: middle;
    position: relative;
    top: -1px;
    margin-left: 6px;
}

/* === BILLS desktop (≥1366px): period badge on its own line, left-aligned === */
@media screen and (min-width: 1366px) {
    .al-bills-page .bill-period .al-power-tip {
        display: block;
        width: fit-content;
        margin-left: 0;
        margin-top: 2px;
        position: static;
        top: auto;
    }
}

/* === BILLS: page heading — match leads style (crm.css:148 title-search-result) === */
.al-bills-page h1.title {
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;
    font-style: normal;
    font-weight: normal;
    font-size: 34px;
    line-height: 41px;
    margin: 0 0 16px;
    padding: 0;
}
/* Override main_mngr.css:40 which forces 0 30px padding on section .title at ≤480px */
@media screen and (max-width: 480px) {
    .al-bills-page h1.title { padding: 0; }
}

/* === BILLS: strip global 20px bottom margins on .input-block and 20px top
   margin on .bk-filter-btn / .crm-button inside filter row — these added visible
   vertical gap on top of the grid/flex gap we control. Applies to all widths. */
.al-bills-page .bills-search-form .field-container .input-block {
    margin-bottom: 0;
    margin-right: 0;
}
.al-bills-page .bills-search-form .bk-filter-btn,
.al-bills-page .bills-search-form .input-block .crm-button {
    margin-top: 0;
}

/* === BILLS desktop (≥1366px): controls on one row aligned by field/button bottom
   (labels above inputs handled by align-items: flex-end), Export+Find pushed
   to the right via margin-left:auto on Export, badges on separate row === */
@media screen and (min-width: 1366px) {
    .al-bills-page .bills-search-form form > .field-container.wide-filter- {
        flex-wrap: wrap;
        align-items: flex-end;
        column-gap: 12px;
        row-gap: 10px;
    }
    .al-bills-page .bills-search-form .search-right-block { display: contents; }
    .al-bills-page .bills-search-form .input-block.filter-btn-block {
        order: 3;
    }
    .al-bills-page .bills-search-form .input-block.mr0.wa.bills-search-submit-block {
        order: 4;
    }
    .al-bills-page .bills-search-form .input-block.wa:not(.mr0) {
        order: 5;
        margin-left: auto;
    }
    .al-bills-page .bills-search-form .al-selected-filter {
        order: 40;
        flex-basis: 100%;
        width: 100%;
        margin-left: 0;
        margin-top: 4px;
    }
    .al-bills-page .bills-search-form .bk-filter-btn,
    .al-bills-page .bills-search-form .input-block.wa .crm-button {
        width: 180px;
        box-sizing: border-box;
        justify-content: center;
    }
}

/* === BILLS TABLET: grid cards (769px-1365px) === */
@media screen and (min-width: 769px) and (max-width: 1365px) {
    /* Kill fixed 1260px container width (crm.css:4323) + side padding so
       content doesn't hug edges (container-base has 0 horizontal padding by default). */
    .container-base.bookkeeper-bills-page.al-bills-page {
        width: auto !important;
        max-width: 100% !important;
        padding-left: 24px !important;
        padding-right: 24px !important;
        box-sizing: border-box;
    }
    .al-bills-page,
    .al-bills-page .client-tab-data-block {
        overflow-x: hidden;
    }

    /* Filter layout:
       Row 1: [Пошук 150] [№ рах. 150] [Фільтр 150]            [Експорт 150] [Знайти 150]
       If Export+Find don't fit on row 1 they wrap together to row 2 (right-aligned).
       Last row: badges (full-width own row).
       Right-alignment achieved with margin-left:auto on Export so it absorbs free
       space when fitting and stays grouped with Find when wrapping. */
    .al-bills-page .bills-search-form form > .field-container.wide-filter- {
        display: flex;
        flex-wrap: wrap;
        column-gap: 12px;
        row-gap: 10px;
        align-items: flex-end;
    }
    .al-bills-page .bills-search-form .search-right-block {
        display: contents;
    }
    .al-bills-page .bills-search-form form > .field-container > .input-block.w150 {
        flex: 0 0 calc((100% - 36px) / 4);
        min-width: 0;
    }
    .al-bills-page .bills-search-form form > .field-container > .input-block.w150 input[type=text] {
        width: 100% !important;
        box-sizing: border-box;
    }
    .al-bills-page .bills-search-form .input-block.filter-btn-block {
        order: 3;
        flex: 0 0 calc((100% - 36px) / 4);
        min-width: 0;
    }
    .al-bills-page .bills-search-form .input-block.mr0.wa.bills-search-submit-block {
        order: 4;
        flex: 0 0 calc((100% - 36px) / 4);
        min-width: 0;
    }
    .al-bills-page .bills-search-form .input-block.filter-btn-block .bk-filter-btn,
    .al-bills-page .bills-search-form .input-block.mr0.wa.bills-search-submit-block .crm-button {
        width: 100%;
        box-sizing: border-box;
        justify-content: center;
    }
    .al-bills-page .bills-search-form .input-block.wa:not(.mr0) {
        order: 30;
        flex: 0 0 100%;
        display: flex;
        justify-content: flex-end;
        margin-left: 0;
        margin-bottom: 16px;
    }
    .al-bills-page .bills-search-form .input-block.wa:not(.mr0) .export__ {
        width: 150px;
        box-sizing: border-box;
        justify-content: center;
    }
    .al-bills-page .bills-search-form .al-selected-filter {
        order: 20;
        flex-basis: 100%;
        width: 100%;
        margin-left: 0;
        margin-top: 4px;
    }

    /* Table → cards grid */
    .al-bills-page .bills-table { display: block !important; }
    .al-bills-page .bills-table-thead { display: none !important; }
    .al-bills-page .bills-table-tbody {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        gap: 12px;
    }
    .al-bills-page .data-tr.bills-item {
        position: relative;
        display: flex !important;
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 12px 0;
        box-sizing: border-box;
    }
    .al-bills-page .data-tr.bills-item .data-td {
        display: flex !important;
        flex-flow: row !important;
        flex: unset !important;
        width: 100%;
        padding: 3px 16px;
        border-bottom: none !important;
        font-size: 13px;
        line-height: 18px;
        box-sizing: border-box;
        align-items: flex-start;
    }
    .al-bills-page .data-tr.bills-item .data-td[data-label]::before {
        content: attr(data-label);
        display: inline-block;
        min-width: 130px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-bills-page .data-tr.bills-item .bill-action {
        position: absolute;
        top: 8px;
        right: 8px;
        width: auto !important;
        padding: 0 !important;
    }
    .al-bills-page .data-tr.bills-item .bill-action::before { display: none !important; }

    /* Stats header on tablet — wrap both parent and inner bills-stat */
    .al-bills-page .client-contacts-header {
        flex-wrap: wrap;
        row-gap: 8px;
    }
    .al-bills-page .client-contacts-header .left-block.bills-stat {
        flex-wrap: wrap;
        max-width: 100%;
        min-width: 0;
        row-gap: 6px;
    }
    .al-bills-page .left-block.bills-stat span {
        border-right: solid 1px #CDD4D9 !important;
    }
    .al-bills-page .left-block.bills-stat span:last-child {
        border-right: 0 !important;
        margin-right: 0;
        padding-right: 0;
    }

    /* Filter action row override (desktop: 136px button default) */
    .al-bills-page .bk-filter-btn { margin-top: 0; }

    /* Tablet — Фільтр / Експорт / Знайти = 150px */
    .al-bills-page .bills-search-form .bk-filter-btn,
    .al-bills-page .bills-search-form .input-block.wa .crm-button {
        width: 150px;
        box-sizing: border-box;
        justify-content: center;
    }
}

/* === BILLS MOBILE: list cards (max 768px) === */
@media screen and (max-width: 768px) {
    /* Kill fixed 1260px container width (crm.css:4323) + side padding so
       content doesn't hug edges (container-base has 0 horizontal padding by default). */
    .container-base.bookkeeper-bills-page.al-bills-page {
        width: auto !important;
        max-width: 100% !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
        box-sizing: border-box;
    }
    .al-bills-page,
    body {
        overflow-x: hidden;
    }

    /* Variant A mobile layout — each control on its own row (full-width),
       badges 2-per-row 50/50. */
    .al-bills-page .bills-search-form form > .field-container.wide-filter- {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 10px;
        align-items: stretch;
    }
    /* Breathing room between badges and following client-contacts-header */
    .al-bills-page .bills-search-form { margin-bottom: 20px; }
    .al-bills-page .bills-search-form .search-right-block {
        display: contents;
    }
    .al-bills-page .bills-search-form form > .field-container > .input-block.w150 {
        width: 100%;
    }
    .al-bills-page .bills-search-form form > .field-container > .input-block.w150 input[type=text] {
        width: 100% !important;
        box-sizing: border-box;
    }
    .al-bills-page .bills-search-form .input-block.filter-btn-block,
    .al-bills-page .bills-search-form .input-block.wa {
        width: 100%;
        margin-top: 0;
    }
    .al-bills-page .bills-search-form .input-block.filter-btn-block {
        order: 3;
        width: calc(50% - 5px) !important;
        margin: 0;
    }
    .al-bills-page .bills-search-form .input-block.mr0.wa.bills-search-submit-block {
        order: 4;
        width: calc(50% - 5px) !important;
        margin: 0;
    }
    .al-bills-page .bills-search-form .input-block.wa:not(.mr0) {
        order: 11;
        flex: 0 0 100%;
        width: 100%;
        margin: 0 0 16px 0;
        display: flex;
        justify-content: flex-end;
    }
    .al-bills-page .bills-search-form .input-block.wa:not(.mr0) .export__ {
        width: calc(50% - 5px);
        margin-left: auto;
    }
    .al-bills-page .bills-search-form .bk-filter-btn,
    .al-bills-page .bills-search-form .input-block.wa .crm-button,
    .al-bills-page .bills-search-form .input-block.wa .export__ {
        width: 100%;
        margin-top: 0;
        box-sizing: border-box;
        justify-content: center;
    }
    .al-bills-page .bills-search-form .al-selected-filter {
        flex: 0 0 100%;
        width: 100%;
        margin-left: 0;
        margin-top: 4px;
        margin-bottom: 12px;
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        order: 10;
    }
    .al-bills-page .bills-search-form .al-selected-filter .selected-filter-item {
        flex: 0 0 calc(50% - 4px);
        max-width: calc(50% - 4px);
        margin-right: 0;
        margin-bottom: 0;
        box-sizing: border-box;
        display: block;
        position: relative;
        padding-right: 30px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 20px;
    }
    .al-bills-page .bills-search-form .al-selected-filter .selected-filter-item img {
        position: absolute;
        right: 8px;
        top: 50%;
        transform: translateY(-50%);
        margin-left: 0;
    }

    /* Drawer 100vw on mobile */
    .al-bills-page .bk-filter-block { width: 100vw; }

    /* Table → vertical list cards */
    .al-bills-page .bills-table { display: block !important; }
    .al-bills-page .bills-table-thead { display: none !important; }
    .al-bills-page .bills-table-tbody {
        display: flex !important;
        flex-direction: column;
        gap: 12px;
        box-sizing: border-box;
    }
    .al-bills-page .data-tr.bills-item {
        position: relative;
        display: flex !important;
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 12px 0;
        margin: 0;
        box-sizing: border-box;
    }
    .al-bills-page .data-tr.bills-item .data-td {
        display: flex !important;
        flex-flow: row !important;
        flex: unset !important;
        width: 100%;
        padding: 3px 12px;
        border-bottom: none !important;
        font-size: 13px;
        line-height: 18px;
        box-sizing: border-box;
        align-items: flex-start;
    }
    .al-bills-page .data-tr.bills-item .data-td[data-label]::before {
        content: attr(data-label);
        display: inline-block;
        min-width: 130px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-bills-page .data-tr.bills-item .bill-action {
        position: absolute;
        top: 8px;
        right: 8px;
        width: auto !important;
        padding: 0 !important;
    }
    .al-bills-page .data-tr.bills-item .bill-action::before { display: none !important; }
    .al-bills-page .data-tr.bills-item .bill-action .more-action {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 30px;
        border: 1px solid #E0E4EA;
        border-radius: 6px;
        background: #fff;
    }
    .al-bills-page .data-tr.bills-item .bill-action .sub-action {
        right: 0;
        left: auto;
    }

    /* Stats header — column, wrap */
    .al-bills-page .client-contacts-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
    .al-bills-page .client-contacts-header .left-block.bills-stat {
        display: flex;
        flex-wrap: wrap;
        max-width: 100%;
        min-width: 0;
        row-gap: 6px;
        column-gap: 0;
    }
    .al-bills-page .left-block.bills-stat span {
        border-right: solid 1px #CDD4D9 !important;
        padding-right: 10px;
        margin-right: 10px;
    }
    .al-bills-page .left-block.bills-stat span:last-child {
        border-right: 0 !important;
        margin-right: 0;
        padding-right: 0;
    }

    /* Pagination */
    .al-bills-page .result-paginator {
        flex-wrap: wrap;
        gap: 8px;
    }

    /* Filter actions on mobile: 50/50 split between Reset and Find */
    .al-bills-page .bk-filter-actions {
        justify-content: stretch;
    }
    .al-bills-page .bk-filter-actions .bk-filter-reset-btn,
    .al-bills-page .bk-filter-actions .crm-button {
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 0;
    }

    /* Payment-info popup table → label/value cards */
    .payment-info-table,
    .payment-info-table tbody,
    .payment-info-table tr,
    .payment-info-table td {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }
    .payment-info-table tr.payment-info-table-header {
        display: none;
    }
    .payment-info-table tr {
        border: 1px solid #CDD4D9;
        border-radius: 6px;
        margin-bottom: 10px;
        padding: 4px 0;
    }
    .payment-info-table td {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: 12px;
        border: none;
        border-bottom: 1px solid #E8EBF1;
        padding: 8px 12px;
        word-break: break-word;
    }
    .payment-info-table tr td:last-child {
        border-bottom: none;
    }
    .payment-info-table td[data-label]::before {
        content: attr(data-label);
        color: #8B8F9D;
        font-weight: 500;
        font-size: 12px;
        text-transform: lowercase;
        flex-shrink: 0;
        min-width: 90px;
    }
}

/* === BILL EDIT POPUP: custom header + approve button (desktop) === */
.bookkeeper-bill-edit-popup .default-popup-header {
    margin: -20px -20px 20px;
    padding: 0 30px;
    height: 70px;
}
.bookkeeper-bill-edit-popup .default-popup-header .popup-title {
    font-size: 24px;
    color: #3D445C;
    font-weight: 400;
}
.bookkeeper-bill-edit-popup .default-popup-header .close {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.bookkeeper-bill-edit-popup > .mfp-close,
.bookkeeper-bill-edit-popup .mfp-close {
    display: none !important;
}
.bookkeeper-bill-edit-popup .bill-approve-btn {
    width: 180px;
}

/* === BILL EDIT POPUP TABLET (769px-1365px) === */
@media screen and (min-width: 769px) and (max-width: 1365px) {
    .bookkeeper-bill-edit-popup .bill-details-info .field-container {
        display: flex !important;
        flex-wrap: wrap;
        gap: 12px 16px;
    }
    .bookkeeper-bill-edit-popup .bill-details-info .field-container > .input-block {
        display: block !important;
        padding: 0 !important;
        flex: 1 1 180px;
        min-width: 180px;
        margin-bottom: 0;
    }
    .bookkeeper-bill-edit-popup .bill-details-info .field-container > .input-block input {
        width: 100% !important;
        box-sizing: border-box;
    }

    /* Services items: wrap — name wide, numeric cells share remaining space */
    .bookkeeper-bill-edit-popup .items-list .item .field-container {
        display: flex;
        flex-wrap: wrap;
        gap: 10px 12px;
        align-items: flex-end;
    }
    .bookkeeper-bill-edit-popup .items-list .item .input-block {
        margin: 0;
    }
    /* Hide native labels on non-first items too — each field shows its data-label as ::before */
    .bookkeeper-bill-edit-popup .items-list .item .input-block > label {
        display: none;
    }
    .bookkeeper-bill-edit-popup .items-list .item .input-block[data-label]::before {
        content: attr(data-label);
        display: block;
        color: #ADB0B9;
        font-size: 12px;
        font-weight: 500;
        margin-bottom: 4px;
    }
    .bookkeeper-bill-edit-popup .items-list .item .item-line-block {
        flex: 0 0 24px;
        min-width: 24px;
        display: flex;
        align-items: center;
    }
    .bookkeeper-bill-edit-popup .items-list .item .name-block {
        flex: 1 1 100%;
        min-width: 0;
    }
    .bookkeeper-bill-edit-popup .items-list .item .name-block input {
        width: 100% !important;
    }
    .bookkeeper-bill-edit-popup .items-list .item .number-block:not(.item-line-block) {
        flex: 1 1 140px;
        min-width: 120px;
    }
    .bookkeeper-bill-edit-popup .items-list .item .number-block:not(.item-line-block) input {
        width: 100% !important;
    }
    .bookkeeper-bill-edit-popup .items-list .item + .item {
        margin-top: 14px;
        padding-top: 12px;
        border-top: 1px dashed #E8EBF1;
    }

    .bookkeeper-bill-edit-popup .bill-approve-btn {
        width: 150px;
    }
}

/* === BILL EDIT POPUP MOBILE (max-width: 768px) === */
@media screen and (max-width: 768px) {
    .bookkeeper-bill-edit-popup .default-popup-header {
        margin: -20px -20px 16px;
        padding: 0 16px;
        height: 56px;
    }
    .bookkeeper-bill-edit-popup .default-popup-header .popup-title {
        font-size: 18px;
    }

    /* Top row (bill number / date / payment) → one field per row full-width */
    .bookkeeper-bill-edit-popup .bill-details-info .field-container {
        display: flex !important;
        flex-direction: column;
        gap: 12px;
    }
    .bookkeeper-bill-edit-popup .bill-details-info .field-container > .input-block {
        display: block !important;
        padding: 0 !important;
        width: 100% !important;
        margin: 0;
    }
    .bookkeeper-bill-edit-popup .bill-details-info .field-container > .input-block input {
        width: 100% !important;
        box-sizing: border-box;
    }

    /* Services items: vertical card, label left / value right */
    .bookkeeper-bill-edit-popup .items-list .item {
        border: 1px solid #E8EBF1;
        border-radius: 6px;
        padding: 8px 12px;
        margin-bottom: 12px;
    }
    .bookkeeper-bill-edit-popup .items-list .item .field-container {
        display: flex;
        flex-direction: column;
        gap: 0;
    }
    .bookkeeper-bill-edit-popup .items-list .item .input-block {
        display: flex !important;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 6px 0 !important;
        border-bottom: 1px solid #F2F4F7;
        margin: 0;
        width: 100% !important;
    }
    .bookkeeper-bill-edit-popup .items-list .item .field-container > .input-block:last-child {
        border-bottom: none;
    }
    /* Hide the "first item" labels rendered as <label>, replace with data-label ::before */
    .bookkeeper-bill-edit-popup .items-list .item .input-block > label {
        display: none;
    }
    .bookkeeper-bill-edit-popup .items-list .item .input-block[data-label]::before {
        content: attr(data-label);
        color: #8B8F9D;
        font-size: 12px;
        font-weight: 500;
        flex-shrink: 0;
        min-width: 110px;
    }
    .bookkeeper-bill-edit-popup .items-list .item .item-line-block {
        justify-content: flex-start;
        padding: 4px 0 !important;
        border-bottom: 1px solid #F2F4F7;
    }
    .bookkeeper-bill-edit-popup .items-list .item .item-line-block .line-number {
        padding-top: 0;
        font-weight: 600;
    }
    .bookkeeper-bill-edit-popup .items-list .item .input-block input {
        width: auto !important;
        flex: 1 1 auto;
        min-width: 0;
        text-align: right;
        box-sizing: border-box;
    }
    .bookkeeper-bill-edit-popup .items-list .item .name-block input {
        text-align: left;
    }

    /* Approve button: full width */
    .bookkeeper-bill-edit-popup .bill-approve-actions {
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }
    .bookkeeper-bill-edit-popup .bill-approve-btn {
        width: 100%;
        justify-content: center;
    }
}

/* === ACT POPUP: Manual boards form & search form — common (all widths) === */
/* Scoped to .popup-data so standalone (non-popup) usages stay untouched. */

/* Trash delete button — bordered square, matches lead-card action styling */
.popup-data .manual-boards-list-item .item-header .item-action .board-delete {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid #CDD4D9;
    border-radius: 4px;
    background: #fff;
    box-sizing: border-box;
}
.popup-data .manual-boards-list-item .item-header .item-action .board-delete:hover {
    background: #f7f9fa;
}

/* "Додати ще" link — bordered button like lead-card actions, min 150px */
.popup-data .manual-boards-list .form-action .manual-board-form-item-add {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-width: 150px;
    height: 42px;
    padding: 0 16px;
    background: #fff;
    border: 1px solid #CDD4D9;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
    box-sizing: border-box;
    cursor: pointer;
}
.popup-data .manual-boards-list .form-action .manual-board-form-item-add:hover {
    background: #f7f9fa;
    text-decoration: none;
}
.popup-data .manual-boards-list .form-action .manual-board-form-item-add svg {
    margin-right: 0;
}

/* Force select2 containers for Тип/Розмір/Сторона/Підсвітка to 130px on
   desktop/tablet. select2 mounts via AJAX and sometimes auto-sizes to the
   longest <option> (short labels collapse the widget). City is fine because
   its options are long. Mobile rule below overrides to 100%. */
.popup-data .manual-boards-list-item .form .field-container .manual_type ~ .select2-container,
.popup-data .manual-boards-list-item .form .field-container .manual_format ~ .select2-container,
.popup-data .manual-boards-list-item .form .field-container .manual_side ~ .select2-container,
.popup-data .manual-boards-list-item .form .field-container .manual_light ~ .select2-container {
    width: 130px !important;
    min-width: 130px;
    box-sizing: border-box;
}

/* Ensure select2 dropdown opens on top of the magnific popup and is not
   clipped by the popup body's stacking context. */
.popup-data {
    overflow: visible;
}
.select2-container--open .select2-dropdown {
    z-index: 10300 !important;
}

/* Form buttons row: Cancel + Додати площину — min 150px each, identical
   box-model so they sit on the same baseline regardless of line-height. */
.popup-data .manual-boards-wrap .align-right.form-buttons {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 16px;
}
.popup-data .manual-boards-wrap .form-buttons .manual-add-boards-form-clear,
.popup-data .manual-boards-wrap .form-buttons .manual-add-boards-form-submit {
    min-width: 150px;
    height: 42px;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 14px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    margin: 0;
}
.popup-data .manual-boards-wrap .form-buttons .manual-add-boards-form-clear {
    border: 1px solid #CDD4D9;
    background: #fff;
}


/* Search-by-code form: fit modal, not viewport.
   Default .boards-search-input uses calc(100vw - …), which overflows the
   popup when the modal is narrower than the viewport. Reset to flex-based
   layout so the input shrinks to fit its container. */
.popup-data #application-search .boards-search-form {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: flex-end;
}
.popup-data #application-search .boards-search-form .input-block {
    flex: 1 1 240px;
    min-width: 0;
    width: auto;
    margin: 0;
}
.popup-data #application-search .boards-search-form .boards-search-input {
    width: 100%;
    box-sizing: border-box;
}
.popup-data #application-search .boards-search-form .button-block {
    flex: 0 0 auto;
    padding-top: 0;
}
.popup-data #application-search .boards-search-form .button-block button {
    height: 42px;
}

/* === ACT POPUP TABLET (769px-1365px) === */
@media screen and (min-width: 769px) and (max-width: 1365px) {
    .popup-data .act-popup-title h2 { font-size: 20px; }
    .popup-data .act-popup-title h3 { display: block; margin-left: 0; margin-top: 6px; }

    /* "Тип ціни : без ПДВ" — inline below action buttons, not absolute */
    .popup-data .act-popup-menu-block {
        flex-wrap: wrap;
        row-gap: 8px;
        align-items: flex-start;
    }
    .popup-data .act-popum-menu {
        flex-wrap: wrap;
        gap: 8px;
    }
    .popup-data .act-popum-menu a {
        height: 34px;
    }
    /* Right group pinned to the right — keeps dropdown anchored inside popup */
    .popup-data .act-popup-right-wrap {
        width: 100%;
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;
        flex-wrap: wrap;
        gap: 10px;
    }
    .popup-data .act-popum-menu.act-popup-right {
        order: 2;
        justify-content: flex-end;
        width: auto;
    }
    .popup-data .act-popup-right-wrap .application-nds {
        order: 1;
        margin: 0 !important;
    }

    /* Tabs horizontal scroll if needed */
    .popup-data .application-tabs .tabls-list {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .popup-data .application-tabs .tabls-list::-webkit-scrollbar { display: none; }
    .popup-data .application-tabs .tabls-list li { flex-shrink: 0; }

    /* Boards table → flex-wrap cards (one card aligns left) */
    .popup-data .boards-table {
        display: block !important;
        min-width: unset !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .popup-data .boards-table-thead { display: none !important; }
    .popup-data .boards-table-tbody {
        display: flex !important;
        flex-flow: row wrap;
        justify-content: flex-start;
        align-items: stretch;
        gap: 12px;
    }
    .popup-data .boards-table-tbody .boards-table-tr {
        display: flex !important;
        flex-direction: column;
        flex: 0 1 calc(50% - 6px);
        max-width: calc(50% - 6px);
        min-width: 320px;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 8px 0;
        margin: 0;
        position: relative;
        background: #fff;
        box-sizing: border-box;
    }
    .popup-data .boards-table-tbody .boards-td {
        display: flex;
        align-items: flex-start;
        width: 100%;
        padding: 4px 14px;
        font-size: 13px;
        line-height: 18px;
        height: auto !important;
        text-align: left;
        box-sizing: border-box;
    }
    .popup-data .boards-table-tbody .boards-td a,
    .popup-data .boards-table-tbody .boards-td > div {
        color: #3D445C;
        text-decoration: none;
        min-width: 0;
        word-break: break-word;
    }
    .popup-data .boards-table-tbody .boards-td[data-label]::before {
        content: attr(data-label);
        min-width: 120px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .popup-data .boards-table-tbody .boards-td-photo {
        justify-content: flex-start;
        padding: 8px 14px;
    }
    .popup-data .boards-table-tbody .boards-td-photo img {
        width: 120px !important;
        height: 80px !important;
        object-fit: cover;
        border-radius: 4px;
    }
    .popup-data .boards-table-tbody .boards-td-photo[data-label]::before { display: none; }
    .popup-data .boards-table-tbody .boards-td-period input,
    .popup-data .boards-table-tbody .boards-td-price-in input,
    .popup-data .boards-table-tbody .boards-td-price-out input,
    .popup-data .boards-table-tbody .boards-td-price-result input {
        box-sizing: border-box;
        flex: 0 0 110px;
        width: 110px;
        margin-left: auto;
    }
    .popup-data .boards-table-tbody .boards-td-action {
        position: absolute;
        top: 8px;
        right: 8px;
        width: auto !important;
        padding: 0 !important;
        justify-content: flex-end;
    }
    .popup-data .boards-table-tbody .boards-td-action::before { display: none !important; }

    /* Services table → flex-wrap cards (2 per row) */
    .popup-data .services-table {
        display: block !important;
        min-width: unset !important;
    }
    .popup-data .services-table-thead { display: none !important; }
    .popup-data .services-table-tbody {
        display: flex !important;
        flex-flow: row wrap;
        justify-content: flex-start;
        gap: 12px;
    }
    .popup-data .services-table-tbody .services-table-tr {
        display: flex !important;
        flex-direction: column;
        flex: 0 1 calc(50% - 6px);
        max-width: calc(50% - 6px);
        min-width: 320px;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 8px 0;
        margin: 0;
        position: relative;
        background: #fff;
        box-sizing: border-box;
    }
    .popup-data .services-table-tbody .services-table-tr#service-itogo {
        background: #F6F7F9;
    }
    .popup-data .services-table-tbody .services-td {
        display: flex;
        align-items: center;
        width: 100% !important;
        padding: 4px 14px;
        font-size: 13px;
        line-height: 18px;
        height: auto !important;
        text-align: left;
        box-sizing: border-box;
    }
    .popup-data .services-table-tbody .services-td[data-label]::before {
        content: attr(data-label);
        min-width: 120px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .popup-data .services-table-tbody .services-td input {
        flex: 0 0 110px;
        width: 110px !important;
        min-width: 0;
        text-align: left;
        box-sizing: border-box;
        margin-left: auto;
        padding-right: 30px;
        background-position: right top !important;
    }
    .popup-data .services-table-tbody .services-td-action {
        position: absolute;
        top: 8px;
        right: 8px;
        width: auto !important;
        padding: 0 !important;
    }
    .popup-data .services-table-tbody .services-td-action::before { display: none !important; }

    /* Services + boards tables: kill the desktop -20px side margins so cards
       stay within the popup body on mobile, and add breathing room around. */
    .popup-data .services-table,
    .popup-data .boards-table {
        margin: 12px 0 0 !important;
    }

    /* Manual boards form: cap inputs at sprite width so the icon renders correctly */
    .popup-data .manual-boards-list-item .form .field-container .input-block input.price-input {
        max-width: 198px;
    }
    .popup-data .manual-boards-list-item .form .field-container .manual_date_from,
    .popup-data .manual-boards-list-item .form .field-container .manual_date_to {
        max-width: 160px;
    }

    /* Period row: stack "По" under "С", aligned with value column. */
    .popup-data .boards-table-tbody .boards-td-period {
        flex-wrap: wrap;
        align-items: center;
        column-gap: 0;
        row-gap: 6px;
        font-size: 0; /* hide bare "-" text node */
    }
    .popup-data .boards-table-tbody .boards-td-period::before,
    .popup-data .boards-table-tbody .boards-td-period .date_from,
    .popup-data .boards-table-tbody .boards-td-period .date_to {
        font-size: 13px;
    }
    .popup-data .boards-table-tbody .boards-td-period .date_from,
    .popup-data .boards-table-tbody .boards-td-period .date_to {
        flex: 0 0 110px;
        width: 110px !important;
        max-width: 110px;
        box-sizing: border-box;
        margin-left: auto;
    }
    .popup-data .boards-table-tbody .boards-td-period .date_to {
        margin-right: 0; /* date_to wraps to next line, still right-aligned */
    }

    /* "Додати із додатка" tab: two selects stacked 350px, button 150px on right */
    .popup-data #application-from-exist .boards-search-form {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        align-items: flex-start;
    }
    .popup-data #application-from-exist .boards-search-form .input-block {
        display: flex;
        flex-direction: column;
        gap: 10px;
        flex: 0 0 auto;
        width: auto;
        padding: 0;
    }
    .popup-data #application-from-exist .boards-search-form .input-block select,
    .popup-data #application-from-exist .boards-search-form .input-block .select2-container {
        width: 350px !important;
        max-width: 100%;
    }
    .popup-data #application-from-exist .boards-search-form .button-block {
        flex: 0 0 auto;
        padding: 0;
    }
    .popup-data #application-from-exist .boards-search-form .button-block .add-to-contract-from-exist {
        width: 150px;
        height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
    }
}

/* === ACT POPUP MOBILE (max-width: 768px) === */
@media screen and (max-width: 768px) {
    .popup-data .act-popup-title {
        padding: 12px 16px;
        margin-left: -20px;
        margin-right: -20px;
        margin-top: -20px;
        margin-bottom: 16px;
    }
    .popup-data .act-popup-title h2 { font-size: 16px; }
    .popup-data .act-popup-title h3 {
        display: block;
        margin-left: 0;
        margin-top: 4px;
        font-size: 12px;
    }

    .popup-data .act-popup-menu-block {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
        margin-bottom: 16px;
    }

    /* Left group — wrap pills onto next row when they don't fit */
    .popup-data .act-popum-menu:not(.act-popup-right) {
        flex-wrap: wrap;
        gap: 8px;
    }
    .popup-data .act-popum-menu a {
        flex-shrink: 0;
        height: 36px;
        font-size: 12px;
        padding: 0 10px;
    }
    .popup-data .act-popum-menu a svg {
        width: 16px;
        height: 16px;
    }

    /* Right group — own row, pinned to the right so the dropdown
       (anchored right: 0 to its wrapper) fits inside the popup */
    .popup-data .act-popup-right-wrap {
        width: 100%;
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;
        flex-wrap: wrap;
        gap: 8px;
    }
    .popup-data .act-popum-menu.act-popup-right {
        order: 2;
        flex-wrap: wrap;
        gap: 8px;
        justify-content: flex-end;
        width: auto;
    }

    /* Mobile: months submenu flows inline inside the dropdown instead of
       popping to the left (which overflows off-screen on narrow viewports) */
    .popup-data .acts-popup-sub-action .flex-position-fix.month-list {
        position: static;
        width: auto;
        height: auto;
        right: auto;
    }
    .popup-data .acts-popup-sub-action .bills-month-list {
        position: static;
        width: auto;
        left: auto;
        top: auto;
        padding: 0;
        box-shadow: none;
        border-radius: 0;
        border-top: 1px solid #E8EBF1;
        margin-top: 4px;
    }
    .popup-data .acts-popup-sub-action .bills-month-list ul li {
        padding: 10px 16px 10px 32px;
    }
    /* Hide the chevron on the trigger since submenu now opens below, not to the side */
    .popup-data .acts-popup-sub-action .bill-acts-submenu svg {
        display: none;
    }

    /* Tabs horizontal scroll */
    .popup-data .application-tabs .tabls-list {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .popup-data .application-tabs .tabls-list::-webkit-scrollbar { display: none; }
    .popup-data .application-tabs .tabls-list li { flex-shrink: 0; }

    .popup-data .act-popup-right-wrap .application-nds {
        order: 1;
        align-self: auto;
        margin: 0 !important;
        font-size: 13px;
        line-height: 1;
        display: flex;
        min-height: 36px;
        align-items: center;
        gap: 6px;
        padding: 0;
        border: none;
        border-radius: 0;
        background: transparent;
    }
    .popup-data .act-popup-right-wrap .application-nds b {
        font-size: 15px;
    }

    /* Boards table → single-column vertical cards */
    .popup-data .boards-table {
        display: block !important;
        min-width: unset !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .popup-data .boards-table-thead { display: none !important; }
    .popup-data .boards-table-tbody {
        display: flex !important;
        flex-direction: column;
        gap: 10px;
    }
    .popup-data .boards-table-tbody .boards-table-tr {
        display: flex;
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 8px 0;
        position: relative;
        background: #fff;
    }
    .popup-data .boards-table-tbody .boards-td {
        display: flex;
        align-items: flex-start;
        width: 100%;
        padding: 4px 12px;
        font-size: 13px;
        line-height: 18px;
        height: auto !important;
        text-align: left;
        box-sizing: border-box;
    }
    .popup-data .boards-table-tbody .boards-td a,
    .popup-data .boards-table-tbody .boards-td > div {
        color: #3D445C;
        text-decoration: none;
        min-width: 0;
        word-break: break-word;
    }
    .popup-data .boards-table-tbody .boards-td[data-label]::before {
        content: attr(data-label);
        min-width: 110px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 12px;
        font-weight: 400;
    }
    .popup-data .boards-table-tbody .boards-td-photo {
        justify-content: center;
        padding: 8px 12px;
    }
    .popup-data .boards-table-tbody .boards-td-photo img {
        width: 100% !important;
        max-height: 140px !important;
        height: auto !important;
        object-fit: cover;
        border-radius: 4px;
    }
    .popup-data .boards-table-tbody .boards-td-photo[data-label]::before { display: none; }

    /* Inputs — keep at desktop sprite width (110px), right-aligned, so the
       background-sprite icon renders identically to desktop. */
    .popup-data .boards-table-tbody .boards-td input[type=text],
    .popup-data .boards-table-tbody .boards-td input:not([type]) {
        flex: 0 0 110px;
        width: 110px !important;
        min-width: 0;
        box-sizing: border-box;
        margin-left: auto;
    }
    .popup-data .boards-table-tbody .boards-td-period {
        flex-wrap: wrap;
        row-gap: 4px;
    }

    .popup-data .boards-table-tbody .boards-td-action {
        position: absolute;
        top: 8px;
        right: 8px;
        width: auto !important;
        padding: 0 !important;
        justify-content: flex-end;
    }
    .popup-data .boards-table-tbody .boards-td-action::before { display: none !important; }

    /* Services table → 1-column vertical cards */
    .popup-data .services-table {
        display: block !important;
        min-width: unset !important;
    }
    .popup-data .services-table-thead { display: none !important; }
    .popup-data .services-table-tbody {
        display: flex !important;
        flex-direction: column;
        gap: 10px;
    }
    .popup-data .services-table-tbody .services-table-tr {
        display: flex !important;
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 8px 0;
        margin: 0;
        position: relative;
        background: #fff;
    }
    .popup-data .services-table-tbody .services-table-tr#service-itogo {
        background: #F6F7F9;
    }
    .popup-data .services-table-tbody .services-td {
        display: flex;
        align-items: center;
        width: 100% !important;
        padding: 4px 12px;
        font-size: 13px;
        line-height: 18px;
        height: auto !important;
        text-align: left;
        box-sizing: border-box;
    }
    .popup-data .services-table-tbody .services-td[data-label]::before {
        content: attr(data-label);
        min-width: 110px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 12px;
        font-weight: 400;
    }
    .popup-data .services-table-tbody .services-td input {
        flex: 0 0 110px;
        width: 110px !important;
        min-width: 0;
        text-align: left;
        box-sizing: border-box;
        margin-left: auto;
        padding-right: 30px;
        background-position: right top !important;
    }
    .popup-data .services-table-tbody .services-td-action {
        position: absolute;
        top: 8px;
        right: 8px;
        width: auto !important;
        padding: 0 !important;
    }
    .popup-data .services-table-tbody .services-td-action::before { display: none !important; }

    /* Services + boards tables: kill the desktop -20px side margins so cards
       stay within the popup body on mobile, and add breathing room around. */
    .popup-data .services-table,
    .popup-data .boards-table {
        margin: 12px 0 0 !important;
    }

    /* Manual boards form: cap inputs at sprite width so the icon renders correctly */
    .popup-data .manual-boards-list-item .form .field-container .input-block input.price-input {
        max-width: 198px;
    }
    .popup-data .manual-boards-list-item .form .field-container .manual_date_from,
    .popup-data .manual-boards-list-item .form .field-container .manual_date_to {
        max-width: 160px;
    }

    /* Period row: stack "По" under "С", aligned with value column. */
    .popup-data .boards-table-tbody .boards-td-period {
        flex-wrap: wrap;
        align-items: center;
        column-gap: 0;
        row-gap: 6px;
        font-size: 0; /* hide bare "-" text node */
    }
    .popup-data .boards-table-tbody .boards-td-period::before,
    .popup-data .boards-table-tbody .boards-td-period .date_from,
    .popup-data .boards-table-tbody .boards-td-period .date_to {
        font-size: 13px;
    }
    .popup-data .boards-table-tbody .boards-td-period .date_from,
    .popup-data .boards-table-tbody .boards-td-period .date_to {
        flex: 0 0 110px;
        width: 110px !important;
        max-width: 110px;
        box-sizing: border-box;
        margin-left: auto;
    }

    /* Manual boards form: every field stacks full-width, one per row */
    .popup-data .manual-boards-list-item .form .field-container {
        column-gap: 10px;
        row-gap: 12px;
    }
    .popup-data .manual-boards-list-item .form .field-container .input-block {
        flex: 0 0 100%;
        margin-right: 0;
        margin-bottom: 0;
        width: 100%;
        box-sizing: border-box;
    }
    .popup-data .manual-boards-list-item .form .field-container .manual_firm,
    .popup-data .manual-boards-list-item .form .field-container .manual_code,
    .popup-data .manual-boards-list-item .form .field-container .manual_city,
    .popup-data .manual-boards-list-item .form .field-container .manual_addr,
    .popup-data .manual-boards-list-item .form .field-container .manual_type,
    .popup-data .manual-boards-list-item .form .field-container .manual_format,
    .popup-data .manual-boards-list-item .form .field-container .manual_side,
    .popup-data .manual-boards-list-item .form .field-container .manual_light {
        width: 100% !important;
        box-sizing: border-box;
    }
    .popup-data .manual-boards-list-item .form .field-container .input-block .select2-container {
        width: 100% !important;
    }

    /* Period dates: stack vertically, one per row, full width */
    .popup-data .manual-boards-list-item .form .field-container .date-block {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
        width: 100%;
        font-size: 0;
    }
    .popup-data .manual-boards-list-item .form .field-container .date-block .manual_date_from,
    .popup-data .manual-boards-list-item .form .field-container .date-block .manual_date_to {
        flex: 0 0 auto;
        width: 100% !important;
        min-width: 0;
        max-width: none;
        padding-right: 30px;
        background-position: right top !important;
        box-sizing: border-box;
        font-size: 14px;
    }

    /* Cancel + Додати площину: 50/50 with gap */
    .popup-data .manual-boards-wrap .form-buttons .manual-add-boards-form-clear,
    .popup-data .manual-boards-wrap .form-buttons .manual-add-boards-form-submit {
        flex: 1 1 calc(50% - 5px);
        min-width: 0;
        width: calc(50% - 5px);
    }

    /* Пошук по коду: field full width, button on its own full-width row */
    .popup-data #application-search .boards-search-form .input-block {
        flex: 0 0 100%;
        width: 100%;
    }
    .popup-data #application-search .boards-search-form .button-block {
        flex: 0 0 100%;
        width: 100%;
    }
    .popup-data #application-search .boards-search-form .button-block button {
        width: 100%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    /* "Додати із додатка" tab: full-width selects stacked, button last */
    .popup-data #application-from-exist .boards-search-form {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        gap: 10px;
        align-items: stretch;
    }
    .popup-data #application-from-exist .boards-search-form .input-block {
        display: flex;
        flex-direction: column;
        gap: 10px;
        width: 100%;
        padding: 0;
    }
    .popup-data #application-from-exist .boards-search-form .input-block select,
    .popup-data #application-from-exist .boards-search-form .input-block .select2-container {
        width: 100% !important;
        max-width: 100%;
    }
    .popup-data #application-from-exist .boards-search-form .button-block {
        order: 2;
        width: 100%;
        padding: 0;
    }
    .popup-data #application-from-exist .boards-search-form .button-block .add-to-contract-from-exist {
        width: 100%;
        height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
    }
}

/* === SUPPLIERS BILLS — common (all widths) === */
/* Scoped class: .al-suppliers-bills-page on the root <section>.
   Mirrors /manager/bills (.al-bills-page) patterns. */
.al-suppliers-bills-page h1.title-search-result {
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;
    font-weight: normal;
    font-size: 34px;
    line-height: 41px;
    margin: 0 0 16px;
    padding: 0;
}
.al-suppliers-bills-page .bk-filter-btn svg path {
    fill: #FC6B40 !important;
}
/* Drawer filter-actions (Reset + Find) — desktop/tablet: right-aligned 150px.
   Mobile override below splits 50/50. */
.al-suppliers-bills-page .bk-filter-actions {
    display: flex;
    justify-content: stretch;
    align-items: center;
    gap: 10px;
    width: 100%;
    margin-top: 16px;
}
.al-suppliers-bills-page .bk-filter-actions .bk-filter-reset-btn {
    flex: 1 1 0;
    width: auto;
    height: 42px;
    padding: 0 14px;
    min-width: 0;
}
.al-suppliers-bills-page .bk-filter-actions .crm-button {
    flex: 1 1 0;
    width: auto;
    height: 42px;
    min-width: 0;
}
/* Horizontal 3-dot kebab button — framed box on all widths */
.al-suppliers-bills-page .result-table .action-col .more-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border: 1px solid #E0E4EA;
    border-radius: 6px;
    background: #fff;
}
/* When no filters are selected, .al-selected-filter sits empty inside the
   flex .field-container with `flex-basis: 100%`, and its presence forces an
   extra row that still consumes `row-gap: 10px`. That makes .search-block
   ~10px taller than the fields+label, which in turn pushes the stretched
   .action-block (Додати рахунок) visually below the Фільтр/Експорт bottom
   baseline. Hide the empty badge container so no extra row is allocated. */
.al-suppliers-bills-page .al-selected-filter:empty,
.al-suppliers-bills-page .al-selected-filter:not(:has(*)) {
    display: none !important;
}

/* Badges row (.al-selected-filter) — force onto its own line regardless of
   viewport. Inside the flex .field-container, badges would otherwise sit
   next to the last field when there's leftover horizontal room. Tablet/mobile
   blocks below repeat this (plus extra layout), but we want the same
   behaviour on desktop (≥1366px) too so badges never share a row with
   inputs/buttons. */
.al-suppliers-bills-page .al-selected-filter {
    flex-basis: 100%;
    width: 100%;
}

/* === SUPPLIERS BILLS DESKTOP (≥1366px): controls 180px wide === */
@media screen and (min-width: 1366px) {
    .al-suppliers-bills-page .suppliers-bills-header .bk-filter-btn,
    .al-suppliers-bills-page .suppliers-bills-header .suppliers-bills-search-submit,
    .al-suppliers-bills-page .suppliers-bills-header .suppliers-bills-export.crm-button,
    .al-suppliers-bills-page .suppliers-bills-header .suppliers-bills-add-btn.crm-button {
        width: 180px;
        box-sizing: border-box;
        justify-content: center;
    }
    .al-suppliers-bills-page .suppliers-bills-header .field-container > .input-block.filter-btn-block {
        flex: 1 1 auto;
        min-width: 0;
    }
    .al-suppliers-bills-page .suppliers-bills-actions-block .suppliers-bills-export.crm-button {
        margin-left: auto;
    }
}

/* === SUPPLIERS BILLS — strip default vertical margins inside header/form.
   Bills page does the same (crm.css:14850). Applies on all widths because
   `.field-container .input-block { margin-bottom: 20px }` (crm.css:1111) and
   `.search-block .input-block { margin-bottom: 15px }` (crm.css:1106) bleed
   into our gap-based flex layout and make .suppliers-bills-header taller than
   its content (which pushes the unlabelled Додати рахунок button down).
   !important beats any later inline <style> declarations from the blade. === */
.al-suppliers-bills-page .suppliers-bills-header .field-container .input-block,
.al-suppliers-bills-page .suppliers-bills-header .search-block .input-block {
    margin-bottom: 0 !important;
    margin-right: 0 !important;
}
.al-suppliers-bills-page .suppliers-bills-header .bk-filter-btn,
.al-suppliers-bills-page .suppliers-bills-header .suppliers-bills-search-submit,
.al-suppliers-bills-page .suppliers-bills-header .input-block .crm-button,
.al-suppliers-bills-page .suppliers-bills-header .suppliers-bills-add-btn.crm-button {
    margin-top: 0 !important;
}
/* Filter+Search block */
.al-suppliers-bills-page .filter-btn-block {
    display: flex;
    gap: 12px;
    align-items: flex-end;
    width: auto !important;
}
/* Export+Add block */
.al-suppliers-bills-page .suppliers-bills-actions-block {
    display: flex;
    gap: 12px;
    align-items: flex-end;
    width: auto !important;
    margin-left: auto;
}
/* Header row: fields+buttons share a baseline at the bottom of the inputs so
   unlabelled buttons (Фільтр/Експорт/Додати) don't float above the labelled
   inputs. Gap between .search-block and .action-block. */
.al-suppliers-bills-page .suppliers-bills-header {
    align-items: flex-end;
    gap: 10px;
}
/* Form/field-container own margins shouldn't introduce vertical offset */
.al-suppliers-bills-page .suppliers-bills-header .search-block,
.al-suppliers-bills-page .suppliers-bills-header .search-block form,
.al-suppliers-bills-page .suppliers-bills-header .search-block .field-container {
    margin: 0;
    padding: 0;
}
/* The filter form's field-container: flex wrap with consistent gaps, bottoms
   aligned so labelled inputs + unlabelled buttons share a baseline. */
.al-suppliers-bills-page .suppliers-bills-header .search-block form .field-container {
    display: flex;
    flex-wrap: wrap;
    column-gap: 12px;
    row-gap: 10px;
    align-items: flex-end;
}

/* === SUPPLIERS BILLS TABLET: grid cards (769px-1365px) === */
@media screen and (min-width: 769px) and (max-width: 1365px) {
    /* Kill fixed widths on outer containers so content fills viewport.
       Padding only on innermost .mw1366 (24px×2). Outer .container-fluid keeps
       Bootstrap default 15px×2. Total ≈78px — matches /manager/bills so the
       2-column breakpoint aligns. Previously we padded all three nested
       containers (24×3×2 = 144 extra px), which pushed the 2-column grid
       threshold to ~908px viewport vs bills' ~830px. */
    .al-suppliers-bills-page .container-fluid.container-fluid-base,
    .al-suppliers-bills-page .container.container-base,
    .al-suppliers-bills-page .mw1366 {
        width: auto !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box;
    }
    .al-suppliers-bills-page .mw1366 {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }
    .al-suppliers-bills-page {
        overflow-x: hidden;
    }

    /* Header: form on left, Add button on right, wrap allowed. Align to baseline
       of bottom of inputs so Add button sits on same line as Фільтр/Експорт. */
    .al-suppliers-bills-page .suppliers-bills-header {
        flex-wrap: wrap;
        gap: 12px;
        align-items: flex-end;
    }
    .al-suppliers-bills-page .suppliers-bills-header .search-block {
        flex: 1 1 auto;
        min-width: 0;
    }
    /* Filter form row: inputs + buttons in one line, badges wrap below */
    .al-suppliers-bills-page .suppliers-bills-header .field-container {
        display: flex;
        flex-wrap: wrap;
        column-gap: 12px;
        row-gap: 10px;
        align-items: flex-start;
    }
    .al-suppliers-bills-page .suppliers-bills-header .search-block form .field-container {
        align-items: flex-start;
    }
    .al-suppliers-bills-page .suppliers-bills-header .field-container > .input-block:not(.filter-btn-block):not(.suppliers-bills-actions-block) {
        width: calc((100% - 36px) / 4);
        margin-right: 0;
        margin-bottom: 0;
    }
    .al-suppliers-bills-page .suppliers-bills-header .field-container > .input-block input[type=text] {
        width: 100% !important;
        box-sizing: border-box;
    }
    .al-suppliers-bills-page .filter-btn-block {
        width: calc((100% - 36px) / 2) !important;
        display: flex;
        flex-wrap: wrap;
        column-gap: 12px;
        row-gap: 10px;
        margin-left: auto;
        padding-top: 21px;
        box-sizing: border-box;
    }
    .al-suppliers-bills-page .suppliers-bills-actions-block {
        width: calc((100% - 36px) / 2) !important;
        display: flex;
        flex-wrap: wrap;
        column-gap: 12px;
        row-gap: 10px;
        margin-left: auto;
        box-sizing: border-box;
        order: 30;
    }
    .al-suppliers-bills-page .filter-btn-block .bk-filter-btn,
    .al-suppliers-bills-page .filter-btn-block .suppliers-bills-search-submit,
    .al-suppliers-bills-page .suppliers-bills-actions-block .suppliers-bills-export.crm-button,
    .al-suppliers-bills-page .suppliers-bills-actions-block .suppliers-bills-add-btn.crm-button {
        width: calc((100% - 12px) / 2);
        box-sizing: border-box;
        justify-content: center;
        margin-top: 0;
    }
    .al-suppliers-bills-page .suppliers-bills-actions-block .suppliers-bills-export.crm-button {
        margin-left: auto;
    }
    /* Badges row — always own line, full width */
    .al-suppliers-bills-page .al-selected-filter {
        flex-basis: 100%;
        width: 100%;
        margin-left: 0;
        margin-top: 4px;
        order: 20;
    }

    /* Drawer — keep desktop position */
    .al-suppliers-bills-page .bk-filter-fields .input-block {
        width: 100% !important;
        max-width: 100% !important;
    }
    .al-suppliers-bills-page .bk-filter-fields .input-block select,
    .al-suppliers-bills-page .bk-filter-fields .input-block input[type=text] {
        width: 100% !important;
        box-sizing: border-box;
    }
    .al-suppliers-bills-page .bk-filter-fields .input-block .select2-container {
        width: 100% !important;
    }

    /* Table → cards grid */
    .al-suppliers-bills-page .result-table {
        display: block !important;
    }
    .al-suppliers-bills-page .result-table thead {
        display: none !important;
    }
    .al-suppliers-bills-page .result-table tbody {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        gap: 12px;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row {
        position: relative;
        display: flex !important;
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 12px 0;
        box-sizing: border-box;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td {
        display: flex !important;
        flex-flow: row !important;
        width: 100%;
        padding: 3px 16px;
        border-bottom: none !important;
        font-size: 13px;
        line-height: 18px;
        box-sizing: border-box;
        align-items: flex-start;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td[data-label]::before {
        content: attr(data-label);
        display: inline-block;
        min-width: 130px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td.action-col {
        position: absolute;
        top: 8px;
        right: 8px;
        width: auto !important;
        padding: 0 !important;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td.action-col::before {
        display: none !important;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td.action-col .sub-action {
        right: 0;
        left: auto;
        top: 36px;
        margin-top: 0;
    }
    /* Override inline style="text-align: center" on Рахунок / Статус td so
       the ::before label stays left-aligned like other rows. */
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td[data-label] {
        text-align: left !important;
    }
    /* Payment-from-client contains multiple entries separated by <br><br>.
       Switch this specific td from flex-row to block layout so <br> and
       .informer{display:block} actually produce vertical line breaks.
       Label is absolute-positioned to keep the "label left / content right"
       visual shared with other card rows. */
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td.client-bill-status {
        display: block !important;
        position: relative;
        padding-left: 146px !important;
        min-width: 0;
        word-break: break-word;
        overflow-wrap: anywhere;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td.client-bill-status::before {
        position: absolute;
        left: 16px;
        top: 3px;
        display: inline-block;
        min-width: 130px;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td.client-bill-status .informer {
        display: block;
        white-space: normal;
        max-width: max-content;
        margin: 2px 0;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td.client-bill-status br + br {
        display: block;
        content: "";
        height: 6px;
    }
}

/* === SUPPLIERS BILLS MOBILE: list cards (max 768px) === */
@media screen and (max-width: 768px) {
    /* Same single-container padding strategy as tablet — keep Bootstrap's
       15px on .container-fluid, apply 16px only to innermost .mw1366. */
    .al-suppliers-bills-page .container-fluid.container-fluid-base,
    .al-suppliers-bills-page .container.container-base,
    .al-suppliers-bills-page .mw1366 {
        width: auto !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box;
    }
    .al-suppliers-bills-page .mw1366 {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
    .al-suppliers-bills-page,
    body {
        overflow-x: hidden;
    }

    /* Header: single column with paired action buttons */
    .al-suppliers-bills-page .suppliers-bills-header {
        flex-direction: column;
        gap: 10px;
    }
    .al-suppliers-bills-page .suppliers-bills-header .search-block {
        width: 100%;
    }

    /* Filter form: each field / button on its own full-width row */
    .al-suppliers-bills-page .suppliers-bills-header .field-container {
        display: flex;
        flex-direction: column;
        gap: 10px;
        align-items: stretch;
    }
    .al-suppliers-bills-page .suppliers-bills-header .field-container > .input-block {
        width: 100%;
        margin-right: 0;
        margin-bottom: 0;
    }
    .al-suppliers-bills-page .suppliers-bills-header .field-container > .input-block input[type=text] {
        width: 100% !important;
        box-sizing: border-box;
    }
    /* Buttons layout:
       row 1: Фільтр + Пошук
       row 2: badges
       row 3: Експорт + Додати рахунок */
    .al-suppliers-bills-page .filter-btn-block {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 10px;
        row-gap: 10px;
        width: 100% !important;
        margin-left: 0;
        order: 3;
    }
    .al-suppliers-bills-page .suppliers-bills-actions-block {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 10px;
        row-gap: 10px;
        width: 100% !important;
        margin-left: 0;
        order: 11;
    }
    .al-suppliers-bills-page .filter-btn-block .bk-filter-btn,
    .al-suppliers-bills-page .filter-btn-block .suppliers-bills-search-submit,
    .al-suppliers-bills-page .suppliers-bills-actions-block .suppliers-bills-export.crm-button,
    .al-suppliers-bills-page .suppliers-bills-actions-block .suppliers-bills-add-btn.crm-button {
        width: 100%;
        box-sizing: border-box;
        justify-content: center;
        margin-top: 0;
    }

    /* Badges: 50/50 with pinned × icon */
    .al-suppliers-bills-page .al-selected-filter {
        margin-left: 0;
        margin-top: 4px;
        margin-bottom: 12px;
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        order: 10;
        width: 100%;
    }
    .al-suppliers-bills-page .al-selected-filter .selected-filter-item {
        flex: 0 0 calc(50% - 4px);
        max-width: calc(50% - 4px);
        margin-right: 0;
        margin-bottom: 0;
        box-sizing: border-box;
        display: block;
        position: relative;
        padding-right: 30px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 20px;
    }
    .al-suppliers-bills-page .al-selected-filter .selected-filter-item img {
        position: absolute;
        right: 8px;
        top: 50%;
        transform: translateY(-50%);
        margin-left: 0;
    }

    /* Drawer: 100vw */
    .al-suppliers-bills-page .bk-filter-block {
        width: 100vw;
    }
    .al-suppliers-bills-page .bk-filter-fields .input-block {
        width: 100% !important;
        max-width: 100% !important;
    }
    .al-suppliers-bills-page .bk-filter-fields .input-block select,
    .al-suppliers-bills-page .bk-filter-fields .input-block input[type=text] {
        width: 100% !important;
        box-sizing: border-box;
    }
    .al-suppliers-bills-page .bk-filter-fields .input-block .select2-container {
        width: 100% !important;
    }

    /* Drawer actions: 50/50 split */
    .al-suppliers-bills-page .bk-filter-actions {
        justify-content: stretch;
    }
    .al-suppliers-bills-page .bk-filter-actions .bk-filter-reset-btn,
    .al-suppliers-bills-page .bk-filter-actions .crm-button {
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 0;
    }

    /* Table → vertical list cards */
    .al-suppliers-bills-page .result-table {
        display: block !important;
    }
    .al-suppliers-bills-page .result-table thead {
        display: none !important;
    }
    .al-suppliers-bills-page .result-table tbody {
        display: flex !important;
        flex-direction: column;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row {
        position: relative;
        display: flex !important;
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 12px 0;
        margin: 0 0 12px;
        box-sizing: border-box;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td {
        display: flex !important;
        flex-flow: row !important;
        width: 100%;
        padding: 4px 12px;
        border-bottom: none !important;
        font-size: 13px;
        line-height: 18px;
        box-sizing: border-box;
        align-items: flex-start;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td[data-label]::before {
        content: attr(data-label);
        display: inline-block;
        min-width: 130px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td.action-col {
        position: absolute;
        top: 8px;
        right: 8px;
        width: auto !important;
        padding: 0 !important;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td.action-col::before {
        display: none !important;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td.action-col .sub-action {
        right: 0;
        left: auto;
        top: 36px;
        margin-top: 0;
    }
    /* Same text-align / vertical alignment fixes as on tablet. */
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td[data-label] {
        text-align: left !important;
    }
    /* Payment-from-client: block layout + absolute label (see tablet block
       above for the reasoning). Mobile uses 12px padding instead of 16px. */
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td.client-bill-status {
        display: block !important;
        position: relative;
        padding-left: 142px !important;
        min-width: 0;
        word-break: break-word;
        overflow-wrap: anywhere;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td.client-bill-status::before {
        position: absolute;
        left: 12px;
        top: 4px;
        display: inline-block;
        min-width: 130px;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td.client-bill-status .informer {
        display: block;
        white-space: normal;
        max-width: max-content;
        margin: 2px 0;
    }
    .al-suppliers-bills-page .result-table tr.suppliers-bills-row td.client-bill-status br + br {
        display: block;
        content: "";
        height: 6px;
    }

    /* Pagination wrap */
    .al-suppliers-bills-page .result-paginator {
        flex-wrap: wrap;
        gap: 8px;
    }

    /* Stats header — column, wrap */
    .al-suppliers-bills-page .client-contacts-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
    .al-suppliers-bills-page .client-contacts-header .bills-stat {
        display: flex;
        flex-wrap: wrap;
        max-width: 100%;
        row-gap: 6px;
    }

    /* Title smaller on narrow screens */
    .al-suppliers-bills-page h1.title-search-result {
        font-size: 22px;
        line-height: 28px;
    }
}

/* === ADD SUPPLIER BILL POPUP — buttons (all widths) === */
.add-supplier-bill .buttons-block.right-buttons {
    display: flex;
    align-items: center;
    gap: 6px;
}
.add-supplier-bill .buttons-block.right-buttons .cancel,
.add-supplier-bill .buttons-block.right-buttons .crm-button {
    width: 150px;
    box-sizing: border-box;
    text-align: center;
    margin: 0;
}
.add-supplier-bill .buttons-block.right-buttons .cancel {
    background: #FFFFFF;
    color: #3D445C;
    border: 1px solid #E5E5E5;
    border-radius: 4px;
    font-weight: 600;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 42px;
    line-height: 1;
    margin: 0;
}
.add-supplier-bill .buttons-block.right-buttons .cancel:hover {
    border-color: #FC6B40;
    color: #FC6B40 !important;
}

/* === ADD SUPPLIER BILL POPUP MOBILE (<=768px) === */
@media screen and (max-width: 768px) {
    /* Whole drawer: full viewport width */
    .add-supplier-bill {
        width: 100vw !important;
        max-width: 100vw !important;
    }
    .add-supplier-bill .add-supplier-bill-body {
        width: 100% !important;
        padding: 20px 16px;
        box-sizing: border-box;
    }
    .add-supplier-bill .add-supplier-bill-header {
        padding: 0 16px;
    }

    /* Fields: one per row, full width */
    .add-supplier-bill .field-container {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }
    .add-supplier-bill .field-container > .input-block {
        width: 100% !important;
        margin-right: 0 !important;
    }
    .add-supplier-bill .form-select,
    .add-supplier-bill .input-block input[type="text"],
    .add-supplier-bill .input-block select,
    .add-supplier-bill .input-block textarea {
        width: 100% !important;
        box-sizing: border-box;
    }
    .add-supplier-bill .input-block .select2-container {
        width: 100% !important;
    }

    /* File-block keeps row layout so Переглянути/Завантажити sit inline */
    .add-supplier-bill .field-container.preview-block,
    .add-supplier-bill .field-container.file-block {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 10px;
    }

    /* Radio buttons (status changer): one per row */
    .add-supplier-bill .bill-status-changer {
        width: 100%;
        box-sizing: border-box;
    }
    .add-supplier-bill .bill-status-changer fieldset {
        width: 100%;
        box-sizing: border-box;
    }
    .add-supplier-bill .bill-status-changer fieldset label {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    /* Tabs headers — allow wrap so long Ukrainian labels fit */
    .add-supplier-bill .tab-selector,
    .add-supplier-bill .tab-selector2 {
        flex-wrap: wrap;
    }

    /* Buttons: 50% with gap */
    .add-supplier-bill .buttons-block.right-buttons {
        display: flex !important;
        justify-content: space-between !important;
        gap: 6px !important;
    }
    .add-supplier-bill .buttons-block.right-buttons .cancel,
    .add-supplier-bill .buttons-block.right-buttons .crm-button {
        width: calc(50% - 3px) !important;
        flex: none !important;
        text-align: center !important;
        box-sizing: border-box !important;
        margin: 0 !important;
    }
}

/* === BOOKKEEPER BILL POPUP — field pairs gap reduction (desktop + tablet) === */
@media (min-width: 769px) {
    .add-supplier-bill.bookkeeper-bill-popup .field-container:has(#bookkeeper-suppliers-bill-sum),
    .add-supplier-bill.bookkeeper-bill-popup #commission-block {
        justify-content: flex-start;
        gap: 20px;
    }
    /* Force Select2 container width to match the underlying .form-select
       (305px) — Select2 computes width from getComputedStyle which resolves
       to 'auto' while the popup is still display:none during init, leaving
       the visible container ~50px wide. */
    .add-supplier-bill.bookkeeper-bill-popup .input-block .select2-container {
        width: 305px !important;
    }
    .add-supplier-bill.bookkeeper-bill-popup .field-container .input-block:has(> .form-select) {
        width: 305px;
    }
}

/* === BOOKKEEPER BILL POPUP — file-block + buttons-block (all widths) === */
.add-supplier-bill.bookkeeper-bill-popup .field-container.file-block {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    justify-content: flex-start;
}
.add-supplier-bill.bookkeeper-bill-popup .field-container.file-block .file-button,
.add-supplier-bill.bookkeeper-bill-popup .field-container.file-block .download-bill-file {
    min-width: 150px;
    margin-right: 0;
    text-align: center;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.add-supplier-bill.bookkeeper-bill-popup .buttons-block {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.add-supplier-bill.bookkeeper-bill-popup .buttons-block .save_comment,
.add-supplier-bill.bookkeeper-bill-popup .buttons-block .crm-button {
    min-width: 150px;
    margin-right: 0;
    text-align: center;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 42px;
    line-height: 1;
}

/* === BOOKKEEPER BILL POPUP — orange checkboxes (boards & services tables) === */
.add-supplier-bill.bookkeeper-bill-popup #supplier-bill-boards-list input[type=checkbox],
.add-supplier-bill.bookkeeper-bill-popup #supplier-bill-services-list input[type=checkbox] {
    appearance: none;
    -webkit-appearance: none;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px;
    flex: 0 0 18px;
    display: inline-block;
    border: 1px solid #dee5ec;
    border-radius: 3px;
    background: #fafbfc;
    cursor: pointer;
    margin: 0;
    padding: 0;
    position: relative;
    vertical-align: middle;
    transition: background 0.2s, border-color 0.2s;
}
.add-supplier-bill.bookkeeper-bill-popup #supplier-bill-boards-list input[type=checkbox]:checked,
.add-supplier-bill.bookkeeper-bill-popup #supplier-bill-services-list input[type=checkbox]:checked {
    background: #FC6B40;
    border-color: #FC6B40;
}
.add-supplier-bill.bookkeeper-bill-popup #supplier-bill-boards-list input[type=checkbox]:checked::after,
.add-supplier-bill.bookkeeper-bill-popup #supplier-bill-services-list input[type=checkbox]:checked::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 5px;
    width: 5px;
    height: 9px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* === BOOKKEEPER BILL POPUP MOBILE — file-block & buttons-block 50% === */
@media screen and (max-width: 768px) {
    .add-supplier-bill.bookkeeper-bill-popup .field-container.file-block {
        gap: 10px !important;
        flex-wrap: wrap;
    }
    .add-supplier-bill.bookkeeper-bill-popup .field-container.file-block .file-button,
    .add-supplier-bill.bookkeeper-bill-popup .field-container.file-block .download-bill-file {
        flex: 1 1 calc(50% - 5px) !important;
        width: calc(50% - 5px) !important;
        min-width: 0 !important;
        margin-right: 0 !important;
        padding-left: 8px;
        padding-right: 8px;
    }
    .add-supplier-bill.bookkeeper-bill-popup .buttons-block {
        gap: 10px !important;
        flex-wrap: wrap;
    }
    .add-supplier-bill.bookkeeper-bill-popup .buttons-block .save_comment,
    .add-supplier-bill.bookkeeper-bill-popup .buttons-block .crm-button {
        flex: 1 1 calc(50% - 5px) !important;
        width: calc(50% - 5px) !important;
        min-width: 0 !important;
        margin-right: 0 !important;
        padding-left: 8px;
        padding-right: 8px;
    }
}

/* === SUPPLIER BILL LOG POPUP MOBILE — table → card layout === */
@media screen and (max-width: 768px) {
    .default-popup.supplier-bill-log {
        width: 100vw !important;
        max-width: 100vw !important;
        height: auto !important;
        max-height: 90vh;
        left: 0 !important;
        top: 5vh !important;
        transform: none !important;
        margin: 0 !important;
        box-sizing: border-box;
    }
    .default-popup.supplier-bill-log .default-popup-body {
        height: auto !important;
        max-height: calc(90vh - 70px);
        padding: 16px;
        box-sizing: border-box;
    }
    .default-popup.supplier-bill-log .log-table,
    .default-popup.supplier-bill-log .log-table tbody,
    .default-popup.supplier-bill-log .log-table tr,
    .default-popup.supplier-bill-log .log-table td {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }
    .default-popup.supplier-bill-log .log-table tr.header-row {
        display: none !important;
    }
    .default-popup.supplier-bill-log .log-table tr {
        position: relative;
        padding: 12px 0;
        border-bottom: 1px solid #cdd4d9;
    }
    .default-popup.supplier-bill-log .log-table tr.hidden {
        display: none !important;
    }
    .default-popup.supplier-bill-log .log-table td {
        padding: 4px 0;
        border: none;
    }
    .default-popup.supplier-bill-log .log-table td[data-label] {
        display: flex;
        align-items: flex-start;
        gap: 8px;
    }
    .default-popup.supplier-bill-log .log-table td[data-label]::before {
        content: attr(data-label);
        min-width: 110px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
    }
    .default-popup.supplier-bill-log .log-table td.action-col {
        position: absolute;
        top: 8px;
        right: 0;
        width: auto;
        padding: 0;
    }
    .default-popup.supplier-bill-log .log-table tr#log-,
    .default-popup.supplier-bill-log .log-table tr[id^="log-"] td.log-info {
        padding: 8px 0 0 0;
        white-space: normal;
        word-break: break-word;
    }
}

/* === SUPPLIERS — common (/manager/suppliers) === */
@media screen and (max-width: 1365px) {
    body:has(.al-suppliers-page),
    .al-suppliers-page { overflow-x: hidden; }
    .al-suppliers-page .container-fluid.container-fluid-base {
        padding-left: 24px !important;
        padding-right: 24px !important;
        width: auto !important;
    }
    .al-suppliers-page .container.container-base.mw1366 {
        max-width: 100% !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    #result-search-list.al-suppliers-page .manager-search .title-search-result,
    .al-suppliers-page .manager-search .title-search-result,
    .al-suppliers-page .title-search-result {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .al-suppliers-page .favorite-viewed-tab {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .al-suppliers-page .favorite-viewed-tab::-webkit-scrollbar { display: none; }
    .al-suppliers-page .favorite-viewed-tab a { flex-shrink: 0; }
    .al-suppliers-page .result-paginator {
        flex-wrap: wrap;
        gap: 10px;
        justify-content: center;
    }

    /* === SUPPLIERS card pattern: label left / value right (like leads) === */
    /* перестраховка: глобальное правило .leads-card-header { display:none } (crm.css:9568)
       перекрываем явно со скоупом .al-suppliers-page */
    .al-suppliers-page .supplier-block .leads-card-header {
        display: flex !important;
        justify-content: space-between;
        align-items: center;
        padding: 12px 16px 4px;
    }
    .al-suppliers-page .supplier-block .leads-card-header button {
        display: flex !important;
        width: 30px; height: 30px;
        border: 1px solid #E0E4EA;
        background: transparent;
        cursor: pointer;
        padding: 0;
        align-items: center;
        justify-content: center;
        border-radius: 6px;
    }
    .al-suppliers-page .supplier-block .leads-card-header button:hover {
        background: #F6F7F9; border-color: #C8CDD8;
    }
    .al-suppliers-page .supplier-block .leads-card-dropdown {
        position: absolute;
        right: 16px;
        top: 48px;
        width: 205px;
        background: #fff;
        border: 1px solid #E0E4EA;
        border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        z-index: 100;
        display: none;
    }
    .al-suppliers-page .supplier-block .leads-card-dropdown.open { display: block; }

    /* label-left / value-right на карточке (строгие две колонки фиксированной ширины) */
    .al-suppliers-page .supplier-block .supplier-row { flex-direction: column; min-width: unset; padding: 0; cursor: default; }
    .al-suppliers-page .supplier-block .supplier-col {
        flex: unset !important;
        width: 100%;
        min-width: unset;
        padding: 4px 16px;
        display: flex !important;
        align-items: flex-start;
        gap: 8px;
        font-size: 13px;
        line-height: 18px;
        box-sizing: border-box;
    }
    .al-suppliers-page .supplier-block .supplier-col[data-label]::before {
        content: attr(data-label);
        display: inline-block;
        width: 160px;
        flex: 0 0 160px;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
        white-space: normal;
        overflow-wrap: break-word;
        word-break: break-word;
        hyphens: auto;
    }
    /* строгая вторая колонка: единый wrapper занимает весь остаток строки */
    .al-suppliers-page .supplier-block .supplier-col > .supplier-col-value {
        flex: 1 1 0;
        min-width: 0;
        overflow-wrap: break-word;
        word-break: break-word;
    }
    /* col-name: показать label (перебиваем inline-CSS .col-name::before { display:none }) */
    .al-suppliers-page .supplier-block .supplier-col.col-name::before { display: inline-block !important; }
    .al-suppliers-page .supplier-block .supplier-col.col-name .up-down { display: none; }
    .al-suppliers-page .supplier-block .supplier-col.col-action { display: none !important; }
    .al-suppliers-page .supplier-block .supplier-row-selects { min-width: unset; }
}

/* === SUPPLIERS TABLET (769-1365px) === */
@media screen and (min-width: 769px) and (max-width: 1365px) {
    /* header: filter form grid + right-block row */
    .al-suppliers-page .header-block {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }
    .al-suppliers-page .header-block .search-block { flex-basis: 100% !important; }
    .al-suppliers-page .header-block .search-block form.field-container {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(180px, 300px));
        justify-content: start;
        gap: 12px;
        align-items: flex-end;
    }
    .al-suppliers-page .header-block .search-block .input-block {
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
    }
    .al-suppliers-page .header-block .search-block .input-block.short-select-block,
    .al-suppliers-page .header-block .search-block .input-block select.search-form-select {
        width: 100% !important;
    }
    .al-suppliers-page .header-block .search-block .input-block:last-child { width: auto !important; }
    .al-suppliers-page .header-block .search-block .input-block:last-child button { width: 100%; height: 42px; }
    .al-suppliers-page .header-block .right-block {
        display: flex;
        gap: 10px;
        margin-bottom: 20px;
        justify-content: flex-end;
    }
    .al-suppliers-page .header-block .right-block #export-supplier,
    .al-suppliers-page .header-block .right-block .add-block a {
        min-width: 160px;
        height: 42px;
        margin: 0 !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    /* expandable detail — grid 2 cols */
    .al-suppliers-page .srs-detail { padding: 20px; }
    .al-suppliers-page .srs-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px 20px !important;
    }
    .al-suppliers-page .srs-prices-table { max-width: 100% !important; }
    .al-suppliers-page .srs-status-row {
        flex-direction: column !important;
        align-items: stretch !important;
    }
    .al-suppliers-page .srs-status-field {
        min-width: unset !important;
        width: 100%;
    }
    .al-suppliers-page .srs-status-field textarea {
        min-width: unset !important;
        width: 100%;
    }
    .al-suppliers-page .srs-status-actions {
        justify-content: flex-end !important;
    }
    .al-suppliers-page .srs-status-actions .cancel,
    .al-suppliers-page .srs-status-actions .submit {
        min-width: 150px !important;
    }
}

/* === SUPPLIERS MOBILE (≤768px) === */
@media screen and (max-width: 768px) {
    /* title size */
    .al-suppliers-page h1.title-search-result {
        font-size: 22px;
        line-height: 28px;
    }

    /* card: content edge-to-edge (no horizontal padding) */
    .al-suppliers-page .supplier-block .supplier-col,
    .suppliers-index-page .supplier-col {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    /* For /manager/suppliers mobile cards keep inner horizontal content padding */
    .al-suppliers-page .suppliers-index-page .supplier-block .supplier-col,
    .al-suppliers-page .suppliers-index-page .supplier-block .supplier-col.col-name,
    .al-suppliers-page .suppliers-index-page .supplier-block .leads-card-header {
        padding-left: 16px !important;
        padding-right: 16px !important;
        box-sizing: border-box;
    }
    .al-suppliers-page .supplier-block .leads-card-header,
    .suppliers-index-page .leads-card-header {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* header: all fields/buttons full width, one per row */
    .al-suppliers-page .header-block {
        flex-direction: column;
        gap: 6px;
    }
    .al-suppliers-page .header-block .search-block { flex-basis: 100% !important; }
    .al-suppliers-page .header-block .search-block form.field-container {
        display: flex !important;
        flex-direction: column;
        flex-wrap: nowrap;
        gap: 6px;
    }
    .al-suppliers-page .header-block .search-block .input-block,
    .al-suppliers-page .header-block .search-block .input-block.short-select-block,
    .al-suppliers-page .header-block .search-block .input-block select.search-form-select {
        width: 100% !important;
        min-width: 0 !important;
    }
    .al-suppliers-page .header-block .search-block .input-block {
        margin: 0 !important;
    }
    .al-suppliers-page .header-block .search-block .input-block:last-child {
        width: 100% !important;
    }
    .al-suppliers-page .header-block .search-block .input-block:last-child button {
        width: 100%;
        height: 42px;
    }
    .al-suppliers-page .header-block .right-block {
        flex-direction: column;
        width: 100%;
        gap: 6px;
        margin-bottom: 16px;
    }
    .al-suppliers-page .header-block .right-block #export-supplier,
    .al-suppliers-page .header-block .right-block .add-block,
    .al-suppliers-page .header-block .right-block .add-block a {
        width: 100%;
        margin: 0 !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 42px;
    }

    /* expandable detail — grid 1 col */
    .al-suppliers-page .srs-detail { padding: 16px; }
    .al-suppliers-page .srs-grid {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }
    .al-suppliers-page .srs-prices-summary { flex-wrap: wrap; }
    .al-suppliers-page .srs-prices-table { max-width: 100% !important; }
    .al-suppliers-page .srs-status-row {
        flex-direction: column !important;
        gap: 10px !important;
    }
    .al-suppliers-page .srs-status-field,
    .al-suppliers-page .srs-status-field textarea {
        width: 100% !important;
        min-width: unset !important;
    }
    .al-suppliers-page .srs-status-actions {
        width: 100%;
        gap: 10px !important;
        justify-content: stretch !important;
    }
    .al-suppliers-page .srs-status-actions .cancel,
    .al-suppliers-page .srs-status-actions .submit {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        padding: 0 8px !important;
    }

    /* pagination */
    .al-suppliers-page .result-paginator .btn-show-more-leads { width: 100%; }
    .al-suppliers-page .result-paginator__pages {
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
    }
}

/* ============================================================
   === SERVICES TAB — "Додати дод. послуги" inside act popup ===
   Scoped to #application-services so only this tab is affected.
   ============================================================ */

/* Desktop+ : supplier checkbox goes under the dropdown so the
   whole row visually aligns at top. HTML order already puts
   the dropdown first — here we clean up spacing and top-align
   the whole data row so the dropdown sits on the same line as
   the other inputs. */
#application-services .services-item.service-item-data {
    align-items: flex-start;
}
#application-services .services-item .services-supplier .supplier-type-item {
    margin-top: 10px;
    margin-bottom: 0;
}
#application-services .services-item .services-supplier .services-supplier-dd {
    margin-right: 0;
}

/* Desktop+ : bordered delete button (trash icon) */
#application-services .services-item.service-item-data .services-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid #CDD4D9;
    border-radius: 4px;
    background: #fff;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease;
    box-sizing: border-box;
}
#application-services .services-item.service-item-data .services-action:hover {
    background: #F6F7F9;
    border-color: #B0B6C3;
}
#application-services .services-item.service-item-data .services-action svg {
    width: 20px;
    height: 20px;
    display: block;
}

/* Desktop+ : bordered "Додати рядок" button */
#application-services .add-service-line {
    display: inline-flex;
    align-items: center;
    padding: 10px 16px;
    background: #fff;
    border: 1px solid #CDD4D9;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    color: #FC6B40 !important;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease;
}
#application-services .add-service-line:hover {
    background: #F6F7F9;
    border-color: #B0B6C3;
    text-decoration: none;
}

/* ==== TABLET (769px-1365px): card layout ==== */
@media (min-width: 769px) and (max-width: 1365px) {
    #application-services .services-item.head-line {
        display: none;
    }
    #application-services .services-item.service-item-data {
        position: relative;
        padding: 16px;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        background: #fff;
        margin-bottom: 12px;
        gap: 12px;
        align-items: flex-start;
    }
    #application-services .services-item.service-item-data [data-label]::before {
        content: attr(data-label);
        display: block;
        font-size: 12px;
        color: #8B8F9D;
        font-weight: 500;
        margin-bottom: 6px;
    }
    /* Row 1 — name + supplier, each 50% */
    #application-services .services-item.service-item-data .services-name,
    #application-services .services-item.service-item-data .services-supplier {
        width: calc(50% - 6px);
        padding-right: 0;
        flex: 0 0 calc(50% - 6px);
    }
    #application-services .services-item.service-item-data .services-name select,
    #application-services .services-item.service-item-data .services-name .other-input,
    #application-services .services-item.service-item-data .services-supplier .services-supplier-dd {
        width: 100%;
        margin-right: 0;
        box-sizing: border-box;
    }
    #application-services .services-item.service-item-data .services-supplier .select2-container,
    #application-services .services-item.service-item-data .services-name .select2-container {
        width: 100% !important;
    }
    .popup-data #application-services .services-item.service-item-data .services-supplier .select2-container,
    .popup-data #application-services .services-item.service-item-data .services-name .select2-container,
    .bill-without-contract-popup #application-services .services-item.service-item-data .services-supplier .select2-container,
    .bill-without-contract-popup #application-services .services-item.service-item-data .services-name .select2-container {
        width: 100% !important;
        max-width: 100%;
    }
    #application-services .services-item.service-item-data .services-supplier .supplier-type-item {
        margin-top: 10px;
        margin-bottom: 0;
    }
    /* Row 2 — 4 numerics + delete button (4 gaps × 12px + 42px delete = 90px) */
    #application-services .services-item.service-item-data .services-price_in,
    #application-services .services-item.service-item-data .services-price,
    #application-services .services-item.service-item-data .services-count,
    #application-services .services-item.service-item-data .services-result {
        width: calc((100% - 90px) / 4);
        flex: 0 0 calc((100% - 90px) / 4);
        padding-right: 0;
    }
    #application-services .services-item.service-item-data .services-price_in input,
    #application-services .services-item.service-item-data .services-price input,
    #application-services .services-item.service-item-data .services-count input,
    #application-services .services-item.service-item-data .services-result input {
        width: 100%;
        box-sizing: border-box;
    }
    #application-services .services-item.service-item-data .services-action {
        width: 42px;
        height: 42px;
        flex: 0 0 42px;
        align-self: flex-end;
        margin-bottom: 0;
    }
    /* Sub-service nested rows reuse parent gap */
    #application-services .services-item.service-item-data .sub-service,
    #application-services .services-item.service-item-data .sub-service-action {
        width: 100%;
    }
}

/* ==== MOBILE (≤768px): card layout ==== */
@media (max-width: 768px) {
    #application-services .services-item.head-line {
        display: none;
    }
    #application-services .services-item.service-item-data {
        position: relative;
        padding: 16px;
        padding-right: 60px;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        background: #fff;
        margin-bottom: 12px;
        gap: 12px;
        align-items: flex-start;
    }
    #application-services .services-item.service-item-data [data-label]::before {
        content: attr(data-label);
        display: block;
        font-size: 12px;
        color: #8B8F9D;
        font-weight: 500;
        margin-bottom: 6px;
    }
    /* Name, Supplier — full width, one per row */
    #application-services .services-item.service-item-data .services-name,
    #application-services .services-item.service-item-data .services-supplier {
        width: 100%;
        padding-right: 0;
        flex: 0 0 100%;
    }
    #application-services .services-item.service-item-data .services-name select,
    #application-services .services-item.service-item-data .services-name .other-input,
    #application-services .services-item.service-item-data .services-supplier .services-supplier-dd {
        width: 100%;
        margin-right: 0;
        box-sizing: border-box;
    }
    #application-services .services-item.service-item-data .services-supplier .select2-container,
    #application-services .services-item.service-item-data .services-name .select2-container {
        width: 100% !important;
    }
    #application-services .services-item.service-item-data .services-supplier .supplier-type-item {
        margin-top: 10px;
        margin-bottom: 0;
    }
    /* 4 numerics — two per row (50% each) */
    #application-services .services-item.service-item-data .services-price_in,
    #application-services .services-item.service-item-data .services-price,
    #application-services .services-item.service-item-data .services-count,
    #application-services .services-item.service-item-data .services-result {
        width: calc(50% - 6px);
        flex: 0 0 calc(50% - 6px);
        padding-right: 0;
    }
    #application-services .services-item.service-item-data .services-price_in input,
    #application-services .services-item.service-item-data .services-price input,
    #application-services .services-item.service-item-data .services-count input,
    #application-services .services-item.service-item-data .services-result input {
        width: 100%;
        box-sizing: border-box;
    }
    /* Delete — top-right of the card */
    #application-services .services-item.service-item-data .services-action {
        position: absolute;
        top: 12px;
        right: 12px;
        width: 36px;
        height: 36px;
        flex: 0 0 auto;
        margin: 0;
    }
    #application-services .services-item.service-item-data .services-action svg {
        width: 18px;
        height: 18px;
    }
    /* Sub-service rows */
    #application-services .services-item.service-item-data .sub-service,
    #application-services .services-item.service-item-data .sub-service-action {
        width: 100%;
    }
    /* "Додати рядок" — full width on mobile */
    #application-services .add-service-line {
        width: 100%;
        justify-content: center;
    }
    /* Form header + submit footer */
    #application-services .form-footer.align-right {
        text-align: center;
        margin-top: 16px;
    }
    #application-services .form-footer.align-right .crm-button {
        width: 100%;
    }
}

/* === CLIENT TABS MOBILE FINAL OVERRIDE: bordered cards + spacing === */
@media (max-width: 768px) {
    .al-client-view-page .clients-company-data .data-table .data-tbody,
    .al-client-view-page .clients-contacts-data .data-table .data-tbody,
    .al-client-view-page .clients-contracts-data .data-table .data-tbody,
    .al-client-view-page .bills-table .bills-table-tbody,
    .al-client-view-page .suppliers-table .suppliers-tbody,
    .al-client-view-page .clients-docs-data .data-table .data-tbody,
    .al-client-view-page .boards-table .boards-table-tbody,
    .al-client-view-page .photoreports-table .photoreports-tbody {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
    }

    .al-client-view-page .clients-company-data .data-table .data-tbody > .data-tr,
    .al-client-view-page .clients-contacts-data .data-table .data-tbody > .data-tr,
    .al-client-view-page .clients-docs-data .data-table .data-tbody > .data-tr,
    .al-client-view-page .bills-table .bills-table-tbody > .data-tr,
    .al-client-view-page .suppliers-table .suppliers-tbody > .supplier-block,
    .al-client-view-page .boards-table .boards-table-tbody > .boards-table-tr,
    .al-client-view-page .photoreports-table .photoreports-tbody > .photoreports-row,
    .al-client-view-page .clients-contracts-data .data-tr-global {
        border: 1px solid #E8EBF1 !important;
        border-radius: 8px !important;
        margin: 0 !important;
        overflow: hidden;
    }

    /* Clients -> Suppliers: extra gap after month(period) select block */
    .al-client-view-page .info-block.select-in-title-block {
        margin-bottom: 12px !important;
    }
}

/* === SUPPLIER TABS — common (applies to /manager/suppliers/{id}/* pages: view, companies, contacts, parser, clients, files, prices, sales-statistics, docs) === */
.al-supplier-tabs-page,
.al-supplier-tabs-page .container-fluid-base {
    overflow-x: hidden;
}
.al-supplier-tabs-page .container.container-base,
.al-supplier-tabs-page .container.container-base_ {
    max-width: 1600px;
}

/* === SUPPLIER TABS TABLET (769-1365px) === */
@media (min-width: 769px) and (max-width: 1365px) {
    .al-supplier-tabs-page .container.container-base,
    .al-supplier-tabs-page .container.container-base_ {
        padding: 0 24px;
    }
    .al-supplier-tabs-page .client-info-header {
        flex-wrap: wrap;
        gap: 16px;
    }
    .al-supplier-tabs-page .client-info-header .left-block .info h1.client-name {
        font-size: 20px;
        line-height: 24px;
    }
    .al-supplier-tabs-page .client-info-header .left-block .info .short-info {
        flex-wrap: wrap;
        gap: 8px;
    }
    .al-supplier-tabs-page .client-info-header .left-block .nowrap {
        margin-right: 16px;
    }
    .al-supplier-tabs-page .client-info-header .right-block {
        flex: 0 0 auto !important;
        align-self: flex-start;
        margin-left: auto;
    }
    .al-supplier-tabs-page .client-info-header .right-block .btn.edit {
        width: 150px;
    }
    .al-supplier-tabs-page .client-navigation .favorite-viewed-tab {
        display: flex;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .al-supplier-tabs-page .client-navigation .favorite-viewed-tab::-webkit-scrollbar {
        display: none;
    }
    .al-supplier-tabs-page .client-navigation .favorite-viewed-tab a {
        flex-shrink: 0;
        margin-right: 20px;
    }
}

/* === SUPPLIER TABS MOBILE (≤768px) === */
@media (max-width: 768px) {
    body {
        overflow-x: hidden;
    }
    .al-supplier-tabs-page .container.container-base,
    .al-supplier-tabs-page .container.container-base_ {
        padding: 0 16px;
    }
    /* Header — vertical stack */
    .al-supplier-tabs-page .client-info-header {
        flex-direction: column;
        gap: 12px;
        margin-top: 16px;
        margin-bottom: 16px;
    }
    .al-supplier-tabs-page .client-info-header .left-block {
        display: block !important;
    }
    .al-supplier-tabs-page .client-info-header .left-block .img {
        float: left;
        width: 80px;
        height: 80px;
        margin: 0 12px 8px 0;
    }
    .al-supplier-tabs-page .client-info-header .left-block .img svg {
        width: 80px;
        height: 80px;
    }
    .al-supplier-tabs-page .client-info-header .left-block .info {
        padding-top: 0;
        padding-right: 0;
        overflow: hidden;
    }
    .al-supplier-tabs-page .client-info-header .left-block .info h1.client-name {
        font-size: 18px;
        line-height: 22px;
        font-weight: 600;
    }
    .al-supplier-tabs-page .client-info-header .left-block .info .short-info {
        flex-wrap: wrap;
        gap: 6px;
        clear: left;
    }
    .al-supplier-tabs-page .client-info-header .left-block .info .short-info svg {
        width: 18px;
        height: 18px;
    }
    .al-supplier-tabs-page .client-info-header .left-block .nowrap {
        margin-right: 0;
    }
    .al-supplier-tabs-page .client-info-header .left-block .cities-list {
        padding-right: 0;
    }
    /* Header buttons row */
    .al-supplier-tabs-page .client-info-header .right-block {
        display: flex !important;
        flex-flow: row nowrap !important;
        gap: 10px;
        width: 100%;
        padding-top: 0;
        justify-content: stretch;
    }
    .al-supplier-tabs-page .client-info-header .right-block .btn.edit {
        flex: 1 1 0 !important;
        width: auto !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
        height: 42px !important;
        box-sizing: border-box;
        margin-right: 0 !important;
        padding: 0 !important;
    }
    /* Navigation tabs — horizontal scroll */
    .al-supplier-tabs-page .client-navigation .favorite-viewed-tab {
        display: flex;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        gap: 0;
        border-bottom: 1px solid #E8EBF1;
        padding-bottom: 0;
    }
    .al-supplier-tabs-page .client-navigation .favorite-viewed-tab::-webkit-scrollbar {
        display: none;
    }
    .al-supplier-tabs-page .client-navigation .favorite-viewed-tab a {
        flex-shrink: 0;
        margin-right: 0;
        padding: 10px 14px;
        font-size: 13px;
    }
}

/* === SALES STATISTICS — common === */
.al-sales-statistics-page .srs-date-group {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    min-width: 0;
}
.al-sales-statistics-page .srs-date-group .srs-period-select,
.al-sales-statistics-page .srs-period-filter .select2-container {
    min-width: 0;
    max-width: 100%;
}
.al-sales-statistics-page .srs-purchased-surfaces-block {
    margin-top: 24px;
}
.al-sales-statistics-page .srs-calc-cards {
    display: none;
}

/* === SALES STATISTICS TABLET === */
@media (min-width: 769px) and (max-width: 1365px) {
    .al-sales-statistics-page .srs-calc-table-wrap {
        display: none;
    }
    .al-sales-statistics-page .srs-calc-cards {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        gap: 12px;
    }
    .al-sales-statistics-page .srs-calc-card {
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        background: #fff;
        padding: 12px;
    }
    .al-sales-statistics-page .srs-calc-card-city {
        background: #F7F8FC;
        border-color: #D7DCE6;
    }
    .al-sales-statistics-page .srs-calc-card-total {
        background: #EDEFF5;
        border-color: #B8BFD0;
    }
    .al-sales-statistics-page .srs-calc-card-header {
        margin-bottom: 10px;
    }
    .al-sales-statistics-page .srs-calc-card-metrics > div,
    .al-sales-statistics-page .srs-calc-type-metrics > div {
        font-size: 13px;
        line-height: 1.4;
        margin-bottom: 2px;
    }
    .al-sales-statistics-page .srs-calc-card-metrics > div > span,
    .al-sales-statistics-page .srs-calc-type-metrics > div > span {
        color: #8B8F9D;
    }
    .al-sales-statistics-page .srs-calc-type-row {
        border-top: 1px solid #E8EBF1;
        padding-top: 8px;
        margin-top: 8px;
    }
    .al-sales-statistics-page .srs-calc-type-title {
        font-weight: 500;
        margin-bottom: 4px;
    }

    .al-sales-statistics-page .info-block > div[style*="overflow-x"] { overflow-x: visible !important; }
    .al-sales-statistics-page .srs-period-filter { gap: 10px; }

    .al-sales-statistics-page .srs-prices-table,
    .al-sales-statistics-page .srs-prices-table tbody,
    .al-sales-statistics-page .srs-prices-table tr,
    .al-sales-statistics-page .srs-prices-table td { display: block; }
    .al-sales-statistics-page .srs-prices-table thead { display: none; }

    .al-sales-statistics-page .srs-prices-table tbody {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        gap: 12px;
    }
    .al-sales-statistics-page .srs-prices-table tr {
        border: 1px solid #E8EBF1 !important;
        border-radius: 8px;
        padding: 12px;
        background: #fff;
        box-sizing: border-box;
    }
    .al-sales-statistics-page .srs-prices-table tr[style*="display:none"],
    .al-sales-statistics-page .srs-prices-table tr[style*="display: none"] { display: none !important; }

    .al-sales-statistics-page .srs-prices-table td {
        padding: 4px 0 !important;
        background: transparent !important;
        border: 0 !important;
    }
    .al-sales-statistics-page .srs-prices-table td[data-label]::before {
        content: attr(data-label) ": ";
        display: inline-block;
        min-width: 140px;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: normal;
    }
    .al-sales-statistics-page .srs-prices-table td:empty { display: none !important; }

    .al-sales-statistics-page .srs-calc-city-row {
        background: #F7F8FC !important;
        border-color: #D7DCE6 !important;
    }
    .al-sales-statistics-page .srs-calc-total-row {
        background: #EDEFF5 !important;
        border: 1px solid #B8BFD0 !important;
    }
    .al-sales-statistics-page .srs-calc-total-type-row {
        background: #F0F2F7 !important;
        border-color: #CDD4E0 !important;
    }
}

/* === SALES STATISTICS MOBILE === */
@media (max-width: 768px) {
    .al-sales-statistics-page .srs-calc-table-wrap {
        display: none;
    }
    .al-sales-statistics-page .srs-calc-cards {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }
    .al-sales-statistics-page .srs-calc-card {
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        background: #fff;
        padding: 10px 12px;
        box-sizing: border-box;
    }
    .al-sales-statistics-page .srs-calc-card-city {
        background: #F7F8FC;
        border-color: #D7DCE6;
    }
    .al-sales-statistics-page .srs-calc-card-total {
        background: #EDEFF5;
        border-color: #B8BFD0;
    }
    .al-sales-statistics-page .srs-calc-card-header {
        margin-bottom: 8px;
    }
    .al-sales-statistics-page .srs-calc-card-title {
        margin-bottom: 4px;
    }
    .al-sales-statistics-page .srs-calc-card-metrics > div,
    .al-sales-statistics-page .srs-calc-type-metrics > div {
        font-size: 13px;
        line-height: 1.35;
        margin-bottom: 2px;
    }
    .al-sales-statistics-page .srs-calc-card-metrics > div > span,
    .al-sales-statistics-page .srs-calc-type-metrics > div > span {
        color: #8B8F9D;
    }
    .al-sales-statistics-page .srs-calc-type-row {
        border-top: 1px solid #E8EBF1;
        padding-top: 8px;
        margin-top: 8px;
    }
    .al-sales-statistics-page .srs-calc-type-title {
        font-weight: 500;
        margin-bottom: 4px;
    }

    .al-sales-statistics-page .srs-period-filter {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }
    .al-sales-statistics-page .srs-period-filter > .srs-filter-label,
    .al-sales-statistics-page .srs-date-group > .srs-filter-label {
        display: block;
        width: 100%;
        font-weight: 500;
        color: #3D445C;
        margin-bottom: 2px;
    }
    .al-sales-statistics-page .srs-period-filter .srs-period-select {
        width: 100%;
        height: 40px;
        font-size: 14px;
    }
    .al-sales-statistics-page .srs-date-group {
        display: flex;
        flex-direction: column;
        gap: 6px;
        width: 100%;
    }
    .al-sales-statistics-page .srs-period-filter button.btn-main {
        width: 100%;
        height: 42px;
        margin-top: 4px;
    }

    .al-sales-statistics-page .info-block > div[style*="overflow-x"] { overflow-x: visible !important; }

    .al-sales-statistics-page .srs-prices-table,
    .al-sales-statistics-page .srs-prices-table tbody,
    .al-sales-statistics-page .srs-prices-table tr,
    .al-sales-statistics-page .srs-prices-table td { display: block; }
    .al-sales-statistics-page .srs-prices-table thead { display: none; }

    .al-sales-statistics-page .srs-prices-table tbody {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .al-sales-statistics-page .srs-prices-table tr {
        border: 1px solid #E8EBF1 !important;
        border-radius: 8px;
        padding: 10px 12px;
        background: #fff;
        box-sizing: border-box;
    }
    .al-sales-statistics-page .srs-prices-table tr[style*="display:none"],
    .al-sales-statistics-page .srs-prices-table tr[style*="display: none"] { display: none !important; }

    .al-sales-statistics-page .srs-prices-table td {
        padding: 3px 0 !important;
        background: transparent !important;
        border: 0 !important;
        font-size: 13px;
    }
    .al-sales-statistics-page .srs-prices-table td[data-label]::before {
        content: attr(data-label) ": ";
        display: inline-block;
        min-width: 130px;
        color: #8B8F9D;
        font-size: 12px;
    }
    .al-sales-statistics-page .srs-prices-table td:empty { display: none !important; }

    .al-sales-statistics-page .srs-calc-city-row {
        background: #F7F8FC !important;
        border-left: 3px solid #FC6B40 !important;
        padding-left: 8px !important;
    }
    .al-sales-statistics-page .srs-calc-total-row,
    .al-sales-statistics-page .srs-calc-total-type-row {
        background: #EDEFF5 !important;
        border-left: 3px solid #3D445C !important;
        padding-left: 8px !important;
    }

    .al-sales-statistics-page .srs-surface-link { display: inline; word-break: break-all; }
}

/* === SUPPLIER PRICES — common === */
.al-supplier-prices-page .client-tab-data-block {
    box-sizing: border-box;
}
/* Оранжевый чекбокс + текст справа (на всех ширинах) */
.al-supplier-prices-page .orange-checkbox-label,
.al-supplier-form-page .services-label,
.al-supplier-form-page .supplier-type-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-size: 13px;
    color: #3D445C;
    margin: 0;
    line-height: 1.3;
}
.al-supplier-form-page .services-label,
.al-supplier-form-page .supplier-type-item {
    margin-right: 20px;
    margin-bottom: 6px;
}
.al-supplier-prices-page .orange-checkbox-label > input[type="checkbox"],
.al-supplier-form-page .services-label > input[type="checkbox"],
.al-supplier-form-page .supplier-type-item > input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    max-width: 18px !important;
    box-sizing: border-box;
    border: 1px solid #dee5ec;
    border-radius: 3px;
    background: #fafbfc;
    cursor: pointer;
    margin: 0 !important;
    padding: 0;
    position: relative;
    transition: background 0.2s, border-color 0.2s;
    flex: 0 0 18px;
    vertical-align: middle;
}
.al-supplier-prices-page .orange-checkbox-label > input[type="checkbox"]:checked,
.al-supplier-form-page .services-label > input[type="checkbox"]:checked,
.al-supplier-form-page .supplier-type-item > input[type="checkbox"]:checked {
    background: #FC6B40;
    border-color: #FC6B40;
}
.al-supplier-prices-page .orange-checkbox-label > input[type="checkbox"]:checked::after,
.al-supplier-form-page .services-label > input[type="checkbox"]:checked::after,
.al-supplier-form-page .supplier-type-item > input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 5px;
    width: 5px;
    height: 9px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.al-supplier-prices-page .orange-checkbox-label > span {
    flex: 1 1 auto;
    line-height: 1.3;
    vertical-align: middle;
}
/* Отступ сверху у form-rows (add city, add board, extended-values, extended-filter) и компактный лейбл */
.al-supplier-prices-page .client-tab-data-block > form > .field-container {
    margin-top: 16px;
}
.al-supplier-prices-page .client-tab-data-block > form > .field-container > .input-block > label {
    display: block !important;
    margin: 0 0 4px 0 !important;
    padding: 0 !important;
    line-height: 1.3 !important;
}
.al-supplier-prices-page .client-tab-data-block > form > .field-container > .input-block > select,
.al-supplier-prices-page .client-tab-data-block > form > .field-container > .input-block > input[type="text"],
.al-supplier-prices-page .client-tab-data-block > form > .field-container > .input-block > .select2-container {
    margin-top: 0 !important;
    vertical-align: top;
}
/* Обнуляем глобальный .input-block .crm-button { margin-top: 20px } — он ломает вертикальное выравнивание */
.al-supplier-prices-page .client-tab-data-block > form > .field-container .input-block > .crm-button {
    margin-top: 0 !important;
    vertical-align: top;
}

/* Save-кнопка на десктопе и планшете — по правому краю */
@media (min-width: 769px) {
    .al-supplier-prices-page form#suppliers-boards-cost > button.crm-button {
        display: block;
        margin-left: auto;
    }
    /* Селект «Місто» и инпут «ID рекламної площині» — 270px на десктопе+планшете */
    .al-supplier-prices-page .client-tab-data-block > form > .field-container:not(.extended-filter) > .input-block > .select2-container,
    .al-supplier-prices-page .client-tab-data-block > form > .field-container:not(.extended-filter) > .input-block > input[type="text"] {
        width: 270px !important;
    }
}
@media (min-width: 1366px) {
    .al-supplier-prices-page form#suppliers-boards-cost > button.crm-button {
        min-width: 180px;
    }
}

/* === SUPPLIER PRICES TABLET + MOBILE — card-stack для таблиц === */
@media (max-width: 1365px) {
    /* Лог возвращается в нормальный поток под форму */
    .al-supplier-prices-page .prices-log {
        position: static !important;
        width: 100% !important;
        top: auto !important;
        right: auto !important;
        margin-top: 24px;
        padding: 0;
    }
    .al-supplier-prices-page .prices-log > b {
        display: block;
        margin-bottom: 8px;
        font-size: 14px;
    }
    .al-supplier-prices-page .prices-log .log-item .log-title,
    .al-supplier-prices-page .prices-log .log-item .log-data {
        width: 100% !important;
        box-sizing: border-box;
    }

    /* Таблицы → card-stack */
    .al-supplier-prices-page .client-tab-data-block table,
    .al-supplier-prices-page .prices-log .log-data table {
        display: block;
        width: 100%;
        max-width: 100%;
        border-collapse: collapse;
    }
    .al-supplier-prices-page .client-tab-data-block table > tbody,
    .al-supplier-prices-page .prices-log .log-data table > tbody {
        display: block;
        width: 100%;
    }
    /* Скрыть header-строку (первую tr без класса field-container) */
    .al-supplier-prices-page .client-tab-data-block table > tbody > tr:not(.field-container),
    .al-supplier-prices-page .client-tab-data-block table > tr:not(.field-container),
    .al-supplier-prices-page .prices-log .log-data table > tbody > tr:not(.field-container),
    .al-supplier-prices-page .prices-log .log-data table > tr:not(.field-container) {
        display: none;
    }
    /* Скрыть td без data-label (пустые и label-only) */
    .al-supplier-prices-page .client-tab-data-block tr.field-container > td:not([data-label]),
    .al-supplier-prices-page .prices-log .log-data tr.field-container > td:not([data-label]) {
        display: none;
    }
    /* Каждая data-строка = карточка */
    .al-supplier-prices-page .client-tab-data-block tr.field-container,
    .al-supplier-prices-page .prices-log .log-data tr.field-container {
        display: flex;
        flex-direction: column;
        width: 100%;
        padding: 12px;
        box-sizing: border-box;
        background: #fff;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        margin-bottom: 12px;
    }
    /* td с data-label — label слева, значение справа */
    .al-supplier-prices-page .client-tab-data-block tr.field-container > td[data-label],
    .al-supplier-prices-page .prices-log .log-data tr.field-container > td[data-label] {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        width: 100%;
        padding: 4px 0;
        box-sizing: border-box;
    }
    .al-supplier-prices-page .client-tab-data-block tr.field-container > td[data-label]::before,
    .al-supplier-prices-page .prices-log .log-data tr.field-container > td[data-label]::before {
        content: attr(data-label);
        flex: 0 0 auto;
        min-width: 130px;
        color: #8B8F9D;
        font-size: 13px;
        line-height: 1.4;
        padding-top: 2px;
    }
    /* Пустой data-label (td с orange-checkbox) — без лейбла слева, чекбокс+текст на всю ширину */
    .al-supplier-prices-page .client-tab-data-block tr.field-container > td[data-label=""]::before {
        display: none;
    }
    /* input внутри td.input-block — 100% */
    .al-supplier-prices-page .client-tab-data-block tr.field-container > td.input-block[data-label] > input[type="text"] {
        flex: 1 1 auto;
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }
    .al-supplier-prices-page .client-tab-data-block tr.field-container > td.input-block[data-label] > input[type="checkbox"] {
        margin: 4px 0;
    }

    /* Кнопка удалить в заголовке блока city/board */
    .al-supplier-prices-page .del-firm-price-item.crm-button {
        display: inline-block;
        margin: 8px 0;
        padding: 6px 12px;
    }
    .al-supplier-prices-page .boards-prices-block {
        max-width: 100%;
    }
}

/* === SUPPLIER PRICES TABLET (769-1365px) === */
@media (min-width: 769px) and (max-width: 1365px) {
    .al-supplier-prices-page .client-tab-data-block {
        padding-top: 20px;
        padding-bottom: 24px;
    }
    /* tbody — grid 2 колонки карточек */
    .al-supplier-prices-page .client-tab-data-block table > tbody,
    .al-supplier-prices-page .prices-log .log-data table > tbody {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
        gap: 12px;
    }
    .al-supplier-prices-page .client-tab-data-block tr.field-container,
    .al-supplier-prices-page .prices-log .log-data tr.field-container {
        margin-bottom: 0;
    }
    /* Фильтр расширенных — wrap */
    .al-supplier-prices-page .extended-filter {
        display: flex;
        flex-wrap: wrap;
        gap: 10px 8px;
    }
    .al-supplier-prices-page .extended-filter .input-block {
        margin-right: 0;
    }
    .al-supplier-prices-page .extended-filter .input-block .city-select,
    .al-supplier-prices-page .extended-filter .input-block .type-select,
    .al-supplier-prices-page .extended-filter .input-block .format-select {
        width: 180px;
        max-width: 100%;
    }
    .al-supplier-prices-page .extended-filter .input-block .select2-container {
        width: 180px !important;
        max-width: 100%;
    }
    .al-supplier-prices-page .field-container .crm-button.add-city,
    .al-supplier-prices-page .field-container .crm-button.add-board,
    .al-supplier-prices-page .field-container .crm-button.add-extended {
        min-width: 160px;
    }
    .al-supplier-prices-page form#suppliers-boards-cost > button.crm-button {
        min-width: 150px;
    }
}

/* === SUPPLIER PRICES MOBILE (≤768px) === */
@media (max-width: 768px) {
    .al-supplier-prices-page .client-tab-data-block {
        padding-top: 16px;
        padding-bottom: 24px;
    }
    .al-supplier-prices-page .client-tab-data-block b {
        display: block;
        margin-top: 16px;
        margin-bottom: 8px;
        font-size: 14px;
    }
    .al-supplier-prices-page .prices-log {
        margin-top: 20px;
    }
    .al-supplier-prices-page .prices-log > b {
        margin-top: 16px;
    }
    .al-supplier-prices-page .prices-log .log-item .log-title {
        font-size: 13px;
        padding: 8px 10px;
    }
    .al-supplier-prices-page .prices-log .log-item .log-data {
        padding: 8px;
        font-size: 13px;
    }
    /* tbody — одна колонка */
    .al-supplier-prices-page .client-tab-data-block table > tbody,
    .al-supplier-prices-page .prices-log .log-data table > tbody {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    /* Карточки компактнее */
    .al-supplier-prices-page .client-tab-data-block tr.field-container,
    .al-supplier-prices-page .prices-log .log-data tr.field-container {
        padding: 10px;
        margin-bottom: 0;
    }
    /* Лейбл на мобиле — 110px */
    .al-supplier-prices-page .client-tab-data-block tr.field-container > td[data-label]::before,
    .al-supplier-prices-page .prices-log .log-data tr.field-container > td[data-label]::before {
        min-width: 110px;
        font-size: 12px;
    }
    /* Form-rows (add city, add board) — колонка, 100% */
    .al-supplier-prices-page .client-tab-data-block > form > .field-container {
        margin-top: 10px;
    }
    .al-supplier-prices-page .client-tab-data-block > form > .field-container:not(.extended-filter) > .input-block {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
        width: 100%;
    }
    .al-supplier-prices-page .client-tab-data-block > form > .field-container:not(.extended-filter) > .input-block > label {
        margin-bottom: 0;
    }
    .al-supplier-prices-page .client-tab-data-block > form > .field-container:not(.extended-filter) > .input-block > .crm-button {
        margin-top: 0;
    }
    .al-supplier-prices-page .client-tab-data-block > form > .field-container:not(.extended-filter) > .input-block > input[type="text"],
    .al-supplier-prices-page .client-tab-data-block > form > .field-container:not(.extended-filter) > .input-block > select {
        width: 100%;
        box-sizing: border-box;
    }
    /* select2-обёртка — 100% (inline width: 200px перекрываем) */
    .al-supplier-prices-page .client-tab-data-block > form > .field-container:not(.extended-filter) > .input-block > .select2-container {
        width: 100% !important;
        box-sizing: border-box;
    }
    .al-supplier-prices-page .client-tab-data-block > form > .field-container:not(.extended-filter) > .input-block > .crm-button {
        width: 100%;
        text-align: center;
        box-sizing: border-box;
    }
    /* Фильтр расширенных — колонка */
    .al-supplier-prices-page .extended-filter {
        display: flex;
        flex-direction: column;
        gap: 2px;
    }
    .al-supplier-prices-page .extended-filter .input-block {
        margin-bottom: 0;
    }
    .al-supplier-prices-page .extended-filter .input-block > label {
        margin-bottom: 2px !important;
        line-height: 1.3 !important;
    }
    .al-supplier-prices-page .extended-filter .input-block .crm-button {
        margin-top: 4px !important;
    }
    .al-supplier-prices-page .extended-filter .input-block {
        width: 100%;
        margin-right: 0;
    }
    .al-supplier-prices-page .extended-filter .input-block select,
    .al-supplier-prices-page .extended-filter .input-block .crm-button {
        width: 100%;
        box-sizing: border-box;
    }
    .al-supplier-prices-page .extended-filter .input-block .select2-container {
        width: 100% !important;
        box-sizing: border-box;
    }
    /* Save-кнопка формы */
    .al-supplier-prices-page form#suppliers-boards-cost > button.crm-button {
        width: 100%;
        margin-top: 20px;
        box-sizing: border-box;
    }
    .al-supplier-prices-page .attention {
        font-size: 13px;
        padding: 8px;
    }
}

/* === SUPPLIER COMPANIES — desktop === */
.al-supplier-companies-page .client-contacts-header .left-block {
    flex: 1 1 auto;
    min-width: 0;
}
.al-supplier-companies-page .supplier-companies-search-form {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    width: 100%;
}
.al-supplier-companies-page .supplier-companies-search-input {
    flex: 0 0 260px;
    width: 260px;
    max-width: 260px;
    min-width: 260px;
    margin: 0;
    position: relative;
}
.al-supplier-companies-page .supplier-companies-search-input input {
    width: 100%;
    box-sizing: border-box;
}
.al-supplier-companies-page .supplier-companies-search-submit-block {
    width: 180px;
    flex: 0 0 180px;
    margin: 0;
}
.al-supplier-companies-page .supplier-companies-search-submit-block .crm-button {
    width: 100%;
    box-sizing: border-box;
    justify-content: center;
}
.al-supplier-companies-page .client-contacts-header .right-block .btn.submit {
    width: 180px;
    box-sizing: border-box;
    text-align: center;
}
.al-supplier-companies-page .clients-company-data .data-table,
.al-supplier-companies-page .clients-company-data .data-tbody,
.al-supplier-companies-page .clients-company-data .data-tr,
.al-supplier-companies-page .clients-company-data .data-td.action-col {
    overflow: visible;
}
.al-supplier-companies-page .clients-company-data .data-tr {
    position: relative;
}
.al-supplier-companies-page .clients-company-data .data-td.action-col .sub-action {
    top: auto;
    bottom: 54px;
    z-index: 30;
}

/* === SUPPLIER COMPANIES TABLET === */
@media (min-width: 769px) and (max-width: 1365px) {
    .al-supplier-companies-page .supplier-companies-search-input {
        flex: 0 0 260px;
        width: 260px;
        max-width: 260px;
        min-width: 260px;
    }
}

/* === SUPPLIER COMPANIES MOBILE === */
@media (max-width: 768px) {
    .al-supplier-companies-page .client-contacts-header {
        flex-direction: column;
        gap: 10px;
    }
    .al-supplier-companies-page .client-contacts-header .left-block,
    .al-supplier-companies-page .client-contacts-header .right-block {
        width: 100%;
        padding: 0;
    }
    .al-supplier-companies-page .supplier-companies-search-form {
        flex-direction: column;
        align-items: stretch;
        gap: 6px;
        width: 100%;
    }
    .al-supplier-companies-page .supplier-companies-search-form .input-block {
        margin-bottom: 0 !important;
    }
    .al-supplier-companies-page .supplier-companies-search-input .clear-search {
        top: 36px;
        transform: none;
    }
    .al-supplier-companies-page .client-contacts-header .left-block form.search-form,
    .al-supplier-companies-page .supplier-companies-search-input,
    .al-supplier-companies-page .supplier-companies-search-submit-block {
        width: 100%;
        max-width: none;
        min-width: 0;
        flex: 0 0 auto;
        margin: 0 !important;
    }
    .al-supplier-companies-page .client-contacts-header .left-block form.search-form input {
        width: 100%;
        box-sizing: border-box;
    }
    .al-supplier-companies-page .supplier-companies-search-submit-block .crm-button {
        width: 100%;
        margin-top: 0 !important;
        box-sizing: border-box;
    }
    .al-supplier-companies-page .client-contacts-header .right-block .btn.submit {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 42px;
        box-sizing: border-box;
    }
}

/* === CLIENT CONTACTS — common === */
.al-client-contacts-page .client-contacts-header {
    gap: 16px;
    align-items: flex-end;
}
.al-client-contacts-page .client-contacts-header .left-block {
    flex: 1 1 auto;
    min-width: 0;
}
.al-client-contacts-page .client-contacts-search-form {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    width: 100%;
}
.al-client-contacts-page .client-contacts-search-input {
    flex: 0 0 260px;
    width: 260px;
    max-width: 260px;
    min-width: 260px;
    margin: 0;
    position: relative;
}
.al-client-contacts-page .client-contacts-search-input input {
    width: 100%;
    box-sizing: border-box;
}
.al-client-contacts-page .client-contacts-search-submit-block {
    width: 180px;
    height: 42px;
    flex: 0 0 180px;
    margin: 0;
}
.al-client-contacts-page .client-contacts-search-submit-block .crm-button {
    width: 100%;
    height: 42px;
    margin-top: 0 !important;
    box-sizing: border-box;
    justify-content: center;
}
.al-client-contacts-page .client-contacts-header .right-block .contacts-add-link {
    width: 180px;
    box-sizing: border-box;
    justify-content: center;
    text-align: center;
}

/* === CLIENT CONTRACTS SEARCH — common === */
.al-client-contracts-page .client-contacts-header .left-block {
    flex: 1 1 auto;
    min-width: 0;
}
.al-client-contracts-page .client-contracts-search-form {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    width: 100%;
}
.al-client-contracts-page .client-contracts-search-input {
    width: 260px;
    flex: 0 0 260px;
    min-width: 260px;
    max-width: 260px;
    position: relative;
    margin: 0;
}
.al-client-contracts-page .client-contracts-search-input input {
    width: 100%;
    box-sizing: border-box;
}
.al-client-contracts-page .client-contracts-activity-input {
    width: 200px;
    flex: 0 0 200px;
    min-width: 200px;
    margin: 0;
    position: relative;
    z-index: 100;
}
.al-client-contracts-page .client-contracts-activity-input select,
.al-client-contracts-page .client-contracts-activity-input .select2-container {
    width: 100% !important;
}
.al-client-contracts-page .client-contracts-search-submit-block {
    width: 180px;
    flex: 0 0 180px;
    margin: 0;
}
.al-client-contracts-page .client-contracts-search-submit-block .crm-button {
    width: 100%;
    margin-top: 0 !important;
    box-sizing: border-box;
    justify-content: center;
}

/* === CLIENT BILLS SEARCH - common === */
.al-client-bills-page .bills-search-form {
    border-bottom: 1px solid #CDD4D9;
    padding-bottom: 12px;
}
.al-client-bills-page .client-bills-search-form .field-container {
    margin-top: 15px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 10px;
}
.al-client-bills-page .client-bills-search-form .input-block {
    margin-right: 0;
    margin-bottom: 0 !important;
}
.al-client-bills-page .client-bills-search-input {
    width: 260px;
    flex: 0 0 260px;
    min-width: 260px;
    max-width: 260px;
    position: relative;
}
.al-client-bills-page .client-bills-number-input {
    width: 260px;
    flex: 0 0 260px;
    min-width: 260px;
    max-width: 260px;
}
.al-client-bills-page .client-bills-status-input {
    width: 230px;
    flex: 0 0 230px;
    min-width: 230px;
}
.al-client-bills-page .client-bills-year-input,
.al-client-bills-page .client-bills-month-input {
    width: 150px;
    flex: 0 0 150px;
    min-width: 150px;
}
.al-client-bills-page .client-bills-show-deleted-input {
    width: auto;
    flex: 1 1 auto;
    margin-right: auto;
    align-self: flex-end;
    display: flex;
    align-items: flex-end;
}
.al-client-bills-page .client-bills-show-deleted-label {
    display: flex;
    height: 42px;
    align-items: center;
    padding-top: 0;
}
.al-client-bills-page .client-bills-search-submit-block {
    width: 180px;
    flex: 0 0 180px;
    display: flex;
    align-items: flex-end;
    margin-left: auto;
    align-self: flex-end;
}
.al-client-bills-page .client-bills-search-submit-block .crm-button {
    width: 100%;
    height: 42px;
    margin-top: 0 !important;
    box-sizing: border-box;
    justify-content: center;
}
.al-client-bills-page .client-bills-search-form input[type="text"],
.al-client-bills-page .client-bills-search-form select,
.al-client-bills-page .client-bills-search-form .select2-container {
    width: 100% !important;
    box-sizing: border-box;
}

/* === CLIENT CONTACTS TABLET === */
@media (min-width: 769px) and (max-width: 1365px) {
    .al-client-contacts-page .client-contacts-search-input {
        flex: 0 0 260px;
        width: 260px;
        max-width: 260px;
        min-width: 260px;
    }
    .al-client-contracts-page .client-contracts-search-input {
        width: 260px;
        flex: 0 0 260px;
        min-width: 260px;
        max-width: 260px;
    }
    .al-client-bills-page .client-bills-search-input,
    .al-client-bills-page .client-bills-number-input {
        width: calc(50% - 5px);
        flex: 0 0 calc(50% - 5px);
        min-width: calc(50% - 5px);
        max-width: calc(50% - 5px);
    }
    .al-client-bills-page .client-bills-search-submit-block {
        width: 150px;
        flex: 0 0 150px;
    }
}

/* === CLIENT CONTACTS MOBILE === */
@media (max-width: 768px) {
    .al-client-contacts-page .client-contacts-header {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }
    .al-client-contacts-page .client-contacts-header .left-block,
    .al-client-contacts-page .client-contacts-header .right-block {
        width: 100%;
        padding: 0;
    }
    .al-client-contacts-page .client-contacts-search-form {
        flex-direction: column;
        align-items: stretch;
        gap: 6px;
        width: 100%;
    }
    .al-client-contacts-page .client-contacts-search-form .input-block {
        margin-bottom: 0 !important;
    }
    .al-client-contacts-page .client-contacts-search-input {
        flex: 0 0 auto;
        width: 100%;
        min-width: 0;
        max-width: none;
        margin: 0 !important;
    }
    .al-client-contacts-page .client-contacts-search-input .clear-search {
        top: 36px;
        transform: none;
    }
    .al-client-contacts-page .client-contacts-search-submit-block,
    .al-client-contacts-page .client-contacts-search-submit-block .crm-button {
        width: 100%;
        flex: 0 0 auto;
        margin-top: 0 !important;
    }
    .al-client-contacts-page .client-contacts-header .right-block {
        margin-top: 12px;
    }
    .al-client-contacts-page .client-contacts-header .right-block .contacts-add-link {
        width: 100%;
        display: flex;
        align-items: center;
        height: 42px;
    }

    .al-client-contracts-page .client-contracts-search-form {
        flex-direction: column;
        align-items: stretch;
        gap: 6px;
        width: 100%;
    }
    .al-client-contracts-page .client-contracts-search-form .input-block {
        margin-bottom: 0 !important;
    }
    .al-client-contracts-page .client-contracts-search-input,
    .al-client-contracts-page .client-contracts-activity-input,
    .al-client-contracts-page .client-contracts-search-submit-block {
        width: 100%;
        min-width: 0;
        max-width: none;
        flex: 0 0 auto;
        margin: 0 !important;
    }
    .al-client-contracts-page .client-contracts-search-input .clear-search {
        top: 36px;
        transform: none;
    }
    .al-client-contracts-page .client-contracts-search-submit-block .crm-button {
        width: 100%;
        margin-top: 0 !important;
    }

    .al-client-bills-page .client-bills-search-form .field-container {
        gap: 6px;
    }
    .al-client-bills-page .client-bills-search-form .input-block {
        width: 100%;
        min-width: 0;
        max-width: none;
        flex: 0 0 auto;
        margin: 0 !important;
    }
    .al-client-bills-page .client-bills-search-input .clear-search {
        top: 36px;
        transform: none;
    }
    .al-client-bills-page .client-bills-show-deleted-label {
        padding-top: 0;
        min-height: 42px;
    }
.al-client-bills-page .client-bills-search-submit-block .crm-button {
    width: 100%;
    margin-top: 0 !important;
}
}

/* === CLIENT PHOTOREPORTS FILTER === */
.al-client-photoreports-page .photoreport-filter-action-block {
    flex-wrap: wrap;
    gap: 10px 0;
}
.al-client-photoreports-page .photoreport-filter-action-block .header-styles:first-child {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-end;
    gap: 10px;
}
.al-client-photoreports-page .photoreport-filter-action-block .header-styles:first-child .field-container {
    width: 100%;
    flex: 1 1 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0;
}
.al-client-photoreports-page .photoreport-filter-action-block .header-styles:first-child .input-block {
    margin-bottom: 0 !important;
}
.al-client-photoreports-page .photoreport-filter-action-block .header-styles:first-child .photoreports-search-button,
.al-client-photoreports-page .photoreport-filter-action-block .header-styles:first-child .filter-btn-block {
    width: 150px;
    flex: 0 0 150px;
    margin: 0;
}
.al-client-photoreports-page .photoreport-filter-action-block .header-styles:first-child .search-button,
.al-client-photoreports-page .photoreport-filter-action-block .header-styles:first-child .bk-filter-btn {
    width: 100%;
    margin-top: 0 !important;
    justify-content: center;
    box-sizing: border-box;
}
.al-client-photoreports-page .photoreport-filter-action-block .header-styles:first-child .bk-filter-block {
    flex: 0 0 100%;
    /*width: 100%;*/
}
.al-client-photoreports-page .photoreport-filter-action-block .bk-filter-fields .field-container{
    width: 100%;
}
.al-client-photoreports-page .photoreport-filter-action-block .header-styles:nth-child(2) {
    width: 100%;
    padding-top: 0 !important;
}
.al-client-photoreports-page .photoreport-filter-action-block .header-styles:nth-child(2) .switcher-block {
    width: 100%;
    margin: 0;
    display: flex;
    flex-direction: row !important;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
}
.al-client-photoreports-page .photoreport-filter-action-block .header-styles:nth-child(2) .switcher-block .switcher {
    order: 1 !important;
}
.al-client-photoreports-page .photoreport-filter-action-block .header-styles:nth-child(2) .switcher-block .switcher-label {
    order: 2 !important;
}
.al-client-photoreports-page .photoreport-filter-action-block .header-styles:nth-child(3) {
    width: 100%;
    padding-top: 0 !important;
}
.al-client-photoreports-page .photoreport-filter-action-block .header-styles:nth-child(3) .al-selected-filter {
    width: 100%;
    margin: 0;
}

@media (max-width: 768px) {
    .al-client-photoreports-page .photoreport-filter-action-block .header-styles:first-child .field-container,
    .al-client-photoreports-page .photoreport-filter-action-block .header-styles:first-child .filter-btn-block,
    .al-client-photoreports-page .photoreport-filter-action-block .header-styles:first-child .photoreports-search-button {
        width: 100%;
        min-width: 0;
        flex: 0 0 100%;
        margin: 0 !important;
    }
    .al-client-photoreports-page .photoreport-filter-action-block .header-styles:first-child .search-button,
    .al-client-photoreports-page .photoreport-filter-action-block .header-styles:first-child .bk-filter-btn {
        width: 100%;
    }
}

@media (min-width: 769px) {
    .al-client-photoreports-page .photoreport-filter-action-block .header-styles:first-child .field-container {
        width: 260px;
        flex: 0 0 260px;
        min-width: 260px;
        max-width: 260px;
    }
    .al-client-photoreports-page .photoreport-filter-action-block .header-styles .bk-filter-fields .field-container{
        width: 100%;
        min-width: 100%;
        max-width: 100%;
    }
    .al-client-photoreports-page .photoreport-filter-action-block .header-styles .bk-filter-fields .field-container:last-child{
        margin-top: 10px;
    }
}

/* === SUPPLIER CONTACTS — common === */
.al-supplier-contacts-page .clients-contacts-data .data-table,
.al-supplier-contacts-page .clients-contacts-data .data-tbody,
.al-supplier-contacts-page .clients-contacts-data .data-tr {
    overflow: visible;
    position: relative;
}
.al-supplier-contacts-page .clients-contacts-data .data-td.action-col {
    overflow: visible;
    position: relative;
}
.al-supplier-contacts-page .clients-contacts-data .data-td.action-col .leads-row-dropdown {
    right: 0;
    top: auto;
    bottom: calc(100% + 4px);
    z-index: 30;
}
.al-supplier-contacts-page .client-contacts-header {
    gap: 16px;
    align-items: flex-end;
}
.al-supplier-contacts-page .client-contacts-header .left-block {
    flex: 1 1 auto;
    min-width: 0;
}
.al-supplier-contacts-page .supplier-contacts-search-form {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    width: 100%;
}
.al-supplier-contacts-page .supplier-contacts-search-input {
    flex: 0 0 260px;
    width: 260px;
    max-width: 260px;
    min-width: 260px;
    margin: 0;
    position: relative;
}
.al-supplier-contacts-page .supplier-contacts-search-input input {
    width: 100%;
    box-sizing: border-box;
}
.al-supplier-contacts-page .supplier-contacts-search-button {
    width: 150px;
    height: 42px;
    flex: 0 0 150px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

/* === SUPPLIER CONTACTS TABLET === */
@media (min-width: 769px) and (max-width: 1365px) {
    .al-supplier-contacts-page .client-contacts-header .left-block {
        flex: 1 1 auto;
        width: auto;
    }
    .al-supplier-contacts-page .supplier-contacts-search-input {
        flex: 0 0 260px;
        width: 260px;
        max-width: 260px;
        min-width: 260px;
    }
    .al-supplier-contacts-page .clients-contacts-data .data-thead { display: none !important; }
    .al-supplier-contacts-page .clients-contacts-data .data-tbody {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
        gap: 12px;
    }
    .al-supplier-contacts-page .clients-contacts-data .data-tbody > .data-tr {
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 12px 0;
        position: relative;
    }
    .al-supplier-contacts-page .clients-contacts-data .data-tbody > .data-tr > .data-td {
        display: flex;
        align-items: flex-start;
        padding: 4px 16px;
        font-size: 13px;
        flex: unset !important;
        width: auto !important;
        min-width: 0 !important;
    }
    .al-supplier-contacts-page .clients-contacts-data .data-tbody .data-td[data-label]::before {
        content: attr(data-label);
        min-width: 120px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-supplier-contacts-page .clients-contacts-data .data-tbody .data-td.action-col {
        position: absolute;
        top: 8px;
        right: 8px;
        padding: 0 !important;
        width: auto !important;
    }
    .al-supplier-contacts-page .clients-contacts-data .data-tbody .data-td.action-col::before { display: none !important; }
    .al-supplier-contacts-page .clients-contacts-data .data-tbody > .data-tr > .data-td:first-child {
        padding-right: 56px;
    }
}

/* === SUPPLIER CONTACTS MOBILE === */
@media (max-width: 768px) {
    .al-supplier-contacts-page .client-contacts-header {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }
    .al-supplier-contacts-page .client-contacts-header .left-block {
        width: 100%;
        padding: 0;
    }
    .al-supplier-contacts-page .supplier-contacts-search-form {
        flex-direction: column;
        align-items: stretch;
        gap: 6px;
        width: 100%;
    }
    .al-supplier-contacts-page .supplier-contacts-search-input {
        flex: 0 0 auto;
        width: 100%;
        min-width: 0;
        max-width: none;
        margin-bottom: 0 !important;
    }
    .al-supplier-contacts-page .supplier-contacts-search-form .input-block.supplier-contacts-search-input:not(.w260) {
        margin-bottom: 0 !important;
    }
    .al-supplier-contacts-page .supplier-contacts-search-button {
        width: 100%;
        flex: 0 0 auto;
    }
    .al-supplier-contacts-page .client-contacts-header .right-block {
        width: 100%;
        margin-top: 0;
        padding: 0;
    }
    .al-supplier-contacts-page .client-contacts-header .left-block:has(.supplier-contacts-search-form) + .right-block {
        margin-top: 12px;
    }
    .al-supplier-contacts-page .client-contacts-header .right-block .btn {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 42px;
        box-sizing: border-box;
    }
    .al-supplier-contacts-page .clients-contacts-data .data-thead { display: none !important; }
    .al-supplier-contacts-page .clients-contacts-data .data-tbody {
        display: flex !important;
        flex-direction: column;
        gap: 12px;
    }
    .al-supplier-contacts-page .clients-contacts-data .data-tbody > .data-tr {
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 12px 0;
        position: relative;
    }
    .al-supplier-contacts-page .clients-contacts-data .data-tbody > .data-tr > .data-td {
        display: flex;
        align-items: flex-start;
        padding: 4px 16px;
        font-size: 13px;
        flex: unset !important;
        width: auto !important;
        min-width: 0 !important;
    }
    .al-supplier-contacts-page .clients-contacts-data .data-tbody .data-td[data-label]::before {
        content: attr(data-label);
        min-width: 120px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-supplier-contacts-page .clients-contacts-data .data-tbody .data-td.action-col {
        position: absolute;
        top: 8px;
        right: 8px;
        padding: 0 !important;
        width: auto !important;
    }
    .al-supplier-contacts-page .clients-contacts-data .data-tbody .data-td.action-col::before { display: none !important; }
    .al-supplier-contacts-page .clients-contacts-data .data-tbody > .data-tr > .data-td:first-child {
        padding-right: 56px;
    }
}

/* === SUPPLIER CLIENTS — common === */
.al-supplier-clients-page .suppliers-table {
    position: relative;
}
.al-supplier-clients-page .up-down-new {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

/* === SUPPLIER CLIENTS TABLET (769-1365px) === */
@media (min-width: 769px) and (max-width: 1365px) {
    .al-supplier-clients-page .suppliers-table > .suppliers-thead {
        display: none !important;
    }
    .al-supplier-clients-page .suppliers-table > .suppliers-tbody {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
        gap: 12px;
    }
    .al-supplier-clients-page .suppliers-tbody > .supplier-block {
        border: 1px solid #E8EBF1 !important;
        border-radius: 8px;
        padding: 12px 16px;
        box-sizing: border-box;
    }
    .al-supplier-clients-page .supplier-block > .supplier-data-row {
        display: flex !important;
        flex-direction: column;
        align-items: stretch;
        padding: 0 !important;
        position: relative;
    }
    .al-supplier-clients-page .supplier-block > .supplier-data-row > .supplier-col {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        padding: 4px 0 !important;
        flex: unset !important;
    }
    .al-supplier-clients-page .supplier-block > .supplier-data-row > .supplier-col[data-label]::before {
        content: attr(data-label);
        min-width: 140px;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
        flex-shrink: 0;
    }
    .al-supplier-clients-page .supplier-block > .supplier-data-row > .supplier-col.action-col {
        position: absolute;
        top: 0;
        right: 0;
        padding: 0 !important;
        width: auto !important;
        justify-content: flex-end;
    }
    .al-supplier-clients-page .supplier-block > .supplier-data-row > .supplier-col.action-col::before {
        display: none !important;
    }
    .al-supplier-clients-page .supplier-block > .supplier-data-row > .supplier-col:first-child {
        padding-right: 40px !important;
    }
    .al-supplier-clients-page .suppliers-table > .suppliers-tfoot {
        display: flex !important;
        flex-direction: column;
        align-items: stretch;
        margin-top: 12px;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 12px 16px;
        background: #F9F9FA;
    }
    .al-supplier-clients-page .suppliers-tfoot .supplier-col {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        padding: 3px 0 !important;
        flex: unset !important;
    }
    .al-supplier-clients-page .suppliers-tfoot .supplier-col[data-label]::before {
        content: attr(data-label);
        min-width: 140px;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
        flex-shrink: 0;
    }
    .al-supplier-clients-page .suppliers-tfoot .supplier-col.action-col {
        display: none;
    }
    .al-supplier-clients-page .supplier-row-selects {
        padding: 12px 0 0 !important;
    }
    .al-supplier-clients-page .supplier-row-selects > .suppliers-thead {
        display: none !important;
    }
    .al-supplier-clients-page .supplier-row-selects .supplier-row {
        display: flex !important;
        flex-direction: column;
        align-items: stretch;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 10px 14px;
        margin-bottom: 8px;
    }
    .al-supplier-clients-page .supplier-row-selects .supplier-row > .supplier-col {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 4px 8px;
        padding: 3px 0 3px 148px !important;
        flex: unset !important;
        width: 100%;
        box-sizing: border-box;
        position: relative;
        min-height: 20px;
    }
    .al-supplier-clients-page .supplier-row-selects .supplier-row > .supplier-col[data-label]::before {
        content: attr(data-label);
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 140px;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
        line-height: 1.2;
    }
    .al-supplier-clients-page .supplier-row-selects .supplier-row > .supplier-col .informer,
    .al-supplier-clients-page .supplier-row-selects .supplier-row > .supplier-col .informer2,
    .al-supplier-clients-page .supplier-row-selects .supplier-row > .supplier-col .informer-date,
    .al-supplier-clients-page .supplier-row-selects .supplier-row > .supplier-col .informer-form {
        display: inline-flex;
        align-items: center;
        line-height: 1.2;
    }
    .al-supplier-clients-page .supplier-row-selects .supplier-row > .supplier-col br {
        display: none;
    }
    .al-supplier-clients-page .supplier-row-selects .client-company-title {
        margin: 10px 0 6px;
    }
    .al-supplier-clients-page .supplier-row-selects input.supplier-price {
        max-width: 180px;
        width: 100%;
        box-sizing: border-box;
    }
}

/* === SUPPLIER CLIENTS MOBILE (<=768px) === */
@media (max-width: 768px) {
    .al-supplier-clients-page .info-block.select-in-title-block {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }
    .al-supplier-clients-page .info-block.select-in-title-block .info-block-title {
        display: block !important;
        width: 100%;
        margin: 0;
    }
    .al-supplier-clients-page .info-block.select-in-title-block .search-form-select,
    .al-supplier-clients-page .info-block.select-in-title-block select,
    .al-supplier-clients-page .info-block.select-in-title-block .select2,
    .al-supplier-clients-page .info-block.select-in-title-block .select2-container {
        width: 100% !important;
        box-sizing: border-box;
    }
    .al-supplier-clients-page .suppliers-table > .suppliers-thead {
        display: none !important;
    }
    .al-supplier-clients-page .suppliers-table > .suppliers-tbody {
        display: flex !important;
        flex-direction: column;
        gap: 12px;
    }
    .al-supplier-clients-page .suppliers-tbody > .supplier-block {
        padding: 12px;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        background: #fff;
        box-sizing: border-box;
    }
    .al-supplier-clients-page .supplier-block > .supplier-data-row {
        display: flex !important;
        flex-direction: column;
        align-items: stretch;
        padding: 0 !important;
        position: relative;
    }
    .al-supplier-clients-page .supplier-block > .supplier-data-row > .supplier-col {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        padding: 4px 0 !important;
        flex: unset !important;
    }
    .al-supplier-clients-page .supplier-block > .supplier-data-row > .supplier-col[data-label]::before {
        content: attr(data-label);
        min-width: 130px;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
        flex-shrink: 0;
    }
    .al-supplier-clients-page .supplier-block > .supplier-data-row > .supplier-col.action-col {
        position: absolute;
        top: 0;
        right: 0;
        padding: 0 !important;
        width: auto !important;
        justify-content: flex-end;
    }
    .al-supplier-clients-page .supplier-block > .supplier-data-row > .supplier-col.action-col::before {
        display: none !important;
    }
    .al-supplier-clients-page .supplier-block > .supplier-data-row > .supplier-col:first-child {
        padding-right: 40px !important;
    }
    .al-supplier-clients-page .suppliers-table > .suppliers-tfoot {
        display: flex !important;
        flex-direction: column;
        align-items: stretch;
        margin-top: 12px;
        padding: 12px 0 !important;
        border-top: 1px solid #E8EBF1;
    }
    .al-supplier-clients-page .suppliers-tfoot .supplier-col {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        padding: 3px 0 !important;
        flex: unset !important;
    }
    .al-supplier-clients-page .suppliers-tfoot .supplier-col[data-label]::before {
        content: attr(data-label);
        min-width: 130px;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
        flex-shrink: 0;
    }
    .al-supplier-clients-page .suppliers-tfoot .supplier-col.action-col {
        display: none;
    }
    .al-supplier-clients-page .supplier-row-selects {
        padding: 12px 8px 4px 8px !important;
    }
    .al-supplier-clients-page .supplier-row-selects > .suppliers-thead {
        display: none !important;
    }
    .al-supplier-clients-page .supplier-row-selects .supplier-row {
        display: flex !important;
        flex-direction: column;
        align-items: stretch;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 10px 12px;
        margin-bottom: 8px;
    }
    .al-supplier-clients-page .supplier-row-selects .supplier-row > .supplier-col {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 4px 8px;
        padding: 3px 0 3px 138px !important;
        flex: unset !important;
        width: 100%;
        box-sizing: border-box;
        position: relative;
        min-height: 20px;
    }
    .al-supplier-clients-page .supplier-row-selects .supplier-row > .supplier-col[data-label]::before {
        content: attr(data-label);
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 130px;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
        line-height: 1.2;
    }
    .al-supplier-clients-page .supplier-row-selects .supplier-row > .supplier-col .informer,
    .al-supplier-clients-page .supplier-row-selects .supplier-row > .supplier-col .informer2,
    .al-supplier-clients-page .supplier-row-selects .supplier-row > .supplier-col .informer-date,
    .al-supplier-clients-page .supplier-row-selects .supplier-row > .supplier-col .informer-form {
        display: inline-flex;
        align-items: center;
        line-height: 1.2;
    }
    .al-supplier-clients-page .supplier-row-selects .supplier-row > .supplier-col br {
        display: none;
    }
    .al-supplier-clients-page .supplier-row-selects .client-company-title {
        margin: 10px 0 6px;
    }
    .al-supplier-clients-page .supplier-row-selects input.supplier-price {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
}

/* === SUPPLIER DOCS — common === */
.al-supplier-docs-page .clients-contacts-data .data-tr {
    position: relative;
}
.al-supplier-docs-page .clients-contacts-data .data-td.action-col {
    position: relative;
}
.al-supplier-docs-page .clients-contacts-data .data-td.action-col .contract-dwn {
    right: 0;
    top: calc(100% + 4px);
}
/* Клики по дочерним элементам SVG (path/circle) должны доходить до <a.contract-files-dwn>,
   иначе document.click closer в crm.js:4627 закрывает только что открытый dropdown. */
.al-supplier-docs-page .contract-files-dwn svg,
.al-supplier-docs-page .contract-files-dwn svg * {
    pointer-events: none;
}

/* === SUPPLIER DOCS TABLET (769-1365px) === */
@media (min-width: 769px) and (max-width: 1365px) {
    .al-supplier-docs-page .clients-contacts-data .data-thead { display: none !important; }
    .al-supplier-docs-page .clients-contacts-data .data-tbody {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        gap: 12px;
    }
    .al-supplier-docs-page .clients-contacts-data .data-tbody > .data-tr {
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 12px 0;
        position: relative;
    }
    .al-supplier-docs-page .clients-contacts-data .data-tbody > .data-tr > .data-td {
        display: flex;
        align-items: flex-start;
        padding: 4px 16px;
        font-size: 13px;
        flex: unset !important;
        width: auto !important;
        min-width: 0 !important;
    }
    .al-supplier-docs-page .clients-contacts-data .data-tbody .data-td[data-label]::before {
        content: attr(data-label);
        min-width: 140px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-supplier-docs-page .clients-contacts-data .data-tbody .data-td.action-col {
        position: absolute;
        top: 8px;
        right: 8px;
        padding: 0 !important;
        width: auto !important;
    }
    .al-supplier-docs-page .clients-contacts-data .data-tbody .data-td.action-col::before { display: none !important; }
    .al-supplier-docs-page .clients-contacts-data .data-tbody > .data-tr > .data-td:first-child {
        padding-right: 56px;
    }
}

/* === SUPPLIER DOCS MOBILE (≤768px) === */
@media (max-width: 768px) {
    .al-supplier-docs-page .clients-contacts-data .data-thead { display: none !important; }
    .al-supplier-docs-page .clients-contacts-data .data-tbody {
        display: flex !important;
        flex-direction: column;
    }
    .al-supplier-docs-page .clients-contacts-data .data-tbody > .data-tr {
        flex-direction: column;
        border: none;
        border-bottom: 1px solid #E8EBF1;
        border-radius: 0;
        padding: 12px 0;
        position: relative;
    }
    .al-supplier-docs-page .clients-contacts-data .data-tbody > .data-tr > .data-td {
        display: flex;
        align-items: flex-start;
        padding: 4px 16px;
        font-size: 13px;
        flex: unset !important;
        width: auto !important;
        min-width: 0 !important;
    }
    .al-supplier-docs-page .clients-contacts-data .data-tbody .data-td[data-label]::before {
        content: attr(data-label);
        min-width: 130px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-supplier-docs-page .clients-contacts-data .data-tbody .data-td.action-col {
        position: absolute;
        top: 8px;
        right: 8px;
        padding: 0 !important;
        width: auto !important;
    }
    .al-supplier-docs-page .clients-contacts-data .data-tbody .data-td.action-col::before { display: none !important; }
    .al-supplier-docs-page .clients-contacts-data .data-tbody > .data-tr > .data-td:first-child {
        padding-right: 56px;
    }
    .al-supplier-docs-page .pagination-wrapper {
        flex-wrap: wrap;
        gap: 4px;
    }
}

/* === DOCUMENTS STORAGE (/manager/documents) — common === */
.al-documents-storage-page .clients-contracts-data .data-tr {
    position: relative;
}
.al-documents-storage-page .clients-contracts-data .data-td.action-col {
    position: relative;
}
.al-documents-storage-page .clients-contracts-data .data-td.action-col .contract-dwn {
    right: 0;
    top: calc(100% + 4px);
}
.al-documents-storage-page .clients-contracts-data .data-td.action-col .contract-files-dwn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    margin-right: 0;
    line-height: 1;
    border: 1px solid #E0E4EA;
    border-radius: 6px;
}
.al-documents-storage-page .clients-contracts-data .data-td.action-col .contract-files-dwn:hover {
    background: #F6F7F9;
    border-color: #C8CDD8;
}
.al-documents-storage-page .clients-contracts-data .data-td.action-col .contract-files-dwn:active {
    background: #ECEEF2;
    border-color: #B0B6C3;
}
/* SVG clicks should pass to <a.contract-files-dwn> so body click closer in crm.js won't close dropdown immediately. */
.al-documents-storage-page .contract-files-dwn svg,
.al-documents-storage-page .contract-files-dwn svg * {
    pointer-events: none;
}

/* === DOCUMENTS STORAGE TABLET (769-1365px) === */
@media (min-width: 769px) and (max-width: 1365px) {
    .al-documents-storage-page .clients-contracts-data .data-thead { display: none !important; }
    .al-documents-storage-page .clients-contracts-data .data-tbody {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
        gap: 12px;
    }
    .al-documents-storage-page .clients-contracts-data .data-tbody > .data-tr {
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 12px 0;
        position: relative;
        background: #fff;
    }
    .al-documents-storage-page .clients-contracts-data .data-tbody > .data-tr > .data-td {
        display: flex;
        align-items: flex-start;
        padding: 4px 16px;
        font-size: 13px;
        flex: unset !important;
        width: auto !important;
        min-width: 0 !important;
    }
    .al-documents-storage-page .clients-contracts-data .data-tbody .data-td[data-label]::before {
        content: attr(data-label);
        min-width: 140px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-documents-storage-page .clients-contracts-data .data-tbody .data-td.action-col {
        position: absolute;
        top: 8px;
        right: 8px;
        padding: 0 !important;
        width: auto !important;
    }
    .al-documents-storage-page .clients-contracts-data .data-tbody .data-td.action-col::before { display: none !important; }
    .al-documents-storage-page .clients-contracts-data .data-tbody > .data-tr > .data-td:first-child {
        padding-right: 56px;
    }
}

/* === DOCUMENTS STORAGE MOBILE (≤768px) === */
@media (max-width: 768px) {
    .al-documents-storage-page .clients-contracts-data .data-thead { display: none !important; }
    .al-documents-storage-page .clients-contracts-data .data-tbody {
        display: flex !important;
        flex-direction: column;
        gap: 12px;
    }
    .al-documents-storage-page .clients-contracts-data .data-tbody > .data-tr {
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 12px 0;
        position: relative;
        background: #fff;
    }
    .al-documents-storage-page .clients-contracts-data .data-tbody > .data-tr > .data-td {
        display: flex;
        align-items: flex-start;
        padding: 4px 16px;
        font-size: 13px;
        flex: unset !important;
        width: auto !important;
        min-width: 0 !important;
    }
    .al-documents-storage-page .clients-contracts-data .data-tbody .data-td[data-label]::before {
        content: attr(data-label);
        min-width: 130px;
        flex-shrink: 0;
        color: #8B8F9D;
        font-size: 13px;
        font-weight: 400;
    }
    .al-documents-storage-page .clients-contracts-data .data-tbody .data-td.action-col {
        position: absolute;
        top: 8px;
        right: 8px;
        padding: 0 !important;
        width: auto !important;
    }
    .al-documents-storage-page .clients-contracts-data .data-tbody .data-td.action-col::before { display: none !important; }
    .al-documents-storage-page .clients-contracts-data .data-tbody > .data-tr > .data-td:first-child {
        padding-right: 56px;
    }
}

/* === SUPPLIER FORM (add/edit) — common === */
/* Обнуляем старый margin-right у чекбоксов услуг/типов — теперь зазор через gap контейнера */
.al-supplier-form-page .services-label > input[type="checkbox"],
.al-supplier-form-page .supplier-type-item > input[type="checkbox"] {
    margin-right: 0 !important;
}
/* Заголовок страницы — под стиль лидов (crm.css:148) */
.al-supplier-form-page h1.title {
    font-family: 'Helvetica Neue', Helvetica, 'helvetica', Arial, sans-serif;
    font-style: normal;
    font-weight: normal;
    font-size: 34px;
    line-height: 41px;
    padding: 0;
}
/* Блок доп.услуг (add): обёртка-контейнер для wrap-чекбоксов */
.al-supplier-form-page .lead-block-info .input-block > .services-label {
    margin-right: 16px;
    margin-bottom: 8px;
}

/* === SUPPLIER FORM (add/edit) — DESKTOP (≥1366px): container of buttons stretches, flex-end aligns them right === */
.al-supplier-form-page .lead-block-info .field-container.right {
    width: 100%;
    justify-content: flex-end;
}
.al-supplier-form-page .lead-block-info .field-container.right .buttons-block {
    text-align: right;
}

/* === SUPPLIER FORM (edit) — wrappers around contacts (select) and comment (textarea) === */
/* These unclassed wrapper divs limited inner field-container width on tablet/mobile */
.al-supplier-form-page .lead-block-info .al-contacts-row,
.al-supplier-form-page .lead-block-info .al-comment-row {
    width: 100%;
    box-sizing: border-box;
}

/* === SUPPLIER FORM — h2 всегда на своей строке (в т.ч. внутри flex-wrap field-container) === */
.al-supplier-form-page .lead-block-info h2 {
    display: block;
    width: 100%;
    flex-basis: 100%;
}
/* Вложенный .field-container (чекбоксы «Додаткові послуги» / «Тип») — на всю ширину родителя */
.al-supplier-form-page .lead-block-info .field-container > .field-container {
    width: 100%;
    flex-basis: 100%;
}

/* === SUPPLIER FORM — Чекбоксы «Додаткові послуги» / «Тип» в 2 колонки (tablet + desktop) === */
@media screen and (min-width: 769px) {
    .al-supplier-form-page .lead-block-info .field-container > .field-container > .input-block {
        display: flex;
        flex-wrap: wrap;
        gap: 8px 16px;
        width: 100% !important;
        margin-right: 0 !important;
    }
    .al-supplier-form-page .lead-block-info .input-block > .services-label,
    .al-supplier-form-page .lead-block-info .input-block > .supplier-type-item {
        width: calc(50% - 8px);
        margin: 0 !important;
        box-sizing: border-box;
    }
}

/* === SUPPLIER FORM — DESKTOP (≥1366px): city wide-select фиксированной 695px (name 340 + margin 15 + city 695 = 1050 = ширина ряда из 3-х полей ниже) === */
@media screen and (min-width: 1366px) {
    .al-supplier-form-page .lead-block-info .input-block.wide-select {
        width: 695px !important;
        margin-right: 0 !important;
    }
    .al-supplier-form-page .lead-block-info .input-block.wide-select select,
    .al-supplier-form-page .lead-block-info .input-block.wide-select .select2-container {
        width: 100% !important;
    }
}

/* === SUPPLIER FORM — защита от каскадного display:flex у прямых input-block'ов (label должен оставаться над полем) === */
.al-supplier-form-page .lead-block-info .field-container > .input-block {
    display: block;
}
/* Исключение: input-block с чекбоксами услуг/типов внутри (вложенный field-container > input-block) — flex через ниже описанное правило */

/* === SUPPLIER FORM (add/edit) — TABLET (769px-1365px) === */
@media screen and (min-width: 769px) and (max-width: 1365px) {
    .al-supplier-form-page .container.container-base {
        padding: 0 24px;
    }
    /* Поля формы: 2 в ряд */
    .al-supplier-form-page .lead-block-info .field-container .input-block {
        width: calc(50% - 8px);
        margin-right: 15px !important;
        margin-bottom: 15px;
        box-sizing: border-box;
    }
    .al-supplier-form-page .lead-block-info .field-container .input-block:nth-child(2n) {
        margin-right: 0 !important;
    }
    .al-supplier-form-page .lead-block-info .field-container .input-block select,
    .al-supplier-form-page .lead-block-info .field-container .input-block input {
        width: 100%;
        box-sizing: border-box;
    }
    /* Wide-select (cities) — 50% с gap (в паре с name) */
    .al-supplier-form-page .lead-block-info .field-container .input-block.wide-select {
        width: calc(50% - 8px);
        margin-right: 15px !important;
    }
    .al-supplier-form-page .lead-block-info .field-container .input-block.wide-select:nth-child(2n) {
        margin-right: 0 !important;
    }
    .al-supplier-form-page .lead-block-info .field-container .input-block.wide-select select,
    .al-supplier-form-page .lead-block-info .field-container .input-block.wide-select .select2-container {
        width: 100% !important;
    }
    /* Select2 внутри input-block — перебиваем inline 340px */
    .al-supplier-form-page .lead-block-info .input-block .select2-container {
        width: 100% !important;
    }
    /* Textarea */
    .al-supplier-form-page .lead-block-info .textarea-block {
        width: 100%;
    }
    .al-supplier-form-page .lead-block-info .textarea-block textarea {
        width: 100%;
        box-sizing: border-box;
    }
    /* Кнопки Cancel/Save */
    .al-supplier-form-page .lead-block-info .cancel,
    .al-supplier-form-page .lead-block-info .submit {
        min-width: 150px;
    }
    /* Photo-section */
    .al-supplier-form-page .photo-container {
        width: 100%;
    }
    /* Вложенный .input-block (обёртка НДС в add) — не ломает 2-колоночную сетку родителя */
    .al-supplier-form-page .input-block .input-block {
        width: 100%;
        margin: 0;
    }
    /* Блок "Статусы" (edit, role_id=1): селект .w540 на всю ширину */
    .al-supplier-form-page .lead-block-info .w540 {
        width: 100% !important;
    }
    /* Status tab: вертикальный стек (лог + форма — в колонку), поля на 100% */
    .al-supplier-form-page .status-tab,
    .al-supplier-form-page .row-inner-tabs .tabs-content .tabs-item.status-tab.active {
        flex-direction: column !important;
        gap: 16px;
    }
    .al-supplier-form-page .status-tab .status-div {
        width: 100% !important;
    }
    .al-supplier-form-page .status-tab .status-div select.w540 {
        width: 100% !important;
    }
    .al-supplier-form-page .status-tab .comment-container,
    .al-supplier-form-page .status-tab .comment-container .input-block {
        width: 100% !important;
    }
    .al-supplier-form-page .status-tab .comment-container .input-block textarea {
        width: 100% !important;
        box-sizing: border-box;
        padding: 12px 11px;
    }
    /* НДС radio: safety — не выходит за контейнер */
    .al-supplier-form-page .form_toggle {
        max-width: 100%;
    }
    /* === SUPPLIER FORM — TABLET: контейнеры на 100% (кроме .input-block — остаётся 50%) === */
    section.lead-block.al-supplier-form-page .lead-block-info,
    section.lead-block.al-supplier-form-page .lead-block-info form,
    section.lead-block.al-supplier-form-page .lead-block-info > form > div,
    section.lead-block.al-supplier-form-page .field-container,
    section.lead-block.al-supplier-form-page .textarea-block,
    section.lead-block.al-supplier-form-page .status-tab,
    section.lead-block.al-supplier-form-page .status-div,
    section.lead-block.al-supplier-form-page .comment-container,
    section.lead-block.al-supplier-form-page .buttons-block {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    /* === SUPPLIER FORM — TABLET агрессивные перекрытия inline 340/700/w540 === */
    section.lead-block.al-supplier-form-page .input-block select,
    section.lead-block.al-supplier-form-page .input-block input,
    section.lead-block.al-supplier-form-page .input-block textarea:not(.select2-search__field),
    section.lead-block.al-supplier-form-page .textarea-block textarea {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    section.lead-block.al-supplier-form-page .textarea-block textarea,
    section.lead-block.al-supplier-form-page .input-block textarea:not(.select2-search__field) {
        padding: 12px 11px !important;
    }
    section.lead-block.al-supplier-form-page select.w540 {
        width: 100% !important;
        max-width: 100% !important;
    }
    /* Заголовки h2 — блочно */
    section.lead-block.al-supplier-form-page h2 {
        display: block !important;
        width: 100% !important;
    }
    /* Кнопки на планшете — выровнены справа, min-width 150px */
    section.lead-block.al-supplier-form-page .field-container.right {
        justify-content: flex-end !important;
    }
    section.lead-block.al-supplier-form-page .buttons-block {
        display: flex !important;
        justify-content: flex-end !important;
        gap: 12px !important;
    }
    section.lead-block.al-supplier-form-page .buttons-block .cancel,
    section.lead-block.al-supplier-form-page .buttons-block .submit {
        min-width: 150px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }
    /* Comment textarea ("Примітка") — full-width of its field-container */
    section.lead-block.al-supplier-form-page .field-container > .textarea-block {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    section.lead-block.al-supplier-form-page .field-container > .textarea-block > textarea[name="comment"] {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    /* Contact-person & channel selects: half width of their field-container */
    section.lead-block.al-supplier-form-page .field-container > .input-block > select[name="contact_person"],
    section.lead-block.al-supplier-form-page .field-container > .input-block > select[name="channel"] {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
}

/* === SUPPLIER FORM (add/edit) — MOBILE (≤768px) === */
@media screen and (max-width: 768px) {
    body,
    .al-supplier-form-page {
        overflow-x: hidden;
    }
    .al-supplier-form-page .container.container-base {
        padding: 0 16px;
    }
    /* Все поля — 1 колонка, 100% */
    .al-supplier-form-page .lead-block-info .input-block {
        width: 100% !important;
        margin-right: 0 !important;
    }
    .al-supplier-form-page .lead-block-info .input-block select,
    .al-supplier-form-page .lead-block-info .input-block input {
        width: 100% !important;
        box-sizing: border-box;
    }
    .al-supplier-form-page .lead-block-info .input-block.wide-select {
        width: 100% !important;
    }
    .al-supplier-form-page .lead-block-info .input-block.wide-select select,
    .al-supplier-form-page .lead-block-info .input-block.wide-select .select2-container,
    .al-supplier-form-page .lead-block-info .input-block .select2-container {
        width: 100% !important;
    }
    /* Textarea */
    .al-supplier-form-page .lead-block-info .textarea-block {
        width: 100%;
    }
    .al-supplier-form-page .lead-block-info .textarea-block textarea {
        width: 100% !important;
        box-sizing: border-box;
    }
    /* Кнопки Cancel/Save: по 50% с gap */
    .al-supplier-form-page .lead-block-info .field-container.right {
        justify-content: center;
    }
    .al-supplier-form-page .lead-block-info .buttons-block {
        display: flex;
        width: 100%;
        gap: 10px;
        padding-bottom: 15px;
    }
    .al-supplier-form-page .lead-block-info .buttons-block .cancel {
        flex: 1;
        margin-right: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        min-width: 0;
    }
    .al-supplier-form-page .lead-block-info .buttons-block .submit {
        flex: 1;
        box-sizing: border-box;
        min-width: 0;
    }
    /* Photo-section — колонкой */
    .al-supplier-form-page .photo-container {
        width: 100%;
        flex-direction: column;
        align-items: center;
    }
    /* Заголовок — под стиль лидов на мобиле (22/28), без дефолтного padding 30px от main_mngr.css */
    .al-supplier-form-page h1.title {
        font-size: 22px !important;
        line-height: 28px !important;
        padding: 0 !important;
        margin-left: 0 !important;
    }
    /* Вложенный .input-block (НДС в add) */
    .al-supplier-form-page .input-block .input-block {
        width: 100% !important;
        margin: 0;
    }
    /* Блок "Статусы" (edit) */
    .al-supplier-form-page .lead-block-info .w540 {
        width: 100% !important;
    }
    /* Status tab: вертикальный стек, компактный padding, все поля на 100% */
    .al-supplier-form-page .status-tab,
    .al-supplier-form-page .row-inner-tabs .tabs-content .tabs-item.status-tab.active {
        flex-direction: column !important;
        gap: 16px;
        padding: 12px !important;
    }
    .al-supplier-form-page .status-tab .status-div {
        width: 100% !important;
    }
    /* Лог статусов: заголовок/дата/сообщения каждый на своей строке */
    .al-supplier-form-page .status-tab .status-div > span {
        display: block;
    }
    .al-supplier-form-page .status-tab .status-div select.w540 {
        width: 100% !important;
    }
    .al-supplier-form-page .status-tab .comment-container,
    .al-supplier-form-page .status-tab .comment-container .input-block {
        width: 100% !important;
    }
    .al-supplier-form-page .status-tab .comment-container .input-block textarea {
        width: 100% !important;
        box-sizing: border-box;
        padding: 12px 11px;
        margin-top: 4px;
    }
    /* Paginator / message-tab на всякий случай */
    .al-supplier-form-page .form_toggle {
        max-width: 100%;
    }
    /* === SUPPLIER FORM — MOBILE: все контейнеры на 100% === */
    section.lead-block.al-supplier-form-page .lead-block-info,
    section.lead-block.al-supplier-form-page .lead-block-info form,
    section.lead-block.al-supplier-form-page .lead-block-info > form > div,
    section.lead-block.al-supplier-form-page .field-container,
    section.lead-block.al-supplier-form-page .textarea-block,
    section.lead-block.al-supplier-form-page .status-tab,
    section.lead-block.al-supplier-form-page .status-div,
    section.lead-block.al-supplier-form-page .comment-container,
    section.lead-block.al-supplier-form-page .buttons-block {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    /* === SUPPLIER FORM — MOBILE агрессивные перекрытия inline 340/700/w540 === */
    section.lead-block.al-supplier-form-page .input-block select,
    section.lead-block.al-supplier-form-page .input-block input,
    section.lead-block.al-supplier-form-page .input-block textarea:not(.select2-search__field),
    section.lead-block.al-supplier-form-page .textarea-block textarea {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    section.lead-block.al-supplier-form-page .textarea-block textarea,
    section.lead-block.al-supplier-form-page .input-block textarea:not(.select2-search__field) {
        padding: 12px 11px !important;
    }
    section.lead-block.al-supplier-form-page select.w540 {
        width: 100% !important;
        max-width: 100% !important;
    }
    /* Заголовки h2 — всегда блочно и на всю ширину */
    section.lead-block.al-supplier-form-page h2 {
        display: block !important;
        width: 100% !important;
    }
    /* Status-log span: каждая строка отдельно */
    section.lead-block.al-supplier-form-page .status-tab .status-div > span,
    section.lead-block.al-supplier-form-page .status-tab .status-div > b {
        display: block !important;
        width: 100% !important;
    }
    /* Кнопки Cancel/Save: ровно 50/50 с gap */
    section.lead-block.al-supplier-form-page .buttons-block {
        display: flex !important;
        flex-direction: row !important;
        width: 100% !important;
        gap: 10px !important;
        text-align: left !important;
    }
    section.lead-block.al-supplier-form-page .buttons-block .cancel,
    section.lead-block.al-supplier-form-page .buttons-block .submit {
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }
    /* Comment textarea ("Примітка") — parent containers must be full width so textarea stretches */
    section.lead-block.al-supplier-form-page .field-container > .textarea-block {
        width: 100% !important;
        max-width: 100% !important;
        flex: 1 1 100% !important;
        box-sizing: border-box !important;
    }
    section.lead-block.al-supplier-form-page .field-container > .textarea-block > textarea[name="comment"] {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    /* Contact-person & channel selects — parent .input-block stretches so select fills it */
    section.lead-block.al-supplier-form-page .field-container > .input-block:has(> select[name="contact_person"]),
    section.lead-block.al-supplier-form-page .field-container > .input-block:has(> select[name="channel"]) {
        width: 100% !important;
        max-width: 100% !important;
        flex: 1 1 100% !important;
        box-sizing: border-box !important;
    }
    section.lead-block.al-supplier-form-page .field-container > .input-block > select[name="contact_person"],
    section.lead-block.al-supplier-form-page .field-container > .input-block > select[name="channel"] {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
}

/* === SUPPLIER FORM — h1.title: убрать унаследованный padding-left 30px на ≤560px (перекрывает main_mngr.css) === */
@media screen and (max-width: 560px) {
    .al-supplier-form-page h1.title,
    section.lead-block.al-supplier-form-page h1.title {
        padding: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
    }
}

/* === PHOTOREPORTS — common === */
.al-photoreports-page .photoreport-filter-action-block {
    flex-direction: column;
    align-items: stretch;
}
.al-photoreports-page .photoreport-filter-action-block .header-styles {
    justify-content: flex-start;
    align-items: flex-end;
    flex-wrap: wrap;
    row-gap: 10px;
    column-gap: 12px;
}
/* Switcher — always on its own row after search field row */
.al-photoreports-page .header-styles .switcher-block {
    flex-basis: 100%;
    width: 100%;
    margin: 0;
    justify-content: flex-start;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    flex-wrap: nowrap !important;
}
.al-photoreports-page .header-styles .switcher-block .switcher {
    flex: 0 0 auto;
}
.al-photoreports-page .header-styles .switcher-block .switcher-label {
    flex: 0 0 auto;
    margin-top: 0;
    padding-right: 0;
}
.al-photoreports-page .al-selected-filter {
    flex-basis: 100%;
    width: 100%;
    margin: 0;
}
.al-photoreports-page #filter-search {
    padding-right: 35px;
}
.al-photoreports-page .photoreports-clear-search {
    position: absolute;
    right: 15px;
    top: 36px;
    width: 12px;
    height: 12px;
    cursor: pointer;
    z-index: 1;
}
.al-photoreports-page .photoreports-clear-search.hide {
    display: none;
}
.al-photoreports-page .bk-filter-btn svg path,
.al-photoreports-page .bk-filter-btn.has-filters svg path {
    fill: #FC6B40;
}
.al-photoreports-page .bk-filter-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    width: 100%;
    margin-top: 16px;
}
.al-photoreports-page .bk-filter-actions .bk-filter-reset-btn {
    min-width: 150px;
    height: 42px;
}
.al-photoreports-page .bk-filter-actions .crm-button {
    min-width: 150px;
    height: 42px;
}
.al-photoreports-page .bk-filter-fields .field-container {
    margin-bottom: 3px;
}
.al-photoreports-page .bk-filter-fields .input-block {
    width: 100% !important;
    margin-bottom: 3px !important;
    margin-right: 0 !important;
}
.al-photoreports-page .bk-filter-fields .input-block input[type="text"],
.al-photoreports-page .bk-filter-fields .input-block select {
    width: 100% !important;
    max-width: 100%;
    box-sizing: border-box;
    background: #F6F7F9;
    border: 1px solid #CDD4D9;
    height: 42px;
    border-radius: 3px;
    font-size: 13px;
    line-height: 16px;
    color: #3D445C;
    padding: 0 11px;
}
.al-photoreports-page .bk-filter-fields .select2-container {
    width: 100% !important;
}
#result-search-list.al-photoreports-page .result-paginator,
.al-photoreports-page .result-paginator {
    margin-top: 24px !important;
}
#result-search-list.al-photoreports-page .result-paginator .pagination,
#result-search-list.al-photoreports-page .pagination-block,
#result-search-list.al-photoreports-page .pagination-block .pagination,
.al-photoreports-page .result-paginator .pagination,
.al-photoreports-page .pagination-block,
.al-photoreports-page .pagination-block .pagination,
.al-photoreports-page .pagination {
    margin-top: 24px !important;
    margin-bottom: 0 !important;
}

/* === PHOTOREPORTS DESKTOP (≥1366px) === */
@media screen and (min-width: 1366px) {
    .al-photoreports-page .photoreport-filter-action-block .header-styles {
        align-items: flex-end;
    }
    .al-photoreports-page .header-styles .field-container .input-block.big-input-block input#filter-search {
        width: 320px;
    }
    .al-photoreports-page .filter-btn-block {
        width: 180px;
    }
    .al-photoreports-page .filter-btn-block .bk-filter-btn {
        width: 100%;
        box-sizing: border-box;
        justify-content: center;
    }
    .al-photoreports-page .photoreports-search-button.filter-btn-block .search-button {
        width: 100%;
    }
}

/* === PHOTOREPORTS TABLET (769px-1365px) === */
@media screen and (min-width: 769px) and (max-width: 1365px) {
    .al-photoreports-page { overflow-x: hidden; }

    .al-photoreports-page .photoreport-filter-action-block,
    .al-photoreports-page .photoreport-filter-block {
        width: auto !important;
    }

    .al-photoreports-page .photoreport-filter-action-block .header-styles {
        column-gap: 10px;
        row-gap: 10px;
        justify-content: flex-start;
    }
    .al-photoreports-page .header-styles > .field-container {
        flex: 0 0 260px;
        width: 260px;
        min-width: 260px;
        max-width: 260px;
    }
    .al-photoreports-page .header-styles > .field-container .input-block,
    .al-photoreports-page .header-styles > .field-container .input-block input[type="text"] {
        width: 100% !important;
    }
    .al-photoreports-page .filter-btn-block {
        width: 150px;
        flex-shrink: 0;
    }
    .al-photoreports-page .filter-btn-block .bk-filter-btn {
        width: 100%;
        box-sizing: border-box;
        justify-content: center;
    }
    .al-photoreports-page .photoreports-search-button.filter-btn-block .search-button {
        width: 100%;
    }

    /* Table → grid of cards */
    .al-photoreports-page .photoreports-table {
        display: block;
        border-top: none;
    }
    .al-photoreports-page .photoreports-thead { display: none; }
    .al-photoreports-page .photoreports-tbody {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(420px, 1fr));
        gap: 12px;
    }
    .al-photoreports-page .photoreports-row {
        display: flex;
        flex-direction: column;
        position: relative;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 12px 48px 12px 12px;
        background: #fff;
    }
    .al-photoreports-page .photoreports-col {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        padding: 6px 0;
        border-bottom: none;
        width: 100%;
        text-align: left;
        white-space: normal;
    }
    .al-photoreports-page .photoreports-col[data-label]::before {
        content: attr(data-label);
        color: #8B8F9D;
        font-size: 13px;
        min-width: 140px;
        flex-shrink: 0;
    }
    .al-photoreports-page .photoreports-col.photo-col a,
    .al-photoreports-page .photoreports-col.design-col {
        justify-content: flex-start;
        text-align: left;
    }

    /* Kebab card header */
    .al-photoreports-page .photoreports-row .leads-card-header {
        display: block !important;
        position: absolute;
        top: 8px;
        right: 8px;
    }
    .al-photoreports-page .photoreports-row .leads-card-header button.leads-card-more {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 30px; height: 30px;
        background: none;
        border: 1px solid #E0E4EA;
        border-radius: 6px;
        cursor: pointer;
        padding: 0;
    }
    .al-photoreports-page .photoreports-row .leads-card-dropdown {
        position: absolute;
        top: 44px;
        right: 8px;
        display: none;
        background: #fff;
        border: 1px solid #E0E4EA;
        border-radius: 6px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.08);
        z-index: 10;
        min-width: 200px;
    }
    .al-photoreports-page .photoreports-row .leads-card-dropdown.open { display: block; }
    .al-photoreports-page .photoreports-row .leads-card-dropdown-item {
        display: block;
        padding: 10px 14px;
        border-bottom: 1px solid #E8EBF1;
        color: #3D445C;
        cursor: pointer;
        text-decoration: none;
    }
    .al-photoreports-page .photoreports-row .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-photoreports-page .photoreports-row .leads-card-dropdown-item:hover { background: #F6F7F9; }
    .al-photoreports-page .photoreports-col.action-col {
        display: none;
    }
}

/* === PHOTOREPORTS MOBILE (≤768px) === */
@media screen and (max-width: 768px) {
    body, .al-photoreports-page { overflow-x: hidden; }

    .al-photoreports-page .photoreport-filter-action-block,
    .al-photoreports-page .photoreport-filter-block {
        width: auto !important;
    }

    .al-photoreports-page .photoreport-filter-action-block .header-styles {
        flex-direction: column;
        gap: 10px;
        align-items: stretch;
    }
    .al-photoreports-page .header-styles > * { width: 100%; }
    .al-photoreports-page .header-styles .field-container,
    .al-photoreports-page .header-styles .field-container .input-block,
    .al-photoreports-page .header-styles .field-container .input-block input[type="text"] {
        width: 100% !important;
    }
    .al-photoreports-page .filter-btn-block,
    .al-photoreports-page .filter-btn-block .bk-filter-btn,
    .al-photoreports-page .photoreports-search-button,
    .al-photoreports-page .photoreports-search-button .search-button {
        width: 100% !important;
        box-sizing: border-box;
    }

    /* Selected filter badges — 2 per row with gap */
    .al-photoreports-page .al-selected-filter {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }
    .al-photoreports-page .al-selected-filter .selected-filter-item {
        flex: 0 0 calc(50% - 4px);
        box-sizing: border-box;
        position: relative;
        padding-right: 28px;
        margin: 0;
    }
    .al-photoreports-page .al-selected-filter .selected-filter-item img {
        position: absolute;
        right: 8px;
        top: 50%;
        transform: translateY(-50%);
    }

    /* Table → cards (bottom divider, no border/radius) */
    .al-photoreports-page .photoreports-table { display: block; border-top: none; }
    .al-photoreports-page .photoreports-thead { display: none; }
    .al-photoreports-page .photoreports-tbody { display: flex; flex-direction: column; }
    .al-photoreports-page .photoreports-row {
        display: flex;
        flex-direction: column;
        position: relative;
        padding: 12px 48px 12px 0;
        border-bottom: 1px solid #E8EBF1;
    }
    .al-photoreports-page .photoreports-col {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        padding: 4px 0;
        border-bottom: none;
        width: 100%;
        text-align: left;
        white-space: normal;
    }
    .al-photoreports-page .photoreports-col[data-label]::before {
        content: attr(data-label);
        color: #8B8F9D;
        font-size: 13px;
        min-width: 130px;
        flex-shrink: 0;
    }
    .al-photoreports-page .photoreports-col.photo-col a,
    .al-photoreports-page .photoreports-col.design-col {
        justify-content: flex-start;
        text-align: left;
    }

    .al-photoreports-page .photoreports-row .leads-card-header {
        display: block !important;
        position: absolute;
        top: 8px;
        right: 0;
    }
    .al-photoreports-page .photoreports-row .leads-card-header button.leads-card-more {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 30px; height: 30px;
        background: none;
        border: 1px solid #E0E4EA;
        border-radius: 6px;
        cursor: pointer;
        padding: 0;
    }
    .al-photoreports-page .photoreports-row .leads-card-dropdown {
        position: absolute;
        top: 44px; right: 0;
        display: none;
        background: #fff;
        border: 1px solid #E0E4EA;
        border-radius: 6px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.08);
        z-index: 10;
        min-width: 200px;
    }
    .al-photoreports-page .photoreports-row .leads-card-dropdown.open { display: block; }
    .al-photoreports-page .photoreports-row .leads-card-dropdown-item {
        display: block;
        padding: 10px 14px;
        border-bottom: 1px solid #E8EBF1;
        color: #3D445C;
        cursor: pointer;
        text-decoration: none;
    }
    .al-photoreports-page .photoreports-row .leads-card-dropdown-item:last-child { border-bottom: none; }
    .al-photoreports-page .photoreports-col.action-col { display: none; }

    /* Drawer */
    .al-photoreports-page .bk-filter-block {
        width: 100vw !important;
    }
    .al-photoreports-page .bk-filter-actions .bk-filter-reset-btn,
    .al-photoreports-page .bk-filter-actions .crm-button {
        flex: 1 1 0;
        width: 100%;
        min-width: 0;
    }

    .al-photoreports-page h1.title-search-result {
        font-size: 22px;
    }
    .al-photoreports-page .result-paginator {
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media screen and (max-width: 1365px) {
    .al-photoreports-page .photoreports-col.photo-col .custom-bubble-image-container {
        display: inline-flex !important;
        flex: 1 1 auto;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
        min-width: 0;
        margin-top: 0 !important;
    }
    .al-photoreports-page .photoreports-col.photo-col .custom-bubble-image-container > a {
        display: inline-flex;
        flex: 0 0 auto;
        align-items: center;
        margin-left: 0 !important;
    }
    .al-photoreports-page .photoreports-col.photo-col .custom-bubble-image-container > a svg {
        margin-right: 0;
    }
    .al-photoreports-page .photoreports-col.photo-col .photoreports-photo-date {
        flex: 0 0 auto;
        line-height: 18px;
        margin-top: 0 !important;
    }
}

/* === VIEW-SET-STATISTICS — PAGINATION CENTERING === */
.al-vss-page .pagination-block {
    display: flex;
    justify-content: center;
    margin-top: 20px;
}
.al-vss-page .pagination-block .pagination {
    margin: 0 auto;
    flex-wrap: wrap;
    justify-content: center;
}

/* === VIEW-SET-STATISTICS — MOBILE === */
@media (max-width: 768px) {
    .al-vss-page {
        overflow-x: hidden;
    }
    .al-vss-page .container.container-base {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
    .al-vss-page .content-block {
        padding-left: 0;
        padding-right: 0;
    }
    .al-vss-page h1.title-search-result {
        font-size: 20px;
    }

    .al-vss-page .vss-summary-table,
    .al-vss-page .vss-details-table {
        display: block;
        width: 100%;
        table-layout: auto;
        border: 0;
    }
    .al-vss-page .vss-summary-table thead,
    .al-vss-page .vss-details-table thead {
        display: none;
    }
    .al-vss-page .vss-summary-table tbody,
    .al-vss-page .vss-details-table tbody {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }
    .al-vss-page .vss-summary-table tr,
    .al-vss-page .vss-details-table tr {
        display: flex;
        flex-direction: column;
        border: 1px solid #E8EBF1;
        border-radius: 8px;
        padding: 12px;
        background: #fff;
    }
    .al-vss-page .vss-summary-table td,
    .al-vss-page .vss-details-table td {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 8px;
        border: 0;
        padding: 6px 0;
        width: 100% !important;
        word-break: break-word;
    }
    .al-vss-page .vss-summary-table td::before,
    .al-vss-page .vss-details-table td::before {
        content: attr(data-label);
        min-width: 0;
        color: #8B8F9D;
        font-size: 13px;
        flex: 1 1 auto;
        overflow-wrap: anywhere;
    }
    .al-vss-page .vss-cell-value {
        flex: 0 0 auto;
        max-width: 45%;
        margin-left: auto;
        text-align: right;
        overflow-wrap: anywhere;
    }

    .al-vss-page .vss-summary-table tr {
        gap: 4px;
    }
}