:root {
    /* ERP Calm — WorkerNet Design System
       Palette source: design-tokens.css (--erpds-*)
       --main-color-* mapped here so the whole UI follows one token set */
    --main-color-background-grey:      var(--erpds-bg, #FAFAFB);
    --main-color:                      var(--erpds-accent, #3B5BDB);
    --main-color-hover:                var(--erpds-accent-hover, #2D4AC7);
    --main-color-menu-text:            var(--erpds-text, #0F172A);
    --main-color-_sab_menu-text:       var(--erpds-accent, #3B5BDB);
    --main-color-left-menu-icon:       var(--erpds-text-faint, #6B7280);
    --main-color-body-background:      var(--erpds-bg-2, #F2F4F7);
    --main-color-body-background-second: var(--erpds-surface, #ffffff);
    --main-color-text:                 var(--erpds-text, #0F172A);
    --main-color-table-hover:          var(--erpds-accent-soft, #E5EAFB);
    --main-color-button:               var(--erpds-accent, #3B5BDB);
    --main-color-button-text:          #ffffff;
    --main-color-button-hover:         var(--erpds-accent-hover, #2D4AC7);
    --main-color-yellow-info:          #fef3c7;
    --main-color-yellow-info-border:   #b45309;
    --main-color-admin_info:           var(--erpds-ok, #2E8540);
    --main-color-a:                    var(--erpds-accent-text, #2D4AC7);
    --main-color-us-icon:              var(--erpds-text-muted, #525A66);
    --main-color-news_block:           var(--erpds-surface-2, #F6F7F9);
    --main-color-news_block_important: var(--erpds-info-soft, #E0EAF6);
    --main-color-nav_ul_li_ul:         rgba(255, 255, 255, 0.97);
    --main-color-table_item_white:     var(--erpds-surface, #ffffff);
    --main-color-text_table_item_white: var(--erpds-text, #0F172A);
    --main-color_nav_ul_li_a_span:     rgba(15, 23, 42, 0.5);
    --main-color_slider_content:       var(--erpds-surface-2, #F6F7F9);
    --main-color_a_hover_active_focus: var(--erpds-accent-hover, #2D4AC7);

}

@font-face {
    font-family: 'Myriad pro';
    src: url('../fonts/mypro-it-webfont.eot');
    src: url('../fonts/mypro-it-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/mypro-it-webfont.woff') format('woff'),
    url('../fonts/mypro-it-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Myriad pro';
    src: url('../fonts/mypro-regular-webfont.eot');
    src: url('../fonts/mypro-regular-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/mypro-regular-webfont.woff') format('woff'),
    url('../fonts/mypro-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Myriad pro';
    src: url('../fonts/mypro-semibold-webfont.eot');
    src: url('../fonts/mypro-semibold-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/mypro-semibold-webfont.woff') format('woff'),
    url('../fonts/mypro-semibold-webfont.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;

}

@font-face {
    font-family: 'Myriad pro';
    src: url('../fonts/mypro-semiboldit-webfont.eot');
    src: url('../fonts/mypro-semiboldit-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/mypro-semiboldit-webfont.woff') format('woff'),
    url('../fonts/mypro-semiboldit-webfont.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;

}

.us-logo-medium {
    background: url('../picture/logo.png') 0px no-repeat;
}

.date-time-field {
    color: var(--erpds-text, #0F172A);
    font-size: 14px;
    height: 23px;
    line-height: 23px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    outline: none;
    padding: 0 10px;
    padding-right: 10px;
    font-family: var(--erpds-sans);
    background: url('../picture/calendar.svg') 100% 50% no-repeat;
    width: 120px;
}
.date-time-field:focus-visible {
    outline: 2px solid var(--erpds-focus, #2563B8);
    outline-offset: 2px;
}

.date-field {
    color: var(--erpds-text, #0F172A);
    font-size: 14px;
    height: 23px;
    line-height: 23px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    outline: none;
    padding: 0 10px;
    padding-right: 10px;
    font-family: var(--erpds-sans);
    background: url('../picture/calendar.svg') 100% 50% no-repeat;
    width: 100px;
}
.date-field:focus-visible {
    outline: 2px solid var(--erpds-focus, #2563B8);
    outline-offset: 2px;
}

#oper_notify_id {
    position: fixed;
    bottom: 10px;
    right: 10px;
    width: min(440px, calc(100vw - 20px));
    z-index: 9999;
}

.oper_notify_msg {
    width: 100%;
    min-height: 62px;
    background: linear-gradient(180deg, rgba(12, 16, 24, 0.92), rgba(8, 10, 14, 0.88));
    color: #fff;
    border-radius: 10px;
    margin-top: 5px;
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.oper_notify_msg:hover {
    background: linear-gradient(180deg, rgba(10, 14, 20, 0.98), rgba(6, 8, 12, 0.96));
}

/* Severity critical (входящий звонок) — акцентная пульсирующая рамка. */
/* Bounded 5 итераций (~7.5с) → no alarm-fatigue; forced-colors guard для high-contrast. */
.oper-notify--critical {
    border: 2px solid var(--erpds-danger, #c0392b);
    border-radius: 8px;
    animation: operNotifyCriticalPulse 1.5s ease-in-out 5;
}
@keyframes operNotifyCriticalPulse {
    0%   { box-shadow: 0 0 0 0 rgba(192, 57, 43, 0.55); }
    70%  { box-shadow: 0 0 0 8px rgba(192, 57, 43, 0); }
    100% { box-shadow: 0 0 0 0 rgba(192, 57, 43, 0); }
}
@media (prefers-reduced-motion: reduce) {
    .oper-notify--critical {
        animation: none;
        box-shadow: 0 0 0 2px rgba(192, 57, 43, 0.45);
    }
}
@media (forced-colors: active) {
    .oper-notify--critical {
        outline: 3px solid ButtonText;
        animation: none;
    }
}
/* Иконка severity (color-blind доступность — severity не только цветом). */
.oper-notify-icon-critical {
    margin-right: 4px;
}

.oper_notify_msg_title {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
    font-size: 10px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.86);
}

.oper_notify_msg_time,
.oper_notify_msg_ico_time {
    font-weight: 700;
    font-size: 11px;
    color: rgba(255, 255, 255, 0.68);
    white-space: nowrap;
}

.oper_notify_msg_ico {
    display: none;
}

.oper_notify_msg_text {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-height: 62px;
    height: 100%;
    padding: 6px 10px 8px;
}

.oper_notify_msg_body {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.oper_notify_msg_body--compact {
    gap: 2px;
}

.oper_notify_body_label {
    display: inline-block;
    font-size: 11px;
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: 0;
    color: rgba(114, 235, 191, 0.95);
    text-transform: uppercase;
}

.oper_notify_msg_meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    padding-bottom: 2px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.oper_notify_msg_phone {
    line-height: 1.05;
    margin-bottom: 1px;
}

.oper-notify-phone {
    font-size: 17px;
    color: #ffffff;
    text-decoration: none;
    font-weight: 700;
}

.oper-notify-phone:hover {
    color: #ffffff;
    text-decoration: underline;
}

.oper_notify_msg_body_text {
    color: rgba(255, 255, 255, 0.90);
    line-height: 1.35;
    font-size: 11px;
    word-break: break-word;
}

.oper_notify_msg_actions {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
    align-items: center;
}

.oper_notify_msg_actions--inline {
    flex-wrap: nowrap;
    white-space: nowrap;
    align-items: stretch;
    margin-top: 0;
}

.oper-notify-action {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    min-height: 24px;
    padding: 3px 7px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.07);
    color: #fff;
    text-decoration: none;
    font-size: 10px;
    line-height: 1;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.oper_notify_msg_actions--inline .oper-notify-action {
    line-height: 1;
}

.oper-notify-action:hover {
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
}

.oper-notify-action--primary {
    background: rgba(91, 187, 255, 0.14);
    border-color: rgba(91, 187, 255, 0.22);
}

.oper_notify_msg_actions--inline .oper-notify-action {
    flex: 0 0 auto;
}

.oper_notify_msg_actions--inline .oper-notify-action i {
    font-size: 10px;
}

.oper-notify-action--primary:hover {
    background: rgba(91, 187, 255, 0.24);
}

.oper_notify_close a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
}

.oper_notify_close a:hover {
    background: rgba(255, 255, 255, 0.16);
}

@media (max-width: 480px) {
    #oper_notify_id {
        right: 8px;
        left: 8px;
        width: auto;
    }

    .oper_notify_msg_head,
    .oper_notify_msg_text {
        padding-left: 8px;
        padding-right: 8px;
    }

    .oper_notify_msg_actions {
        flex-wrap: wrap;
        flex-direction: column;
    }

    .oper_notify_msg_actions--inline {
        white-space: normal;
    }

    .oper_notify_msg_phone {
        margin-bottom: 0;
    }

    .oper-notify-action {
        width: 100%;
        justify-content: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .oper-notify--critical {
        animation: none;
    }
}
/* Screen-reader only (если не задан в design-системе). */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.employee_notify_task_new_comment {
    background-color: #408080;
    border: 1px solid #800080
}

.employee_notify_task_new_comment:hover {
    background-color: rgba(64, 128, 128, 0.7);
}

.employee_notify_task_employee_assignment {
    background-color: #800080;
    border: 1px solid #800080
}

.employee_notify_task_employee_assignment:hover {
    background-color: rgba(128, 0, 128, 0.7);
}

.oper_notify_msg_ico_href {
    color: #fff;
}

.oper_notify_msg_ico_href:hover {
    color: #fff;
}

.oper_notify_msg_ico_href:visited {
    color: #fff;
}

.oper_notify_msg_ico1 {
    background: url('../picture/phone_green.svg') no-repeat center 0px;
}

.oper_notify_msg_text a {
    color: #BDEBFF;
}

.oper_notify_msg_text a:hover {
    color: #5ACBFF;
}

.notify_caption {
    font-weight: bold;
    text-transform: uppercase;
}

.notify_caption1 {
    color: var(--erpds-ok, #2E8540);
}

.c_attach_div {
    width: 100%;
    position: relative;
    margin-top: 5px;
    margin-bottom: 5px;
    display: inline-block;
    min-height: 40px;
}

.c_attach_div .c_attach_div_left {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 30px;
    height: 100%;
    background-color: var(--erpds-border, #DDE1E8);
    border-radius: 6px 0px 0px 6px;
    min-height: 40px;
}

.c_attach_div .c_attach_div_left span {
    padding-top: 15px;
    padding-left: 5px;
}

.c_attach_div .c_attach_div_right {
    background: var(--erpds-surface-2, #F6F7F9);
    border-radius: 0px 6px 6px 0px;
    padding: 5px;
    padding-left: 35px;
    display: inline-block;
    min-height: 40px;
    border: 1px solid var(--erpds-border, #DDE1E8);
}

.c_attach_div .c_attach_div_right_new {
    background: var(--erpds-surface-2, #F6F7F9);
    border-radius: 0px 6px 6px 0px;
    padding: 5px;
    display: block;
    width: 100%;
    box-sizing: border-box;
    min-height: 40px;
    border: 1px solid var(--erpds-border, #DDE1E8);
}

.c_attach_div .c_attach_div_empty {
    display: inline-block;
}

.c_attach_frame_div {
    border: 1px solid var(--erpds-border, #DDE1E8);
    color: var(--erpds-text, #0F172A);
    background: var(--erpds-surface-2, #F6F7F9);
    padding: 3px;
    width: 400px;
}

.c_attach_frame_div_top {
    display: inline-block;
    position: relative;
    width: 100%;
    min-height: 45px;
}

.c_attach_frame_div_left {
}

.c_attach_frame_div_right {
    padding-top: 10px;
    position: absolute;
    text-align: right;
    right: -5px;
    top: -10px;
    width: 200px;
}

.c_attach_frame_div_info {
    font-size: 11px;
    height: 17px;
    overflow: hidden;
}

.lk_link_promise_span_info {
    font-size: 7pt;
}

footer {
    padding: 16px 0;
    margin-top: 12px;
    border-top: 1px solid var(--erpds-border, #DDE1E8);
    position: relative;
}

footer #down_copy {
    color: var(--erpds-text-muted, #525A66);
    font-size: 13px;
}

footer #down_copy a {
}

footer #down_support {
    width: 150px;
    height: 18px;
    background: var(--main-color);
    color: var(--main-color-text);
    padding-top: 3px;
    padding-left: 7px;
    padding-bottom: 3px;
    display: block;
    position: absolute;
    text-align: right;
    right: 0;
    top: 10px;
}

footer #down_support a {
    text-decoration: none;
    color: var(--main-color-text);
}

footer #down_support i {
    color: var(--main-color-text);
}

footer #down_support:hover {
    background: var(--erpds-text-muted, #525A66);
}

footer #down_support_div {
    width: 500px;
    position: fixed;
    right: 10px;
    bottom: 10px;
    background-color: var(--main-color);
    color: var(--main-color-text);
    padding: 5px;
}

footer #down_support_div ul {
    list-style: square inside;
    padding-bottom: 10px;
}

footer #down_support_div ul li {
    margin: 5px;
}

footer #down_support_div a {
    color: var(--main-color-text);
}

footer #down_support_div a:hover {
    color: rgba(255,255,255,0.75);
}

footer #down_support_div h2 {
    font-size: 16px;
    font-weight: bold;
    text-transform: uppercase;
    margin-top: -5px;
    margin-bottom: 2px;
}

footer #down_support_div #down_support_cancel {
    position: absolute;
    right: 10px;
    top: 5px;
    padding-right: 20px;
}

footer #down_finishinfo {
    display: block;
    position: absolute;
    right: 0;
    margin-right: 170px;
    padding: 2px;
    font-size: 8pt;
    top: 25px;
    color: #fff;
}

footer #down_finishinfo_full {
    display: block;
    position: relative;
    float: right;
    right: 0;
    margin-right: 170px;
    padding: 2px;
    top: -40px;
    font-size: 9pt;
    background-color: var(--erpds-surface-2, #F6F7F9);
    border: 1px solid var(--erpds-border, #DDE1E8);
}

footer #down_finishinfo2_full {
    top: 20px;
    padding: 10px;
    position: relative;
    background-color: var(--erpds-surface-2, #F6F7F9);
    border: 1px solid var(--erpds-border, #DDE1E8);
    width: 400px;
}

.geo_list_check_el {
    background: url('../picture/check.png') 0px no-repeat;
}

/*
Стили для личного кабинета
==================================================================================================================
*/

.lk_menu {
    display: inline-block;
}

.lk_menu_punkt {
    background: rgba(0, 0, 0, 0.15);
    float: left;
    height: 110px;
    width: 220px;
    margin: 20px;
    padding: 10px;
    box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.3);
    border-radius: 6px;
}

.lk_menu_punkt:hover {
    background: rgba(0, 0, 0, 0.1);
}

.lk_menu_punkt_inside {
    background: var(--main-color-hover);
    width: 100%;
    height: 100%;
    box-shadow: inset 0px 0px 2px rgba(0, 0, 0, 0.3);
    position: relative;
}

.lk_menu_punkt_inside:hover {
    background: var(--main-color);
    cursor: pointer;
}

.lk_menu_punkt_inside_link {
    padding: 5px;
    font-weight: bold;
    font-size: 13pt;
    text-align: center;
    position: relative;
    top: 10px;
}

.lk_menu_punkt_inside_link a {
    color: #fff;
    text-decoration: none;
}

.lk_menu_punkt_inside_link a:hover {
    color: #fff;
}

.lk_link_default {
    width: 48px;
    height: 48px;
    position: relative;
    top: 10px;
    left: 50%;
    margin-left: -24px;
}

.lk_netdata {
    display: inline-block;
    width: 100%;
    height: 190px;
}

.lk_netdata .lk_netdata_text {
    float: left;
}

.lk_netdata .lk_netdata_text_link {
    cursor: pointer;
}

.lk_netdata .lk_netdata_text .lk_netdata_text_link .lk_netname {
    position: relative;
    top: 15px;
    height: 40px;
    font-weight: bold;
    font-size: 45pt;
    color: var(--main-color);
}

.lk_netdata .lk_netdata_text .lk_netdata_text_link .lk_lk_text {
    position: relative;
    top: 10px;
    font-weight: bold;
    color: var(--erpds-text-muted, #525A66);
    height: 20px;
    font-size: 20pt;
}

.lk_netdata .lk_netdata_text .lk_lk_userdata {
    position: relative;
    top: 25px;
}

.lk_netdata .lk_logo {
    width: 128px;
    height: 128px;
    left: 100%;
    top: 10px;
    margin-left: -135px;
    margin-bottom: 12px;
    position: relative;
}

.lk_main_content_inside {
}

#lk_notify_all {
    margin: 12px 0px;
}

#lk_notify_all .lk_notify_custom {
    padding: 12px 14px;
    margin-bottom: 12px;
    background: var(--erpds-ok-soft, #E5F1E6);
    border-left: 3px solid var(--erpds-ok, #2E8540);
}

#lk_notify_all .lk_notify_custom h3 {
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
}

#lk_notify_all .lk_notify_custom .text {
    margin-top: -10px;
    margin-bottom: 10px;
}

#lk_notify_all .lk_notify_custom a {
    color: var(--main-color);
}

#lk_notify_all .lk_notify_custom a:hover {
    color: var(--erpds-text-muted, #525A66);
}

.lk_label_top {
    color: var(--erpds-text-muted, #525A66);
    font-size: 20px;
    margin-top: 12px;
    margin-bottom: 8px;
    font-weight: bold;
}

.link_lk_addcard {
}

.link_lk_online {
}

.link_lk_promise {
}

/* ------------------------------------ */
/* -----------Левое меню------------ */
/* ------------------------------------ */

nav {
    border-right: 1px solid var(--erpds-border, #DDE1E8);
    min-width: 250px;
}


nav ul {
    list-style: none;
}

nav ul li {
    -webkit-transition: all 2s ease-in-out;
    -moz-transition: all 2s ease-in-out;
    transition: all 2s ease-in-out;
}

nav ul li a {
    color: var(--main-color-menu-text);
    font-size: 12.5px;
    font-weight: 500;
    text-decoration: none;
    display: flex;
    align-items: center;
    padding: 7px 10px 7px 16px;
    border-radius: 8px;
    margin: 1px 4px;
    transition: background 0.10s ease, color 0.10s ease;
    background-position: 16px 54%;
    background-repeat: no-repeat;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

nav ul li a span {
    float: right;
    color: var(--main-color_nav_ul_li_a_span);
    font-size: 13px;
    margin-right: 10px;
}

nav ul li a .span_second {
    float: right;
    color: var(--main-color);
    font-size: 13px;
    margin-right: 20px;
}

/*nav#nav_id.nav_short {*/
/*    !*position: absolute;*!*/
/*    width: 30px;*/
/*    border-right: 1px solid #E7E3E7;*/
/*    min-width: unset;*/
/*}*/

/*.nav_short span {*/
/*    display: none;*/
/*}*/

#mywork_blink {
    color: var(--erpds-bad, #B62A26);
    font-weight: bold;
}

nav ul li a:hover {
    background-color: var(--erpds-bg-2, #F2F4F7);
    color: var(--main-color-menu-text);
}

nav ul li ul {
    padding-left: 10px;
    margin-right: 0;
    width: auto;
    box-sizing: border-box;
    box-shadow: 0 4px 16px -4px rgba(15,23,42,0.12), 0 1px 3px rgba(15,23,42,0.06) !important;
    border-radius: 12px !important;
    border: 1px solid var(--erpds-border, #DDE1E8);
    background: var(--main-color-nav_ul_li_ul);
    padding-block: 3px;
}

nav ul li ul li {
    /* list-style: circle; */
    color: var(--main-color-left-menu-icon);
    margin-top: 1px;
    /*list-style: none;*/
}

nav ul li ul li:hover {
    color: var(--erpds-text-muted, #525A66);
}

nav ul li ul li a {
    color: var(--main-color-_sab_menu-text);
    font-size: 12px;
    font-weight: 500;
    text-decoration: none;
    display: flex;
    align-items: center;
    padding: 5px 8px 5px 10px;
    border-radius: 6px;
    border-bottom: none;
    transition: background 0.10s ease;
}

nav ul li ul li a:hover {
    background: var(--erpds-bg-2, #F2F4F7);
    text-decoration: none;
}

nav ul li:hover ul {
}

nav ul li.active a {
    background-color: var(--erpds-accent-soft, #E5EAFB);
    color: var(--erpds-accent-text, #2D4AC7);
    border: none;
    background-position: 5px 50%;
    background-repeat: no-repeat;
    font-weight: 600;
}

/* Active state via span_bold class on <a> (used by BodyHtml.php) */
nav ul li a.span_bold {
    background-color: var(--erpds-accent-soft, #E0EAF6);
    color: var(--erpds-accent, #3B5BDB);
    font-weight: 600;
}

/* Desktop menu-separator: subtle top border between nav sections */
nav ul li.menu-separator {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid var(--erpds-border, #DDE1E8);
}

nav ul li a.i0 {
    cursor: pointer;
}

.paging {
    margin: 20px 0;
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

.paging .current {
    font-weight: 600;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    height: 28px;
    border: 1px solid var(--erpds-accent, #3B5BDB);
    background: var(--erpds-accent-soft, #E5EAFB);
    color: var(--erpds-accent, #3B5BDB);
    border-radius: 8px;
    margin-left: 0;
}

.paging .links {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 4px;
    padding: 0;
}

.paging .links a {
    border: 1px solid var(--erpds-border, #DDE1E8);
    font-weight: 500;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    height: 28px;
    border-radius: 8px;
    margin-left: 0;
    color: var(--erpds-text, #0F172A);
    transition: background 0.1s ease, border-color 0.1s ease;
}

.paging .links a:hover {
    background: var(--erpds-accent-soft, #E5EAFB);
    border-color: var(--erpds-accent, #3B5BDB);
    color: var(--erpds-accent, #3B5BDB);
}

.paging .links a:last-child {
}

.paging .links a.left {
    margin-bottom: 0;
}

.paging .links a.left:hover {
    margin-bottom: 0;
}

.paging .links a.right {
    margin-bottom: 0;
}

.page-right {

}

.calendar_all {
    vertical-align: top;
}

.calendar_all_wrapper {
    overflow-x: auto;
    width: 100%;
    -webkit-overflow-scrolling: touch;
    /* Умные тени для индикации прокрутки */
    background:
        linear-gradient(to right, var(--main-color-body-background-second) 30%, rgba(255, 255, 255, 0)),
        linear-gradient(to right, rgba(255, 255, 255, 0), var(--main-color-body-background-second) 70%) 100% 0,
        radial-gradient(farthest-side at 0 50%, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)),
        radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)) 100% 0;
    background-repeat: no-repeat;
    background-color: var(--main-color-body-background-second);
    background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%;
    background-attachment: local, local, scroll, scroll;
}

.calendar_all td {
    padding: 5px;
}

.calendar_all .calendar_header .current_date {
    background: var(--main-color);
    color: #fff;
}

.calendar_all .calendar_header .current_date a {
    color: #fff;
}

.calendar_all .calendar_item_hour {
    width: 40px;
    text-align: right;
    border-right: 1px dashed var(--erpds-border, #DDE1E8);
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
}

.calendar_all .calendar_item_element {
    vertical-align: top;
    border-right: 1px dashed var(--erpds-border, #DDE1E8);
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
}

.calendar_all .calendar_item_element_hover:hover {
    background: var(--erpds-accent-soft, #E0EAF6);
}

.calendar_all .item .current_date {
    background-color: var(--erpds-accent-soft, #E0EAF6);
    border-right: 1px solid var(--main-color);
    border-left: 1px solid var(--main-color);
}

.calendar_all .item .current_date_doing {
    background-color: var(--erpds-accent-soft, #E0EAF6);
    border-right: 1px solid var(--main-color);
    border-left: 1px solid var(--main-color);
}

.calendar_all .item .current_date_doing:hover {
    background-color: var(--main-color-table-hover, #E5EAFB);
}

.calendar_all .item .current_hour {
    text-decoration: none;
    padding-left: 20px;
}

.calendar_header_date {
    padding: 10px;
    border-bottom: 3px solid var(--erpds-border, #DDE1E8);
}

.calendar_all .calendar_header_date {
    padding: 4px 6px;
    line-height: 1.15;
    vertical-align: middle;
    white-space: nowrap;
    text-align: center;
    font-size: 12px;
}

.calendar_header_date .erpds-calendar-day-head {
    display: inline;
    white-space: nowrap;
}

.calendar_header_date .erpds-calendar-day-date {
    font-size: 13px;
    font-weight: 700;
    margin-right: 4px;
}

/* День недели вторичен — дата доминирует (раньше оба были 700, читались плоско). */
.calendar_header_date .erpds-calendar-day-name {
    font-weight: 500;
    font-size: 11px;
    color: var(--erpds-text-secondary, #5F5E5A);
}

/* Выходные (Сб/Вс) — приглушённый фон шапки, чтобы выделялись при сканировании.
   :not(.current_date) — «сегодня» сохраняет свой акцент, даже если это выходной. */
.calendar_all .calendar_header_date.erpds-calendar-day--weekend:not(.current_date) {
    background: color-mix(in srgb, var(--erpds-text, #0F172A) 6%, var(--erpds-surface-2, #f4f5f7));
}
.calendar_all .calendar_header_date.erpds-calendar-day--weekend:not(.current_date) .erpds-calendar-day-name {
    color: var(--erpds-danger, #B62A26);
}
/* «Сегодня» — синий фон, текст белый; день недели не должен оставаться серым. */
.calendar_all .calendar_header .current_date .erpds-calendar-day-name {
    color: #fff;
}

.calendar_header_date .erpds-calendar-day-menu {
    margin: 0 3px;
}

.calendar_header_date .erpds-calendar-weather {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    margin: 0 0 0 3px;
    line-height: 1;
    white-space: nowrap;
    vertical-align: middle;
}

.calendar_header_date .erpds-calendar-weather-icon {
    width: 24px !important;
    height: 24px !important;
    display: block;
}

.calendar_header_date .erpds-calendar-weather-temp {
    font-size: 13px;
    line-height: 1;
    font-weight: 600;
    white-space: nowrap;
}

.calendar_all .item .current_date_hour {
    border: 3px dotted var(--main-color);
}

.calendar_all .item .current_date_hour2 {
    background: var(--erpds-accent-soft, #E0EAF6);
}

.calendar_all .item .current_date_hour2_hover {
    background: var(--erpds-accent-soft, #E0EAF6);
}

.calendar_all .item .current_date_hour2_hover:hover {
    background: var(--main-color-table-hover, #E5EAFB);
}

.calendar_all .calendar_item_element .busy_hour {
    text-align: center;
    font-weight: bold;
    border: var(--erpds-border, #DDE1E8) solid 1px;
}

.calendar_all .calendar_item_element .work_hour {
    /* background: #FFFFDE; */
    border: var(--erpds-warn, #E8A020) solid 3px;
    margin-bottom: 1px;
    padding: 3px;
}

.calendar_all .calendar_item_element .doing_hour {
    border: var(--erpds-ok, #2E8540) solid 3px;
    font-style: italic;
    padding-right: 16px;
    margin-bottom: 1px;
    padding: 3px;
}

.calendar_all .calendar_item_element .erpds-calendar-task-card {
    color: inherit;
    box-sizing: border-box;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}

.calendar_all .calendar_item_element .erpds-calendar-task-card a {
    color: inherit;
}

.calendar_all .calendar_item_element .erpds-calendar-task-card a:hover {
    text-decoration: underline;
}

.calendar_all .calendar_item_element .putback_hour {
    border: var(--erpds-text, #0F172A) solid 2px;
    font-style: italic;
    padding-right: 16px;
    margin-bottom: 1px;
    padding: 3px;
    background-color: var(--erpds-surface-2, #F6F7F9);
    color: var(--erpds-text, #0F172A);
}

.calendar_all .calendar_day_col {
    width: 13.5%;
}

/* === Редизайн карточки задачи календаря (направление A) === */
/* Сила тинта типа на карте — крутится одной строкой. 8% было слишком бледно
   (типы сливались, жалобы операторов), 22% — типы «фонят», но без крика. */
:root {
    --erpds-cal-type-tint: 30%;
}
/* Нейтральная подложка с мягким тинтом по цвету типа. 2 строки фоллбэка обязательны. */
.calendar_all .calendar_item_element .erpds-calendar-task-card {
    background: var(--erpds-surface, #fff);
    background: color-mix(in srgb, var(--erpds-task-type-color, transparent) var(--erpds-cal-type-tint, 22%), var(--erpds-surface, #fff));
    border-radius: var(--erpds-radius-sm, 4px);
    padding: 6px 8px;
    min-height: 56px;
    box-shadow: none;
}

.calendar_all .calendar_item_element .erpds-calendar-task-card + .erpds-calendar-task-card {
    margin-top: 4px;
}

/* Гасим шумные толстые статус-рамки старого вида — нейтральная рамка 1px. */
.calendar_all .calendar_item_element .work_hour,
.calendar_all .calendar_item_element .doing_hour,
.calendar_all .calendar_item_element .putback_hour {
    border: 1px solid var(--erpds-border, #DDE1E8);
    font-style: normal;
    padding: 6px 8px;
}

/* Статус = левая полоса. Максимум 3 цвета (амбер/зелёный/красный) + серый;
   holded vs cancelled различает иконка. */
.calendar_all .calendar_item_element .erpds-calendar-task-card.hour-sysrole-run,
.calendar_all .calendar_item_element .erpds-calendar-task-card.hour-sysrole-unfinished {
    border-left: 3px solid var(--erpds-warn, #E8A020);
    border-radius: 0 var(--erpds-radius-sm, 4px) var(--erpds-radius-sm, 4px) 0;
}

.calendar_all .calendar_item_element .erpds-calendar-task-card.hour-sysrole-successful {
    border-left: 3px solid var(--erpds-ok, #2E8540);
    border-radius: 0 var(--erpds-radius-sm, 4px) var(--erpds-radius-sm, 4px) 0;
}

.calendar_all .calendar_item_element .erpds-calendar-task-card.hour-sysrole-failed {
    border-left: 3px solid var(--erpds-danger, #D7263D);
    border-radius: 0 var(--erpds-radius-sm, 4px) var(--erpds-radius-sm, 4px) 0;
}

.calendar_all .calendar_item_element .erpds-calendar-task-card.hour-sysrole-holded,
.calendar_all .calendar_item_element .erpds-calendar-task-card.hour-sysrole-cancelled {
    border-left: 3px solid var(--erpds-border-strong, #9aa0a8);
    border-radius: 0 var(--erpds-radius-sm, 4px) var(--erpds-radius-sm, 4px) 0;
}

/* Типографическая иерархия */
.calendar_all .calendar_item_element .erpds-cal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
}

.calendar_all .calendar_item_element .erpds-cal-time {
    font-weight: 700;
    font-size: 13px;
}

.calendar_all .calendar_item_element .erpds-cal-time .erpds-cal-task-link {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.calendar_all .calendar_item_element .erpds-cal-status-ico {
    flex: none;
}

.calendar_all .calendar_item_element .erpds-cal-type {
    font-size: 12px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 5px;
}

.calendar_all .calendar_item_element .erpds-cal-type-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--erpds-task-type-color, var(--erpds-accent, #2563eb));
    flex: none;
}

.calendar_all .calendar_item_element .erpds-cal-addr {
    font-size: 12px;
    color: var(--erpds-text-secondary, #5F5E5A);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.calendar_all .calendar_item_element .erpds-cal-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.calendar_all .calendar_item_element .erpds-cal-meta:empty {
    display: none;
}

.calendar_all .calendar_item_element .erpds-cal-tag {
    font-size: 11px;
    padding: 1px 6px;
    border-radius: var(--erpds-radius-sm, 4px);
    background: var(--erpds-surface-2, #F6F7F9);
    color: var(--erpds-text-secondary, #5F5E5A);
}

.calendar_all .calendar_item_element .erpds-cal-tag-more {
    font-size: 11px;
    padding: 1px 6px;
    border-radius: var(--erpds-radius-sm, 4px);
    background: var(--erpds-surface-2, #F6F7F9);
    color: var(--erpds-text-secondary, #5F5E5A);
}

.calendar_all .calendar_item_element .erpds-cal-overdue {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 11px;
    padding: 1px 6px;
    border-radius: var(--erpds-radius-sm, 4px);
    background: color-mix(in srgb, var(--erpds-danger, #D64545) 12%, transparent);
    color: var(--erpds-danger, #D64545);
    font-weight: 600;
    white-space: nowrap;
}

.calendar_all .calendar_item_element .erpds-cal-dup {
    text-align: center;
    color: var(--erpds-text-secondary, #5F5E5A);
}

#top_topline_current {
    position: sticky;
    width: 100%;
    height: 40px;
    background: var(--main-color);
    top: 0;
    left: 0;
    z-index: 900;
}

#top_topline_plan {
    position: sticky;
    width: 100%;
    height: 40px;
    background: #848284;
    top: 0;
    left: 0;
    z-index: 900;
}

#top_topline_all {
    position: sticky;
    width: 100%;
    height: auto;
    min-height: 40px;
    overflow: visible;

    background: -moz-linear-gradient(left, var(--main-color), #848284 100%);
    background: -webkit-linear-gradient(left, var(--main-color), #848284 100%);
    background: -o-linear-gradient(left, var(--main-color), #848284 100%);
    background: -ms-linear-gradient(left, var(--main-color), #848284 100%);
    background: linear-gradient(to right, var(--main-color), var(--main-color) 100%);
    top: 0;
    left: 0;
    z-index: 900;
}

/* Когда активен попап поиска — поднимаем весь header в supreme stacking context.
   Иначе z-index попапа (2147483646) ограничен локальным контекстом header'a (z:900)
   и не перекрывает модалки/sticky-bar/etc на body-уровне. */
#top_topline_all:has(#top_find_result),
#top_topline_current:has(#top_find_result),
#top_topline_plan:has(#top_find_result) {
    z-index: 2147483647 !important;
}

#top_userbar {
    height: 40px;
    line-height: 40px;
    background: var(--main-color);
    color: #FFF;
    position: relative;
    margin: 0 auto;
    padding: 0 20px;
    max-width: 1400px;
}

#top_userbar1 {
    height: 40px;
    line-height: 40px;
    background: #848284;
    color: #FFF;
    position: relative;
    margin: 0 auto;
    padding: 0 20px;
    max-width: 1400px;
}

#top_userbar2 {
    height: 40px;
    line-height: 40px;
    color: #FFF;
    position: relative;
    margin: 0 auto;
    padding: 0 20px;
    max-width: 1400px;
}

#top_userbar_current {
    height: 40px;
    line-height: 40px;
    background: var(--main-color);
    color: #FFF;
    position: relative;
    margin: 0 auto;
    padding: 0 20px;
}

#top_userbar_plan {
    height: 40px;
    line-height: 40px;
    background: #848284;
    color: #FFF;
    position: relative;
    margin: 0 auto;
}

#top_userbar_all {
    /*height: 40px;*/
    line-height: 40px;
    color: #FFF;
    position: relative;
    margin: 0 auto;
    /*padding: 0 20px;*/

    display: flex;
    flex-wrap: wrap;
    align-items: center;
    min-height: 40px;
    padding: 0 10px;
}

#top_search {
    position: relative;
    width: 250px;
}

#top_search #top_field {
    color: var(--erpds-text-muted, #525A66);
    font-size: 13px;
    height: 23px;
    line-height: 23px;
    width: 205px;
    border: none;
    outline: none;
    padding: 0 10px;
    padding-right: 35px;
    font-family: var(--erpds-sans);
    /*position: absolute;*/
    top: 8px;
    left: 0;
}

#top_search #top_button {
    width: 28px;
    height: 23px;
    background: url('../picture/search_gray.svg') 50% 50% no-repeat var(--erpds-surface-2, #F6F7F9);
    cursor: pointer;
    border: none;
    position: absolute;
    top: 8px;
    right: 0;
}

#top_search #top_button:hover {
    background: url('../picture/search_blue.svg') 50% 50% no-repeat var(--erpds-surface-2, #F6F7F9);
}

#button_go_task, #button_go_device, #button_go_device_inv, #button_go_inventory {
    width: 28px;
    height: 23px;
    background: url('../picture/search_gray.svg') 50% 50% no-repeat #F2F5F500;
    cursor: pointer;
    border: none;
    margin-top: 4px;
    right: 0;
}

#button_go_task:hover, #button_go_device:hover, #button_go_device_inv:hover, #button_go_inventory:hover {
    background: url('../picture/search_blue.svg') 50% 50% no-repeat var(--erpds-surface-2, #F6F7F9);
}

#top_links {
    /*height: 20px;*/
    float: right;
    margin: 10px 0;
    line-height: 20px;
}

#top_links li {
    display: inline-block;
    border-left: 1px solid rgba(255,255,255,0.20);
    height: 100%;
    text-align: center;
    padding-left: 10px;
    margin-left: 10px;
}

#top_links li:first-child {
    border: none;
}

#top_links li a {
    color: #FFF;
    text-align: center;
}

#top_links li a:hover {
    color: rgba(255,255,255,0.75);
}

#top_links li #top_region {
    border-bottom: 1px dashed;
}

/* ============================================================
   Region selector dropdown #region_select / #region_select_id
   Структура: ul > li > a > i (см. DashBoardHtml::ajaxChangeRegion).
   ============================================================ */
#region_select_id {
    z-index: 2147483646;
    min-width: 280px;
    max-width: min(420px, calc(100vw - 32px));
    top: calc(100% + 8px) !important;
    right: 0;
    left: auto !important;
    margin: 0 !important;
}
#region_select {
    background-color: var(--erpds-surface, #fff);
    color: var(--erpds-text, #0F172A);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: var(--erpds-radius, 12px);
    box-shadow: var(--erpds-shadow, 0 12px 32px -12px rgba(15,23,42,0.22));
    margin: 0;
    padding: 6px 0;
    font-family: var(--erpds-sans, -apple-system, "Segoe UI", sans-serif);
    font-size: 13px;
    max-height: min(70vh, 480px);
    overflow-y: auto;
    overscroll-behavior: contain;
    animation: erpds-find-pop 140ms cubic-bezier(0.16, 1, 0.3, 1);
}
#region_select ul {
    border: none;
    padding: 0;
    margin: 0;
    list-style: none;
}
#region_select li {
    list-style: none;
    margin: 0;
    padding: 0;
}
#region_select li a {
    display: block;
    padding: 8px 14px;
    color: var(--erpds-text, #0F172A);
    text-decoration: none;
    border-radius: var(--erpds-radius-xs, 6px);
    margin: 1px 6px;
    transition: background-color 0.12s ease, color 0.12s ease;
    font-weight: 500;
}
#region_select li a:hover,
#region_select li a:focus-visible {
    background-color: var(--erpds-accent-soft, #E5EAFB);
    color: var(--erpds-accent-text, #2D4AC7);
    outline: none;
}
#region_select li a:focus-visible {
    box-shadow: 0 0 0 2px var(--erpds-accent, #3B5BDB);
}
#region_select li a i {
    font-style: normal;
    color: inherit;
}
/* Активный регион (по data-attr или классу — backend может добавить) */
#region_select li.is-current a,
#region_select li a.is-current {
    background-color: var(--erpds-accent-soft, #E5EAFB);
    color: var(--erpds-accent-text, #2D4AC7);
    font-weight: 600;
}
#region_select::-webkit-scrollbar { width: 6px; }
#region_select::-webkit-scrollbar-thumb {
    background: var(--erpds-border-strong, #C4CAD4);
    border-radius: 3px;
}
#region_select::-webkit-scrollbar-track { background: transparent; }
/* Подсказка снизу */
#region_select::after {
    content: "\2191\2193 выбор   Enter открыть   Esc закрыть";
    display: block;
    position: sticky;
    bottom: 0;
    margin: 6px 0 -6px;
    padding: 5px 14px 6px;
    background: linear-gradient(to top, var(--erpds-surface, #fff) 60%, transparent);
    color: var(--erpds-text-faint, #6B7280);
    font-size: 10.5px;
    text-align: center;
    opacity: 0.65;
    transition: opacity 0.15s ease;
    pointer-events: none;
}
#region_select:hover::after { opacity: 0.95; }

/* Поднимаем header в supreme z-index когда открыт region_select (как у поиска) */
#top_topline_all:has(#region_select),
#top_topline_current:has(#region_select),
#top_topline_plan:has(#region_select) {
    z-index: 2147483647 !important;
}

@media (prefers-reduced-motion: reduce) {
    #region_select { animation: none; }
    #region_select li a { transition: none; }
}


/* ============================================================
   Search dropdown #top_find_result (header search popup).
   Реальная структура — плоский HTML: <span>Тип:</span> <a>имя</a><br>
   (см. CustomerListHtml.php:3886+). Стилизуем по факту.
   ============================================================ */
#top_find_result {
    background-color: var(--erpds-surface, #fff);
    color: var(--erpds-text, #0F172A);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: var(--erpds-radius, 12px);
    box-shadow: var(--erpds-shadow, 0 12px 32px -12px rgba(15,23,42,0.22));
    position: absolute;
    z-index: 2147483646;
    line-height: 1.5;
    top: calc(100% + 6px);
    left: 0;
    min-width: 320px;
    max-width: min(520px, calc(100vw - 32px));
    padding: 6px 0;
    font-family: var(--erpds-sans, -apple-system, sans-serif);
    font-size: 13px;
    max-height: min(70vh, 560px);
    overflow-y: auto;
    overscroll-behavior: contain;
    animation: erpds-find-pop 140ms cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes erpds-find-pop {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Каждая «строка» = span (label) + a (значение) + br. Группируем через .row не выйдет — стилизуем через combinators. */
#top_find_result > span {
    display: inline-block;
    color: var(--erpds-text-faint, #6B7280);
    font-size: 10.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0 6px 0 12px;
    margin: 2px 0;
    vertical-align: middle;
}

#top_find_result a {
    display: inline-block;
    color: var(--erpds-accent-text, #2D4AC7);
    text-decoration: none;
    padding: 4px 12px;
    margin: 1px 6px;
    border-radius: var(--erpds-radius-xs, 6px);
    font-weight: 500;
    transition: background-color 0.12s ease, color 0.12s ease;
    vertical-align: middle;
}
#top_find_result a:hover,
#top_find_result a:focus-visible {
    color: var(--erpds-accent-hover, #2D4AC7);
    background-color: var(--erpds-accent-soft, #E5EAFB);
    outline: none;
    text-decoration: none;
}
#top_find_result a:focus-visible {
    box-shadow: 0 0 0 2px var(--erpds-accent, #3B5BDB);
}

/* Иконки типа категорий из шаблона — приглушаем, выравниваем */
#top_find_result .us-icon,
#top_find_result i {
    color: var(--erpds-text-faint, #6B7280);
    margin-right: 6px;
    font-size: 11px;
    vertical-align: middle;
}

/* <br> между записями — добавляет тонкий разделитель за счёт самого блока */
#top_find_result br {
    line-height: 0;
}

/* Loading state (fa-spinner) */
#top_find_result .fa-spinner {
    display: inline-block;
    color: var(--erpds-accent, #3B5BDB);
    font-size: 18px;
    margin: 14px auto;
    animation: erpds-spin 800ms linear infinite;
}
@keyframes erpds-spin {
    to { transform: rotate(360deg); }
}

/* Empty state (текст «Ничего не найдено» — нет ни <a>, ни <span> ни <i>) */
#top_find_result:not(:has(a)):not(:has(.fa-spinner)) {
    padding: 12px 16px;
    text-align: center;
    color: var(--erpds-text-faint, #6B7280);
    font-style: italic;
    min-width: 240px;
}

/* Highlight совпадений (если backend оборачивает в <mark>) */
#top_find_result mark {
    background: var(--erpds-hold-soft, #FAF1DC);
    color: var(--erpds-hold-text, #7A540B);
    padding: 0 2px;
    border-radius: 3px;
    font-weight: 600;
}

/* Footer-подсказка с горячими клавишами — ненавязчивая */
#top_find_result::after {
    content: "\2191\2193 выбор   \2 Enter \2 открыть   \2 Esc \2 закрыть";
    display: block;
    position: sticky;
    bottom: 0;
    margin: 6px 0 -6px;
    padding: 5px 14px 6px;
    background: linear-gradient(to top, var(--erpds-surface, #fff) 60%, transparent);
    color: var(--erpds-text-faint, #6B7280);
    font-size: 10.5px;
    font-weight: 400;
    letter-spacing: 0;
    text-align: center;
    font-family: var(--erpds-sans, -apple-system, "Segoe UI", sans-serif);
    opacity: 0.65;
    pointer-events: none;
    transition: opacity 0.15s ease;
}
#top_find_result:hover::after {
    opacity: 0.95;
}
/* Не показываем подсказку для loading state */
#top_find_result:has(.fa-spinner)::after {
    display: none;
}

/* Скроллбар внутри попапа — тонкий */
#top_find_result::-webkit-scrollbar { width: 6px; }
#top_find_result::-webkit-scrollbar-thumb { background: var(--erpds-border-strong, #C4CAD4); border-radius: 3px; }
#top_find_result::-webkit-scrollbar-track { background: transparent; }

@media (prefers-reduced-motion: reduce) {
    #top_find_result { animation: none; }
    #top_find_result .fa-spinner { animation: none; }
    #top_find_result a { transition: none; }
}

/* Подсказка в самом поле — при пустом значении и фокусе показываем формат поиска */
#top_search:focus-within #top_field:placeholder-shown::placeholder {
    color: var(--erpds-text-muted, rgba(255,255,255,0.7));
    font-size: 12px;
}

#us_label {
    font-weight: bold;
    color: var(--main-color-hover);
    margin-top: 7px;
    margin-right: 7px;
    font-size: 28pt;
    height: 32px;
    width: 154px;
}

/* ~~ этот контейнер фиксированной ширины окружает остальные DIV ~~ */
#page_container {
    max-width: 1400px;
    margin: 0 auto; /* автоматическое задание величин по бокам в совокупности с шириной центрирует макет */
    padding: 0 16px;
    position: relative;
    margin-top: 48px;
    /* border: 3px solid #f00; */
}

#page_container314 {
    margin: 0 auto; /* автоматическое задание величин по бокам в совокупности с шириной центрирует макет */
    padding-left: 10px;
    position: relative;
    margin-top: 10px;
    /* border: 3px solid #f00; */
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    overflow-y: auto;
}

.modeTypeall a, .modeTypeall a:visited, .modeTypeall a:hover, .modeType a, .modeType a:visited, .modeType a:hover {
    text-decoration: none;
    color: var(--main-color);
}

.modeTypeplan a, .modeTypeplan a:visited, .modeTypeplan a:hover {
    text-decoration: none;
    color: var(--erpds-text-muted, #525A66);
}

#menuTopUsText {
    font-size: 20pt;
    margin-top: 20px;
    margin-left: 3px;
}

#menuUsVersion {
    font-size: 9pt;
    margin-top: 9px;
    margin-left: 5px;
}

#menuUsIsPlanned {
    color: var(--erpds-bad, #B62A26);
    font-weight: bold;
    padding-left: 5px;
}

#menuUsNetwork {
    margin-top: 9px;
    margin-bottom: -5px;
    font-size: 12pt;
    font-weight: bold;
    font-style: italic;
    padding-left: 5px;
}

.div_razdel {
    font-size: 18px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--erpds-border, #DDE1E8);
    margin-bottom: 12px;
    text-transform: uppercase;
}

/* Всплывающее уведомление: flex-бокс с авто-размером под произвольный текст
   (api_msg из внутреннего API может быть длинным). Иконка inline, не оторвана.
   Центрирование через transform — корректно при переменной ширине. */
#popup,
#popup_error {
    background-color: var(--erpds-surface, #FFF);
    color: var(--erpds-text, #0F172A);
    position: fixed;
    top: 45px;
    left: 50%;
    transform: translateX(-50%);
    margin-left: 0;
    min-width: 220px;
    max-width: min(440px, calc(100vw - 24px));
    width: max-content;
    min-height: 44px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 12px;
    box-shadow: var(--erpds-shadow-lg, 0 12px 40px -12px rgba(15, 23, 42, 0.16));
    z-index: 1000;
    padding: 12px 18px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-left: 4px solid var(--erpds-accent, #1871a5);
    border-radius: var(--erpds-radius, 12px);
    font-size: 16px;
    line-height: 1.4;
    word-break: break-word;
    text-align: left;
}

/* Семантика: успех — зелёный, ошибка — красный. Непрозрачная поверхность
   (плавающий тост — контент сзади не должен просвечивать), цвет передаём
   левым бордером + иконкой + цветом текста. Токены адаптируются в тёмной теме. */
#popup {
    border-left-color: var(--erpds-ok, #2E8540);
    color: var(--erpds-ok-text, #1F5E2D);
}

#popup_error {
    border-left-color: var(--erpds-bad, #B62A26);
    color: var(--erpds-bad-text, #821B18);
}

#popup #notifyDivIcon,
#popup_error #notifyDivIcon {
    position: static;
    top: auto;
    left: auto;
    margin: 0;
    z-index: 1010;
    font-size: 26px;
    line-height: 1;
    flex: 0 0 auto;
}

#popup #notifyDivIcon { color: var(--erpds-ok, #2E8540); }

#popup_error #notifyDivIcon { color: var(--erpds-bad, #B62A26); }

#main_content {
    display: flex;
    /* border: 3px solid #0ff; */

    flex: 1;
    min-width: 0;
}

.main_content_inside {
    /*margin-left: 10px;*/
    min-width: 400px;
    width: 100%;
    padding: 10px;
}

.main_content_inside_min {
    padding-top: 10px;
    margin-left: 50px;
}

.main_content_inside_right_aside {
    /*margin-right: 220px;*/
}

#aside_left {
    width: 300px;
    min-width: 300px;
    max-width: 300px;
    padding-bottom: 10px;
    margin-right: 10px;
    align-self: flex-start;
}
#mobile_menu_open_btn,
#mobile_back_btn,
#mobile_refresh_btn,
#mobile_menu_close_btn {
    display: none; /* Полностью убираем с десктопа */
}
@media (max-width: 900px) {
    /* Базовый шрифт — стандарт мобильного baseline */
    body {
        font-size: 16px !important;
    }

    .table_item td {
        font-size: 14px !important;
    }

    #top_topline_all,
    #top_topline_current,
    #top_topline_plan {
        height: 56px !important;
        min-height: 56px !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        padding: 0 !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.25);
        /* Выше mobile map overlays (backdrop 10001+, FAB 10009) — «Назад» всегда кликабелен */
        z-index: 10020 !important;
    }
    #top_userbar,
    #top_userbar1,
    #top_userbar2,
    #top_userbar_current,
    #top_userbar_plan {
        min-height: auto;
        height: auto;
    }

    #top_userbar,
    #top_userbar1,
    #top_userbar2,
    #top_userbar_current,
    #top_userbar_plan {
        padding-left: 12px;
        padding-right: 12px;
    }

    #top_userbar_all {
        flex: 1 1 auto !important;
        flex-wrap: nowrap !important;
        gap: 0 !important;
        padding: 0 6px 0 0 !important;
        min-height: 56px !important;
        max-height: 56px !important;
        overflow: hidden !important;
        min-width: 0 !important;
        line-height: 1 !important;
    }

    #top_search {
        flex: 1 1 auto !important;
        width: auto !important;
        max-width: none !important;
        min-width: 60px !important;
        display: flex !important;
        align-items: center !important;
        background: rgba(255,255,255,0.18) !important;
        border-radius: 20px !important;
        height: 36px !important;
        margin: 0 6px 0 0 !important;
        overflow: hidden !important;
        transition: background 0.2s ease, box-shadow 0.2s ease !important;
        position: static !important;
    }

    #top_search:focus-within {
        background: rgba(255,255,255,0.27) !important;
        box-shadow: 0 0 0 2px rgba(255,255,255,0.45) !important;
    }

    #top_search #top_field {
        flex: 1 !important;
        width: 100% !important;
        max-width: none !important;
        height: 36px !important;
        background: transparent !important;
        color: #fff !important;
        font-size: 14px !important;
        padding: 0 6px 0 14px !important;
        border: none !important;
        outline: none !important;
        top: auto !important;
        left: auto !important;
        caret-color: rgba(255,255,255,0.9) !important;
        box-sizing: border-box;
    }

    #top_search #top_field::placeholder {
        color: rgba(255,255,255,0.58) !important;
        font-size: 13px !important;
    }

    #top_search #top_button {
        position: static !important;
        width: 36px !important;
        min-width: 36px !important;
        height: 36px !important;
        flex-shrink: 0 !important;
        filter: brightness(0) invert(1) opacity(0.75) !important;
        top: auto !important;
        right: auto !important;
        background-color: transparent !important;
    }

    #region_select_id {
        min-width: 0;
        width: 100%;
        max-width: 100%;
        padding-left: 0;
        max-height: 60vh;
        overflow: auto;
        box-sizing: border-box;
    }

    #top_links {
        float: none !important;
        width: auto !important;
        flex-shrink: 0 !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        height: 56px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
    }

    #top_links li {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        height: 56px !important;
        width: 40px !important;
        flex: 0 0 40px !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
    }

    /* Скрыть: Биллинг (1), script (2), Регион (3), WiKi (5), Выход (7) */
    #top_links li:nth-child(1),
    #top_links li:nth-child(2),
    #top_links li:nth-child(3),
    #top_links li:nth-child(5),
    #top_links li:nth-child(7) {
        display: none !important;
    }

    #login_page_footer {
        min-width: 0;
        width: 100%;
        height: auto;
    }

    #login_page #login_page_toplogo {
        height: 220px;
        background-position: center center;
        background-size: cover;
    }

    .div_razdel {
        font-size: 16px;
        line-height: 1.3;
        margin-bottom: 10px;
        padding-bottom: 8px;
        word-break: break-word;
    }

    #popup,
    #popup_error {
        left: 12px;
        right: 12px;
        width: auto;
        max-width: calc(100vw - 24px);
        margin-left: 0;
        transform: none;
        box-sizing: border-box;
    }

    #notifyDivIcon {
        left: 24px;
        margin-left: 0;
    }

    #main_content {
        min-width: 0;
        flex: 1 1 100%;
    }

    .main_content_inside {
        min-width: 0;
        padding: 8px;
    }

    #div_contentplace {
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .table_block,
    .table_table,
    .table_data {
        max-width: 100%;
    }

    .input_box,
    .textarea_class,
    #usersearch .field,
    #usersearch2 .field,
    select {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .button,
    .button_small,
    .button2 {
        min-height: 44px;
        touch-action: manipulation;
    }

    .table_block {
        display: block;
        width: 100%;
        margin: 12px 0;
    }

    .div_sortable_class {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .div_sortable_class > div,
    .div_sortable_class > div > div {
        width: 100%;
        box-sizing: border-box;
    }

    .div_sortable_class > div > div[style*="position: absolute"] {
        position: static !important;
        top: auto !important;
        right: auto !important;
        left: auto !important;
        margin-top: 4px !important;
        text-align: left !important;
    }

    .table_block[style*="width: 50%"],
    .table_block[style*="float: left"],
    .gray_block[style*="width: 50%"],
    div[style*="float: left"],
    div[style*="width: 250px"],
    div[style*="width: 300px"],
    div[style*="width: 400px"],
    div[style*="width: 500px"],
    div[style*="min-width: 300px"],
    div[style*="max-width: 300px"],
    div[style*="max-width: 400px"],
    div[style*="max-width: 500px"],
    div[style*="max-width: 700px"][style*="float: left"],
    div[style*="max-width: 1000px"],
    div[style*="float: right"] {
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        display: block !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box;
    }

    div[style*="display: inline; float: left"],
    div[style*="display: inline;float: left"],
    div[style*="display: inline; float: right"],
    div[style*="display: inline;float: right"] {
        display: block !important;
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box;
    }

    .div_ipnet,
    .div_ipnet_hide {
        width: auto;
        max-width: 100%;
        box-sizing: border-box;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .slider_content_double {
        display: block;
        width: 100%;
    }

    .slider_content_double > div,
    .slider_content_double > .table_block {
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box;
    }

    .slider_content_double > div[style*="max-width: 700px"],
    .slider_content_double > div[style*="max-width: 400px"],
    .slider_content_double > div[style*="width: 50%"] {
        max-width: 100% !important;
        width: 100% !important;
    }

    .gray_block > div[style*="float: right"] {
        float: none !important;
        width: 100% !important;
        text-align: left !important;
        margin-top: 12px !important;
        margin-right: 0 !important;
    }

    .gray_block > div[style*="position: absolute"] {
        position: static !important;
        top: auto !important;
        right: auto !important;
        left: auto !important;
        float: none !important;
        width: 100% !important;
        margin: 8px 0 0 !important;
        text-align: left !important;
    }

    .gray_block_left > div[style*="float: right"],
    .gray_block_left > div[style*="margin-right: 120px"],
    .gray_block > div[style*="margin-right: 120px"] {
        float: none !important;
        width: 100% !important;
        margin-right: 0 !important;
        text-align: left !important;
        box-sizing: border-box;
    }

    .support_history,
    div[id^="msg_"] {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box;
    }

    div[id^="msg_"] > .div_color_1,
    div[id^="msg_"] > .div_color_2,
    div[id^="msg_"] [id^="msg_set_"] {
        float: none !important;
        display: block !important;
        width: auto !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: left !important;
        position: static !important;
    }

    div[id^="msg_"] > div[style*="margin-left: 20%"],
    div[id^="msg_"] > div[style*="margin-right: 20%"],
    div[id^="msg_"] > .gray_block[style*="margin-left: 20%"],
    div[id^="msg_"] > .gray_block[style*="margin-right: 20%"] {
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        position: static !important;
        box-sizing: border-box;
    }

    div[id^="msg_"] [id$="_body"] {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .table_port {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
    }

    .table_port .legend,
    .table_port .item {
        width: max-content;
    }

    .table_port .legend .bold_text[style*="min-width: 200px"],
    .left_data[style*="max-width: 150px"],
    .left_data[style*="width: 150px"],
    .left_data[style*="max-width: 180px"],
    .left_data[style*="width: 180px"],
    .left_data[style*="max-width: 220px"],
    .left_data[style*="width: 220px"],
    .left_data[style*="max-width: 200px"],
    .left_data[style*="width: 200px"],
    .left_data[style*="max-width: 150px;"],
    .left_data[style*="width: 150px;"],
    .left_data[style*="max-width: 180px;"],
    .left_data[style*="width: 180px;"],
    .left_data[style*="max-width: 220px;"],
    .left_data[style*="width: 220px;"],
    .left_data[style*="max-width: 250px"],
    .left_data[style*="width: 250px"],
    .left_data[style*="max-width: 300px"],
    .left_data[style*="width: 300px"],
    .left_data[style*="max-width: 200px;"],
    .left_data[style*="width: 200px;"],
    .left_data[style*="max-width: 150px;"],
    .left_data[style*="width: 150px;"],
    .left_data[style*="max-width: 180px;"],
    .left_data[style*="width: 180px;"],
    .left_data[style*="max-width: 220px;"],
    .left_data[style*="width: 220px;"],
    .left_data[style*="max-width: 250px;"],
    .left_data[style*="width: 250px;"],
    .left_data[style*="max-width: 300px;"],
    .left_data[style*="width: 300px;"],
    .item > div[style*="max-width: 200px"],
    .item > div[style*="max-width: 200px;"],
    .item > div[style*="max-width: 250px"],
    .item > div[style*="max-width: 250px;"],
    .item > div[style*="max-width: 300px"],
    .item > div[style*="max-width: 300px;"],
    .item > div[style*="width: 200px"],
    .item > div[style*="width: 200px;"],
    .item > div[style*="width: 250px"],
    .item > div[style*="width: 250px;"],
    .item > div[style*="width: 300px"],
    .item > div[style*="width: 300px;"] {
        min-width: 0 !important;
        width: auto !important;
        max-width: 100% !important;
        white-space: normal !important;
        word-break: break-word;
    }

    .info_block[style*="max-width: 250px"],
    .info_block[style*="max-width: 300px"],
    .info_block[style*="max-width: 400px"],
    .info_block[style*="max-width: 500px"] {
        display: block !important;
        max-width: 100% !important;
        white-space: normal !important;
        word-break: break-word;
    }

    .table_block .item {
        display: flex;
        flex-direction: column;
        width: 100%;
        gap: 4px;
        margin-bottom: 8px;
    }

    .table_block .item > div {
        display: block;
        width: 100%;
        padding: 0;
    }

    .table_block .item > div.left_data[style*="width"] {
        width: 100% !important;
        max-width: 100% !important;
    }

    .table_block .left_data {
        text-align: left;
        background: none;
        font-size: 13px;
        line-height: 1.3;
    }

    #usersearch,
    #usersearch2 {
        height: auto;
        line-height: normal;
        padding: 10px 12px;
        box-sizing: border-box;
    }

    #usersearch .field,
    #usersearch2 .field {
        margin-left: 0;
        margin-right: 0;
        width: calc(100% - 48px);
    }

    #usersearch .check,
    #usersearch2 .check {
        width: 100%;
        margin: 8px 0 0;
    }

    .label_wait,
    .label_stop,
    .label_error,
    .label_alert {
        height: auto;
        min-height: 44px;
        padding-top: 10px;
        padding-bottom: 10px;
        word-break: break-word;
    }

    #dialog-box,
    #dialog-box .dialog-content,
    #dialog-box .dialog_header,
    #map_add_obj_id,
    #map_add_obj_id .dialog_header {
        max-width: 100%;
    }

    #map_add_obj_id,
    #dialog-box {
        left: 8px !important;
        right: 8px !important;
        width: auto !important;
        margin-left: 0 !important;
        box-sizing: border-box;
    }

    .map_frame {
        width: 100%;
        max-width: 100%;
        overflow: hidden;
    }

    #map_menu_panel,
    #scheme_menu_panel,
    #map_edit_panel {
        position: sticky;
        top: 0;
        left: 0;
        width: 100%;
        height: auto;
        min-height: 40px;
        padding: 6px 8px;
        box-sizing: border-box;
    }

    #map_edit_panel {
        top: 40px;
    }

    #map_menu_panel {
        top: 80px;
    }

    #map_edit_panel,
    #map_menu_panel {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
    }

    #map_edit_panel > div,
    #map_menu_panel > div,
    #scheme_menu_panel > div {
        float: none !important;
        display: block !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box;
    }

    #map_edit_panel .obj-button,
    #map_edit_panel .obj-button2,
    #map_menu_panel .menu_down,
    .map_menu_down,
    .button_inside {
        float: none;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 40px;
        margin: 0;
        box-sizing: border-box;
    }

    #map_edit_panel .obj-button,
    #map_edit_panel .obj-button2 {
        padding: 6px 10px;
    }

    .leaflet-container {
        width: 100% !important;
        max-width: 100% !important;
    }

    .leaflet-control-container .leaflet-top,
    .leaflet-control-container .leaflet-bottom {
        max-width: calc(100vw - 16px);
    }

    .leaflet-control-layers {
        max-width: calc(100vw - 24px);
        max-height: 60vh;
        overflow: auto;
    }

    .leaflet-popup-content-wrapper {
        max-width: calc(100vw - 48px);
    }

    .leaflet-popup-content {
        max-width: calc(100vw - 72px);
        word-break: break-word;
    }

    .dropdown-menu,
    .ui-timepicker-container,
    .xdsoft_datetimepicker {
        max-width: calc(100vw - 16px);
    }

    .ui-timepicker-container,
    .xdsoft_datetimepicker {
        left: 8px !important;
        right: 8px !important;
        width: auto !important;
        box-sizing: border-box;
    }

    .xdsoft_datetimepicker .xdsoft_datepicker,
    .xdsoft_datetimepicker .xdsoft_timepicker,
    .xdsoft_datetimepicker .xdsoft_label,
    .xdsoft_datetimepicker .xdsoft_calendar table {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }

    .xdsoft_datetimepicker .xdsoft_datepicker,
    .xdsoft_datetimepicker .xdsoft_timepicker {
        float: none;
        margin-left: 0;
    }

    .xdsoft_datetimepicker .xdsoft_calendar td,
    .xdsoft_datetimepicker .xdsoft_calendar th {
        font-size: 11px;
    }

    .map_toppanel,
    #map_menu2 {
        width: 100%;
        box-sizing: border-box;
    }

    .map_toppanel {
        margin: 0;
        padding: 8px 10px;
    }

    .mapLabel,
    .leaflet-tooltip-label,
    .custom-tooltip-label,
    .mapNodeInfoNormal,
    .mapDeviceInfoNormal,
    .mapDeviceInfoRed,
    .my-label,
    .erp-label,
    .rack_label_low_opacity,
    .rack_label {
        width: auto;
        max-width: calc(100vw - 24px);
        white-space: normal;
        word-break: break-word;
    }

    .reply_comment {
        width: auto;
        max-width: 100%;
        box-sizing: border-box;
    }

    .total-popup .dialog,
    .total-popup-content,
    .total-popup-label,
    .total-popup-label-dot {
        max-width: calc(100vw - 24px);
    }

    .total-popup .dialog {
        position: relative;
        margin-left: 0;
        margin-top: 0;
    }

    .total-popup .dialog .field-wrapper input,
    .total-popup .dialog .field-wrapper textarea {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .reply_comment {
        width: auto;
        max-width: 100%;
        box-sizing: border-box;
    }

    #menu_overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5);
        z-index: 9998;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.25s ease;
    }
    #aside_left.mobile-open + #menu_overlay,
    body:has(#aside_left.mobile-open) #menu_overlay {
        opacity: 1;
        pointer-events: auto;
    }
    #aside_left {
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        position: fixed !important;
        top: 56px;
        left: -100vw;
        width: 300px !important;
        max-width: 88vw !important;
        height: calc(100vh - 56px);
        z-index: 9999;
        float: none !important;
        margin-right: 0 !important;
        transition: transform 0.3s ease-in-out;
        background: var(--main-color-body-background-second);
        scrollbar-width: thin;
        scrollbar-color: rgba(0,0,0,0.15) transparent;
        box-shadow: 2px 0 20px rgba(0,0,0,0.2) !important;
        overscroll-behavior: contain;
        will-change: transform;
    }
    #aside_left::-webkit-scrollbar {
        width: 4px;
    }
    #aside_left::-webkit-scrollbar-track {
        background: transparent;
    }
    #aside_left::-webkit-scrollbar-thumb {
        background: rgba(0, 0, 0, 0.15);
        border-radius: 2px;
    }
    #menuLogo {
        border-bottom: 1px solid rgba(0, 0, 0, 0.08);
        margin-bottom: 4px;
        padding-bottom: 8px;
    }

    /* 3. СОСТОЯНИЕ: ТЕЛЕФОН ОТКРЫТО */
    #aside_left.mobile-open {
        transform: translateX(100vw);
        box-shadow: none;
    }

    /* Кнопка закрытия */
    #mobile_menu_close_btn {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        width: 100%;
        padding: 10px 16px;
        background: none;
        border: none;
        border-bottom: 1px solid rgba(128,128,128,0.2);
        color: var(--main-color-text);
        font-size: 24px;
        cursor: pointer;
        min-height: 48px;
    }
    #mobile_menu_close_btn:active {
        background: rgba(128,128,128,0.1);
    }

    /* Touch targets */
    #aside_left nav ul li > a.i0,
    #aside_left nav ul li > button.i0 {
        height: 48px;
        font-size: 15px;
        display: flex;
        align-items: center;
        padding-left: 16px;
        gap: 0;
        line-height: normal;
    }
    #aside_left nav ul li > button.i0 {
        width: calc(100% - 12px);
        text-align: left;
        background: none;
        border: 0;
        cursor: pointer;
        box-sizing: border-box;
        color: inherit;
        position: relative;
        overflow: hidden;
        font-weight: 500;
        -webkit-appearance: none;
        appearance: none;
    }
    #aside_left nav ul li > a.i0 .us-icon-lmenu,
    #aside_left nav ul li > button.i0 .us-icon-lmenu {
        flex-shrink: 0;
        margin: 0;
        margin-right: 12px;
        font-size: 1.1em;
        line-height: 1;
        width: 20px;
        text-align: center;
    }
    #aside_left nav ul li ul li a {
        min-height: 40px;
        display: flex;
        align-items: center;
        padding: 0 16px;
        line-height: 1.3;
    }

    /* Tap ripple — position:relative нужен ВСЕМ <a> в aside,
       иначе ::after position:absolute «вытекает» к <aside position:fixed>
       и накрывает весь дровер (height=942px) */
    #aside_left nav ul li a {
        position: relative;
        overflow: hidden;
    }
    #aside_left nav ul li a::after {
        content: '';
        position: absolute;
        inset: 0;
        background: rgba(8, 84, 160, 0.08);
        opacity: 0;
        transition: opacity 0.15s;
    }
    #aside_left nav ul li a:active::after {
        opacity: 1;
    }

    /* Разделители групп в мобильном меню */
    #aside_left nav ul li.menu-separator {
        margin-top: 4px;
        padding-top: 4px;
        border-top: 1px solid rgba(128, 128, 128, 0.18);
    }

    /* Hide version number on mobile */
    #menuUsVersion {
        display: none;
    }

    /* Дополнительно: скрываем правое меню на мобилке, чтобы не мешало */
    #aside_right {
        display: none !important;
    }

    #mobile_menu_open_btn,
    #mobile_back_btn,
    #mobile_refresh_btn {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: relative;
        z-index: 910;
        background: none;
        border: none;
        color: #FFF;
        font-size: 20px;
        height: 48px !important;
        width: 48px !important;
        min-width: 48px !important;
        flex-shrink: 0 !important;
        cursor: pointer;
        outline: none;
        padding: 0;
        float: none !important;
        border-radius: 50% !important;
        margin: 0 2px !important;
        transition: background-color 0.18s ease !important;
        -webkit-tap-highlight-color: transparent !important;
        user-select: none !important;
    }

    /* После общих flex-правил: скрытая «Назад» не резервирует 48px в шапке */
    #mobile_back_btn.mobile-nav-back-hidden,
    #top_topline_all.mobile-nav-no-back > #mobile_back_btn,
    #top_topline_current.mobile-nav-no-back > #mobile_back_btn,
    #top_topline_plan.mobile-nav-no-back > #mobile_back_btn {
        display: none !important;
        width: 0 !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        flex: 0 0 0 !important;
    }

    #top_topline_all.mobile-nav-no-back > #mobile_refresh_btn,
    #top_topline_current.mobile-nav-no-back > #mobile_refresh_btn,
    #top_topline_plan.mobile-nav-no-back > #mobile_refresh_btn {
        margin-left: 0 !important;
    }

    #mobile_menu_open_btn {
        width: 48px !important;
    }

    #mobile_menu_open_btn:active,
    #mobile_back_btn:active,
    #mobile_refresh_btn:active {
        background: rgba(255,255,255,0.28) !important;
    }
    #mobile_menu_open_btn:hover,
    #mobile_back_btn:hover,
    #mobile_refresh_btn:hover {
        background: rgba(255,255,255,0.15) !important;
    }
    #mobile_menu_open_btn:focus-visible,
    #mobile_back_btn:focus-visible,
    #mobile_refresh_btn:focus-visible {
        outline: 2px solid rgba(255,255,255,0.75) !important;
        outline-offset: 2px !important;
    }

    @supports (padding-top: env(safe-area-inset-top)) {
        #top_topline_all {
            padding-top: env(safe-area-inset-top) !important;
            height: calc(56px + env(safe-area-inset-top)) !important;
            min-height: calc(56px + env(safe-area-inset-top)) !important;
        }
        #aside_left {
            top: calc(56px + env(safe-area-inset-top)) !important;
            height: calc(100vh - 56px - env(safe-area-inset-top)) !important;
        }
    }

    .mobile-close-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        border-radius: 50%;
        background: rgba(0, 0, 0, 0.06);
        transition: background 0.15s;
        color: var(--erpds-text-muted, #525A66);
        font-size: 16px;
    }
    #mobile_menu_close_btn:hover .mobile-close-icon {
        background: rgba(0, 0, 0, 0.12);
        color: var(--erpds-text, #0F172A);
    }

    #mobile_menu_open_btn .fa-bars:before {
        content: "\f0c9";
        font-family: FontAwesome;
    }
    #mobile_back_btn .fa-arrow-left:before {
        content: "\f060";
        font-family: FontAwesome;
    }
    #mobile_refresh_btn .fa-refresh:before {
        content: "\f021";
        font-family: FontAwesome;
    }

    /* === Адаптивность таблиц === */

    /* Горизонтальный скролл для всех секций с таблицами */
    .slider_content {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Таблицы разворачиваются по контенту, не сжимаются */
    .table_table {
        width: max-content;
        min-width: 100%;
        max-width: none;
    }

    /* Табель: сбрасываем override от #div_contentplace > table tr/td { display:block; width:100%!important }
       и от @media(max-width:600px) .table_list_data thead { display:none !important } */
    .gray_block_light .table_table {
        display: table !important;
        width: max-content !important;
        min-width: 100%;
        max-width: none !important;
    }
    .gray_block_light .table_table thead {
        display: table-header-group !important;
        width: auto !important;
    }
    .gray_block_light .table_table tbody,
    .gray_block_light .table_table tfoot {
        display: table-row-group !important;
        width: auto !important;
    }
    .gray_block_light .table_table tr {
        display: table-row !important;
        width: auto !important;
        border: none !important;
        border-radius: 0 !important;
        margin-bottom: 0 !important;
        padding: 0 !important;
    }
    .gray_block_light .table_table td,
    .gray_block_light .table_table th {
        display: table-cell !important;
        width: auto !important;
        min-height: 0 !important;
        word-break: normal !important;
    }
    /* Восстанавливаем border-bottom заголовка, убранный card-view */
    .gray_block_light .table_table .table_legend td {
        border-bottom: 3px solid var(--erpds-border, #DDE1E8) !important;
    }
    /* Убираем card-view лейблы внутри ячеек табеля */
    .gray_block_light .table_table td::before {
        content: none !important;
    }
    /* Инпуты в узких ячейках дней — не сжимать, минимальная ширина */
    .gray_block_light .table_table input[type="text"] {
        width: 100% !important;
        min-width: 18px;
        box-sizing: border-box;
    }
    /* Усечение широких информационных колонок (Количество, Подразделение, Сотрудник) */
    .gray_block_light .table_table td:nth-child(3),
    .gray_block_light .table_table td:nth-child(4),
    .gray_block_light .table_table td:nth-child(5) {
        max-width: 80px;
        white-space: nowrap !important;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    /* Скролл-хинт: тень справа сигнализирует о горизонтальном скролле */
    .gray_block_light:has(.table_table) {
        box-shadow: inset -10px 0 14px -6px rgba(0, 0, 0, 0.18);
    }

    /* ТМЦ и другие таблицы без класса внутри attach-блоков */
    .c_attach_div table {
        width: max-content;
        min-width: 100%;
    }

    /* Детальная страница задачи — 2 колонки стекаются вертикально */
    #div_contentplace > table,
    #div_contentplace > table tr,
    #div_contentplace > table td {
        display: block;
        width: 100% !important;
    }

    /* Календарная таблица тоже скроллится */
    .table_data.calendar_all {
        width: max-content;
        min-width: 100%;
    }

    /* Контейнер страницы — симметричные отступы 8px */
    #page_container314 {
        padding-left: 0 !important;
    }
    .main_content_inside {
        padding: 8px !important;
        min-width: 0 !important;
    }

    /* top_links иконки — ссылки */
    #top_links li a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 36px !important;
        height: 40px !important;
        border-radius: 50% !important;
        color: rgba(255,255,255,0.9) !important;
        font-size: 16px !important;
        text-decoration: none !important;
        transition: background 0.18s !important;
        -webkit-tap-highlight-color: transparent !important;
        overflow: hidden !important;
        padding: 0 !important;
        white-space: nowrap;
    }

    #top_links li a:hover { background: rgba(255,255,255,0.15) !important; }
    #top_links li a:active { background: rgba(255,255,255,0.28) !important; }

    /* Скрыть текстовый span с именем пользователя */
    #top_links li a > span:not(.us-icon):not([class*="fa"]):not([class*="icon"]) {
        display: none !important;
    }

    /* us-icon внутри top_links */
    #top_links .us-icon {
        display: block !important;
        color: rgba(255,255,255,0.9) !important;
        line-height: 1 !important;
    }

    /* Регион-селект не ломает поток */
    #region_select_id {
        position: absolute;
        z-index: 1001;
        background: #fff;
        max-height: 300px;
        overflow-y: auto;
    }

    /* Результаты поиска под хедером */
    #top_find_result2 {
        position: fixed !important;
        top: 56px !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 2147483646 !important;
    }

    /* Блоки статистики на dashboard */
    .lk_main_content_inside {
        flex-wrap: wrap;
    }

    /* Кнопки действий вне MUI */
    .btn_group,
    .action_buttons {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
    }

    /* Диалоговые окна — не шире экрана */
    #dialog-box,
    .ui-dialog {
        max-width: 96vw !important;
        width: auto !important;
        left: 2vw !important;
        box-sizing: border-box;
    }

    /* Табель: ссылка выбора дня — block с min-height для нормального тач-таргета */
    .table_legend td a {
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 36px;
        padding: 3px 4px;
        margin: -3px 0;
        touch-action: manipulation;
        text-align: center;
        white-space: nowrap;
        box-sizing: border-box;
    }

    /* Инпуты в табеле (узкие ячейки дней) — не растягивать по ширине */
    .gray_block_light .input_box {
        width: auto;
        max-width: none;
        min-width: 0;
        box-sizing: content-box;
    }

    /* Sub-menu items — touch targets + indentation */
    #aside_left nav ul li > ul > li > a {
        display: flex;
        align-items: center;
        height: 40px;
        padding-left: 44px;
        font-size: 14px;
        color: var(--erpds-text-muted, #525A66);
        line-height: 1;
        border-radius: 0 6px 6px 0;
    }

    /* Active sub-item */
    #aside_left nav ul li > ul > li > a.span_bold {
        color: var(--main-color);
        font-weight: 600;
        background: rgba(8, 84, 160, 0.06);
    }

    /* Hover state */
    #aside_left nav ul li > ul > li > a:hover {
        background: rgba(0, 0, 0, 0.04);
    }

    /* Sub-menu UL — subtle left accent border */
    #aside_left nav ul li > ul {
        border-left: 2px solid rgba(8, 84, 160, 0.15);
        margin-left: 22px;
        margin-bottom: 4px;
        border-radius: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
        padding-block: 2px !important;
    }

    /* Chevron on expandable section headers (overrides ripple ::after) */
    #aside_left nav ul li > a.i0:not([href])::after,
    #aside_left nav ul li > button.i0::after {
        content: '›';
        position: absolute;
        inset: unset;
        right: 14px;
        top: 50%;
        background: none;
        opacity: 1;
        font-size: 20px;
        color: rgba(0, 0, 0, 0.28);
        line-height: 1;
        transform: translateY(-50%);
        transition: transform 0.22s ease;
    }

    /* Rotate chevron when sub-menu is open */
    #aside_left nav ul li:has(> ul:not([style*="display: none"])) > a.i0:not([href])::after,
    #aside_left nav ul li:has(> ul:not([style*="display: none"])) > button.i0::after {
        transform: translateY(-50%) rotate(90deg);
    }

    /* Периодические задания и Календарь — показываем (ripple-баг пофиксен) */
    #aside_left .journal-footer-links {
        display: flex !important;
    }

    /* Фикс: ripple ::after у a.i0 внутри journal-header-table позиционируется
       относительно <aside> и перекрывает весь дровер. Делаем <a> containing block. */
    #aside_left .journal-header-table a.i0 {
        position: relative;
        overflow: hidden;
    }
}

#aside_right {
    padding: 5px;
    width: 200px;
    background: #F7EFEF;
    border-left: 2px solid var(--erpds-border, #DDE1E8);
    position: absolute;
    top: 0px;
    right: 12px;
}

#top_topinfo {
    width: 100%;
    height: 60px;
    margin-bottom: 45px;
}

#div_contentplace {
    /* этот класс можно поместить в теге <br /> или в пустом блоке DIV в качестве конечного элемента, следующего за последним обтекаемым DIV (внутри #container), если overflow:hidden удалено в .container */
}

#div_empty {
    height: 0;
    line-height: 0;
    font: 1px;
}

.div_debug_header {
    margin-top: 12px;
    margin-left: 10px;
    font-weight: bold;
}

.div_debug {
    background-color: var(--erpds-bg-2, #F2F4F7);
    border: 2px solid #000;
    margin: 10px;
    padding: 2px;
}

.div_sql_debug {
    background-color: #fff;
    border: 1px solid #000;
    margin: 10px;
    padding: 2px;
}

.debug_greentext {
    color: var(--erpds-ok, #2E8540);
    font-weight: bold;
}

.debug_boldtext {
    font-weight: bold;
}

/* Диалоговое аякс-окно */
#dialog-overlay {
    width: 100%;
    height: 100%;
    opacity: 0.5;
    background: #000;
    position: fixed;
    top: 0px;
    left: 0;
    z-index: 3000;
    display: none;
}

#dialogConfirmOverlay {
    width: 100%;
    height: 100%;
    opacity: 0.5;
    background: #000;
    position: fixed;
    top: 0px;
    left: 0;
    z-index: 7000;
    display: none;
}

#dialog-box {
    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    background: #fff;
    position: fixed;
    z-index: 5000;
    display: none;
    max-width: calc(100vw - 32px);
    box-sizing: border-box;
}

#dialog-box .dialog-content {
    margin: 10px;
}

#dialog-box .dialog_header {
    background: var(--main-color);
    width: 100%;
    margin: -10px;
    padding: 10px;
    color: #fff;
}

#dialog-box .deleteDialog {
    background: var(--erpds-bad, #B62A26);
    width: 100%;
    margin: -10px;
    padding: 10px;
    color: #fff;
    cursor: move;
}

#dialog-box ul {
    padding: 10px;
    margin-left: -15px;
    list-style: square inside;
}

#dialog-box li {
    padding: 5px;
    border: none;
    display: list-item;
    text-align: left;
}

#dialogConfirmbox {
    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    background: #fff;
    position: fixed;
    z-index: 10000;
    display: none;
}

#dialogConfirmbox .dialogConfirmContent {
    margin: 10px;
}

#dialogConfirmbox .dialog_header {
    background: var(--main-color);
    width: 100%;
    margin: -10px;
    padding: 10px;
    color: #fff;
    cursor: move;
}

#dialogConfirmbox .deleteDialog {
    background: var(--erpds-bad, #B62A26);
    width: 100%;
    margin: -10px;
    padding: 10px;
    color: #fff;
    cursor: move;
}

#dialogConfirmbox ul {
    padding: 10px;
    margin-left: -15px;
    list-style: square inside;
}

#dialogConfirmbox li {
    padding: 5px;
    border: none;
    display: list-item;
    text-align: left;
}

.div_map_equip {
    position: absolute;
    right: 10px;
    top: 80px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    max-width: 50%;
    max-height: 80%;
    background: var(--erpds-surface-2, #F6F7F9);
    padding: 5px;
    border-radius: 6px;
}

.div_map_equip .window_header {
    background: var(--main-color);
    width: 100%;
    margin-left: -7px;
    margin-top: -7px;
    padding: 10px 10px 10px 4px;
    color: #fff;
}

#region_select_id {
    position: absolute;
}

.div_table {
    border: 0px solid black;
    overflow: visible;
}

.div_table .a_cell {
    color: #000;
    text-decoration: none;
}

.div_table .a_cell:hover, a:active, a:focus {
    text-decoration: underline;
}

.div_table td {
    padding: 3px;
    margin: 0px;
    border-top: 1px solid black;
    border-right: 1px solid black;
}

.div_table .first_td {
    border-left: 1px solid black;
}

.div_table .last_tr {
    border-bottom: 1px solid black;
}

.div_table .total_tr {
    background: var(--erpds-border, #DDE1E8);
}

.div_table .total_td {
    background: var(--erpds-surface-2, #F6F7F9);
}

.div_table .td_small {
    font-size: smaller;
}

.div_ipnet {
    margin-bottom: 8px;
    padding: 6px;
    background: #f4efef;
    border-left: 3px solid var(--main-color);
    padding-left: 5px;
    font-size: 15px;
    font-weight: bold;
}

.div_ipnet_hide {
    margin-bottom: 8px;
    padding: 6px;
    background: #ADADAD;
    padding-left: 5px;
    font-size: 15px;
    font-weight: bold;
    width: 653px;
    color: #fff;
}

.div_ipnet_hide a {
    color: #fff;
}

.div_courier {
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 5px;
    font-family: 'Courier', 'sans-serif', Tahoma, Geneva, Helvetica;
    border: 1px solid #000;
}

#map_add_obj_id {
    position: fixed;
    top: 0px;
    background: #fff;
    padding: 10px;
    left: 50%;
    margin-left: -200px;
    z-index: 20;
    max-width: calc(100vw - 32px);
    box-sizing: border-box;
}

#map_add_obj_id .dialog_header {
    background: var(--main-color);
    width: 100%;
    margin: -10px;
    padding: 10px;
    color: #fff;
}

.att_blink {
    display: inline-block;
    background-color: var(--erpds-bad-soft, #F5DDD9);
    padding: 1px 6px;
    border: 1px solid var(--erpds-bad, #B62A26);
    color: var(--erpds-bad-text, #821B18);
    font-size: 8pt;
    border-radius: 3px;
    font-weight: 600;
}

.comment_0 {
}

.comment_1 {
    background-color: var(--erpds-surface-2, #F6F7F9);
}

.comment_author {
    color: #8482FF;
}

#task_apart_used_info2_id {
    margin-top: 10px;
    padding: 3px;
    border: 6px solid #800000;
    border-radius: 6px 6px 6px 6px;
    background-color: var(--erpds-bad-soft, #F5DDD9);
    font-weight: bold;
}

#task_apart_task_yet_info2_id {
    margin-top: 10px;
    padding: 3px;
    border: 6px solid #4B799B;
    border-radius: 6px 6px 6px 6px;
    background-color: #DDF4FF;
}

#task_building_task_yet_info_id {
    margin-top: 10px;
    padding: 3px;
    border: 6px solid #884a48;
    border-radius: 6px 6px 6px 6px;
    background-color: #f3d8d2;
}

#filter_button_id {
    width: 150px;
}

.table_table {
    border-spacing: 0px;
    position: relative;
    width: 100%;
}

.table_table tr {
    position: relative;
}

.table_table tbody tr:hover {
    background: var(--main-color-table-hover);
}

.table_table td {
    position: relative;
}

.table_legend {
    font-weight: bold;
    background: none;
    text-align: center;
    vertical-align: middle;
    font-size: 14px !important;
}

.table_legend td {
    border-bottom: 3px solid var(--erpds-border, #DDE1E8) !important;
    padding: 10px 5px;
    margin: 1px 0px;
}

.table_table thead tr {
    background: var(--erpds-surface-2, #F6F7F9);
    border-bottom: 2px solid var(--erpds-border, #DDE1E8);
}

.table_table thead td,
.table_table thead th {
    font-weight: 600;
    color: var(--erpds-text-muted, #525A66);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 8px 6px;
}

.table_item {
    background: none;
    font-size: 13px;
    vertical-align: middle;
}

.table_item td {
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
    padding: 6px 6px;
    margin: 1px 0px;
}

.table_item_white {
    background: var(--main-color-table_item_white);
    color: var(--main-color-text_table_item_white);
}

.table_item_white:hover {
    background: var(--main-color-table-hover, #E5EAFB);
    color: var(--main-color-text);
}

.table_item_gray {
    background: var(--main-color-body-background-second);
}

.table_item_gray:hover {
    background: var(--main-color-table-hover, #E5EAFB);
    color: var(--main-color-text);
}

.table_item_total {
    background: var(--erpds-surface-2, #F6F7F9);
    font-weight: bold;
}

#login_page #login_page_toplogo {
    width: 100%;
    height: 301px;
}

#login_page #login_page_info {
    width: 600px;
    max-width: calc(100vw - 24px);
    background: rgba(0, 0, 0, 0.52);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    padding: 16px 22px;
    font-size: 15px;
    line-height: 1.6;
}

/* Демо-логин: контент-driven flex-колонка вместо абсолютных magic-чисел.
   Скоуп :has(#login_page_info) — обычный логин (без demo-блока) не затрагивается.
   Футер остаётся absolute снизу, padding-bottom освобождает под него место. */
#login_page:has(#login_page_info) {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    min-height: 100vh;
    min-height: 100dvh;
    padding: 16px 0 0;
    box-sizing: border-box;
    overflow-y: auto;
}

#login_page:has(#login_page_info) #login_page_toplogo {
    display: none;
}

#login_page:has(#login_page_info) #login_page_info,
#login_page:has(#login_page_info) #login_page_form {
    position: static;
    transform: none;
    left: auto;
    top: auto;
    bottom: auto;
    margin: 0;
    flex: 0 0 auto;
}

/* Футер в поток flex: margin-top:auto прижимает его к низу при коротком контенте,
   при длинном — страница скроллится. Перекрытия с формой невозможны. */
#login_page:has(#login_page_info) #login_page_footer {
    position: static;
    margin-top: auto;
    width: 100%;
    flex: 0 0 auto;
}

/* На узких экранах прячем ознакомительный текст (реквизиты — суть demo, остаются)
   и поджимаем карточку, чтобы flex-стопка влезла без скролла */
@media (max-width: 600px) {
    #login_page #login_page_info .login-demo-desc {
        display: none;
    }
    #login_page:has(#login_page_info) #login_page_form #divForm {
        padding: 16px;
    }
}

#login_page #login_page_info h1 {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 8px;
}

#login_page #login_page_info .login-demo-desc {
    opacity: 0.82;
    margin-bottom: 12px;
    font-size: 13px;
    line-height: 1.45;
}

#login_page #login_page_info .login-demo-creds {
    display: grid;
    grid-template-columns: auto 1fr 1fr;
    gap: 4px 16px;
    align-items: center;
    font-size: 14px;
}

#login_page #login_page_info .login-demo-creds .cred-lang {
    font-weight: 600;
    letter-spacing: 0.04em;
    font-size: 13px;
    opacity: 0.75;
    white-space: nowrap;
}

#login_page #login_page_info .login-demo-creds .cred-val {
    font-family: ui-monospace, "SF Mono", "Fira Code", Consolas, monospace;
    background: rgba(255, 255, 255, 0.12);
    border-radius: 5px;
    padding: 2px 8px;
    font-size: 13px;
    letter-spacing: 0.02em;
    white-space: nowrap;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background 0.15s ease, border-color 0.15s ease;
    position: relative;
}

#login_page #login_page_info .login-demo-creds .cred-val:hover {
    background: rgba(255, 255, 255, 0.22);
    border-color: rgba(255, 255, 255, 0.35);
}

#login_page #login_page_info .login-demo-creds .cred-val:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.7);
    outline-offset: 1px;
}

#login_page #login_page_info .login-demo-creds .cred-val.is-copied {
    background: rgba(46, 133, 64, 0.55);
    border-color: rgba(120, 220, 150, 0.6);
}

#login_page #login_page_info .login-demo-creds .cred-val.is-copied::after {
    content: "Скопировано";
    position: absolute;
    left: 50%;
    bottom: calc(100% + 4px);
    transform: translateX(-50%);
    font-family: Inter, sans-serif;
    font-size: 11px;
    letter-spacing: 0;
    white-space: nowrap;
    background: rgba(0, 0, 0, 0.85);
    color: #fff;
    padding: 2px 7px;
    border-radius: 4px;
    pointer-events: none;
}

#login_page #login_page_info .login-demo-notice {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 16px;
    padding: 11px 13px;
    background: rgba(255, 255, 255, 0.10);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-left: 3px solid var(--erpds-info, #2563B8);
    border-radius: 8px;
    font-size: 13px;
    line-height: 1.45;
    text-align: left;
}

#login_page #login_page_info .login-demo-notice__icon {
    flex: 0 0 auto;
    margin-top: 1px;
    opacity: 0.85;
}

#login_page #login_page_info .login-demo-notice__text {
    opacity: 0.92;
}

#login_page #login_page_info .login-demo-notice__en {
    display: block;
    margin-top: 5px;
    font-size: 12px;
    opacity: 0.68;
}

#login_page #login_page_alert {
    width: 360px;
    left: 50%;
    top: 50%;
    margin-left: -175px;
    margin-top: -290px;
    position: fixed;
    background: rgba(0, 0, 0, 0.15);
    box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.3);
    padding: 10px;
}

#login_page #login_page_alert_inside {
    background: #fff;
    position: relative;
    background-color: #FFF;
    padding: 20px;
    padding-left: 80px;
    font-size: 17px;
}

/* Glass-стиль алерта логина (соответствует .update_status / .label_error) */
#login_page.login-canvas-bg #login_page_alert {
    background: transparent;
    box-shadow: none;
    padding: 0;
}

#login_page.login-canvas-bg #login_page_alert_inside {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    background: rgba(255, 255, 255, 0.86);
    backdrop-filter: blur(20px) saturate(140%);
    -webkit-backdrop-filter: blur(20px) saturate(140%);
    border: 1px solid rgba(185, 28, 28, 0.28);
    border-left: 3px solid var(--erpds-bad, #B62A26);
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(31, 55, 120, 0.18);
    padding: 18px 20px;
    color: var(--erpds-bad-text, #821B18);
}

#login_page.login-canvas-bg #login_page_alert_inside .login-alert-icon {
    flex: 0 0 auto;
    margin-top: 1px;
    font-size: 24px;
    color: var(--erpds-bad, #B62A26);
}

#login_page.login-canvas-bg #login_page_alert_inside .login-alert-text {
    font-size: 15px;
    line-height: 1.4;
}

#login_page #login_page_pda {
    width: 64px;
    height: 64px;
    display: block;
    position: fixed;
    bottom: 60px;
    /*left: 50%;
    margin-left: -32px;
    */
    right: 0;
}

#login_page #login_page_form {
    width: 100%;
    max-width: 380px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
    background: transparent;
    padding: 0;
}

#login_page #login_page_form #divForm {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(20px) saturate(140%);
    -webkit-backdrop-filter: blur(20px) saturate(140%);
    border: 1px solid rgba(255, 255, 255, 0.7);
    border-radius: 20px;
    box-shadow: 0 20px 60px rgba(31, 55, 120, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.65);
    padding: 24px 20px;
    position: relative;
    animation: lpFloat 6s ease-in-out infinite;
}

@keyframes lpFloat {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-7px); }
}

@media (prefers-reduced-motion: reduce) {
    #login_page #login_page_form #divForm {
        animation: none;
    }
}

#login_page #login_page_form .title {
    margin-bottom: 10px;
    font-size: 21px;
}

#login_page #login_page_form .field {
    width: 100%;
    box-sizing: border-box;
    height: 44px;
    line-height: 24px;
    padding: 0 14px;
    font: 14px/24px var(--erpds-sans);
    color: var(--erpds-text, #0F172A);
    background: var(--erpds-surface, #FFF);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: 8px;
    margin-bottom: 10px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

#login_page #login_page_form .field:focus {
    outline: none;
    border-color: var(--erpds-accent, #1871a5);
    box-shadow: 0 0 0 3px var(--erpds-accent-soft, #deedf5);
}

/* Chrome/Safari autofill — жёлтый фон ломал стиль поля; держим surface+текст */
#login_page #login_page_form .field:-webkit-autofill,
#login_page #login_page_form .field:-webkit-autofill:hover,
#login_page #login_page_form .field:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--erpds-text, #0F172A);
    -webkit-box-shadow: 0 0 0 1000px var(--erpds-surface, #FFF) inset;
    caret-color: var(--erpds-text, #0F172A);
}

#login_page #login_page_form .button {
    width: 100%;
    box-sizing: border-box;
    font-size: 15px;
    font-weight: 600;
    height: 44px;
    margin-top: 6px;
    padding: 0 16px;
    background: var(--main-color);
    color: #FFF;
    border: 0;
    outline: 0;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s ease, transform 0.06s ease;
}

#login_page #login_page_form .button:hover {
    background: var(--main-color-button-hover);
}

#login_page #login_page_form .button:active {
    transform: translateY(1px);
}

/* Antigravity: кнопка-градиент + мягкое свечение, поля скруглены под карточку */
#login_page.login-canvas-bg #login_page_form .button {
    height: 46px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--erpds-accent, #1871a5), #3b82f6);
    box-shadow: 0 6px 18px rgba(40, 110, 200, 0.32);
}

#login_page.login-canvas-bg #login_page_form .button:hover {
    background: linear-gradient(135deg, #1871a5, #2f6fd6);
    box-shadow: 0 8px 22px rgba(40, 110, 200, 0.40);
}

#login_page.login-canvas-bg #login_page_form .field {
    height: 46px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.6);
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease, transform 0.12s ease;
}

#login_page.login-canvas-bg #login_page_form .field:hover {
    background: rgba(255, 255, 255, 0.8);
}

#login_page.login-canvas-bg #login_page_form .field:focus {
    background: #fff;
    border-color: var(--erpds-accent, #1871a5);
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.18), 0 4px 14px rgba(40, 110, 200, 0.14);
    transform: translateY(-1px);
}

#login_page.login-canvas-bg #login_page_form .button {
    transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease;
}

#login_page.login-canvas-bg #login_page_form .button:hover {
    transform: translateY(-2px);
}

#login_page.login-canvas-bg #login_page_form .button:active {
    transform: translateY(0);
    box-shadow: 0 3px 10px rgba(40, 110, 200, 0.30);
}

/* Loading-состояние кнопки (submit идёт) */
#login_page #login_page_form .button.is-loading {
    opacity: 0.72;
    cursor: progress;
    transform: none;
}

#login_page #login_page_form .button:disabled {
    cursor: not-allowed;
}

/* Переключатель видимости пароля */
#login_page #login_page_form .login-pass-wrap {
    position: relative;
}

#login_page #login_page_form .login-pass-wrap .field {
    padding-right: 44px;
}

#login_page #login_page_form .login-pass-toggle {
    position: absolute;
    top: 0;
    right: 0;
    width: 44px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: transparent;
    border: 0;
    color: var(--erpds-text-muted, #525A66);
    cursor: pointer;
    border-radius: 0 10px 10px 0;
    transition: color 0.15s ease;
}

#login_page #login_page_form .login-pass-toggle:hover {
    color: var(--erpds-accent, #1871a5);
}

#login_page #login_page_form .login-pass-toggle:focus-visible {
    outline: 2px solid var(--erpds-accent, #1871a5);
    outline-offset: -2px;
}

/* Caps Lock индикатор */
#login_page #login_page_form .login-caps-hint {
    display: none;
    align-items: center;
    gap: 6px;
    margin: -6px 0 12px;
    font-size: 12px;
    color: var(--erpds-warn, #b45309);
}

#login_page #login_page_form .login-caps-hint.is-visible {
    display: flex;
}

#login_page #login_page_form > .update_status {
    width: 100%;
    box-sizing: border-box;
    margin: 0 0 12px;
    padding: 10px 14px;
    border: 1px solid rgba(185, 28, 28, 0.28);
    border-left: 3px solid #b91c1c;
    border-radius: 12px;
    background: rgba(254, 226, 226, 0.86);
    color: #7f1d1d;
    box-shadow: 0 12px 30px rgba(31, 55, 120, 0.10);
    font-size: 13px;
    line-height: 1.35;
    text-align: left;
    overflow-wrap: anywhere;
    backdrop-filter: blur(16px) saturate(140%);
    -webkit-backdrop-filter: blur(16px) saturate(140%);
}

#login_page #login_page_form > .update_status strong {
    font-weight: 700;
}

#login_page #login_page_form > .update_status .update_status__tickets_teaser {
    font-size: 12px;
}

/* Inline-ошибка входа: стеклянная красная карточка + shake */
#login_page.login-canvas-bg #login_page_form .label_error {
    background: rgba(220, 38, 38, 0.10);
    border: 1px solid rgba(220, 38, 38, 0.35);
    color: #b91c1c;
    border-radius: 10px;
    padding: 10px 14px;
    margin-bottom: 10px;
    font-size: 13px;
    line-height: 1.4;
    animation: lpShake 0.4s ease;
}

@keyframes lpShake {
    0%, 100% { transform: translateX(0); }
    20%      { transform: translateX(-6px); }
    40%      { transform: translateX(6px); }
    60%      { transform: translateX(-4px); }
    80%      { transform: translateX(4px); }
}

@media (prefers-reduced-motion: reduce) {
    #login_page.login-canvas-bg #login_page_form .label_error {
        animation: none;
    }
}

#login_page #login_page_form #link_cabinet {
    position: absolute;
    right: 3px;
    bottom: 30px;
    color: var(--main-color);
    padding-right: 20px;
}

#login_page #login_page_form #link_cabinet:hover {
    color: var(--erpds-text-muted, #525A66);
}

#login_page_footer {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    background: rgba(0, 0, 0, 0.2);
    box-shadow: inset 0px 3px 3px rgba(0, 0, 0, 0.2);
    height: 50px;
    min-width: 0;
}

#login_page_footer #down_copy {
    position: absolute;
    top: 15px;
    left: 25px;
    color: #fff;
}

#login_page_footer #down_copy a {
    color: var(--main-color);
}

#login_page_footer #down_copy a:hover {
    color: var(--erpds-text-muted, #525A66);
}

/* PWA: футер страницы входа — safe-area, без горизонтального скролла, касаемая зона установки */
#login_page_footer.login-page-footer-pwa {
    min-width: 0;
    width: 100%;
    height: auto;
    min-height: 52px;
    box-sizing: border-box;
    padding: 10px 12px calc(12px + env(safe-area-inset-bottom, 0px)) 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

#login_page_footer.login-page-footer-pwa #down_copy {
    position: static;
    top: auto;
    left: auto;
    width: 100%;
    max-width: 100%;
    text-align: center;
    line-height: 1.45;
    font-size: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}

#login_page_footer.login-page-footer-pwa #down_copy a {
    word-break: break-all;
}

#login_page_footer.login-page-footer-pwa .login-pwa-install-wrap {
    display: none;
    flex-basis: 100%;
    justify-content: center;
}

@media screen and (max-width: 900px) {
    #login_page_footer.login-page-footer-pwa .login-pwa-install-wrap:not(.login-pwa-install-unavailable) {
        display: flex;
    }
}

#login_page_footer.login-page-footer-pwa .login-pwa-install-wrap.login-pwa-install-unavailable {
    display: none !important;
}

#login_page_footer.login-page-footer-pwa .login-pwa-install-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 8px 14px;
    margin: 4px 0 0;
    box-sizing: border-box;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    text-decoration: none;
    background: var(--main-color);
    border-radius: 10px;
    border: none;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}

#login_page_footer.login-page-footer-pwa .login-pwa-install-btn:active {
    opacity: 0.92;
}

#login_page_footer.login-page-footer-pwa .login-pwa-install-btn:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}

/* Вход: строка копирайта отдельно; версия/ссылка/PWA — второй блок (на очень узком экране — сетка в две колонки) */
#login_page_footer.login-page-footer-pwa .login-footer-down-copy {
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
}

#login_page_footer.login-page-footer-pwa .login-footer-down-primary {
    text-align: center;
    width: 100%;
}

#login_page_footer.login-page-footer-pwa .login-footer-down-secondary {
    width: 100%;
}

/* На низком viewport (мало высоты видимой области — адресная строка браузера)
   раздутый футер (открытый <details> с версией/PWA-кнопкой) наезжает на форму логина,
   т.к. #login_page_footer абсолютно спозиционирован снизу и растёт вверх с контентом. */
@media (max-height: 700px), (max-width: 480px) {
    #login_page_footer.login-page-footer-pwa .login-footer-down-secondary {
        display: none;
    }
}

#login_page_footer.login-page-footer-pwa .login-footer-down-meta {
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
}

#login_page_footer.login-page-footer-pwa .login-footer-down-meta-summary {
    list-style: none;
    cursor: pointer;
    font-size: 11px;
    opacity: 0.92;
    padding: 2px 0 6px;
    text-align: center;
    user-select: none;
}

#login_page_footer.login-page-footer-pwa .login-footer-down-meta-summary::-webkit-details-marker {
    display: none;
}

@media screen and (min-width: 380px) {
    #login_page_footer.login-page-footer-pwa .login-footer-down-meta > .login-footer-down-meta-summary {
        display: none;
    }
}

#login_page_footer.login-page-footer-pwa .login-footer-down-meta-inner {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    justify-content: center;
    align-items: center;
}

@media screen and (max-width: 379px) {
    #login_page_footer.login-page-footer-pwa .login-footer-down-meta-inner {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        justify-items: center;
        align-items: start;
        gap: 8px 10px;
    }

    #login_page_footer.login-page-footer-pwa .login-footer-down-meta-inner #down_copy_caption_id {
        grid-column: 1 / -1;
        text-align: center;
    }

    #login_page_footer.login-page-footer-pwa .login-footer-down-meta-inner .login-pwa-install-wrap {
        grid-column: 1 / -1;
        justify-self: stretch;
    }

    #login_page_footer.login-page-footer-pwa .login-footer-down-meta-inner .login-pwa-install-btn {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
}

#to_top {
    position: fixed;
    left: auto;
    right: max(16px, env(safe-area-inset-right, 0px));
    bottom: calc(100px + env(safe-area-inset-bottom, 0px));
    z-index: 10001;
    margin: 0;
}

body.erp-hide-to-top #to_top {
    display: none !important;
}

#to_top a {
    width: 68px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    box-sizing: border-box;
    padding: 8px 6px 7px;
    text-align: center;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
    color: rgba(44, 58, 74, 0.86);
    background-color: rgba(255, 255, 255, 0.62);
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 16px;
    box-shadow: 0 12px 34px rgba(34, 43, 57, 0.18), 0 2px 8px rgba(34, 43, 57, 0.1);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    backdrop-filter: blur(14px) saturate(140%);
    -webkit-transition: color .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
    -moz-transition: color .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
    transition: color .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

#to_top a:hover,
#to_top a:focus-visible {
    color: var(--main-color);
    background-color: rgba(255, 255, 255, 0.82);
    border-color: rgba(75, 131, 181, 0.34);
    box-shadow: 0 16px 40px rgba(34, 43, 57, 0.24), 0 4px 12px rgba(34, 43, 57, 0.14);
    transform: translateY(-2px);
}

#to_top span {
    width: 34px;
    height: 34px;
    display: block;
    box-sizing: border-box;
    color: inherit;
    padding-top: 3px;
    font-size: 22pt;
    border-radius: 50%;
    -webkit-transition: color .2s ease;
    -moz-transition: color .2s ease;
    transition: color .2s ease;
}

#to_top a:hover span,
#to_top a:focus-visible span {
    color: inherit;
}

@media (prefers-reduced-motion: reduce) {
    #to_top a,
    #to_top span {
        -webkit-transition: none;
        -moz-transition: none;
        transition: none;
    }
    #to_top a:hover,
    #to_top a:focus-visible {
        transform: none;
    }
}

#div_failuremsg {
    margin: 10px;
    width: 400px;
    border: 1px solid #000;
}

#div_failuremsg_div {
    padding: 4px;
}

#div_failuremsg_header {
    background-color: var(--main-color);
    color: #fff;
    font-weight: bold;
    padding: 2px;
}

#div_yellow_info {
}

#div_yellow_info .div_info_block {
    padding: 8px 10px;
    background: var(--erpds-surface-2, #F6F7F9);
    border-left: 3px solid var(--erpds-border, #DDE1E8);
    border-radius: 0 8px 8px 0;
    margin-bottom: 5px;
}

#div_yellow_info .div_info_block_advert {
    background: var(--erpds-ok-soft, #E5F1E6);
    border-left: 3px solid var(--erpds-ok, #2E8540);
    border-radius: 0 8px 8px 0;
}

#div_yellow_info .div_info_block .caption {
    font-size: 13px;
    font-weight: bold;
    margin-bottom: 2px;
    text-transform: uppercase;
}

#div_yellow_info .div_info_block .text {
}

#div_yellow_info .div_info_block .text span {
    font-weight: bold;
    color: var(--erpds-text-muted, #525A66);
}

#div_yellow_info .important {
    background: var(--main-color-yellow-info);
    border-left: 3px solid var(--main-color-yellow-info-border);
}

#div_yellow_info .div_info_block a {
    color: var(--main-color);
    border-radius: 5px;
}

#div_yellow_info .div_info_block a:hover {
    color: var(--erpds-text-muted, #525A66);
}

#div_news {
    margin: 12px 0px;
}

#div_news .div_news_block {
    padding: 12px 14px;
    background: var(--main-color-news_block);
    border-left: 3px solid var(--erpds-border, #DDE1E8);
    margin-bottom: 12px;
    border-radius: 5px;
    box-shadow: 1px 1px 2px 1px rgba(44, 57, 74, .25) !important;
}

#div_news .div_news_block h3 {
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
}

#div_news .div_news_block .text {
    margin-top: -10px;
    margin-bottom: 10px;
}

#div_news .msg_block {
    background: var(--erpds-ok-soft, #E5F1E6);
    border-left: 3px solid var(--erpds-ok, #2E8540);
}

#div_news .important {
    background: var(--main-color-news_block_important);
    border-left: 1px solid var(--erpds-warn, #E8A020);
}

#div_news .high {
    background: #f35e68;
    color: #fff;
    border-left: 1px solid #f35e68;
    box-shadow: 1px 1px 2px 1px var(--erpds-border, #DDE1E8) !important;
}

.div_alert_news {
    padding: 12px;
    margin-bottom: 12px;
    background: var(--erpds-bad, #B62A26);
    border-left: 3px solid var(--erpds-bad-text, #821B18);
    color: #fff;
    border-radius: 6px;
}

.div_alert_news a {
    color: #fff;
    text-decoration: underline;
    text-decoration-color: rgba(255,255,255,0.6);
}

.div_alert_news a:hover {
    color: #fff;
    text-decoration-color: #fff;
}

#div_news .div_news_block a {
    color: var(--main-color-a);
}

#div_news .div_news_block a:hover {
    color: var(--erpds-text-muted, #525A66);
}

.map_frame {
    border: 5px solid rgba(198, 195, 198, 0.5);
    border-radius: 6px;
}

#scheme_menu_panel {
    height: 30px;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 5px;
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
}

#map_edit_panel {
    height: 30px;
    position: fixed;
    top: 39px;
    left: 0;
    width: 100%;
    padding: 5px;
    background: var(--main-color-hover);
    color: #fff;
    z-index: 10;
}

#map_edit_panel a {
    text-decoration: none;
}

#map_edit_panel .obj-button {
    margin-left: 5px;
    margin-top: -3px;
    margin-right: 5px;
    padding: 3px;
    background: var(--erpds-surface-2, #F6F7F9);
    border: 1px solid var(--erpds-border, #DDE1E8);
    float: left;
    border-radius: 3px;
}

#map_edit_panel .obj-button:hover {
    background: var(--erpds-border, #DDE1E8);
}

#map_edit_panel .obj-button a {
    color: var(--erpds-text, #0F172A);
}

#map_edit_panel .obj-button2 {
    margin-left: 5px;
    margin-top: -3px;
    margin-right: 5px;
    padding: 3px;
    padding-left: 7px;
    background: var(--erpds-surface-2, #F6F7F9);
    border: 1px solid var(--erpds-border, #DDE1E8);
    float: left;
    border-radius: 3px;
}

#map_edit_panel .obj-button2:hover {
    background: var(--erpds-border, #DDE1E8);
}

#map_edit_panel .obj-button2 a {
    color: #000;
}

#map_menu_panel {
    height: auto;
    min-height: 30px;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 5px;
    box-sizing: border-box;
    z-index: 1000;
}

#map_menu_panel table {
    width: 100%;
}

#map_menu_panel table td:first-child {
    white-space: nowrap;
    padding-right: 10px;
    vertical-align: middle;
}

#map_menu_panel .menu_down {
    margin-left: 5px;
    margin-top: 2px;
    margin-right: 5px;
    padding: 3px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    float: left;
    background-color: var(--erpds-surface-2, #F6F7F9);
    border-radius: 3px;
}

#map_menu_panel .menu_down:hover {
    background-color: var(--erpds-border, #DDE1E8);
}

#map_menu_panel .menu_down a {
    color: #000;
    text-decoration: none;
}

.map_menu_down {
    display: inline;
    float: left;
    height: 100%;
    width: 16px;
    background-color: #fff;
    padding-left: 5px;
    padding-top: 1px;
    margin-top: 0px
}

.map_menu_down:hover {
    background-color: var(--erpds-border, #DDE1E8);
}

.button_inside {
    display: inline;
    float: left;
    padding-left: 5px;
    padding-right: 5px;
    width: 32px;
    height: 100%;
}

.unselected_button {
    cursor: pointer;
    margin-left: 5px;
    margin-top: 2px;
    margin-right: 5px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    float: left;
    border-radius: 3px;
    background-color: var(--erpds-surface-2, #F6F7F9);
    height: 23px;
}

.unselected_button:hover {
    background: var(--erpds-border, #DDE1E8);
}

.unselected_button div {
    margin-top: 2px;
}

.selected_button {
    float: left;
    color: var(--main-color);
    background-color: var(--erpds-accent-soft, #E0EAF6);
    border: 1px solid var(--main-color);
    border-radius: 3px;
    height: 28px;
    margin-top: 0px;
    margin-left: 5px;
    margin-right: 5px;
}

.selected_button:hover {
    background: var(--main-color-table-hover, #E5EAFB);
}

.selected_button div {
    margin-top: 5px;
}

/* === ERPDS filter chips (global): saved filters, map layers, similar toggles === */
.erpds-filter-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin: 0 0 10px;
    padding: 0;
}

.erpds-filter-chip,
.selected_layer,
.unselected_layer,
.unselected_layer2 {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 220px;
    margin: 0;
    padding: 4px 10px;
    border-radius: 20px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.35;
    font-family: var(--erpds-sans, inherit);
    box-sizing: border-box;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.unselected_layer,
.unselected_layer2 {
    background: var(--erpds-surface, #FFFFFF);
    color: var(--erpds-text-muted, #525A66);
}

.unselected_layer:hover,
.unselected_layer2:hover {
    background: var(--erpds-accent-soft, #E5EAFB);
    border-color: var(--erpds-accent-soft-hover, #cce0ed);
    color: var(--erpds-accent-text, #125d88);
}

.selected_layer {
    background: var(--erpds-accent, #1871a5);
    border-color: var(--erpds-accent, #1871a5);
    color: var(--erpds-text-on-accent, #FFFFFF);
    font-weight: 600;
}

.selected_layer:hover {
    background: var(--erpds-accent-hover, #125d88);
    border-color: var(--erpds-accent-hover, #125d88);
}

.erpds-filter-chip__link,
.selected_layer a,
.unselected_layer a,
.unselected_layer2 a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    color: inherit;
    text-decoration: none;
}

.erpds-filter-chip__label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.selected_layer .us-icon,
.selected_layer a .us-icon {
    color: inherit;
}

.erpds-filter-chip__remove {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    margin-left: -2px;
    opacity: 0;
    transition: opacity 0.15s ease;
}

.erpds-filter-chip:hover .erpds-filter-chip__remove,
.erpds-filter-chip:focus-within .erpds-filter-chip__remove,
.erpds-filter-chip.selected_layer .erpds-filter-chip__remove {
    opacity: 1;
}

@media (hover: none) {
    .erpds-filter-chip .erpds-filter-chip__remove {
        opacity: 1;
    }
}

.erpds-filter-chip--default:not(.selected_layer) {
    background: transparent;
    border-style: dashed;
}

.erpds-filter-chip__remove a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    color: var(--erpds-text-faint, #6B7280);
    text-decoration: none;
}

.erpds-filter-chip__remove a:hover {
    background: var(--erpds-bad-soft, #F5DDD9);
    color: var(--erpds-bad, #B62A26);
}

.unselected_layer a,
.unselected_layer2 a {
    color: inherit;
}

@media (max-width: 900px) {
    .erpds-filter-chips--saved {
        flex-wrap: nowrap;
        align-items: stretch;
        gap: 5px;
        margin: 0 0 6px;
        padding: 0 8px 6px 0;
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: thin;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
        scroll-padding-inline: 8px;
        touch-action: pan-x;
    }

    .erpds-filter-chips--saved .erpds-filter-chip,
    .erpds-filter-chips--saved .selected_layer,
    .erpds-filter-chips--saved .unselected_layer,
    .erpds-filter-chips--saved .unselected_layer2 {
        flex: 0 0 auto;
        min-height: 32px;
        max-width: min(42vw, 160px);
        padding: 3px 8px;
        border-radius: 16px;
        font-size: 12px;
        line-height: 1.25;
        scroll-snap-align: start;
    }

    .erpds-filter-chips--saved .erpds-filter-chip__link {
        min-height: 24px;
    }

    .erpds-filter-chips--saved .erpds-filter-chip__remove a {
        width: 22px;
        height: 22px;
    }
}

#ttip {
    z-index: 999;
    border: 1px solid var(--erpds-border, #DDE1E8);
    background-color: var(--erpds-surface-2, #F6F7F9);
    padding: 5px;
    opacity: 0.85;
}

#ttip.calendar-task-tooltip {
    z-index: 1200;
    max-width: min(360px, calc(100vw - 32px));
    padding: 10px 12px;
    border-radius: 8px;
    background: var(--erpds-surface, #fff);
    color: var(--erpds-text, #1f2937);
    opacity: 0.98;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.18);
    line-height: 1.35;
    overflow-wrap: anywhere;
}

#ttip.calendar-task-tooltip b {
    display: block;
    margin-bottom: 4px;
    color: var(--erpds-text-strong, #111827);
}

.map_toppanel {
    background: var(--main-color);
    width: 100%;
    margin: -10px;
    padding: 10px;
    color: #fff;
}

.map_toppanel a {
    color: #fff;
}

.map_toppanel a:hover {
    color: rgba(255,255,255,0.75);
}

.j_card_div {
    border: 1px solid var(--erpds-border, #DDE1E8);
    background-color: var(--erpds-surface, #FFFFFF);
    padding: 12px;
    border-radius: var(--erpds-radius, 12px);
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
    margin-bottom: 10px;
    box-sizing: border-box;
    width: 100%;
}

.j_card_div .div_caption {
    text-align: left;
    background-color: transparent;
    padding: 0 0 12px 0;
    margin: 0;
    font-weight: 600;
    font-size: 16px;
    color: var(--erpds-text, #111827);
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
    margin-bottom: 12px;
}

.j_card_div .j_table {
    margin-top: 5px;
    width: 100%;
    font-size: 14px;
    vertical-align: top;
}

.j_card_div .j_table tr {
    height: auto;
    vertical-align: top;
}

.j_card_div .j_table td {
    padding: 6px 0;
}

.j_table_td_left {
    text-align: left;
    font-weight: 500;
    color: var(--erpds-text-faint, #6B7280);
    width: 140px;
    padding-right: 12px;
}

.j_table_td_left_na {
    text-align: left;
    font-weight: 500;
    color: var(--erpds-text-faint, #6B7280);
    max-width: 250px; /* TT-28086 width: 250px; */
    min-width: 150px;
    padding-right: 12px;
}

.j_card_cur_state {
    text-align: left;
    font-weight: bold;
    font-size: 15pt;
    margin: 8px 0px;
}

.j_button {
    width: 24px;
    height: 24px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    padding-right: 0px;
    padding-left: 9px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 3px;
    background-color: var(--erpds-surface-2, #F6F7F9);
    margin: 2px;
    float: left;
}

.j_button:hover {
    background-color: var(--erpds-accent-soft, #E0EAF6);
    border: 1px solid var(--main-color);
    margin: 1px;
    width: 26px;
    height: 26px;
}

.j_button_green {
    background-color: var(--erpds-ok-soft, #E5F1E6);
}

.j_button_blau {
    background-color: var(--erpds-accent-soft, #E0EAF6);
}

.j_button_lock {
    width: 24px;
    height: 24px;
    border: 1px solid #C60000;
    padding-right: 0px;
    padding-left: 9px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 3px;
    margin: 2px;
    cursor: help;
    float: left;
}

.j_button_menu_delete {
    background-color: #FFCACA;
}

.j_button_splitter {
    width: 2px;
    height: 24px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 3px;
    background-color: #848284;
    margin: 2px;
    float: left;
}

.j_button_inside {
    width: 24px;
    height: 24px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    padding-right: 0px;
    padding-left: 9px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 3px;
    background-color: var(--erpds-surface-2, #F6F7F9);
    margin: 2px 0px 2px 2px;
    float: left;
}

.j_button_inside:hover {
    background-color: var(--erpds-accent-soft, #E0EAF6);
    border: 1px solid var(--erpds-accent, #3B5BDB);
}

.j_button_down {
    float: left;
    height: 24px;
    width: 15px;
    margin: 2px 2px 2px 0px;
    background-color: var(--main-color);
    padding-right: 0px;
    padding-left: 3px;
    padding-top: 6px;
    padding-bottom: 6px;
}

.j_button_down:hover {
    background-color: var(--main-color-hover);
}

.j_button_counter {
    float: left;
    height: 24px;
    min-width: 18px;
    margin: 2px 2px 2px 0px;
    background-color: #fff;
    border-right: 1px solid var(--erpds-border, #DDE1E8);
    border-top: 1px solid var(--erpds-border, #DDE1E8);
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: 3px;
    padding-right: 0px;
    padding-left: 0px;
    padding-top: 8px;
    padding-bottom: 2px;
    text-align: center;
}

.j_button_counter:hover {
    background-color: var(--erpds-surface-2, #F6F7F9);
}

.j_button_delete:hover {
    background-color: #FFAEAD;
}

.j_card_comment_div2 {
    border: 1px solid var(--erpds-border, #DDE1E8);
    background-color: #fff;
    padding: 3px;
    border-radius: 3px;
}

.j_card_comment_div {
    border: 1px solid var(--erpds-border, #DDE1E8);
    padding: 3px;
    border-radius: 3px;
    margin-top: 10px;
    margin-bottom: 5px;
}

.j_card_comment_div span {
    font-size: 12pt;
}

.j_card_comment_div_my {
    background-color: #CCC4E6;
}

.j_card_comment_div_author {
    background-color: #ADCBFF;
}

.j_card_comment_div_all {
    background-color: #DEEFFF;
}

.j_card_label_div {
    float: left;
    border: 1px solid var(--erpds-border, #DDE1E8);
    padding: 2px;
    border-radius: 3px;
    margin-bottom: 5px;
    margin-right: 5px;
    background-color: #CEFFCE;
    cursor: help;
}

.j_mywork_div {
    float: left;
    padding: 2px;
    border-radius: 10px;
    margin: 5px;
    padding: 10px;
    min-width: 200px;
    text-align: center;
}

.j_mywork_div_create {
    background-color: #0082C6;
    color: #fff;
    max-width: 200px;
}

.j_mywork_div_watch {
    background-color: #00C742;
    color: #fff;
    max-width: 200px;
}

.j_mywork_div_work {
    background-color: #FF9694;
    color: #fff;
    max-width: 200px;
    line-height: 20px;
}

.j_mywork_div_wo_pers {
    background-color: #000;
    color: #fff;
    max-width: 200px;
}

.j_mywork_div_caption {
    font-size: 17pt;
    font-weight: bold;
}

.j_mywork_div_counter {
    padding-top: 12px;
    padding-bottom: 12px;
    font-size: 21pt;
    font-weight: bold;
    color: var(--erpds-text, #0F172A);
}

.j_mywork_div_counter span {
    background-color: #fff;
    border-radius: 5px;
    padding-right: 10px;
    padding-left: 10px;
}

.j_mywork_div_counter span:hover {
    background-color: var(--erpds-surface-2, #F6F7F9);
}

.j_mywork_div_list {
    margin-top: 9px;
    padding-top: 10px;
    padding-bottom: 10px;
    color: #000;
    text-align: left;

    background-color: #fff;
    border-radius: 5px;
    padding-right: 10px;
    padding-left: 10px;
}

.link_menu_down {
    padding-left: 20px;
}

.input_box {
    color: var(--erpds-text, #0F172A);
    font-size: 14px;
    height: 32px;
    line-height: 32px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    outline: none;
    border-radius: 8px;
    padding: 0 10px;
    padding-right: 10px;
    font-family: var(--erpds-sans);
    transition: border-color 0.12s ease, box-shadow 0.12s ease;
    background: var(--erpds-surface, #fff);
}

.input_box:focus {
    background: var(--erpds-surface, #fff);
    border-color: var(--erpds-accent, #3B5BDB);
    box-shadow: 0 0 0 3px rgba(59, 91, 219, 0.12);
}

/* select и textarea без .input_box — те же токены */
select:not([class]),
select.form-control,
textarea:not([class]),
textarea.form-control {
    color: var(--erpds-text, #0F172A);
    font-size: 14px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    outline: none;
    border-radius: 8px;
    padding: 4px 10px;
    font-family: var(--erpds-sans);
    background: var(--erpds-surface, #fff);
    transition: border-color 0.12s ease, box-shadow 0.12s ease;
}
select:not([class]):focus,
select.form-control:focus,
textarea:not([class]):focus,
textarea.form-control:focus {
    border-color: var(--erpds-accent, #3B5BDB);
    box-shadow: 0 0 0 3px rgba(59,91,219,0.12);
}
textarea:not([class]),
textarea.form-control {
    line-height: 1.5;
    resize: vertical;
}

/* Прочие текстовые .input_field (color-picker и т.п.) — единая рамка как у .input_box.
   Фон/цвет НЕ задаём: iColorPicker сам красит превью выбранным цветом (это данные). */
input.input_field {
    height: 32px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: 8px;
    padding: 0 10px;
    font-size: 14px;
    font-family: var(--erpds-sans);
    outline: none;
    transition: border-color 0.12s ease, box-shadow 0.12s ease;
}
input.input_field:focus {
    border-color: var(--erpds-accent, #3B5BDB);
    box-shadow: 0 0 0 3px rgba(59, 91, 219, 0.12);
}

.find_box {
    background: url('../picture/search_gray.svg') 100% 45% no-repeat;
}

.find_box:focus {
    background: url('../picture/search_blue.svg') 100% 45% no-repeat;
}

/* Глобальная back-ссылка «Вернуться…»: <a><i.fa-chevron-left|fa-arrow-left>текст</a>.
   Сайдбар этих иконок не использует — затрагиваются только контентные back-ссылки. */
a:has(> i.us-icon.fa-chevron-left:first-child),
a:has(> i.us-icon.fa-arrow-left:first-child) {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px 5px 9px;
    margin-bottom: 8px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: 6px;
    background: var(--erpds-surface, #fff);
    color: var(--erpds-text-muted, #525A66);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
    text-decoration: none;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
a:has(> i.us-icon.fa-chevron-left:first-child):hover,
a:has(> i.us-icon.fa-arrow-left:first-child):hover {
    background: var(--erpds-bg-2, #F3F6FA);
    border-color: var(--erpds-accent, #3B5BDB);
    color: var(--erpds-accent, #3B5BDB);
}
a:has(> i.us-icon.fa-chevron-left:first-child) > i.us-icon,
a:has(> i.us-icon.fa-arrow-left:first-child) > i.us-icon {
    font-size: 11px;
    margin: 0;
}

.div_center {
    text-align: center;
}

.div_right {
    text-align: right;
}

.div_bold {
    font-weight: bold;
}

#usersearch {
    height: 38px;
    line-height: 38px;
    width: 100%;
    background: var(--erpds-surface-2, #F6F7F9);
    position: relative;
    margin: 20px 0px;
    border-radius: 5px;
}

#usersearch .field {
    width: -webkit-calc(100% - 80px);
    width: -moz-calc(100% - 80px);
    width: calc(100% - 80px);
    margin-left: 15px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    height: 22px;
    line-height: 22px;
    padding: 0px 5px;
}

#usersearch .button {
    width: 40px;
    height: 38px;
    position: absolute;
    top: 0px;
    right: 0px;
    display: block;
    background: url('../picture/search_white.svg') 50% 50% no-repeat var(--main-color);
    border: none;
    outline: none;
    cursor: pointer;
}

#usersearch .button:hover {
    background: url('../picture/search_gray.svg') 50% 50% no-repeat var(--main-color);
}
#usersearch .button:focus-visible {
    outline: 2px solid var(--erpds-focus, #2563B8);
    outline-offset: 2px;
}

#usersearch .check {
    display: inline-block;
    width: 20%;
    margin-right: 45px;
    margin-left: 15px;
}

#usersearch2 {
    height: 38px;
    line-height: 38px;
    width: 100%;
    background: var(--erpds-surface-2, #F6F7F9);
    position: relative;
    margin: 20px 0px;
}

#usersearch2 .field {
    width: 500px;
    margin-left: 15px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    height: 22px;
    line-height: 22px;
    padding: 0px 5px;
}

#usersearch2 .button {
    width: 40px;
    height: 38px;
    position: absolute;
    top: 0px;
    right: 0px;
    display: block;
    background: url('../picture/search_white.svg') 50% 50% no-repeat var(--main-color);
    border: none;
    outline: none;
    cursor: pointer;
}

#usersearch2 .button:hover {
    background: url('../picture/search_gray.svg') 50% 50% no-repeat var(--main-color);
}
#usersearch2 .button:focus-visible {
    outline: 2px solid var(--erpds-focus, #2563B8);
    outline-offset: 2px;
}

#usersearch2 .check {
    display: inline-block;
    width: 20%;
    margin-right: 45px;
    margin-left: 15px;
}

.j_news2 {
    width: 32px;
    height: 32px;
    margin-left: 5px;
}

.label_wait {
    height: 26px;
    font-size: 15px;
    margin-top: 10px;
    margin-bottom: 10px;
    font-weight: bold;
    background-color: #D5D500;
    padding-left: 13px;
    padding-top: 7px;
    border-radius: 5px;
    color: #000;
}

.label_stop {
    height: 26px;
    font-size: 15px;
    margin-top: 10px;
    margin-bottom: 10px;
    font-weight: bold;
    background-color: var(--erpds-bad-soft, #F5DDD9);
    padding-left: 13px;
    padding-top: 7px;
    border-radius: 5px;
    color: var(--erpds-bad-text, #821B18);
}

.label_alert {
    margin-top: 10px;
    margin-bottom: 10px;
    background: var(--erpds-bad-soft, #F5DDD9);
    padding-left: 33px;
    padding-top: 7px;
    width: 100%;
    border-radius: 5px;
    color: var(--erpds-bad-text, #821B18);
}

.label_error {
    font-size: 15px;
    margin: 10px;
    background-color: var(--erpds-bad-soft, #F5DDD9);
    padding: 10px;
    border-radius: 5px;
    color: var(--erpds-bad-text, #821B18);
}

.morris-hover {
    position: absolute;
    z-index: 1000;
}

.morris-hover.morris-default-style {
    border-radius: 10px;
    padding: 6px;
    color: #666;
    background: rgba(255, 255, 255, 0.8);
    border: solid 2px rgba(230, 230, 230, 0.8);
    font-family: sans-serif;
    font-size: 12px;
    text-align: center;
}

.morris-hover.morris-default-style .morris-hover-row-label {
    font-weight: bold;
    margin: 0.25em 0;
}

.morris-hover.morris-default-style .morris-hover-point {
    white-space: nowrap;
    margin: 0.1em 0;
}

.graph_div {
    border: 1px solid var(--erpds-border, #DDE1E8);
}

.graph_caption {
    font-weight: bold;
    background: var(--erpds-surface-2, #F6F7F9);
    padding-left: 5px;
    padding-right: 5px;
}

.div_sortable_class {
    cursor: pointer;
    margin-top: 5px;
    padding: 5px;
    width: 50%;
    background: var(--erpds-surface-2, #F6F7F9);
    color: var(--erpds-text, #0F172A);
}

.div_sortable_class:hover {
    background: var(--main-color-table-hover, #E5EAFB);
    cursor: crosshair;
}

.div_scheme_port {
    position: absolute;
    font-size: 9pt;
    font-family: var(--erpds-mono);
}

.div_scheme_port2 {
    position: absolute;
    font-size: 7pt;
    font-family: var(--erpds-mono);
}

.div_scheme_att {
    position: absolute;
    font-size: 7pt;
    background-color: #fff;
    padding-left: 2px;
    padding-right: 2px;
    border: 1px solid #000;
    color: #00F;
    font-family: var(--erpds-mono);
}

.div_scheme_att_red {
    position: absolute;
    font-size: 7pt;
    background-color: #fff;
    padding-left: 2px;
    padding-right: 2px;
    border: 1px solid #000;
    color: #f00;
    font-family: var(--erpds-mono);
}

.div_scheme_att_pg {
    position: absolute;
    font-size: 7pt;
    background-color: #F7F700;
    padding-left: 2px;
    padding-right: 2px;
    border: 1px solid #000;
    color: #f00;
    font-family: var(--erpds-mono);
}

.div_scheme_caption {
    position: absolute;
    font-size: 8pt;
    line-height: 1.35;
    text-align: center;
    width: 190px;
    font-family: var(--erpds-mono);
}

.div_scheme_link {
    color: #000;
    text-decoration: none;
}

.div_scheme_link:hover {
    color: var(--main-color);
}

.div_stat_select_kat {
    text-align: right;
    width: 100%;
}

.table_result_class {
    background: var(--erpds-surface-2, #F6F7F9);
    font-weight: bold;
    text-align: right;
}

.div_task_comment {
    overflow: hidden;
    max-height: 105px;
    word-wrap: break-word;
}

.div_task_comment_print {
    overflow: hidden;
    max-height: 1050px;
    word-wrap: break-word;
}

.link_leftmenu_j_count {
    text-decoration: underline;
    font-size: 16px;
}

.link_leftmenu_j_count:hover {
    color: #A5A6FF;
}

/* Badge-стиль счётчика в меню журнала заданий */
#nav_ul_li_task_id .link_leftmenu_j_count,
.journal-group-item div[id^="ajax_left_typer_group_"] .link_leftmenu_j_count {
    font-size: 11px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: var(--erpds-text-muted, #525A66);
    color: #fff !important;
    line-height: 1;
}

.sms_block_div {
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 10px;
    background: var(--erpds-surface-2, #F6F7F9);
    border-radius: 5px;
}

.cursor_pointer {
    cursor: pointer;
}

.link_dashed, .link_dashed:hover, .link_dashed:active, .link_dashed:focus {
    text-decoration: none;
}

.erpds-link-button-reset {
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
}

/* Пунктир только у прямого текста (> span), не у вложенных и не у иконок.
   Раньше .link_dashed span цеплял любой span внутри — ломало кнопки статусов. */
.link_dashed > span {
    border-bottom: 1px dashed currentColor;
    text-decoration: none;
}
/* Текст без обёртки span (редко в legacy) */
a.link_dashed:not(:has(> span)) {
    border-bottom: 1px dashed currentColor;
}

/* Контексты-кнопки: ссылка уже оформлена как control, пунктир не нужен */
.button_state .link_dashed > span,
.working_menu_change_state .link_dashed > span,
.erpds-task-state-card .erpds-task-state-actions .link_dashed > span {
    border-bottom: none;
}

.link_dashed2, .link_dashed2:hover, .link_dashed2:active, .link_dashed2:focus {
    text-decoration: none;
    border-bottom: 1px dashed;
    text-decoration: none;
}

.link_none, .link_none:hover, .link_none:active, .link_none:focus {
    text-decoration: none;
}

.span_news_counter {
    background-color: var(--main-color);
    padding-left: 4px;
    margin-top: 1px;
    padding-right: 4px;
    color: #fff;
    font-weight: bold;
    font-size: 9pt;
    cursor: pointer;
}

#span_mywork_counter_id {
    padding-left: 4px;
    margin-top: 1px;
    padding-right: 4px;
    background-color: #f35e68;
    color: #fff;
    font-weight: bold;
    font-size: 9pt;
    cursor: pointer;
}

.act_color {
    padding: 0px;
    width: 1px;
    position: relative;
}

.act_color .arrow {
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    position: absolute;
    top: 50%;
    margin-top: -5px;
    right: -5px;
}

.bad {
    background: var(--erpds-bad, #B62A26);
}

.bad .arrow {
    border-color: transparent transparent transparent var(--erpds-bad, #B62A26);
}

.ok {
    background: var(--erpds-ok, #2E8540);
}

.gray_column {
    background: var(--erpds-border, #DDE1E8);
}

.ok .arrow {
    border-color: transparent transparent transparent var(--erpds-ok, #2E8540);
}

#span_all_counter_id {
    background-color: #30c4ac;
    padding-left: 4px;
    margin-top: 1px;
    padding-right: 4px;
    color: #fff;
    font-weight: bold;
    font-size: 9pt;
    cursor: pointer;
}

.day_delimiter {
    height: 15px;
}

.scheme_oval {
    float: left;
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
    border-radius: 100px / 80px;
    border-color: #000;
    border-style: solid;
    border-width: 2px;
}

.scheme_line {
    float: left;
    background-color: #000;
    width: 10px;
    height: 20px;
}

.table_table a {
    position: relative;
    z-index: 1;
}

.table_table a.c_t2_rowlink {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0px;
}

.table_table a.c_t2_rowlink:hover {
    background-color: var(--erpds-border, #DDE1E8);
    opacity: 0.1;
}

.working_menu_change_state {
    text-align: left;
    padding-bottom: 5px;
}

.working_menu_change_state .button_state {
    display: inline-block;
    margin: 5px;
    padding: 5px;
    background-color: var(--main-color);
    border: 1px solid var(--main-color);
    border-radius: 3px;
}

.working_menu_change_state .button_state a {
    color: #fff;
}

.working_menu_change_state .button_state:hover {
    background-color: var(--main-color-hover);
}

.red_link {
    display: inline-block;
    padding: 1px 6px;
    margin-top: 1px;
    background-color: var(--erpds-bad, #B62A26);
    font-weight: bold;
    cursor: pointer;
    color: #fff;
    text-decoration: none;
    border-radius: 3px;
}

.red_link:hover {
    color: var(--erpds-text-muted, #525A66);
}

.red_link2 {
    color: var(--erpds-bad, #B62A26);
    text-decoration: none;
    font-weight: bold;
}

.white_div {
    background-color: #fff;
    border-radius: 5px;
    padding: 10px;
}

.current_date_free_doing {
    cursor: pointer;
}

.current_date_free_doing:hover {
    background-color: var(--erpds-accent-soft, #E0EAF6);
}

/* .current_date_red переопределён в блоке календаря (grep: "Softer unavailable") */

/* ОБЩИЕ ПАРАМЕТРЫ */

.box_border {
    box-sizing: border-box;
}

.code {
    font-family: var(--erpds-mono);
    font-weight: 600;
}

.sup {
    margin-top: 16px;
    font-size: 0.9em;
    font-style: italic;
}

.right {
    margin-left: auto;
    margin-right: 0px;
}

/*----------------------------------------*/
/* Разметка для блоков контакт-центра */
/*  Общие параметры (строка для блоков кнопок) */
.row {
    height: 4em;
    margin-left: -16px;
    margin-right: -16px;
    line-height: 1.2em;
}

.row:before {
    content: " ";
    display: block;
}

.row:after {
    content: " ";
    clear: both;
}

/* Блоки кнопок разных размеров внутри строки */
/* Цифра - количество ячеек, которые занимает блок по ширине в 12 ячеечной сетке */
.block-6 {
    width: 45%;
    float: left;
    text-align: center;
    padding: 0 16px;
}

.block-5 {
    width: 41.5%;
    float: left;
    text-align: center;
    padding: 0 16px;
}

.block-4 {
    width: 30%;
    float: left;
    text-align: center;
    padding: 0 16px;
}

.block-3 {
    width: 22%;
    float: left;
    text-align: center;
    padding: 0 16px;
}

.block-2 {
    width: 16.6%;
    float: left;
    text-align: center;
    padding: 0 16px;
}

.block-1 {
    width: 8.3%;
    float: left;
    text-align: center;
    padding: 0 16px;
}

/*----------------------------------------*/
/* Основные плашки для информации и кнопок */

/* настройка блока (плашки) с категорией кнопок */
.block-cc {
    box-sizing: border-box;

    margin: 16px 0px;
    padding: 12px;
    border-left: 4px solid;
}

/* общие настройки всех кнопок на плашке*/
.block-cc button {
    font-size: 1.1em;
    padding: 12px;
    display: block;
    border: 1px solid;
    border-radius: 4px;
    color: rgba(255, 255, 255, 0.95);
    cursor: pointer;
    transition: all 0.2s ease-out;
    line-height: 1em;
}

.block-cc button:hover {
    outline: 0;
    box-shadow: rgba(0, 0, 0, 0.18) 0px 4px 16px 0px, rgba(0, 0, 0, 0.14) 0px 4px 16px 0px;
}

/* общие настройки заголовка №3 на плашке */
.block-cc h3 {
    font-size: 1.4em;
}

/* общие настройки полей ввода на плашке */
.block-cc input {
    padding: 5px;
    line-height: 1em;
}

/* КНОПКИ */
/* Широкая кнопка */
/* Да и вообще любой блок с шириной 100% */
.width {
    width: 100%;
}

/* Маленькая кнопка */
button.small {
    padding: 8px;
    font-size: 0.9em;
}

/* Серенькая кнопка обычная */
button.default {
    background: var(--erpds-surface-2, #F6F7F9) !important;
    color: var(--erpds-text, #0F172A) !important;
    border: 1px solid var(--erpds-border, #DDE1E8) !important;
}

/* Синенькая кнопка "главная типа" */
button.primary {
    background: var(--main-color-hover) !important;
    color: #fff !important;
    border: 1px solid var(--erpds-accent, #3B5BDB) !important;
}

/*-----------------------------*/
/* Цветные блоки */

.cc-red {
    border-color: var(--erpds-bad, #B62A26);
    background: var(--erpds-bad-soft, #F5DDD9);
}

.cc-red h3 {
    color: var(--erpds-bad-text, #821B18);
}

.cc-red button {
    background: var(--erpds-bad, #B62A26);
    border: 1px solid var(--erpds-bad-text, #821B18);
    color: #fff;
}

.cc-red button:hover {
    background: var(--erpds-bad-text, #821B18);
}

.cc-orange {
    border-color: var(--erpds-warn, #E07A1F);
    background: var(--erpds-warn-soft, #FBEDD9);
}

.cc-orange h3 {
    color: var(--erpds-warn-text, #8A4A0A);
}

.cc-orange button {
    background: var(--erpds-warn, #E07A1F);
    border: 1px solid var(--erpds-warn-text, #8A4A0A);
    color: #fff;
}

.cc-orange button:hover {
    background: var(--erpds-warn-text, #8A4A0A);
}

.cc-green {
    border-color: var(--erpds-ok, #2E8540);
    background: var(--erpds-ok-soft, #E5F1E6);
}

.cc-green h3 {
    color: var(--erpds-ok, #2E8540);
}

.cc-green button {
    background: var(--erpds-ok, #2E8540);
    border: 1px solid var(--erpds-ok, #2E8540);
    color: #fff;
}

.cc-green button:hover {
    background: var(--erpds-ok-hover, #1F5F2C);
}

.cc-blue {
    border-color: var(--erpds-accent, #1871a5);
    background: var(--erpds-accent-soft, #deedf5);
}

.cc-blue h3 {
    color: var(--erpds-accent, #1871a5);
}

.cc-blue button {
    background: var(--erpds-accent, #1871a5);
    border: 1px solid var(--erpds-accent-hover, #125d88);
    color: #fff;
}

.cc-blue button:hover {
    background: var(--erpds-accent-hover, #125d88);
}

.div-form-customer-find {
    background-color: #fff;
    margin: 12px;
    padding-bottom: 12px;
    padding-top: 16px;
    padding-left: 16px;
    padding-right: 16px;
    border-radius: 10px;
}

.div-form-house-find {
    background-color: #fff;
    width: 500px;
    margin: 12px;
    padding-bottom: 16px;
    padding-top: 16px;
    padding-left: 16px;
    padding-right: 16px;
    border-radius: 10px;
}

.task-state-caption_delay,
.task-state-caption_cancel,
.task-state-caption_wait,
.task-state-caption_doing,
.task-caption-house-not-connect {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    border: 1px solid transparent;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1.4;
}

.task-state-caption_delay {
    color: #fff;
    background: var(--erpds-bad, #B62A26);
}

.task-state-caption_cancel {
    color: #fff;
    background: var(--erpds-ok, #2E8540);
}

.task-state-caption_wait {
    color: var(--erpds-warn-text, #8A4A0A);
    background: var(--erpds-warn-soft, #FBEDD9);
    border-color: var(--erpds-warn, #E07A1F);
}

.task-state-caption_doing {
    color: #fff;
    background: var(--erpds-ok, #2E8540);
}

.task-caption-house-not-connect {
    color: #fff;
    background: var(--erpds-bad, #B62A26);

}

.rose-back {
    background-color: #FFB0B0;
}

.yellow-back {
    background-color: #FFFFC1;
}

.accordeon-div {
    padding: 10px;
    padding-bottom: 0;
    padding-top: 0;
    font-size: 13px;
}

body {
    font: 16px/1.4 var(--erpds-sans);
    background-color: var(--main-color-background-grey);
    margin: 0;
    padding: 0;
    color: var(--main-color-text);
    /*min-width: 960px;*/
}

h1, h2, h3, h4, h5, h6, p {
    margin-top: 0; /* удаление верхнего поля позволяет обойти проблему выхода полей за границы содержащего их контейнера DIV. Оставшееся нижнее поле отделит его от любых последующих элементов. */
    padding-right: 0;
    padding-left: 0; /* добавление боковых полей к элементам внутри контейнеров DIV, а не к самим контейнерам избавляет от необходимости расчетов рамочной модели. В качестве альтернативы можно использовать вложенный контейнер DIV с боковыми полями. */
}

ul, ol, dl {
    padding: 0;
    margin: 0;
}

a img {
    border: none;
}

a {
    color: var(--main-color-a);
    text-decoration: underline;
}

a:hover, a:active, a:focus {
    color: var(--main-color_a_hover_active_focus);
}

.info_block {
    font-size: 10pt;
    font-weight: normal;
    font-style: italic;
}

.comment_block {
    float: right;
    width: 52px;
    height: 21px;
    text-align: center;
    color: var(--erpds-text, #0F172A);
    font-weight: bold;
    padding-top: 2px;
    z-index: 150;
}

.erpds-calendar-comment-count {
    color: var(--erpds-calendar-comment-text, #0F172A);
    background-color: var(--erpds-calendar-comment-bg, #faf8f8);
    border-radius: 999px;
    padding: 0 4px;
}

.div_small {
    font-size: 8pt;
}

#admin_info .block {
    background: var(--main-color-admin_info);
    color: #FFF;
    padding: 5px 10px;
    font-size: 12px;
    display: inline-block;
    margin-right: 5px;
    border-radius: 5px;
}

#admin_info .block .first {
    display: inline-block;
    text-align: right;
    list-style: none;
    line-height: 16px;
    margin-right: 10px;
    padding-right: 10px;
    border-right: 1px solid #0b8a1a;
    overflow: hidden;
}

#admin_info .block .second {
    display: inline-block;
    text-align: left;
    list-style: none;
    line-height: 16px;
    overflow: hidden;
}

#admin_info .block a {
    color: #FFF;
    text-decoration: underline;
}

.text_size {
    white-space: nowrap;
    overflow: hidden;
    position: relative;
}

.text_size::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 40px;
    height: 100%;
    background: -moz-linear-gradient(left, rgba(24, 113, 165, 0.2), var(--main-color) 100%);
    background: -webkit-linear-gradient(left, rgba(24, 113, 165, 0.2), var(--main-color) 100%);
    background: -o-linear-gradient(left, rgba(24, 113, 165 0.2), var(--main-color) 100%);
    background: -ms-linear-gradient(left, rgba(24, 113, 165, 0.2), var(--main-color) 100%);
    background: linear-gradient(to right, rgba(24, 113, 165, 0.2), var(--main-color) 100%);
}

.text_size_white {
    white-space: nowrap;
    overflow: hidden;
    position: relative;
}

.text_size_white::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 40px;
    height: 100%;
    background: -moz-linear-gradient(left, rgba(255, 255, 255, 0.2), #fff 100%);
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.2), #fff 100%);
    background: -o-linear-gradient(left, rgba(255, 255, 255 0.2), #fff 100%);
    background: -ms-linear-gradient(left, rgba(255, 255, 255, 0.2), #fff 100%);
    background: linear-gradient(to right, rgba(255, 255, 255, 0.2), #fff 100%);
}

.label_area {
    vertical-align: top;
}

.textarea_class {
    color: var(--erpds-text, #0F172A);
    border: 1px solid var(--erpds-border, #DDE1E8);
    outline: none;
    padding: 0 10px;
    font: 14px/17px var(--erpds-sans);
}

.textarea_class:focus {
    background: #F7EFEF;
    border: 1px solid #808080;
}
.textarea_class:focus-visible {
    outline: 2px solid var(--erpds-focus, #2563B8);
    outline-offset: 2px;
}

.button {
    font-size: 14px;
    padding: 8px 18px;
    background: var(--main-color-button);
    color: var(--main-color-button-text);
    border: 0;
    outline: 0;
    cursor: pointer;
    border-radius: 10px;
    font-weight: 500;
    letter-spacing: -0.005em;
    box-shadow: 0 1px 2px rgba(15,23,42,0.08), inset 0 1px 0 rgba(255,255,255,0.10);
    transition: background 0.12s ease, transform 0.06s ease;
}

.button:hover {
    background: var(--main-color-button-hover);
}

.button:active {
    transform: translateY(1px);
}

.button_small {
    font-size: 13px;
    padding: 4px 12px;
    background: var(--main-color);
    color: #FFF;
    border: 0;
    outline: 0;
    cursor: pointer;
    border-radius: 8px;
    font-weight: 500;
    box-shadow: 0 1px 2px rgba(15,23,42,0.08);
    transition: background 0.12s ease, transform 0.06s ease;
}

.button_small:hover {
    background: var(--main-color-button-hover);
}

.button_small:active {
    transform: translateY(1px);
}

.button2 {
    font-size: 14px;
    padding: 8px 18px;
    background: var(--main-color-button-hover);
    color: #FFF;
    border: 0;
    outline: 0;
    cursor: pointer;
    border-radius: 10px;
    font-weight: 500;
    box-shadow: 0 1px 2px rgba(15,23,42,0.08);
    transition: background 0.12s ease, transform 0.06s ease;
}

.button2:hover {
    background: var(--main-color-hover, #2D4AC7);
}

.button2:active {
    transform: translateY(1px);
}

.span_small {
    font-size: 11px;
}

.menu_div_leftblock {
    float: left;
    width: 180px;
}

.menu_div_leftblock ul {
    list-style: square inside;
    color: var(--main-color-left-menu-icon);
}

.menu_div_leftblock ul {
    font-size: 15px;
    display: block;
}

.menu_div_leftblock ul li {
    color: var(--main-color);
    line-height: 18px;
    height: 100%;
    margin-top: 10px;
}

.menu_div_leftblock ul li .select_punkt {
    font-weight: bold;
    color: #000;
}

.menu_div_leftblock ul li a:hover {
    color: #000;
}

.menu_div_rightblock {
    /*! width: calc(100vw - 530px); */
    margin-left: 200px;
    padding: 5px;
    background: var(--erpds-surface-2, #F6F7F9);
    border-left: 3px solid var(--main-color);
}

.label_h2 {
    font-size: 17px;
    margin-top: 14px;
    margin-bottom: 8px;
    font-weight: 700;
    color: var(--erpds-text, #0F172A);
    letter-spacing: -0.01em;
}

.label_h2_wo {
    font-size: 17px;
    font-weight: 700;
    margin-bottom: 3px;
    color: var(--erpds-text, #0F172A);
    letter-spacing: -0.01em;
}

.label_h3 {
    font-size: 15px;
    margin-top: 14px;
    margin-bottom: 8px;
    font-weight: 600;
    color: var(--erpds-text, #0F172A);
}

.label_h3_wo {
    font-size: 15px;
    font-weight: 600;
    color: var(--erpds-text, #0F172A);
}

.label_h3_hr {
    font-size: 13px;
    margin-top: 14px;
    margin-bottom: 10px;
    font-weight: 600;
    color: var(--erpds-text-muted, #525A66);
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.label_h3_hr_wo {
    font-size: 16px;
    margin-top: 14px;
    margin-bottom: 8px;
    font-weight: bold;
    color: var(--erpds-text-muted, #525A66);
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
}

.label_h3_red {
    font-size: 15px;
    margin-top: 14px;
    margin-bottom: 12px;
    color: var(--erpds-bad, #B62A26);
    font-weight: bold;
}

.label_h3_green {
    font-size: 15px;
    margin-top: 14px;
    margin-bottom: 12px;
    color: var(--erpds-ok, #2E8540);
    font-weight: bold;
}

.settings_option_name {
    width: 300px;
    text-align: right;
    float: left;
    padding-right: 20px;
}

.settings_option_value {
    font-weight: bold;
    width: 100%;
}

.settings_option_value a {
    padding-right: 20px;
}

.settings_option_value_change {
    padding: 0px;
}

.settings_option_value_change a {
    padding-right: 10px;
}

.settings_option_value_change .input_field {
    color: var(--erpds-text, #0F172A);
    font-size: 14px;
    height: 23px;
    line-height: 23px;
    width: 205px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    outline: none;
    padding: 0 10px;
    padding-right: 35px;
    overflow: hidden;
    font-family: var(--erpds-sans);
}
.settings_option_value_change .input_field:focus-visible {
    outline: 2px solid var(--erpds-focus, #2563B8);
    outline-offset: 2px;
}

#letters {
    margin: 20px 0px;
}

#letters .links {
    display: inline;
    border: 1px solid var(--erpds-border, #DDE1E8);
    height: 30px;
    line-height: 20px;
    padding: 5px;
    margin-left: 10px;
}

#letters .links a {
    margin: 5px 0px;
    padding: 0px 3px;
    border-right: 1px solid var(--erpds-border, #DDE1E8);
    text-transform: uppercase;
    font-size: 13px;
}

#letters .links a.current {
    color: #000;
    font-weight: bold;
    font-size: 18px;
    text-decoration: none;
}

#letters .links a:last-child {
    border-right: none;
}

.table_block {
    margin: 20px 0px;
    display: table;
}

.table_block .item {
    display: table-row;
}

.table_block .item > div {
    display: table-cell;
    padding: 6px 10px;
    font-size: 13px;
    margin: 1px 0px;
    vertical-align: top;
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
}

.table_block .item:last-child > div {
    border-bottom: none;
}

.table_block .left_data {
    font-weight: 500;
    color: var(--erpds-text-muted, #525A66);
    text-align: right;
    background: var(--main-color-body-background-second);
}

.erpds-card.table_block {
    display: block;
    width: 100%;
    margin: 0;
}

.erpds-card.table_block .item:not([style*="display:none"]):not([style*="display: none"]) {
    display: grid !important;
    grid-template-columns: max-content minmax(0, 1fr);
    column-gap: 18px;
    align-items: start;
    height: auto !important;
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
}

.erpds-v4 form[name="form1"][action="/task/save"] .erpds-card.table_block .item.tagItem:not([style*="display:none"]):not([style*="display: none"]) {
    display: flex !important;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
}

.erpds-v4 form[name="form1"][action="/task/save"] .erpds-card.table_block .item.tagItem > .left_data {
    flex: 0 1 auto;
    width: auto !important;
    max-width: none;
    padding: 0 !important;
    text-align: left !important;
}

.erpds-v4 form[name="form1"][action="/task/save"] .erpds-card.table_block .item.tagItem > div:last-child {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    padding: 0 !important;
}

.erpds-card.table_block .item[style*="display:none"],
.erpds-card.table_block .item[style*="display: none"] {
    display: none !important;
}

.erpds-card.table_block .item > div {
    display: block;
    min-width: 0;
    border-bottom: none;
}

.erpds-card.table_block .item:last-child {
    border-bottom: none;
}

/* Пояснение под полями попап-таймаутов: обычный help-текст, без пилюли. */
.popup-timeout-settings .popup-timeout-note {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--erpds-border, #DDE1E8);
    color: var(--erpds-text-muted, #525A66);
    font-size: 12px;
    line-height: 1.5;
    max-width: 72ch;
}

.popup-timeout-settings .popup-timeout-note code {
    background: var(--erpds-bg-2, #F2F4F7);
    border-radius: var(--erpds-radius-xs, 4px);
    padding: 1px 5px;
    font-size: 11px;
}

/* В этой карточке подсказки не нужны как пилюли (текст вынесен в note). */
.popup-timeout-settings .info_block {
    display: none;
}

.erpds-card.table_block .left_data,
.erpds-card.table_block .settings_option_name {
    background: transparent;
    box-sizing: border-box;
    float: none;
    max-width: 44ch;
    line-height: 1.35;
    /* customer-redesign задаёт .table_block .left_data { width:1% } для старого
       table-layout; в grid-карточке это не даёт ячейке занять свой трек и текст
       схлопывается по буквам. Возвращаем заполнение трека. */
    width: 100%;
    min-width: 0;
    /* Глобальный nowrap + лимит 44ch обрезает длинные лейблы — текст вылезал
       за ячейку и наезжал на чекбокс значения. Разрешаем перенос по словам. */
    white-space: normal;
}

.erpds-card.table_block .item > div:not(.left_data):not(.settings_option_name) {
    overflow-wrap: anywhere;
}

/* Строки, у которых в left_data есть подпись-хинт (TWIG-шаблон, перечень
   плейсхолдеров): фиксируем ширину колонки-лейбла, иначе max-content-колонка
   карточки либо растягивает nowrap-текст в колонку значения (перекрытие), либо
   схлопывается и рвёт длинный токен по буквам. Фикс-ширина → перенос по словам. */
.erpds-card.table_block .item:has(> .left_data > .normal_text),
.erpds-card.table_block .item:has(> .left_data > .italic_text),
.erpds-card.table_block .item:has(> .left_data > .info_block) {
    grid-template-columns: minmax(0, 300px) minmax(0, 1fr) !important;
}
.erpds-card.table_block .left_data .normal_text,
.erpds-card.table_block .left_data .italic_text,
.erpds-card.table_block .left_data .info_block {
    white-space: normal;
}
.erpds-card.table_block .left_data {
    overflow-wrap: anywhere;
}

/* Строки прав доступа: .item с тремя детьми (лейбл + чекбокс чтения + чекбокс
   записи). Двухколоночный grid карточки ронял третий чекбокс на новую строку и
   не выравнивал столбцы между строками. Переводим такие строки в flex с
   фиксированной шириной лейбла — чекбоксы встают ровными колонками. */
.erpds-card.table_block .item:has(> :nth-child(3)):not(:has(> script)):not([style*="display:none"]):not([style*="display: none"]) {
    display: flex !important;
    align-items: center;
    column-gap: 0;
}
.erpds-card.table_block .item:has(> :nth-child(3)):not(:has(> script)) > .left_data {
    flex: 0 0 240px;
    max-width: 240px;
    width: 240px;
    white-space: normal;
}
.erpds-card.table_block .item:has(> :nth-child(3)):not(:has(> script)) > :not(.left_data):not(script) {
    flex: 0 0 90px;
    display: flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
}

/* Settings option pages mix navigation actions with many setting
   rows, so it needs a denser scoped layout than the generic table_block card. */
.erpds-settings-option-page.table_block.erpds-card {
    padding: 14px 18px 18px !important;
}

.erpds-settings-option-page.table_block.erpds-card > br {
    display: none;
}

.erpds-settings-option-page.table_block.erpds-card > .div_space {
    display: inline-flex;
    align-items: center;
    width: auto;
    min-height: 32px;
    margin: 0 10px 10px 0;
    padding: 0;
}

.erpds-settings-option-page.table_block.erpds-card > .div_space a,
.erpds-settings-option-page.table_block.erpds-card > .div_space button {
    display: inline-flex !important;
    align-items: center;
    gap: 7px;
    min-height: 30px;
    padding: 5px 8px !important;
    border: 1px solid var(--erpds-border, #DDE1E8) !important;
    border-radius: var(--erpds-radius-sm, 8px);
    background: var(--erpds-surface, #FFFFFF) !important;
    color: var(--erpds-accent-text, #2A6AE0);
    font-weight: 600;
    line-height: 1.25;
    text-decoration: none;
}

.erpds-settings-option-page.table_block.erpds-card > .div_space a:hover,
.erpds-settings-option-page.table_block.erpds-card > .div_space button:hover {
    border-color: var(--erpds-accent, #1871A5) !important;
    background: var(--erpds-accent-soft, #EAF3FF) !important;
}

.erpds-settings-option-page.table_block.erpds-card > .item:not([style*="display:none"]):not([style*="display: none"]) {
    grid-template-columns: minmax(240px, 360px) minmax(0, 1fr);
    column-gap: 22px;
    min-height: 38px;
    padding: 6px 0;
    align-items: center;
}

.erpds-settings-option-page.table_block.erpds-card > .item > .settings_option_name {
    max-width: none;
    padding: 0 0 0 2px;
    color: var(--erpds-text, #20242A);
    font-weight: 600;
    text-align: left;
    overflow-wrap: normal;
}

.erpds-settings-option-page.table_block.erpds-card > .item > .settings_option_name .info_block {
    display: block;
    margin-top: 3px;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    color: var(--erpds-text-muted, #525A66);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.3;
}

.erpds-settings-option-page.table_block.erpds-card > .item > div:not(.settings_option_name) {
    display: flex;
    align-items: center;
    min-height: 28px;
    padding: 0;
}

.erpds-settings-option-page.table_block.erpds-card > .item > div:not(.settings_option_name) > span {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
}

.erpds-settings-option-page.table_block.erpds-card > .item > div:not(.settings_option_name) .link_dashed {
    line-height: 1.35;
}

.erpds-settings-option-page.table_block.erpds-card > .item:not(:has(> .settings_option_name)) {
    display: block !important;
    min-height: 0;
    margin-top: 18px;
    padding: 12px 0 7px;
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
    color: var(--erpds-text, #20242A);
    font-size: 15px;
    font-weight: 700;
    text-align: left !important;
}

.erpds-settings-option-page.table_block.erpds-card > .item:not(:has(> .settings_option_name)):first-of-type {
    margin-top: 8px;
}

.erpds-settings-limit-page.table_block.erpds-card {
    padding: 14px 18px 18px !important;
}

.erpds-settings-limit-page.table_block.erpds-card > .item:not([style*="display:none"]):not([style*="display: none"]) {
    grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
    column-gap: 22px;
    min-height: 36px;
    padding: 6px 0;
    align-items: center;
}

.erpds-settings-limit-page.table_block.erpds-card > .item > .left_data {
    max-width: none;
    padding: 0 0 0 2px;
    color: var(--erpds-text-muted, #525A66);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    line-height: 1.35;
    text-align: left;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}

.erpds-settings-limit-page.table_block.erpds-card > .item > div:not(.left_data) {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 28px;
    padding: 0;
    color: var(--erpds-text, #20242A);
    text-align: left;
}

.erpds-settings-limit-page.table_block.erpds-card > .label_h3 {
    margin: 18px 0 6px !important;
    padding: 0 0 8px;
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
    color: var(--erpds-text, #20242A);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
}

.erpds-settings-cron-edit {
    max-width: 1120px;
}

.erpds-settings-cron-back {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 14px;
    color: var(--erpds-accent-text, #2A6AE0);
    font-weight: 600;
    text-decoration: none;
}

.erpds-settings-cron-back:hover {
    color: var(--erpds-accent, #1871A5);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.erpds-settings-cron-edit .label_h2 {
    display: block;
    margin: 0 0 8px;
    color: var(--erpds-text, #20242A);
    font-size: 20px;
    line-height: 1.25;
}

.erpds-settings-cron-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.erpds-settings-cron-form .table_block.erpds-card {
    margin: 0;
    padding: 14px 16px !important;
}

.erpds-settings-cron-form .table_block.erpds-card:not(:has(.item)) {
    display: none !important;
}

.erpds-settings-cron-form .table_block.erpds-card .item:not([style*="display:none"]):not([style*="display: none"]) {
    grid-template-columns: minmax(140px, 170px) minmax(0, 1fr);
    align-items: center;
    min-height: 42px;
    column-gap: 18px;
    padding: 6px 0;
}

.erpds-settings-cron-form .table_block.erpds-card .left_data {
    max-width: none !important;
    width: 100% !important;
    padding: 0;
    color: var(--erpds-text-muted, #525A66);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-align: left;
    text-transform: uppercase;
}

.erpds-settings-cron-form .table_block.erpds-card .item > div:not(.left_data) {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 0;
}

.erpds-settings-cron-form input.input_box,
.erpds-settings-cron-form select {
    width: 100%;
    max-width: 100%;
}

.erpds-settings-cron-form input[name="st_day"],
.erpds-settings-cron-form input[name="st_hour"],
.erpds-settings-cron-form input[name="st_minute"] {
    flex: 0 0 96px;
    width: 96px;
}

.erpds-settings-cron-form .info_block {
    margin: 0;
    padding: 3px 8px;
    border: 0;
    background: var(--erpds-bg-2, #F2F4F7);
    color: var(--erpds-text-muted, #525A66);
    font-size: 12px;
    line-height: 1.35;
}

.erpds-settings-cron-form .erpds-cron-schedule > .item:first-child {
    display: block !important;
    min-height: 0;
    padding: 0 0 10px;
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
}

.erpds-settings-cron-form .erpds-cron-schedule > .item:first-child .left_data {
    color: var(--erpds-text, #20242A);
    font-size: 14px;
    letter-spacing: 0.02em;
}

.erpds-settings-cron-form .erpds-cron-schedule > .item:first-child > div:not(.left_data) {
    display: none;
}

.erpds-settings-cron-form .div_center {
    margin-top: 2px;
    text-align: right;
}

.erpds-settings-cron-edit > br + button,
.erpds-settings-cron-edit > br + a,
.erpds-settings-cron-edit #linkDeleteCronId {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    margin-top: 16px;
}

/* Восстанавливаем padding grid-ячеек — глобальный mobile-сброс его обнуляет */
@media (max-width: 900px) {
    .erpds-card.table_block .item > div {
        padding: 5px 8px;
    }
}

/* Узкий экран — стековый layout: лейбл над значением */
@media (max-width: 767px) {
    .erpds-settings-option-page.table_block.erpds-card {
        padding: 12px !important;
    }
    .erpds-settings-option-page.table_block.erpds-card > .div_space {
        display: flex;
        width: 100%;
        margin-right: 0;
    }
    .erpds-settings-option-page.table_block.erpds-card > .div_space a,
    .erpds-settings-option-page.table_block.erpds-card > .div_space button {
        width: 100%;
        justify-content: flex-start;
    }
    .erpds-settings-option-page.table_block.erpds-card > .item:not([style*="display:none"]):not([style*="display: none"]) {
        grid-template-columns: 1fr;
        row-gap: 6px;
        align-items: start;
    }
    .erpds-settings-option-page.table_block.erpds-card > .item > div:not(.settings_option_name) {
        padding-left: 2px;
    }
    .erpds-settings-limit-page.table_block.erpds-card {
        padding: 12px !important;
    }
    .erpds-settings-limit-page.table_block.erpds-card > .item:not([style*="display:none"]):not([style*="display: none"]) {
        grid-template-columns: 1fr;
        row-gap: 6px;
        align-items: start;
    }
    .erpds-settings-limit-page.table_block.erpds-card > .item > .left_data {
        padding-left: 2px;
        font-size: 10px;
    }
    .erpds-settings-limit-page.table_block.erpds-card > .item > div:not(.left_data) {
        padding-left: 2px;
    }
    .erpds-settings-cron-form .table_block.erpds-card .item:not([style*="display:none"]):not([style*="display: none"]) {
        grid-template-columns: 1fr;
        row-gap: 7px;
        align-items: start;
    }
    .erpds-settings-cron-form .table_block.erpds-card .item > div:not(.left_data) {
        align-items: flex-start;
        flex-direction: column;
    }
    .erpds-settings-cron-form input[name="st_day"],
    .erpds-settings-cron-form input[name="st_hour"],
    .erpds-settings-cron-form input[name="st_minute"] {
        flex-basis: auto;
        width: 100%;
    }
    .erpds-settings-cron-form .div_center {
        text-align: left;
    }
    .erpds-card.table_block .item:not([style*="display:none"]):not([style*="display: none"]) {
        grid-template-columns: 1fr;
        row-gap: 4px;
        padding: 8px 0;
    }
    .erpds-card.table_block .item > div {
        padding: 0 8px;
    }
    .erpds-card.table_block .left_data,
    .erpds-card.table_block .settings_option_name {
        text-align: left;
        border-bottom: none;
        padding-bottom: 0;
        max-width: none;
    }
}

.div_print {
    color: #000;
    font-family: var(--erpds-sans);
}

.div_print a {
    text-decoration: none;
    color: #000;
}

.table_data {
    margin: 3px 0px 3px;
    display: table;
    overflow: hidden;
}

.table_data_nonspace {
    margin: 0px;
}

.table_data .report {
    display: table-row;
    max-height: 35px;
}

.table_data .report > div {
    display: table-cell;
    padding: 3px 10px;
    font-size: 13px;
    margin: 1px 0px;
    vertical-align: middle;
}

.table_data .report .right_div {
    text-align: right;
}

.table_data .item {
    display: table-row;
    max-height: 35px;
}

.table_data .white {
    background: none;
}

.table_data .white:hover {
    background: var(--main-color-table-hover, #E5EAFB);
}

.table_data .gray {
    background: var(--main-color-body-background-second);
}

.table_data .gray:hover {
    background: var(--main-color-table-hover, #E5EAFB);
}

.table_data .cursor_pointer {
    cursor: pointer;
}

.table_data .legend {
    display: table-row;
    max-height: 35px;
    font-weight: bold;
    background: none;
    text-align: center;
}

.table_data .legend:hover {
    background: none;
}

.table_data .legend > div {
    display: table-cell;
    padding: 10px 5px;
    margin: 1px 0px;
    vertical-align: middle;
    border-bottom: 3px solid var(--erpds-border, #DDE1E8) !important;
    font-size: 14px !important;
}

.table_data .item > div:not(.today) {
    display: table-cell;
    padding: 6px 6px;
    font-size: 13px;
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
    margin: 1px 0px;
    vertical-align: middle;
}

.table_data .today {
    display: table-cell;
    padding: 10px 10px;
    font-size: 13px;
    margin: 1px 0px;
    vertical-align: middle;
    border: 2px dotted var(--erpds-text, #0F172A);
}

.table_data .item ._number {
    text-align: center;
}

.table_data .item span:not(.work_fail) {
    /*
    color: #666666;
    */
}

.table_data .item .act_color {
    padding: 0px;
    width: 10px;
    position: relative;
}

.table_data .item .center_div {
    text-align: center;
}

.table_data .item .right_div {
    text-align: right;
}

.table_data .item .act {
    width: 110px;
    text-align: center;
}

.table_data .item .daten {
    width: 110px;
    text-align: center;
}

.table_data .item .money {
    width: 85px;
    text-align: right;
}

.table_data .item .act_color .arrow {
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    position: absolute;
    top: 50%;
    margin-top: -5px;
    right: -5px;
}

.table_data .ok {
    background: var(--erpds-ok, #2E8540);
}

.table_data .ok .arrow {
    border-color: transparent transparent transparent var(--erpds-ok, #2E8540);
}

.table_data .bad {
    background: var(--erpds-bad, #B62A26);
}

.table_data .bad .arrow {
    border-color: transparent transparent transparent var(--erpds-bad, #B62A26);
}

.span_user_mark {
    padding-right: 13px;
    margin-right: 5px;
}

.span_bold {
    font-weight: bold;
}

/* Меню с вкладками (карточка абонента и пр) */

ul#navigation, ul#navigation2 {
    list-style: none;
    height: 21px;
    padding: 10px 0px 7px 10px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
    overflow: visible;
}

ul#navigation li, ul#navigation2 li {
    border-radius: 6px 6px 0px 0px;
    float: left;
    margin: 0 5px 0 0;
    background-color: var(--main-color);
    border: solid 1px var(--main-color);
    position: relative;
    z-index: 1;
}

ul#navigation li.selected, ul#navigation2 li.selected {
    z-index: 3;
}

ul#navigation li a:link, ul#navigation li a:visited, ul#navigation2 li a:link, ul#navigation2 li a:visited {
    border-radius: 6px 6px 0px 0px;
    display: block;
    text-align: center;
    padding: 0 10px 0 10px;
    margin: 0 0 -1px 0;
    height: 25px;
    line-height: 21px;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 13px;
    font-weight: bold;
    color: var(--main-color-button-text);
    letter-spacing: 1px;
    outline: none;
    float: left;
    background: var(--main-color-button);
    -webkit-transition: background-color 0.3s linear;
    -moz-transition: background-color 0.3s linear;
    -o-transition: background-color 0.3s linear;
}

ul#navigation li a:hover, ul#navigation2 li a:hover {
    background-color: var(--main-color-hover, #2D4AC7);
}
ul#navigation li a:focus-visible, ul#navigation2 li a:focus-visible {
    outline: 2px solid var(--erpds-focus, #2563B8);
    outline-offset: 2px;
}

ul#navigation li.selected a:link, ul#navigation li.selected a:visited, ul#navigation2 li.selected a:link, ul#navigation2 li.selected a:visited {
    color: var(--main-color);
    border: solid 1px #fff;
    -webkit-transition: background-color 0.2s linear;
    background: -moz-linear-gradient(top center, #d1d1d1, #f2f2f2 80%) repeat scroll 0 0 #f2f2f2;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(.2, #f2f2f2), color-stop(.8, #d1d1d1));
    background-color: #f2f2f2;
}

.slider_content {
    padding: 8px;
    padding-bottom: 12px;
    box-shadow: 0 1px 4px rgba(15,23,42,0.08), 0 0 0 1px var(--erpds-border, #DDE1E8);
    border-radius: 10px !important;
    background: var(--main-color_slider_content);
}

.slider_content_double {
    position: relative;
    width: 100%;
    display: inline-block;
}

.good_info_text {
    font-weight: 600;
    color: var(--erpds-ok, #2E8540);
}

.bad_info_text {
    font-weight: 600;
    color: var(--erpds-bad, #B62A26);
}

.gray_block_light {
    border: 1px solid var(--erpds-border, #DDE1E8);
    color: var(--erpds-text, #0F172A);
    background: var(--erpds-surface-2, #F6F7F9);
    padding: 3px;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06);
}

.gray_fon {
    background: var(--erpds-surface-2, #F6F7F9);
}

.yellow_fon {
    background: var(--erpds-warn-soft, #FBEDD9);
    color: var(--erpds-warn-text, #8A4A0A);
    padding: 1px 6px;
    border-radius: 3px;
}

.white_fon {
    background: #FFF;
}

.red_fon {
    background: var(--erpds-bad, #B62A26);
    color: #FFFFFF;
    padding: 1px 6px;
    border-radius: 3px;
}

.gray_block {
    border: 1px solid var(--erpds-border, #DDE1E8);
    color: var(--erpds-text, #0F172A);
    background: var(--erpds-surface-2, #F6F7F9);
    padding: 8px 10px;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06);
}

.gray_block_left {
    padding: 10px;
    background: var(--erpds-surface-2, #F6F7F9);
    border-left: 3px solid var(--main-color);
    border-radius: 0 8px 8px 0;
}

.inventory-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: flex-start;
}
.inventory-filter-row > .table_block {
    margin: 0;
    display: block;
    flex: 1 1 180px;
    min-width: 160px;
    box-sizing: border-box;
}
.inventory-filter-row > .table_block select {
    width: 100%;
    box-sizing: border-box;
}

.inventory-locat-segments {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 8px;
}
.inventory-locat-seg {
    padding: 6px 12px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: 6px;
    background: var(--erpds-surface, #FFFFFF);
    color: var(--erpds-text, #1F2733);
    font-size: 13px;
    cursor: pointer;
    transition: background 0.12s, border-color 0.12s;
}
.inventory-locat-seg:hover {
    border-color: var(--main-color);
}
.inventory-locat-seg.is-active {
    background: var(--main-color);
    border-color: var(--main-color);
    color: #FFFFFF;
}

.inventory-list-loading {
    opacity: 0.55;
    pointer-events: none;
    transition: opacity 0.12s ease-out;
}

.border_left {
    border-left: 1px solid var(--erpds-border, #DDE1E8);
}

.border_right {
    border-right: 1px solid var(--erpds-border, #DDE1E8);
}

.green_block {
    color: var(--erpds-ok-text, #1F5E2D);
    background: var(--erpds-ok-soft, #E5F1E6);
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(15,23,42,0.06);
}

.div_color_1 {
    /* синий */
    background: var(--main-color);
    color: #fff;
    padding: 3px;
}

.div_color_1 a {
    color: #fff;
}

.div_color_2 {
    /* желтый */
    background: var(--erpds-warn-soft, #FAF1DC);
    color: var(--erpds-warn-text, #7A540B);
    padding: 3px;
}

.larger_text {
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 18px;
}

.work_fail {
    display: inline-block;
    color: #fff;
    background: var(--erpds-bad, #B62A26);
    padding: 2px 8px;
    border-radius: 10px;
    border: 1px solid transparent;
    font-weight: 600;
    font-size: 11px;
}

.green_text {
    color: var(--erpds-ok, #2E8540);
}

.light_green_text {
    color: var(--erpds-ok, #2E8540);
}

.light_green {
    background: var(--erpds-ok-soft, #E5F1E6);
}

.red_text {
    color: var(--erpds-bad, #B62A26);
}

.normal_text {
    font-weight: normal;
}

.bold_text {
    font-weight: bold;
}

.italic_text {
    font-style: italic;
}

.old_customer {
    background: var(--erpds-border, #DDE1E8);
}

.old_customer:hover {
    background: var(--erpds-border, #DDE1E8);
}

.table_port {
    margin: 0;
    display: table;
    overflow: hidden;
}

.table_port .item {
    display: table-row;
    height: 45px;
}

.table_port .gray {
    background: var(--main-color-body-background-second);
}

.table_port .legend {
    display: table-row;
    max-height: 35px;
    color: #fff;
    background: var(--main-color);
    text-align: center;
}

.table_port .legend > div {
    display: table-cell;
    vertical-align: middle;
    padding: 1px;
    font-size: 13px !important;
}

.table_port .item > div {
    display: table-cell;
    font-size: 13px;
    padding: 2px;
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
    vertical-align: middle;
}

.table_port .item .port_gray {
    background: var(--main-color-body-background-second);
}

.table_port .item .port_black {
    background: #000;
    color: #fff;
    text-align: center;
}

.table_port .item .port_black a {
    color: #fff;
}

.table_port .item .port_green {
    background: var(--erpds-ok, #2E8540);
    color: #fff;
    text-align: center;
}

.table_port .item .port_red {
    background: var(--erpds-bad, #B62A26);
    color: #fff;
    text-align: center;
}

.table_port .item .port_number {
    border-left: 1px solid var(--erpds-border, #DDE1E8);
    border-right: 1px solid var(--erpds-border, #DDE1E8);
}

.table_port .item .port_traf {
    border-right: 1px solid var(--erpds-border, #DDE1E8);
}

.table_port .item .ov_module {
    border-left: 1px solid var(--erpds-border, #DDE1E8);
    border-right: 1px solid var(--erpds-border, #DDE1E8);
}

.table_port .item .ov_module_notdelim {
    border-bottom: 0px;
}

.table_port .item .ov_module_delim {
    border-top: 1px solid var(--erpds-border, #DDE1E8);
}

.table_port .item .act_color {
    padding: 0px;
    width: 10px;
    position: relative;
}

.table_port .item .act_color .arrow {
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    position: absolute;
    top: 50%;
    margin-top: -5px;
    right: -5px;
}

.link_black {
    color: var(--erpds-text, #0F172A);
}

.label_backgray {
    color: #fff;
    background: var(--erpds-text-muted, #525A66);
    padding-left: 3px;
    padding-right: 3px;
    font-weight: bold;
}

.tagSpan {
    padding-left: 3px;
    padding-right: 3px;
    font-weight: bold;
    background: #bc3030;
}

.label_backblack {
    color: #fff;
    background: #000;
    padding-left: 3px;
    padding-right: 3px;
    font-weight: bold;
}

.label_backyellow {
    background: var(--erpds-warn-soft, #FBEDD9);
    color: var(--erpds-warn-text, #8A4A0A);
    padding: 1px 6px;
    border-radius: 3px;
    font-weight: bold;
}

.green_div {
    background: var(--erpds-ok, #2E8540);
}

.red_div {
    background: var(--erpds-bad, #B62A26);
}

.div_space {
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 14px;
}

.div_space2 {
    padding-top: 2px;
    padding-bottom: 2px;
}

.ip_net_width {
    width: 21px;
}

.ip_net_customer {
    color: var(--erpds-warn-text, #7A540B);
    background: var(--erpds-warn-soft, #FAF1DC);
}

.ip_net_customer_dolg {
    color: var(--erpds-bad-text, #821B18);
    background: var(--erpds-bad-soft, #F5DDD9);
}

.ip_net_customer_unreg {
    background: var(--erpds-accent-soft, #E0EAF6);
}

.ip_net_customer_pause {
    background: #428284;
}

.ip_net_customer_pause a {
    color: #fff;
}

.ip_net_user_subnet {
    background-image: linear-gradient(90deg, rgba(255, 255, 255, .07) 50%, transparent 50%),
    linear-gradient(90deg, rgba(255, 255, 255, .13) 50%, transparent 50%),
    linear-gradient(90deg, transparent 50%, rgba(255, 255, 255, .17) 50%),
    linear-gradient(90deg, transparent 50%, rgba(255, 255, 255, .19) 50%);
    background-size: 13px, 29px, 37px, 53px;
}

.ip_net_subnet {
    background-image: repeating-linear-gradient(120deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .1) 1px, transparent 1px, transparent 60px),
    repeating-linear-gradient(60deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .1) 1px, transparent 1px, transparent 60px),
    linear-gradient(60deg, rgba(0, 0, 0, .1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, .1) 75%, rgba(0, 0, 0, .1)),
    linear-gradient(120deg, rgba(0, 0, 0, .1) 25%, transparent 25%, transparent 75%, rgba(0, 0, 0, .1) 75%, rgba(0, 0, 0, .1));
    background-size: 10px 120px;
}

.ip_net_device {
    color: #fff;
    background: var(--main-color);
}

.ip_net_device a {
    color: #fff;
}

.ip_net_device a:hover {
    color: rgba(255,255,255,0.70);
}

.ip_net_reserv {
    background: var(--erpds-surface-2, #F6F7F9);
}

.ip_net_inventory {
    color: #fff;
    background: #8400FF;
}

.ip_net_inventory a {
    color: #fff;
}

.standart_docs {
    font-family: var(--erpds-sans);
    font-size: 8pt;
}

.hide_div {
    display: none;
}

.table_inventory_list {
    border: 1px solid #000;
    width: 100%;
}

.table_inventory_list td {
    margin: 0px;
    border: 1px solid #000;
}

/* task status pills — systemRole from TaskStatusAR */
.task-status-run,
.support_history_task_status_1 {
    background: var(--erpds-warn-soft, #FBEDD9);
    color: var(--erpds-warn-text, #8A4A0A);
    border-radius: 999px;
    padding: 2px 9px;
    font-weight: 500;
    display: inline-block;
}

.task-status-successful,
.support_history_task_status_2 {
    background: var(--erpds-ok-soft, #E5F1E6);
    color: var(--erpds-ok-text, #1F5E2D);
    border-radius: 999px;
    padding: 2px 9px;
    font-weight: 500;
    display: inline-block;
}

.task-status-failed,
.support_history_task_status_3 {
    background: var(--erpds-bad-soft, #F5DDD9);
    color: var(--erpds-bad-text, #821B18);
    border-radius: 999px;
    padding: 2px 9px;
    font-weight: 500;
    display: inline-block;
}

.task-status-holded,
.support_history_task_status_4 {
    background: var(--erpds-hold-soft, #FAF1DC);
    color: var(--erpds-hold-text, #7A540B);
    border-radius: 999px;
    padding: 2px 9px;
    font-weight: 500;
    display: inline-block;
}

.task-status-new,
.support_history_task_status_5 {
    background: var(--erpds-info-soft, #E0EAF6);
    color: var(--erpds-info-text, #163E78);
    border-radius: 999px;
    padding: 2px 9px;
    font-weight: 500;
    display: inline-block;
}

.c_adr_div {
    width: 100%;
    position: relative;
}

.c_adr_div input {
    background-color: #fff;
    margin-left: 2px;
}

.c_adr_div select {
    margin: 2px;
}

.c_adr_div .c_adr_div_left {
    background: var(--erpds-surface-2, #F6F7F9);
    border: var(--erpds-border, #DDE1E8) 2px solid;
    padding-right: 30px;
    border-radius: 0px 6px 6px 0px;
}

.c_adr_div .c_adr_div_right {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 30px;
    height: 100%;
    background: url('../picture/home.png') 7px 5px no-repeat var(--erpds-border, #DDE1E8);
    border-radius: 0px 6px 6px 0px;
}

.c_adr_div .c_adr_div_right .c_adr_div_right_button {
    width: 100%;
    text-align: center;
    margin-left: 2px;
}

.div_cable_line_wire_color {
    width: 12px;
    height: 12px;
    margin-right: 3px;
    float: left;
    border: 1px #000 solid;
}

.us-icon-small {
    display: inline-block;
    font: normal normal normal 10px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 1em;
    line-height: .75em;
    margin-right: 5px;
    vertical-align: -3px;
    color: var(--main-color);
}

.us-icon {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 1.3333333333em;
    line-height: .75em;
    margin-right: 5px;
    vertical-align: -3px;
    color: var(--main-color-us-icon);
}

.us-icon-map {
    margin-left: 5px;
}

.us-icon-normal {
    color: var(--main-color);
}

.us-icon-normal:hover {
    color: var(--main-color-hover)
}

.us-icon-normal-second {
    color: var(--main-color-hover)
}

.us-icon-normal-second:hover {
    color: var(--main-color-hover, #2D4AC7)
}

.us-icon-white {
    color: var(--erpds-text-muted, #525A66)
}

.us-icon-gray {
    color: var(--erpds-text-muted, #525A66)
}

.us-icon-gray2 {
    color: var(--erpds-text-muted, #525A66)
}

.us-icon-gray2:hover {
    color: var(--erpds-bad, #B62A26)
}

.us-icon-black {
    color: var(--erpds-text, #0F172A)
}

.us-icon-green {
    color: var(--erpds-ok, #2E8540);
}

.us-icon-darkgreen {
    color: var(--main-color-left-menu-icon);
}

.us-icon-red {
    color: var(--erpds-bad, #B62A26);
}

.us-icon-lmenu {
    font-size: 1em;
    margin-left: -25px;
    color: var(--main-color-left-menu-icon);
    vertical-align: 0px;
    margin-right: 17px;
}

p.us-icon.us-icon-lmenu {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    flex-shrink: 0;
    margin-left: 0;
    margin-right: 12px;
}

p.us-icon.fa-envelope { margin-top: -3px; }
p.us-icon.fa-money    { margin-top: -2px; }
p.us-icon.fa-sitemap  { margin-top: -2px; }

.us-icon-lk {
    font-size: 3em;
    color: #fff;
    width: 100%;
    text-align: center;
    padding-top: 15px;
}

.us-icon-wait {
    vertical-align: -2px;
    color: #8C8C00 !important
}

.us-icon-danger {
    vertical-align: -2px;
    color: var(--erpds-bad, #B62A26) !important
}

.us-icon-danger:hover {
    color: var(--erpds-bad, #B62A26) !important
}

.us-icon-attention {
    vertical-align: -2px;
    color: var(--erpds-warn, #E8A020) !important
}

.us-icon-attention:hover {
    color: var(--erpds-warn-text, #7A540B) !important
}

.us-icon-32 {
    font-size: 2em;
}

.us-icon-64 {
    font-size: 4em;
}

.us-icon-ok {
    vertical-align: -2px;
    color: var(--erpds-ok, #2E8540) !important
}

.us-icon-task-state {
    color: #fff !important
}

.us-icon-task-card {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 2em;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: .75em;
    color: var(--erpds-text, #0F172A);
    padding-left: 8px;
    padding-right: 5px;
}

.us-icon-task-card2 {
    padding-left: 6px;
    padding-top: 7px;
    padding-bottom: 3px;
}

.us-icon-task-card3 {
    padding-left: 4px;
    padding-top: 9px;
    padding-bottom: 1px;
    font-size: 1.6em;
}

.us-icon-task-card4 {
    padding-left: 3px;
    padding-top: 7px;
    padding-bottom: 3px;
}

.us-icon-task-card-green {
    color: var(--erpds-text, #0F172A);
}

.us-icon-menu-card {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 2em;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: .75em;
    color: var(--erpds-text, #0F172A);
    padding-left: 8px;
    padding-right: 5px;
}

.us-planed {
    background: url('../picture/plan.svg') 50% 50% no-repeat;
    padding-left: 20px;
}

.us-traf-in {
    margin-right: 1px;
    color: var(--erpds-ok, #2E8540);
}

.us-traf-out {
    margin-right: 1px;
    color: var(--erpds-bad, #B62A26);
}

.address-list-border {
    padding-left: 3px;
    border-left: 1px solid var(--erpds-border, #DDE1E8);
}

.address-list-house-border {
    padding-left: 5px;
    margin-left: 30px;
    margin-bottom: 5px;
    border-left: 1px solid var(--erpds-border, #DDE1E8);
}

.mapLabel {
    margin-top: -3px;
    position: absolute;
}

.footer2 {
    padding: 10px 0;
    margin-top: 12px;
    margin-bottom: 0;
    border-top: 2px solid var(--erpds-border, #DDE1E8);
    position: relative;
    width: 100%;
    flex-basis: 100%;
    order: 10;
}

.footer2 #down_copy {
    color: var(--erpds-text-muted, #525A66);
    font-size: 13px;
}

.footer2 #down_copy a {
}

.footer2 #down_support {
    width: 150px;
    height: 18px;
    background: var(--main-color);
    color: var(--main-color-text);
    padding-top: 3px;
    padding-left: 7px;
    padding-bottom: 3px;
    display: block;
    position: absolute;
    right: 0;
    top: 25px;
}

.footer2 #down_support a {
    text-decoration: none;
    color: var(--main-color-body-background);
}

.footer2 #down_support i {
    color: #fff;
}

.footer2 #down_support:hover {
    background: var(--erpds-text-muted, #525A66);
}

.footer2 #down_support_div {
    width: 500px;
    position: fixed;
    right: 10px;
    bottom: 10px;
    background-color: var(--main-color);
    color: #fff;
    padding: 5px;
}

.footer2 #down_support_div ul {
    list-style: square inside;
    padding-bottom: 10px;
}

.footer2 #down_support_div ul li {
    margin: 5px;
}

.footer2 #down_support_div a {
    color: #fff;
}

.footer2 #down_support_div a:hover {
    color: rgba(255,255,255,0.75);
}

.footer2 #down_support_div h2 {
    font-size: 16px;
    font-weight: bold;
    text-transform: uppercase;
    margin-top: -5px;
    margin-bottom: 2px;
}

.footer2 #down_support_div #down_support_cancel {
    position: absolute;
    right: 10px;
    top: 5px;
    padding-right: 20px;
}

.footer2 #down_finishinfo {
    display: block;
    position: absolute;
    right: 0;
    margin-right: 170px;
    padding: 2px;
    font-size: 8pt;
    top: 25px;
    color: var(--main-color-body-background);
}

.footer2 #down_finishinfo_full {
    display: block;
    position: relative;
    float: right;
    right: 0;
    margin-right: 170px;
    padding: 2px;
    top: -40px;
    font-size: 9pt;
    background-color: var(--erpds-surface-2, #F6F7F9);
    border: 1px solid var(--erpds-border, #DDE1E8);
}

.footer2 #down_finishinfo2_full {
    top: 20px;
    padding: 10px;
    position: relative;
    background-color: var(--erpds-surface-2, #F6F7F9);
    border: 1px solid var(--erpds-border, #DDE1E8);
    width: 400px;
}

.iface10M {
    animation: ifaceAnim10M 1s infinite;
}

@keyframes ifaceAnim10M {
    0%, 20%, 40%, 60%, 80%, 100% {
        background-color: var(--erpds-warn, #E07A1F);
    }
    10%, 30%, 50%, 70%, 90% {
        background-color: #fff;
    }
}

.iface100M {
    animation: ifaceAnim100M 1s infinite;
}

@keyframes ifaceAnim100M {
    0%, 20%, 40%, 60%, 80%, 100% {
        background-color: var(--erpds-ok-soft, #E5F1E6);
    }
    10%, 30%, 50%, 70%, 90% {
        background-color: #fff;
    }
}

.iface1G {
    animation: ifaceAnim1G 1s infinite;
}

@keyframes ifaceAnim1G {
    0%, 20%, 40%, 60%, 80%, 100% {
        background-color: var(--erpds-ok, #2E8540);
    }
    10%, 30%, 50%, 70%, 90% {
        background-color: #fff;
    }
}

.leaflet-ruler {
    height: 35px;
    width: 35px;
    background-image: url("../js/images/ruler_icon.png"); /* <div>Icons made by <a href="http://www.freepik.com" title="Freepik">Freepik</a> from <a href="http://www.flaticon.com" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></div> */
    background-repeat: no-repeat;
    background-position: center;
}

.leaflet-ruler:hover {
    background-image: url("../js/images/ruler_icon-colored.png"); /* <div>Icons made by <a href="http://www.freepik.com" title="Freepik">Freepik</a> from <a href="http://www.flaticon.com" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></div> */
}

.leaflet-ruler-clicked {
    height: 35px;
    width: 35px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("../js/images/ruler_icon-colored.png");
    border-color: chartreuse !important;
}

.leaflet-bar {
    background-color: #ffffff;
}

.leaflet-control {
    cursor: pointer;
}

.result-tooltip {
    background-color: white;
    border-width: medium;
    border-color: var(--erpds-bad, #B62A26);
    font-size: smaller;
}

.moving-tooltip {
    background-color: rgba(255, 255, 255, .7);
    background-clip: padding-box;
    opacity: 0.5;
    border: dotted;
    border-color: red;
    font-size: smaller;
}

.plus-length {
    padding-left: 45px;
}

.us-map-class .leaflet-popup-content-wrapper {
    background: transparent;
    opacity: 1;
    color: #000;
    font-size: 10px;
    line-height: 24px;
    border-radius: 0px;
    box-shadow: none;
}

.us-map-class .leaflet-popup-tip {
    background: transparent;
    border: none;
    box-shadow: none;
}

.labelObjectText {
    margin-bottom: -35px;
    text-align: center;
}

.linkOnMap {
    text-decoration: none;
    color: #000;
}

.linkOnMap:hover {
    color: #000;
    text-decoration: none;
}

.linkOnMap:visited {
    color: #000;
    text-decoration: none;
}

.linkOnMap:link {
    color: #000;
    text-decoration: none;
}

.addressNameInTree {
    font-weight: bold;
}

.houseNameInTree {
    font-size: 17px;
    text-decoration: underline;
    margin-left: 3px;
    padding-left: 2px;
    padding-right: 2px;
}

.houseNameInTree:hover {
    font-weight: bold;
}

.houseRed {
    color: var(--erpds-bad, #B62A26);
}

.houseGreen {
    color: var(--erpds-ok, #2E8540);
}

.houseBlackBack {
    background-color: #000;
    color: #fff;
}

.houseYellowBack {
    background-color: #FFFF00;
}

.addressFindSelectorDiv {
    background: var(--erpds-surface-2, #F6F7F9);
    border: var(--erpds-border, #DDE1E8) 2px solid;
    padding: 5px;
    border-radius: 0px 6px 6px 0px;
}

.addressFindSelectorDiv input {
    background-color: #fff;
}

.statRowTotal {
    background-color: var(--erpds-border, #DDE1E8);
    font-weight: bold;
}

.statRowTotal td {
    border: 1px solid var(--erpds-border, #DDE1E8);
}

.statRowNormal {
    background-color: #fff;
}

.statRowNormal td {
    border: 1px solid var(--erpds-border, #DDE1E8);
}

.statRowNormalItalic {
    background-color: #fff;
    font-style: italic;
}

.statRowNormalItalic td {
    border: 1px solid var(--erpds-border, #DDE1E8);
}

.statRowMain {
    background-color: var(--erpds-surface-2, #F6F7F9);
    font-weight: bold;
}

.statRowMain td {
    border: 1px solid var(--erpds-border, #DDE1E8);
}

.leaflet-div-icon {
    opacity: 1;
    background: #fff;
    border-radius: 30px;
}

.leaflet-middle-icon {
    border-radius: 30px;
}

.ifaceRow-epon {
    background-color: var(--erpds-accent-soft, #E0EAF6);
}

.ifaceRow-802-11 {
    background-color: var(--erpds-warn-soft, #FAF1DC);
}

.mapNodeInfoNormal {
    background-color: #fff;
    font-size: 9pt;
    font-weight: normal;
}

.mapDeviceInfoNormal {
    background-color: #fff;
    font-size: 11pt;
    font-weight: bold;
}

.mapDeviceInfoRed {
    background-color: #fff;
    color: var(--erpds-bad, #B62A26);
    font-size: 11pt;
    font-weight: bold;
}

.fiber-reserv {
    font-size: 10pt;
    font-weight: bold;
}

.leaflet-canvas-icon-layer {

}

.labelObjectText {
    cursor: pointer;
}

.leaflet-popup-content-wrapper {
    border: 0px solid #f00;
    height: 0px;
    margin-top: -8px;
}

.dist-marker {
    font-size: 9px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: 10px;
    text-align: center;
    color: var(--erpds-text, #0F172A);
    background: #fff;
}

.cityBack {
    background-color: var(--erpds-surface-2, #F6F7F9);
    border: 1px solid var(--erpds-border, #DDE1E8);
    margin: 3px;
}

.reply_comment {
    text-align: left;
    font-style: italic;
    border-radius: 8px;
    width: 350px;
    max-height: 30px;
    overflow: hidden; /* Обрезаем все, что не помещается в область */
    background: var(--erpds-surface-2, #F6F7F9); /* Цвет фона */
    padding: 5px; /* Поля вокруг текста */
    text-overflow: ellipsis; /* Добавляем многоточие */
}

.reply_comment a {
    color: var(--erpds-text, #0F172A);
    text-decoration: none;
}

#fullTaskTypeDescription {
    display: none
}

#fullTaskTypeDescriptionShort {
    display: ''
}

.nodeSchemeRedesignTopPanel {
    background: var(--erpds-accent-soft, #E0EAF6);
}

.nodeSchemeTopPanel {
    background: var(--erpds-surface-2, #F6F7F9);
}

.leaflet-control-layers-group-name {
    font-weight: bold;
    margin-bottom: .2em;
    margin-left: 3px;
}

.leaflet-control-layers-group {
    margin-bottom: -2.5em;
    margin-top: -20px;
    margin-bottom: 0px;
}

#map_menu2 {
    height: 30px;
    font-size: 14px;
    padding-left: 4px;
    padding-top: 4px;
    margin-bottom: 0px;
    padding-bottom: 0px;
    background-color: #FFFFFF;
}

.grayInfoDiv {
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 3px;
    border: 3px solid var(--erpds-border, #DDE1E8);
    border-radius: 6px 6px 6px 6px;
    background-color: var(--erpds-surface-2, #F6F7F9);
}

.darkRedInfoDiv {
    margin-top: 10px;
    padding: 3px;
    border: 6px solid #800000;
    border-radius: 6px 6px 6px 6px;
    background-color: var(--erpds-bad-soft, #F5DDD9);
}

#buildingTaskCommentId {
    margin-top: 10px;
    padding: 3px;
    border: 6px solid var(--main-color-yellow-info-border);
    border-radius: 6px 6px 6px 6px;
    background-color: var(--main-color-yellow-info);
    font-weight: bold;
}

#house_scheme_id {
    padding-top: 16px;
}

.my-label {
    position: absolute;
    width: 1000px;
    font-size: 2px;
}

.leaflet-container.pointer-cursor-enabled {
    cursor: pointer;
}

.downLinkUrl {
    color: #fff;
    text-decoration: underline;
    text-decoration-color: #fff;
    font-size: 14px;
}

.spanContragentReportTransferName {
    font-size: 24px;
}

.dropdown-menu {
    background-color: white;
    border: 1px solid var(--erpds-border, #DDE1E8);
    list-style: none;
    margin: 0;
    padding: 0;
}

.dropdown-menu li {
    border-top: 1px solid var(--erpds-border, #DDE1E8);
    padding: 2px 5px;
    margin: 0;
}

.dropdown-menu li:first-child {
    border-top: none;
}

.dropdown-menu li:hover,
.dropdown-menu .active {
    background-color: var(--main-color-table-hover, #E5EAFB);
}

.dropdown-menu a {
    height: 18px;
    text-decoration: none;
    color: var(--erpds-text-muted, #525A66);
}

.dropdown-menu a:hover {
    cursor: pointer;
}

.dropdown-menu img {
    vertical-align: text-top;
    height: 18px;
}

.map-label-clickable {
    cursor: pointer;
}
.leaflet-tooltip-label {
    position: absolute;
    padding: 0px 2px 0px 2px !important;
    margin: 0;
    background-color: rgba(255, 255, 255, 0.95); /* background-color: rgba(255, 255, 255, 0.6); */
    border: 0px solid #000;
    color: #000;
    white-space: nowrap;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    pointer-events: none;
}

.oldUnavailableClass {
    display: none;
}

.employeeUnavailableI {
    color: var(--erpds-bad, #B62A26);
}

.xdsoft_datetimepicker {
    box-shadow: 0px 5px 15px -5px rgba(0, 0, 0, 0.506);
    background: #FFFFFF;
    border-bottom: 1px solid #BBBBBB;
    border-left: 1px solid #CCCCCC;
    border-right: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
    color: #333333;
    display: block;
    font-family: var(--erpds-sans);
    padding: 8px;
    padding-left: 0px;
    padding-top: 2px;
    position: absolute;
    z-index: 9999;
    box-sizing: border-box;
    display: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.xdsoft_noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
}

.xdsoft_noselect::selection {
    background: transparent;
}

.xdsoft_noselect::-moz-selection {
    background: transparent;
}

.xdsoft_datetimepicker.xdsoft_inline {
    display: inline-block;
    position: static;
    box-shadow: none;
}

.xdsoft_datetimepicker * {
    box-sizing: border-box;
    padding: 0px;
    margin: 0px;
}

.xdsoft_datetimepicker .xdsoft_datepicker, .xdsoft_datetimepicker .xdsoft_timepicker {
    display: none;
}

.xdsoft_datetimepicker .xdsoft_datepicker.active, .xdsoft_datetimepicker .xdsoft_timepicker.active {
    display: block;
}

.xdsoft_datetimepicker .xdsoft_datepicker {
    width: 224px;
    float: left;
    margin-left: 8px;
}

.xdsoft_datetimepicker .xdsoft_timepicker {
    width: 58px;
    float: left;
    text-align: center;
    margin-left: 8px;
    margin-top: 0px;
}

.xdsoft_datetimepicker .xdsoft_datepicker.active + .xdsoft_timepicker {
    margin-top: 8px;
}

.xdsoft_datetimepicker .xdsoft_mounthpicker {
    position: relative;
    text-align: center;
}

.xdsoft_datetimepicker .xdsoft_prev, .xdsoft_datetimepicker .xdsoft_next {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEYAAAAeCAYAAACR82geAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDozQjRCQjRGREU4MkNFMzExQjRDQkIyRDJDOTdBRUI1MCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDoxQzQ5MUVFRTJDRTkxMUUzODYyMUJDN0ExNzY5MEJFMiIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoxQzQ5MUVFRDJDRTkxMUUzODYyMUJDN0ExNzY5MEJFMiIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjNCNEJCNEZERTgyQ0UzMTFCNENCQjJEMkM5N0FFQjUwIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjNCNEJCNEZERTgyQ0UzMTFCNENCQjJEMkM5N0FFQjUwIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+ZZiqAgAAAR5JREFUeNrs2W0OgjAMBmAnHJjoOZq8FzYTUAkfG9KuJFDaZD8MpoYHmG0JMcabxzLuTuAwDqMR9dlPIISQO0TtqtrVpA7+21troxe8Q3mMPjfsDJ3cmVcGJc4WuOdtDSaFksQphvn+WNHdthJQhFlDWeBowMQcTiEMPilUYLagTHC0YJI4BTD45VWA4aAMOJowCxwhDMY5D7t3MWEmOAIYzPNZghlwmDBI5bIG0+MwYJDLc1SYkl6pYnz3dbraWXjHQPAokfVHCQWbL1mFgcLfNVmDgWKBR4oFHgQFHmnBYIeWgBRbAg4OabUE2LGJJMUmEltRrjh2wBaUK8LkcOjqg6oUjmhkYnXm24wq7qdoyO5vIv29ksM4zI7xFmAAj1yMVcKZ+nYAAAAASUVORK5CYII=');
}

.xdsoft_datetimepicker .xdsoft_prev {
    float: left;
    background-position: -20px 0px;
}

.xdsoft_datetimepicker .xdsoft_next {
    float: right;
    background-position: 0px 0px;
}

.xdsoft_datetimepicker .xdsoft_next:active, .xdsoft_datetimepicker .xdsoft_prev:active {
}

.xdsoft_datetimepicker .xdsoft_next, .xdsoft_datetimepicker .xdsoft_prev {
    background-color: transparent;
    background-repeat: no-repeat;
    border: 0px none currentColor;
    cursor: pointer;
    display: block;
    height: 30px;
    opacity: 0.5;
    outline: medium none currentColor;
    overflow: hidden;
    padding: 0px;
    position: relative;
    text-indent: 100%;
    white-space: nowrap;
    width: 20px;
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_prev,
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_next {
    float: none;
    background-position: -40px -15px;
    height: 15px;
    width: 30px;
    display: block;
    margin-left: 14px;
    margin-top: 7px;
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_prev {
    background-position: -40px 0px;
    margin-bottom: 7px;
    margin-top: 0px;
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box {
    height: 151px;
    overflow: hidden;
    border-bottom: 1px solid #DDDDDD;
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div {
    background: #F5F5F5;
    border-top: 1px solid #DDDDDD;
    color: #666666;
    font-size: 12px;
    text-align: center;
    border-collapse: collapse;
    cursor: pointer;
    border-bottom-width: 0px;
    height: 25px;
    line-height: 25px;
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div:first-child {
    border-top-width: 0px;
}

.xdsoft_datetimepicker .xdsoft_next:hover,
.xdsoft_datetimepicker .xdsoft_prev:hover {
    opacity: 1;
}

.xdsoft_datetimepicker .xdsoft_label {
    display: inline;
    position: relative;
    z-index: 9999;
    overflow: hidden;
    margin: 0;
    padding: 5px 3px;
    font-size: 14px;
    line-height: 20px;
    font-weight: bold;
    background-color: #fff;
    float: left;
    width: 182px;
    text-align: center;
}

.xdsoft_datetimepicker .xdsoft_month {
    width: 114px;
    text-align: right;
}

.xdsoft_datetimepicker .xdsoft_calendar {
    clear: both;
}

.xdsoft_datetimepicker .xdsoft_year {
    width: 56px;
}

.xdsoft_datetimepicker .xdsoft_calendar table {
    border-collapse: collapse;
    width: 100%;

}

.xdsoft_datetimepicker .xdsoft_calendar td > div {
    padding-right: 5px;
}

.xdsoft_datetimepicker .xdsoft_calendar th {
    height: 25px;
}

.xdsoft_datetimepicker .xdsoft_calendar td, .xdsoft_datetimepicker .xdsoft_calendar th {
    width: 14.2857142%;
    text-align: center;
    background: #F5F5F5;
    border: 1px solid #DDDDDD;
    color: #666666;
    font-size: 12px;
    text-align: right;
    padding: 0px;
    border-collapse: collapse;
    cursor: pointer;
    height: 25px;
}

.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_today {
    color: #33AAFF;
}

.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current,
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div.xdsoft_current {
    background: #33AAFF;
    box-shadow: #178FE5 0px 1px 3px 0px inset;
    color: #fff;
    font-weight: 700;
}

.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_other_month,
.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_disabled,
.xdsoft_datetimepicker .xdsoft_time_box > div > div.xdsoft_disabled {
    opacity: 0.5;
}

.xdsoft_datetimepicker .xdsoft_calendar td:hover,
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div:hover {
    color: #fff !important;
    background: #ff8000 !important;
    box-shadow: none !important;
}

.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_disabled:hover,
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div.xdsoft_disabled:hover {
    color: inherit !important;
    background: inherit !important;
    box-shadow: inherit !important;
}

.xdsoft_datetimepicker .xdsoft_calendar th {
    font-weight: 700;
    text-align: center;
    color: #999999;
    cursor: default;
}

.xdsoft_datetimepicker .xdsoft_copyright {
    color: #ccc !important;
    font-size: 10px;
    clear: both;
    float: none;
    margin-left: 8px;
}

.xdsoft_datetimepicker .xdsoft_copyright a {
    color: #eee !important;
}

.xdsoft_datetimepicker .xdsoft_copyright a:hover {
    color: #aaa !important;
}


.xdsoft_time_box {
    position: relative;
    border: 1px solid #ccc;
}

.xdsoft_time_box > .xdsoft_scrollbar > .xdsoft_scroller {
    background: #ccc !important;
    height: 20px;
    border-radius: 3px;
}

.xdsoft_time_box > .xdsoft_scrollbar {
    position: absolute;
    width: 7px;
    width: 7px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    cursor: pointer;
}


.leaflet-contextmenu {
    display: none;
    box-shadow: 0 1px 7px rgba(0, 0, 0, 0.4);
    border-radius: 4px;
    padding: 4px 0;
    background-color: #fff;
    cursor: default;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.leaflet-contextmenu a.leaflet-contextmenu-item {
    display: block;
    color: #222;
    font-size: 12px;
    line-height: 20px;
    text-decoration: none;
    padding: 0 12px;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    cursor: default;
    outline: none;
}

.leaflet-contextmenu a.leaflet-contextmenu-item-disabled {
    opacity: 0.5;
}

.leaflet-contextmenu a.leaflet-contextmenu-item.over {
    background-color: #f4f4f4;
    border-top: 1px solid #f0f0f0;
    border-bottom: 1px solid #f0f0f0;
}

.leaflet-contextmenu a.leaflet-contextmenu-item-disabled.over {
    background-color: inherit;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
}

.leaflet-contextmenu-icon {
    margin: 2px 8px 0 0;
    width: 16px;
    height: 16px;
    float: left;
    border: 0;
}

.leaflet-contextmenu-separator {
    border-bottom: 1px solid #ccc;
    margin: 5px 0;
}

.i0Li {
    overflow: hidden;
    word-wrap: anywhere;
}

option[colorTag="optionRed"] {
    background-color: #E20A0A;
    color: #ffffff;
}

.optionRed {
    background-color: #E20A0A;
    color: #ffffff;
}

option[colorTag="optionWhite"] {
    background-color: #ffffff;
    color: #000;
}

.optionWhite {
    background-color: #ffffff;
    color: #000;
}

option[colorTag="optionSeparator"] {
    font-weight: bold;
    font-style: italic;
    color: #9D9D9D;
}

.erp-label {
    permanent: true;
    position: absolute;
    width: 1000px;
    font-size: 14px;
    background-color: none;
    border-color: none;
    background: none;
    border: none;
    box-shadow: none;
    direction: 'right';
    font-family: 'Courier', 'sans-serif', Tahoma, Geneva, Helvetica;
}

.rack_label_low_opacity.leaflet-tooltip-top:before,
.rack_label_low_opacity.leaflet-tooltip-bottom:before,
.rack_label_low_opacity.leaflet-tooltip-left:before,
.rack_label_low_opacity.leaflet-tooltip-right:before,
.rack_label.leaflet-tooltip-top:before,
.rack_label.leaflet-tooltip-bottom:before,
.rack_label.leaflet-tooltip-left:before,
.rack_label.leaflet-tooltip-right:before,
.erp-label.leaflet-tooltip-top:before,
.erp-label.leaflet-tooltip-bottom:before,
.erp-label.leaflet-tooltip-left:before,
.erp-label.leaflet-tooltip-right:before {
    position: absolute;
    pointer-events: none;
    border: 6px solid transparent;
    background: transparent;
    content: "";
}

.rack_label_low_opacity {
    permanent: true;
    position: absolute;
    width: 1000px;
    font-size: 14px;
    color: #EEEEEE;
    background-color: none;
    border-color: none;
    background: none;
    border: none;
    box-shadow: none;
    direction: 'right';
    font-family: 'Courier', 'sans-serif', Tahoma, Geneva, Helvetica;
}

.rack_label {
    permanent: true;
    position: absolute;
    width: 1000px;
    font-size: 14px;
    color: #000;
    background-color: none;
    border-color: none;
    background: none;
    border: none;
    box-shadow: none;
    direction: 'right';
    font-family: 'Courier', 'sans-serif', Tahoma, Geneva, Helvetica;
}

.menu_pic {
    margin-bottom: 12px;
}

.menu_pic ul {
    list-style: none;
}

.menu_pic ul li {
    display: inline-block;
    width: 12%;
}

.menu_pic ul li:first-child {
    margin-left: 0px;
}

.menu_pic ul li a {
    display: block;
    width: 62px;
    height: 62px;
    border-radius: 30px;
    box-shadow: 0px 0px 0px 2px var(--main-color);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    text-align: center;
    font-size: 23pt;
    width: 62px;
    height: 62px;
    line-height: 62px; /* Совпадает с высотой для центрирования текста */
    text-align: center; /* Центрирует текст по горизонтали */
    text-decoration: none;
}

.menu_pic ul li a:hover {
    background-color: var(--main-color);
}

.menu_pic ul li a.center-text {
    display: flex;
    justify-content: center;
    align-items: center;
}

.menu_pic ul li.bad a {
    box-shadow: 0px 0px 0px 2px var(--erpds-border, #DDE1E8);
}

.menu_pic ul li.bad a:hover {
    background-color: #FFF;
}

.menu_pic ul li a i {
    position: relative;
    top: 0px; /* Измените значение, чтобы сместить иконку по вертикали */
    left: 2px; /* Измените значение, чтобы сместить иконку по горизонтали */
}

#paste-area {
    position: relative;
    height: 100px;
    background-color: var(--erpds-accent-soft, #E0EAF6);
    border: 1px solid var(--erpds-border, #DDE1E8);
    margin: 5px;
    margin-top: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    line-height: 100px;
    caret-color: transparent;
}

#paste-area::before {
    content: attr(data-placeholder);
    position: absolute;
    color: var(--erpds-text-muted, #525A66);
    pointer-events: none;
}

#paste-area img {
    max-width: 100px;
    max-height: 100px;
}

.spinner {
    border: 4px solid rgba(0, 0, 0, 0.1);
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border-left-color: var(--main-color, #3B5BDB);
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* WnPreloader — глобус-прелоадер (оверлей) */
.wn-preloader {
    --preloader-color: #1f2933;
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(244, 247, 252, 0.72);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.wn-preloader[hidden] {
    display: none;
}

.wn-preloader__canvas {
    width: 200px;
    height: 200px;
    will-change: transform;
}

.badges {
    display: flex;
    align-items: center; /* Центрирует элементы по вертикали */
    justify-content: space-around; /* Распределяет пространство между элементами */
}

.badge {
    margin: 10px; /* Добавляет отступы вокруг каждого бейджа */
}

.cableLineMapWireInfo {
}

.cableLineMapWireInfo td {
    border: 1px solid var(--erpds-border, #DDE1E8);
    padding: 2px;
    font-size: 10px;
}

.cableLineMapWireInfo .fiberColor {
    width: 16px;
}

.cableLineMapWireInfo .moduleColor {
    width: 16px;
}

.timeline {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.task {
    display: flex;
    width: 100%;
    border-radius: 10px;
    overflow: hidden;
}

.status-date {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    height: 30px;
    padding-left: 5px;
    font-size: 12px;
    color: var(--erpds-text, #0F172A);
}

.status {
    display: flex;
    align-items: center;
    text-align: left;
    height: 24px;
    padding: 2px 6px;
    overflow: hidden;
    min-width: 0;
}

.status:hover {
    opacity: 0.5;
}

.shadowText {
    font-size: 15px;
    font-weight: bold;
    color: white;
    -webkit-text-stroke: 0.4px black; /* Для Safari/Chrome/Opera */
    text-stroke: 0.4px black; /* Стандартное свойство */
}

.errorPageText {
    color: var(--main-color);
}

#login_page_back {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
    background: linear-gradient(135deg, #eef3fb 0%, #e3ecf9 50%, #f4f7fc 100%);
}

/* Antigravity aurora: мягкие дрейфующие цветные пятна за частицами — только в canvas-режиме */
#login_page_back:has(#login_bg_canvas)::before,
#login_page_back:has(#login_bg_canvas)::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    filter: blur(90px);
    opacity: 0.55;
    will-change: transform;
}

#login_page_back:has(#login_bg_canvas)::before {
    width: 52vmax;
    height: 52vmax;
    left: -12vmax;
    top: -12vmax;
    background: radial-gradient(circle, rgba(99, 160, 255, 0.55), rgba(99, 160, 255, 0));
    animation: lpAurora1 22s ease-in-out infinite alternate;
}

#login_page_back:has(#login_bg_canvas)::after {
    width: 46vmax;
    height: 46vmax;
    right: -10vmax;
    bottom: -10vmax;
    background: radial-gradient(circle, rgba(150, 130, 255, 0.5), rgba(150, 130, 255, 0));
    animation: lpAurora2 27s ease-in-out infinite alternate;
}

@keyframes lpAurora1 {
    to { transform: translate(12vw, 8vh) scale(1.15); }
}

@keyframes lpAurora2 {
    to { transform: translate(-10vw, -6vh) scale(1.1); }
}

@media (prefers-reduced-motion: reduce) {
    #login_page_back:has(#login_bg_canvas)::before,
    #login_page_back:has(#login_bg_canvas)::after {
        animation: none;
    }
}

#login_page_back canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
}

#login_page.login-canvas-bg {
    background: transparent;
}

/* Форма и футер уже position:absolute в базе — поднимаем только над canvas (z-index:0), позицию не трогаем */
#login_page.login-canvas-bg #login_page_form,
#login_page.login-canvas-bg #login_page_footer {
    z-index: 1;
}

/* Светлый фон входа: футер без тёмной полосы, текст тёмный */
#login_page.login-canvas-bg #login_page_footer {
    background: transparent;
}

#login_page.login-canvas-bg #login_page_footer #down_copy {
    color: var(--erpds-text, #0F172A);
}

/* Светлый фон: PWA-пилюля «Установить приложение» — тёмный текст вместо белого */
#login_page.login-canvas-bg #login_page_footer .login-pwa-install-hint {
    background: rgba(40, 90, 200, 0.08);
    border-color: rgba(40, 90, 200, 0.25);
    color: var(--erpds-text, #0F172A) !important;
}

#login_page.login-canvas-bg #login_page_footer .login-pwa-install-hint:hover {
    background: rgba(40, 90, 200, 0.14);
    border-color: rgba(40, 90, 200, 0.40);
    color: var(--erpds-text, #0F172A) !important;
}

#login_page {
    background: var(--main-color);
    box-sizing: border-box;
    min-height: 100vh;
    min-height: 100dvh;
    padding-top: env(safe-area-inset-top, 0);
    padding-right: env(safe-area-inset-right, 0);
    padding-bottom: env(safe-area-inset-bottom, 0);
    padding-left: env(safe-area-inset-left, 0);
}

/* PWA / узкий экран: форма входа без горизонтального скролла, касания по гайдлайнам */
@media screen and (max-width: 420px) {
    #login_page #login_page_form {
        left: 50%;
        margin-left: 0;
        transform: translate(-50%, -50%);
        width: calc(100vw - 24px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px));
        max-width: 360px;
        box-sizing: border-box;
    }

    #login_page #login_page_alert {
        left: 50%;
        margin-left: 0;
        transform: translate(-50%, -50%);
        width: calc(100vw - 24px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px));
        max-width: 360px;
        box-sizing: border-box;
    }

    #login_page #login_page_info {
        left: 50%;
        margin-left: 0;
        transform: translateX(-50%);
        width: calc(100vw - 24px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px));
        max-width: 600px;
        box-sizing: border-box;
    }

    #login_page #login_page_form .field {
        height: auto !important;
        min-height: 44px;
        line-height: 1.25;
        font-size: 16px;
        padding: 10px 8px;
        box-sizing: border-box;
    }

    #login_page #login_page_form .button {
        height: auto !important;
        min-height: 44px;
        padding: 10px 16px;
    }

    #login_page_footer.login-page-footer-pwa {
        padding-left: max(12px, env(safe-area-inset-left, 0px));
        padding-right: max(12px, env(safe-area-inset-right, 0px));
    }

    #login_page_footer.login-page-footer-pwa #down_copy {
        font-size: 11px;
        gap: 6px 8px;
    }
}

@media only screen and (orientation: portrait) {
    .leaflet-control-layers {
        box-sizing: border-box;
        max-height: 70vh; /* Высота для прокрутки */
        overflow-y: auto; /* Включение вертикальной прокрутки */
        -webkit-overflow-scrolling: touch; /* Плавная прокрутка для мобильных устройств */
        position: relative;
    }
}

.leaflet-control-layers-scrollbar {
    overflow-y: none;
}

.divInventoryReport {
    border-left: 1px solid var(--erpds-border, #DDE1E8);
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
}

.lightGray {
    background: var(--erpds-surface-2, #F6F7F9);
}

.arrow-icon {
    width: 14px;
    height: 14px;
}

.arrow-icon > div {
    margin-left: -1px;
    margin-top: -3px;
    transform-origin: center center;
    font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
}



/* ===== UI: Страница устройства — вкладка Инфо ===== */

.css-1d0ftwl { font-weight:600; font-size:16px; color:var(--erpds-text, #0F172A); letter-spacing:0.04em; padding-bottom:8px; border-bottom:2px solid var(--erpds-border, #DDE1E8); margin-bottom:14px; }

.MuiPaper-root td:first-child { color:#6b7a8d; font-size:12px; font-weight:400; padding:6px 6px 6px 14px; white-space:nowrap; width:110px; min-width:80px; max-width:120px; vertical-align:middle; }
.MuiPaper-root td:last-child { color:#1a1a1e; font-size:13px; font-weight:400; padding:6px 14px 6px 6px; vertical-align:middle; }
.MuiPaper-root tr:first-child td:last-child { font-size:13px; font-weight:600; color:#1a1a1e; white-space:normal; word-break:break-word; }
.MuiPaper-root tr { border-bottom:1px solid var(--erpds-border, #DDE1E8); }
.MuiPaper-root tr:last-child { border-bottom:none; }
.MuiPaper-root tr:nth-child(even) { background:#fafbfc; }
.MuiPaper-root td .MuiSvgIcon-root { display:block; margin:auto; }
.MuiPaper-root td .MuiSvgIcon-root path { fill:#2e7d32; }

.MuiTab-root { padding:6px 14px; font-size:12.5px; min-height:40px; }
.MuiTabs-root { border-bottom:1px solid var(--erpds-border, #DDE1E8); min-height:40px; }

.MuiButtonGroup-horizontal .MuiButton-root, .css-hpgf8j .MuiButton-root { border:1px solid rgba(30,134,197,0.3); border-radius:6px; padding:5px 10px; font-size:12px; margin-right:4px; transition:all 0.15s ease; }
.MuiButtonGroup-horizontal .MuiButton-root:hover, .css-hpgf8j .MuiButton-root:hover { background:rgba(30,134,197,0.08); border-color:rgba(30,134,197,0.55); }

.MuiButtonGroup-root { border:1px solid var(--erpds-border, #DDE1E8); border-radius:8px; background:var(--erpds-surface-2, #F6F7F9); padding:3px; gap:2px; display:inline-flex; }
.MuiIconButton-root { border-radius:6px; transition:background 0.15s ease, color 0.15s ease; }
.MuiIconButton-root:hover { background:rgba(59,82,109,0.1); color:var(--erpds-text, #0F172A); }

.css-17djde * { font-family:'Consolas','Monaco','Courier New',monospace; font-size:12px; line-height:1.75; }
.css-12z0wuy > .MuiButton-root:first-child { color:var(--erpds-text, #0F172A); font-size:13px; margin-bottom:4px; }
.css-1yuhvjn { margin-top:12px; }
.css-m4ra40 { border-bottom:1px solid var(--erpds-border, #DDE1E8); padding-bottom:10px; margin-bottom:4px; }

/* ===== UI: DataGrid — все вкладки ===== */

.MuiDataGrid-columnHeader { font-weight:600 !important; font-size:12px !important; color:var(--erpds-text, #0F172A) !important; background-color:var(--erpds-surface-2, #F6F7F9) !important; border-bottom:2px solid var(--erpds-border, #DDE1E8) !important; }
.MuiDataGrid-columnHeaderTitle { font-weight:600 !important; color:var(--erpds-text, #0F172A) !important; }

.MuiDataGrid-row--borderBottom,
.MuiDataGrid-row:nth-child(odd) { background-color:var(--erpds-surface-2, #F6F7F9) !important; }
.MuiDataGrid-row:nth-child(even) { background-color:#ffffff !important; }
.MuiDataGrid-row:hover { background-color:var(--main-color-table-hover, #E5EAFB) !important; }

.MuiDataGrid-cell { font-size:12.5px !important; color:#1a1a1e !important; border-bottom:1px solid var(--erpds-border, #DDE1E8) !important; outline:none !important; }
.MuiDataGrid-cell:focus, .MuiDataGrid-cell:focus-within { outline:none !important; }

.MuiDataGrid-toolbarContainer { padding:8px 10px !important; border-bottom:1px solid var(--erpds-border, #DDE1E8) !important; background:#fafbfc !important; gap:8px !important; }
.MuiDataGrid-toolbarContainer .MuiInputBase-root { background:#ffffff !important; border:1px solid var(--erpds-border, #DDE1E8) !important; border-radius:6px !important; font-size:12.5px !important; padding:2px 8px !important; }
.MuiDataGrid-toolbarContainer .MuiInputBase-root:focus-within { border-color:var(--erpds-text, #0F172A) !important; box-shadow:0 0 0 2px rgba(59,82,109,0.12) !important; }

.MuiDataGrid-root { border:1px solid var(--erpds-border, #DDE1E8) !important; border-radius:6px !important; }

.MuiDataGrid-overlay { background:rgba(250,251,252,0.9) !important; font-size:13px !important; color:#6b7a8d !important; }

.css-1ely9a9 { background-color:#d32f2f !important; color:#ffffff !important; border-radius:4px !important; font-size:11px !important; font-weight:700 !important; letter-spacing:0.05em !important; justify-content:center !important; align-items:center !important; }

.css-1iaqkhh { background-color:#1b8a4c !important; color:#ffffff !important; border-radius:4px !important; font-size:11px !important; font-weight:700 !important; justify-content:center !important; align-items:center !important; }

.MuiButtonGroup-root button { font-size:11.5px !important; padding:4px 9px !important; transition:background 0.12s ease, color 0.12s ease !important; }
.MuiButtonGroup-root button:not(:first-child) { color:var(--erpds-text, #0F172A) !important; opacity:0.75 !important; }
.MuiButtonGroup-root button:not(:first-child):hover { opacity:1 !important; background:var(--main-color-table-hover, #E5EAFB) !important; }

.MuiTypography-h6.css-1cyac1r { font-size:14px !important; font-weight:600 !important; color:var(--erpds-text, #0F172A) !important; background:var(--erpds-surface-2, #F6F7F9) !important; border-bottom:2px solid var(--erpds-border, #DDE1E8) !important; border-radius:4px 4px 0 0 !important; padding:8px 12px !important; }

/* Бейджи 2.5G и LOS — принудительно белый текст */
.css-1iaqkhh p, .css-1iaqkhh span, .css-1iaqkhh .MuiTypography-root { color: #ffffff !important; font-weight: 700 !important; }
.css-1ely9a9 p, .css-1ely9a9 span, .css-1ely9a9 .MuiTypography-root { color: #ffffff !important; font-weight: 700 !important; }

/* Кнопка "On" (Порт включён) — зелёный с рамкой */
.MuiButton-textSuccess { color: #2e7d32 !important; border: 1px solid rgba(46,125,50,0.4) !important; border-radius: 4px !important; padding: 2px 8px !important; font-weight: 600 !important; background: rgba(46,125,50,0.07) !important; min-width: unset !important; }
.MuiButton-textSuccess:hover { background: rgba(46,125,50,0.15) !important; border-color: rgba(46,125,50,0.65) !important; }

/* Кнопка "Off" (Порт выключен) — красный с рамкой */
.MuiButton-textError { color: #c62828 !important; border: 1px solid rgba(198,40,40,0.4) !important; border-radius: 4px !important; padding: 2px 8px !important; font-weight: 600 !important; background: rgba(198,40,40,0.06) !important; min-width: unset !important; }
.MuiButton-textError:hover { background: rgba(198,40,40,0.13) !important; }

/* ===== UI: вкладка Список VLAN (MuiTable) ===== */
.MuiTableCell-head { font-size:12px !important; font-weight:600 !important; color:var(--erpds-text, #0F172A) !important; background-color:var(--erpds-surface-2, #F6F7F9) !important; padding:8px 10px !important; border-bottom:2px solid var(--erpds-border, #DDE1E8) !important; white-space:nowrap !important; }
.MuiTableCell-body { font-size:12.5px !important; color:#1a1a1e !important; padding:5px 10px !important; border-bottom:1px solid var(--erpds-border, #DDE1E8) !important; }
.MuiTableCell-body:first-child { font-family:'Consolas','Monaco',monospace !important; font-weight:600 !important; color:var(--erpds-text, #0F172A) !important; font-size:12px !important; }
.MuiTableRow-root:nth-child(odd):not(.MuiTableRow-head) { background-color:var(--erpds-surface-2, #F6F7F9) !important; }
.MuiTableRow-root:nth-child(even):not(.MuiTableRow-head) { background-color:#ffffff !important; }
.MuiTableRow-root:not(.MuiTableRow-head):hover { background-color:var(--main-color-table-hover, #E5EAFB) !important; cursor:pointer !important; }
.MuiTableContainer-root { border:1px solid var(--erpds-border, #DDE1E8) !important; border-radius:6px !important; box-shadow:none !important; overflow:hidden !important; }

/* === Адаптивные вкладки MuiTabs === */

.MuiTabScrollButton-root { display: none !important; }

.MuiTabs-scroller {
  display: block !important;
  white-space: normal !important;
  overflow: visible !important;
}

.MuiTabs-root {
  height: auto !important;
}

.MuiTabs-flexContainer {
  flex-wrap: wrap !important;
  width: 100% !important;
}

.MuiTab-root {
  flex: 1 1 auto !important;
  min-width: 80px !important;
  max-width: none !important;
  white-space: normal !important;
  padding: 6px 10px !important;
  font-size: 0.75rem !important;
}

.MuiTabs-root .MuiTabs-indicator { display: none !important; }

.MuiTab-root.Mui-selected { border-bottom: 2px solid currentColor !important; }

/* === Адаптивное меню действий === */

.css-m4ra40 { width: 100% !important; }

.MuiButtonGroup-root.MuiButtonGroup-horizontal,
.MuiButtonGroup-root.MuiButtonGroup-horizontal.MuiButtonGroup-contained {
  display: flex !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

.MuiButtonGroup-root.MuiButtonGroup-horizontal .MuiButton-root,
.MuiButtonGroup-root.MuiButtonGroup-horizontal .MuiIconButton-root {
  flex: 1 1 auto !important;
  min-width: 60px !important;
  white-space: normal !important;
  overflow: visible !important;
}

.MuiButtonGroup-root.MuiButtonGroup-horizontal .wn-btn-label,
.MuiButtonGroup-root.MuiButtonGroup-contained button .wn-btn-label {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  max-width: none !important;
  display: inline !important;
}

/* Контейнер с 2+ кнопками вне ButtonGroup (tab-panel action buttons) */
.css-m4ra40 .MuiBox-root,
.css-12z0wuy > .MuiBox-root:not(.css-m4ra40) {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
}

.css-m4ra40 .MuiBox-root > .MuiButton-root,
.css-12z0wuy > .MuiBox-root:not(.css-m4ra40) > .MuiButton-root {
  flex: 1 1 auto !important;
  min-width: 80px !important;
}

/* ─── Mobile: card-view для таблиц ─── */

@media (min-width: 601px) {
    .wn-mobile-filter-toggle {
        display: none !important;
    }
}


/* ─── Customer page: табы #navigation на мобилке ─── */

/* ─── Customer page: мобильная адаптация контента ─── */

/* ─── Settings page: мобильная адаптация ─── */


/* ─── PWA (display-mode: standalone): хедер с safe-area ─── */
@media (display-mode: standalone) {
    /* Отступ под нотч / Dynamic Island */
    #top_topline_all {
        padding-top: env(safe-area-inset-top, 0px);
    }

    /* «Наверх» — ниже, над home-indicator (горизонталь — в базовом #to_top) */
    #to_top {
        bottom: calc(16px + env(safe-area-inset-bottom, 0px));
    }

    #pwa-install-footer-link,
    #pwa-install-footer-btn,
    #pwa-install-footer-hint,
    .login-pwa-install-wrap,
    .login-pwa-install-hint-wrap {
        display: none !important;
    }
}

/* ─── PWA + мобилка: компактный хедер ─── */
/* #top_links уже скрыт в @media (max-width: 600px) */

/* ─── PWA Install Footer Hint (Login Page) ─── */
#login_page_footer.login-page-footer-pwa .login-pwa-install-hint-wrap {
    display: inline-flex;
}
#login_page_footer.login-page-footer-pwa .login-pwa-install-hint {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 32px;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.36);
    color: #fff !important;
    text-decoration: none;
    font-size: 12px;
    line-height: 1.2;
    transition: background-color .2s ease, border-color .2s ease;
    cursor: pointer;
    pointer-events: auto;
    word-break: normal;
}
#login_page_footer.login-page-footer-pwa .login-pwa-install-hint:hover {
    background: rgba(255, 255, 255, 0.26);
    border-color: rgba(255, 255, 255, 0.5);
    color: #fff !important;
}
#login_page_footer.login-page-footer-pwa .login-pwa-install-hint:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}
#login_page_footer.login-page-footer-pwa .login-pwa-install-hint-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 18px;
    border-radius: 999px;
    background: rgba(25, 118, 210, 0.95);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.04em;
}
#login_page_footer.login-page-footer-pwa .login-pwa-install-hint-text {
    font-weight: 600;
}
#login_page_footer.login-page-footer-pwa .login-pwa-install-hint-more {
    opacity: .9;
    text-decoration: underline;
    text-underline-offset: 2px;
}
#login_page_footer.login-page-footer-pwa .login-footer-down-meta-inner .login-pwa-install-hint-wrap {
    grid-column: 1 / -1;
    justify-self: stretch;
}
#login_page_footer.login-page-footer-pwa .login-footer-down-meta-inner .login-pwa-install-hint {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
}
#login_page_footer.login-page-footer-pwa .login-pwa-install-hint-wrap.login-pwa-install-unavailable {
    display: none !important;
}

/* ─── Footer2 PWA Link ─── */
.footer2 #down_copy .footer-pwa-guide-link {
    color: inherit;
    opacity: 0.82;
    text-decoration: none;
    border-bottom: 1px dashed currentColor;
}
.footer2 #down_copy .footer-pwa-guide-link:hover {
    opacity: 1;
    border-bottom-style: solid;
}

/* ─── Footer2 Layout & Axis Alignment ─── */
.footer2 {
    padding: 10px 0 calc(10px + env(safe-area-inset-bottom, 0px));
    margin-bottom: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 14px;
    /* Непрозрачный фон: sticky #aside_left тянется до низа flex-контейнера и
       перекрывает футер — без фона текст меню просвечивает сквозь футер. */
    background: var(--main-color-body-background, #F2F4F7);
}
.footer2 #down_copy {
    line-height: 1.45;
    overflow-wrap: anywhere;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 10px;
    flex: 1 1 520px;
    min-width: 280px;
    order: 1;
}
.footer2 #down_copy a {
    word-break: break-word;
}
.footer2 #down_copy #down_copy_caption_id {
    display: inline-block;
    max-width: 100%;
    white-space: normal;
}
.footer2 #down_copy .footer2-caption {
    opacity: 0.9;
}
.footer2 #down_support {
    width: auto;
    min-width: 150px;
    min-height: 28px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: static;
    border-radius: 8px;
    box-sizing: border-box;
    cursor: pointer;
    margin-left: auto;
    order: 3;
}
.footer2 #down_support a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    line-height: 1.2;
    white-space: nowrap;
    width: 100%;
    justify-content: center;
}
.footer2 #down_finishinfo {
    display: block;
    position: static;
    margin: 0 0 0 auto;
    padding: 0 2px;
    font-size: 8pt;
    color: var(--main-color-body-background);
    order: 2;
    line-height: 1.3;
}

/* === Sticky-заголовки календаря (desktop) === */
/* border-collapse должен быть separate, чтобы position:sticky работало на td/th.
   border-spacing:0 уже выставлен inline на таблице; здесь повторяем как CSS-fallback. */
.calendar_all {
    border-collapse: separate;
    border-spacing: 0;
}

/* .table_data ставит overflow:hidden — он ломает sticky (предок с overflow
   между th и скролл-враппером перехватывает прилипание). Возвращаем visible
   только для календарной таблицы, чтобы заголовки липли к враппер-скроллу. */
.calendar_all_wrapper .calendar_all {
    overflow: visible;
}

/* Враппер сам становится скролл-контейнером (max-height до низа вьюпорта
   ставится в JS calendarSyncStickyLayout). Заголовки липнут к ВЕРХУ враппера
   (top:0), а не к окну — иначе overflow-x:auto враппера ловит sticky и
   вертикальное прилипание не работает (заголовок уезжал, верхние карточки
   перекрывались липкой шапкой портала). */
.calendar_all_wrapper .calendar_header th {
    position: sticky;
    top: 0;
    z-index: 3;
    background-color: var(--erpds-surface-2, #f4f5f7);
    /* Мягкая тень снизу — отделяет липкую шапку от уезжающих под неё карточек. */
    box-shadow: 0 2px 4px -2px rgba(0, 0, 0, 0.12);
}

/* Колонка часов: прилипает к левому краю при горизонтальной прокрутке. */
.calendar_all_wrapper .calendar_item_hour {
    position: sticky;
    left: 0;
    z-index: 2;
    background-color: var(--erpds-surface, #fff);
    /* Компенсируем потерю правой границы при separate+0-spacing через box-shadow */
    box-shadow: inset -1px 0 0 var(--erpds-border, #DDE1E8);
}

/* Угловая ячейка (часы × заголовок): sticky по обеим осям, выше всего. */
.calendar_all_wrapper .calendar_header th.calendar_header_date:first-child,
.calendar_all_wrapper .calendar_header th:first-child {
    position: sticky;
    left: 0;
    top: 0;
    z-index: 4;
    background-color: var(--erpds-surface-2, #f4f5f7);
}

#ui-datepicker-div {
    z-index: 1000 !important;
}

/* === Зебра по часовым строкам (чётные часы) === */
/* tr:nth-child считает с 1; первый tr = calendar_header (нечётный).
   Нечётные строки контента = tr:nth-child(even) относительно всей таблицы.
   Применяем тинт к td внутри чётных строк, исключая ячейки с карточками. */
.calendar_all tr:nth-child(even) td.calendar_item_element:not([class*="current_date_red"]):not([class*="current_date_warning"]),
.calendar_all tr:nth-child(even) td.calendar_item_hour {
    background-color: color-mix(in srgb, var(--erpds-text, #0F172A) 3%, transparent);
}

/* Час-столбец в зебра-строке не должен перекрывать sticky-фон — добавляем тинт поверх */
.calendar_all tr:nth-child(even) td.calendar_item_hour {
    background-color: color-mix(in srgb, var(--erpds-text, #0F172A) 3%, var(--erpds-surface, #fff));
}

/* === Softer unavailable/vacation (redback) === */
.current_date_red {
    background-color: color-mix(in srgb, var(--erpds-danger, #E53E3E) 8%, var(--erpds-surface, #fff)) !important;
    background-image: repeating-linear-gradient(
        -45deg,
        transparent,
        transparent 4px,
        color-mix(in srgb, var(--erpds-danger, #E53E3E) 12%, transparent) 4px,
        color-mix(in srgb, var(--erpds-danger, #E53E3E) 12%, transparent) 5px
    ) !important;
    cursor: not-allowed;
}

/* Availability context is deliberately compact: it supplements the cell tint
   and remains readable in narrow employee columns. */
.erpds-calendar-availability-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    max-width: min(100%, 18rem);
    min-width: 0;
    padding: 2px 6px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 11px;
    line-height: 1.25;
    white-space: normal;
    overflow-wrap: anywhere;
    vertical-align: middle;
}
.erpds-calendar-availability-badge--warning {
    color: var(--erpds-warn-text, var(--erpds-warn, #8A5A00));
    background: color-mix(in srgb, var(--erpds-warn, #E8A020) 12%, var(--erpds-surface, #fff));
    border-color: color-mix(in srgb, var(--erpds-warn, #E8A020) 38%, var(--erpds-surface, #fff));
}
.erpds-calendar-availability-badge--danger {
    color: var(--erpds-danger-text, var(--erpds-danger, #A51D2D));
    background: color-mix(in srgb, var(--erpds-danger, #D7263D) 10%, var(--erpds-surface, #fff));
    border-color: color-mix(in srgb, var(--erpds-danger, #D7263D) 34%, var(--erpds-surface, #fff));
}
.current_date_warning {
    background-color: color-mix(in srgb, var(--erpds-warn, #E8A020) 8%, var(--erpds-surface, #fff)) !important;
    background-image: repeating-linear-gradient(
        -45deg,
        transparent,
        transparent 4px,
        color-mix(in srgb, var(--erpds-warn, #E8A020) 13%, transparent) 4px,
        color-mix(in srgb, var(--erpds-warn, #E8A020) 13%, transparent) 5px
    ) !important;
    cursor: not-allowed;
}

/* === Now-line: позиционирующий контейнер === */
.calendar_all_wrapper {
    position: relative;
}

/* Линия текущего времени */
.calendar-now-line {
    position: absolute;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--erpds-danger, #E53E3E);
    pointer-events: none;
    z-index: 5;
    opacity: 0.7;
}
.calendar-now-line::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--erpds-danger, #E53E3E);
}
.calendar-now-line__label {
    position: absolute;
    left: 52px;
    top: 50%;
    transform: translateY(-50%);
    padding: 1px 6px 2px;
    border-radius: 999px;
    background: var(--erpds-danger, #E53E3E);
    color: #fff;
    font-size: 11px;
    line-height: 1.2;
    font-weight: 600;
    white-space: nowrap;
    pointer-events: auto;
}

/* === Мобильная sticky (переопределяем z-index под единую схему) === */
@media screen and (max-width: 900px) {
    .calendar_all_wrapper .calendar_header th {
        position: sticky;
        top: 0;
        z-index: 3;
        background-color: var(--erpds-surface-2, #f4f5f7);
    }
    .calendar_all_wrapper .calendar_item_hour {
        position: sticky;
        left: 0;
        background-color: var(--erpds-surface, #fff);
        z-index: 2;
    }
    .calendar_all_wrapper .calendar_header_date:first-child {
        position: sticky;
        left: 0;
        top: 0;
        background-color: var(--erpds-surface, #fff);
        z-index: 4;
    }
    .footer2 #down_copy {
        width: 100%;
        text-align: center;
        justify-content: center;
        gap: 6px 10px;
        min-width: 0;
    }
    .footer2 #down_support {
        display: flex;
        width: 100%;
        max-width: 100%;
        min-height: 40px;
        padding: 0;
        margin-top: 10px;
        border-radius: 10px;
        margin-left: 0;
        order: 3;
    }
    .footer2 #down_support a {
        width: 100%;
        justify-content: center;
        padding: 10px 12px;
    }
    .footer2 #down_copy #down_copy_link_id,
    .footer2 #down_copy #down_copy_caption_id,
    .footer2 #down_copy .footer-pwa-guide-link {
        display: block;
        width: 100%;
        text-align: center;
    }
    .footer2 #down_finishinfo {
        width: 100%;
        text-align: center;
        margin: 0;
        order: 2;
    }
}

/* ============================================
   ЖУРНАЛ ЗАДАНИЙ — UX/UI улучшения
   ============================================ */

.journal-header-table { width: 100%; border-collapse: collapse; }
.journal-header-table td { padding: 0 !important; }
.journal-header-table td:first-child { width: 100% !important; }
.journal-header-table a.i0 { padding-left: 16px !important; display: flex !important; align-items: center !important; min-height: 40px !important; }
.journal-header-table a.i0 p.us-icon { margin-left: 0 !important; margin-right: 12px !important; }

.journal-badge { display: inline-flex; align-items: center; justify-content: center;
  min-width: 28px; height: 22px; padding: 0 7px; border-radius: 11px;
  font-weight: 700; line-height: 1; color: #fff; margin-left: 4px; }
.journal-badge.badge-active { background: var(--erpds-bad, #B62A26); }
.journal-badge.badge-total  { background: var(--main-color, #3B5BDB); }

.journal-search-wrap { padding: 6px 8px 2px 8px; box-sizing: border-box; width: 100%; }
.journal-search-row { display: flex !important; align-items: center;
  background: var(--erpds-surface-2, #F6F7F9); border: 1px solid var(--erpds-border, #DDE1E8); border-radius: 6px;
  overflow: hidden; transition: border-color 0.2s, box-shadow 0.2s;
  width: 100%; box-sizing: border-box; }
.journal-search-row:focus-within { border-color: var(--main-color, #3B5BDB); box-shadow: 0 0 0 2px rgba(59,91,219,.15); background: #fff; }
.journal-search-row input[type=text] { flex: 1 !important; background: transparent !important;
  border: none !important; outline: none !important; padding: 7px 8px !important;
  font-size: 15px !important; color: var(--erpds-text, #0F172A) !important; min-width: 0;
  box-shadow: none !important; width: auto !important; min-height: unset !important; height: auto !important; }
.journal-search-row input::placeholder { color: var(--erpds-text-muted, #525A66) !important; }
.journal-search-row button[type=submit] { background: transparent !important; border: none !important;
  padding: 0 8px !important; cursor: pointer; opacity: 0.5; color: var(--erpds-text-muted, #525A66);
  transition: opacity .15s; min-height: unset !important; height: auto !important;
  display: flex !important; align-items: center; }
.journal-search-row button[type=submit]:hover { opacity: 0.9; }

.journal-quick-links { display: flex; gap: 5px; padding: 4px 8px 2px 8px; flex-wrap: wrap; }

.journal-quick-create {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 44px;
  padding: 0 12px !important;
  border: 1px solid var(--erpds-accent, #3B5BDB) !important;
  border-radius: 10px !important;
  background: var(--erpds-accent, #3B5BDB) !important;
  color: var(--erpds-text-on-accent, #fff) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  font-family: inherit;
  text-decoration: none !important;
  white-space: nowrap;
  cursor: pointer;
  box-sizing: border-box;
  transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
  -webkit-appearance: none;
  appearance: none;
}
.journal-quick-create:hover {
  background: var(--erpds-accent-hover, #2D4AC7) !important;
  border-color: var(--erpds-accent-hover, #2D4AC7) !important;
  color: var(--erpds-text-on-accent, #fff) !important;
}
.journal-quick-create:focus-visible {
  outline: 2px solid var(--erpds-focus, #2563B8);
  outline-offset: 2px;
  box-shadow: 0 0 0 3px rgba(37, 99, 184, .18);
}
.journal-quick-create:active {
  transform: translateY(1px);
}
.journal-quick-create .us-icon {
  font-size: 14px;
  line-height: 1;
  color: currentColor !important;
}
.journal-quick-create__label {
  display: inline-block;
}

.qcreate {
  width: min(100%, 560px);
  max-height: min(78vh, 720px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
  border-radius: 8px;
  background: var(--erpds-surface, #fff);
  color: var(--erpds-text, #0F172A);
  box-sizing: border-box;
}
.qcreate__title {
  font-size: 18px;
  line-height: 1.25;
  font-weight: 700;
  color: var(--erpds-text, #0F172A);
  padding-right: 40px;
}
.qcreate__search {
  width: 100%;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid var(--erpds-border, #DDE1E8);
  border-radius: 8px;
  background: var(--erpds-surface-2, #F6F7F9);
  color: var(--erpds-text, #0F172A);
  font-size: 15px;
  box-sizing: border-box;
}
.qcreate__search:focus-visible {
  outline: 2px solid var(--erpds-focus, #2563B8);
  outline-offset: 2px;
  border-color: var(--erpds-focus, #2563B8);
  background: var(--erpds-surface, #fff);
}
.qcreate__mini {
  font-size: 13px;
  line-height: 1.4;
  color: var(--erpds-text-muted, #525A66);
}
.qcreate__list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 0;
  overflow-y: auto;
  padding-right: 4px;
}
.qcreate__group {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 8px 10px 4px;
  background: var(--erpds-surface, #fff);
  color: var(--erpds-text-muted, #525A66);
  font-size: 12px;
  line-height: 1.25;
  font-weight: 700;
  text-transform: uppercase;
}
.qcreate__row {
  display: block;
  padding: 10px 12px;
  border-radius: 8px;
  color: var(--erpds-text, #0F172A);
  text-decoration: none;
  line-height: 1.35;
  border: 1px solid transparent;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.qcreate__row:hover,
.qcreate__row.is-active {
  background: var(--erpds-accent-soft, #E0EAF6);
  border-color: rgba(59, 91, 219, .18);
  color: var(--erpds-text, #0F172A);
}
.qcreate__row:focus-visible {
  outline: 2px solid var(--erpds-focus, #2563B8);
  outline-offset: 2px;
}
.qcreate__empty,
.qcreate__shell-message {
  font-size: 14px;
  line-height: 1.5;
  color: var(--erpds-text-muted, #525A66);
}
.qcreate__empty {
  padding: 8px 4px 0;
}
.qcreate__shell-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
.qcreate__close,
.qcreate__retry {
  min-height: 44px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  font-family: inherit;
  box-sizing: border-box;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.qcreate__close {
  min-width: 44px;
  padding: 0 12px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--erpds-text-muted, #525A66);
}
.qcreate__close:hover {
  background: var(--erpds-surface-2, #F6F7F9);
  color: var(--erpds-text, #0F172A);
}
.qcreate__close:focus-visible,
.qcreate__retry:focus-visible {
  outline: 2px solid var(--erpds-focus, #2563B8);
  outline-offset: 2px;
}
.qcreate__retry {
  padding: 0 14px;
  border: 1px solid var(--erpds-accent, #3B5BDB);
  background: var(--erpds-accent, #3B5BDB);
  color: var(--erpds-text-on-accent, #fff);
}
.qcreate__retry:hover {
  background: var(--erpds-accent-hover, #2D4AC7);
  border-color: var(--erpds-accent-hover, #2D4AC7);
}
.qcreate--loading,
.qcreate--error {
  width: min(100%, 420px);
}
.qcreate--loading .qcreate__shell-message,
.qcreate--error .qcreate__shell-message {
  padding: 4px 0 8px;
}

/* Unified Chip Style */
.journal-quick-link,
aside .journal-today-chip,
aside .journal-footer-link {
  display: inline-flex !important;
  align-items: center;
  gap: 4px;
  padding: 2px 8px !important;
  border-radius: 10px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  white-space: nowrap;
  min-height: unset !important;
  height: auto !important;
  line-height: 1.4 !important;
  transition: all .15s;
}

/* Neutral Variant (General links) */
.journal-quick-link,
aside .journal-footer-link {
  background: var(--erpds-accent-soft, #E0EAF6);
  border: 1px solid var(--erpds-border, #DDE1E8);
  color: var(--erpds-text, #0F172A) !important;
}
.journal-quick-link:hover,
aside .journal-footer-link:hover {
  background: var(--erpds-accent-soft-hover, #D5DCEF);
  border-color: var(--erpds-accent-soft-hover, #D5DCEF);
  color: var(--erpds-text, #0F172A) !important;
}

/* Active State */
.journal-quick-link.is-active,
aside .journal-footer-link.is-active {
  background: var(--erpds-accent, #3B5BDB) !important;
  border-color: var(--erpds-accent, #3B5BDB) !important;
  color: var(--erpds-text-on-accent, #fff) !important;
}
.journal-quick-link.is-active:hover,
aside .journal-footer-link.is-active:hover {
  background: var(--erpds-accent, #3B5BDB) !important;
  border-color: var(--erpds-accent, #3B5BDB) !important;
  color: var(--erpds-text-on-accent, #fff) !important;
}
/* I2: подсветка выбранного типа/группы в журнале (active-state по текущему фильтру списка) */
aside .journal-group-link.is-active {
  background: var(--erpds-accent, #3B5BDB) !important;
  border-color: var(--erpds-accent, #3B5BDB) !important;
  color: var(--erpds-text-on-accent, #fff) !important;
  border-radius: 6px;
}
aside .journal-group-link.is-active .journal-group-name,
aside .journal-group-link.is-active .journal-group-count {
  color: var(--erpds-text-on-accent, #fff) !important;
}
aside .journal-type-item.is-active {
  border-left: 3px solid var(--erpds-accent, #3B5BDB);
  background: rgba(59, 91, 219, 0.08);
  border-radius: 4px;
}

.erpds-filter-summary {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 8px 0 12px;
  padding: 8px 10px;
  border: 1px solid var(--erpds-border, #D8DEE8);
  border-radius: 6px;
  background: var(--erpds-surface-muted, #F6F8FB);
}

.erpds-filter-summary__toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
}

.erpds-filter-summary__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  padding: 0 7px;
  border-radius: 999px;
  background: var(--erpds-accent, #3B5BDB);
  color: #fff;
  font: 700 12px/1 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.erpds-filter-summary__text {
  min-width: 0;
  color: var(--erpds-text-muted, #525A66);
  font-size: 13px;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

@media (max-width: 900px) {
  .erpds-filter-summary {
    flex-wrap: nowrap;
    gap: 6px;
    margin: 4px 0 8px;
    padding: 0;
    border: 0;
    background: transparent;
  }

  .erpds-filter-summary__toggle {
    min-height: 32px;
    flex: 0 0 auto;
  }

  .erpds-filter-summary__count {
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    font-size: 11px;
  }

  .erpds-filter-summary__text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    overflow-wrap: normal;
    font-size: 12px;
  }
}

/* Green Variant (Today) */
aside .journal-today-chip {
  background: var(--erpds-ok-soft, #E5F1E6) !important;
  border: 1px solid #a9dfbf !important;
  color: #27ae60 !important;
}
aside .journal-today-chip:hover {
  background: #d5f5e3 !important;
  color: #1e8449 !important;
}

.journal-section-divider { height: 1px; margin: 3px 8px; background: var(--erpds-border, #DDE1E8); }

.journal-plans-row { display: flex; align-items: center; justify-content: flex-start;
  padding: 3px 8px 2px 8px; gap: 8px; }
aside .journal-plans-row a:first-child { 
  color: var(--erpds-text, #0F172A) !important; text-decoration: none !important; }

.journal-group-item { display: flex !important; align-items: center !important; flex-wrap: wrap !important;
  padding: 0 !important; list-style: none !important; margin: 0 !important; border-radius: 4px; }
.journal-group-item > div[id^="ajax_left_typer_group_"] {
  width: 100%;
  border-left: 2px solid var(--erpds-border, #DDE1E8);
  margin-left: 10px;
}
.journal-group-item:hover { background: var(--main-color-table-hover, #E5EAFB); }
/* Родительская группа не подсвечивается, пока курсор на вложенном под-типе */
li.journal-group-item:has(> div[id^="ajax_left_typer_group_"] .journal-group-item:hover) {
  background: transparent !important;
}

aside .journal-group-link { flex: 1; display: flex !important; align-items: center !important;
  justify-content: space-between !important; padding: 5px 6px 5px 12px !important;
  text-decoration: none !important; font-size: 15px !important; color: var(--erpds-text, #0F172A) !important;
  border-radius: 4px; gap: 6px; min-width: 0;
  min-height: unset !important; height: auto !important; line-height: 1.4 !important; }
aside .journal-group-link:hover { text-decoration: none !important; }

.journal-group-name { flex: 1; min-width: 0; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; font-size: 15px !important; color: var(--erpds-text, #0F172A); }

.journal-group-count { flex-shrink: 0; min-width: 22px; height: 20px; padding: 0 6px;
  border-radius: 10px; font-size: 11px; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center; color: #fff; }
.journal-group-count.count-low  { background: var(--erpds-text-muted, #525A66); }
.journal-group-count.count-med  { background: var(--erpds-warn, #E07A1F); }
.journal-group-count.count-high { background: var(--erpds-bad, #B62A26); }

aside .journal-add-btn { flex-shrink: 0; width: 24px; height: 24px;
  display: flex !important; align-items: center; justify-content: center;
  border-radius: 50%; font-size: 18px; font-weight: 300; line-height: 1;
  color: var(--erpds-text-muted, #525A66); text-decoration: none !important; transition: background .12s, color .12s, transform .22s ease;
  margin-right: 6px; min-height: unset !important; padding: 0 !important; }
aside .journal-add-btn:hover { background: var(--erpds-ok-soft, #E5F1E6); color: var(--erpds-ok, #2E8540); text-decoration: none !important; }

/* Кнопка-раскрытие: FA-шеврон вместо + */
aside .journal-add-btn[href^="javascript:"] { font-size: 13px; color: var(--erpds-text-muted, #525A66); }
aside .journal-add-btn[href^="javascript:"] .fa {
  display: block; transition: transform .25s ease; }
aside .journal-add-btn[href^="javascript:"]:hover { background: var(--erpds-accent-soft, #E0EAF6); color: var(--main-color, #3B5BDB); }
/* Открытое состояние */
aside .journal-add-btn.is-open { color: var(--erpds-ok, #2E8540); background: var(--erpds-ok-soft, #E5F1E6); }
aside .journal-add-btn.is-open .fa { transform: rotate(180deg); }
/* Подсветка открытой группы светло-зелёным */
aside .journal-group-item.is-open > .journal-group-link {
  background: var(--erpds-ok-soft, #E5F1E6) !important; border-radius: 6px; }
aside .journal-group-item.is-open > .journal-group-link .journal-group-name {
  color: #1e8449 !important; font-weight: 500; }

.journal-footer-links { padding: 4px 8px 8px 8px; display: flex; gap: 6px; flex-wrap: wrap; }

/* P1 MRU: блок «Недавние типы задач» */
.journal-recent:not([hidden]) {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 4px 8px 2px 8px;
  border-bottom: 1px solid var(--erpds-border, #DDE1E8);
  margin-bottom: 2px;
}
.journal-recent__label {
  flex-basis: 100%;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--erpds-text-muted, #525A66);
  margin-bottom: 2px;
}
.journal-recent-chip {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.4;
  text-decoration: none !important;
  white-space: nowrap;
  max-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
  background: var(--erpds-accent-soft, #E0EAF6);
  border: 1px solid var(--erpds-border, #DDE1E8);
  color: var(--erpds-accent, #3B5BDB) !important;
  transition: background .12s, border-color .12s, color .12s;
}
.journal-recent-chip:hover,
.journal-recent-chip:focus-visible {
  background: var(--erpds-accent, #3B5BDB);
  border-color: var(--erpds-accent, #3B5BDB);
  color: var(--erpds-text-on-accent, #fff) !important;
  text-decoration: none !important;
  outline: none;
}
.journal-recent-chip:focus-visible {
  outline: 2px solid var(--erpds-focus, #2563B8);
  outline-offset: 2px;
}

.journal-hidden { display: none !important; }


/* Skeleton-loader для AJAX-подтипов */
@keyframes journal-skeleton-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}
.journal-group-skeleton { padding: 4px 6px 4px 20px; }
.journal-group-skeleton__row {
  display: flex; align-items: center; gap: 8px;
  height: 22px; margin-bottom: 2px; }
.journal-group-skeleton__name {
  flex: 1 1 0%; height: 10px; border-radius: 4px;
  background: var(--erpds-border, #DDE1E8); animation: journal-skeleton-pulse 1.2s ease-in-out infinite; }
.journal-group-skeleton__count {
  flex: 0 0 20px; height: 10px; border-radius: 4px;
  background: var(--erpds-border, #DDE1E8); animation: journal-skeleton-pulse 1.2s ease-in-out infinite 0.3s; }

.journal-group-item > div[id^="ajax_left_typer_group_"] > div {
  display: flex !important; align-items: stretch !important;
  padding: 3px 6px 3px 20px !important; min-height: unset !important;
  height: auto !important; border-radius: 4px; width: 100% !important;
  box-sizing: border-box !important; }
.journal-group-item > div[id^="ajax_left_typer_group_"] > div:hover { background: var(--main-color-table-hover, #E5EAFB); }

/* Ungrouped task types in #nav_ul_li_task_id (same structure as AJAX group subtypes) */
#nav_ul_li_task_id > li { list-style: none !important; padding: 0 !important; margin: 0 !important; }
#nav_ul_li_task_id > li > div {
  padding: 3px 6px 3px 20px !important; min-height: unset !important;
  height: auto !important; border-radius: 4px; width: 100% !important;
  box-sizing: border-box !important; }
#nav_ul_li_task_id > li > div:hover { background: var(--main-color-table-hover, #E5EAFB); }
#nav_ul_li_task_id > li > div > div {
  display: flex !important; align-items: center !important; gap: 6px; width: 100%; overflow: hidden; }
#nav_ul_li_task_id > li > div > div > div:first-child {
  flex: 0 0 auto !important; order: 2; float: none !important; width: fit-content !important; max-width: 36px; }
#nav_ul_li_task_id > li > div > div > div:last-child {
  flex: 1 1 auto !important; min-width: 0 !important; overflow: hidden; order: 1; }
#nav_ul_li_task_id > li > div > div > div:last-child a {
  font-size: 14px !important; color: var(--erpds-text, #0F172A) !important; text-decoration: none !important;
  display: block !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  min-height: unset !important; height: auto !important; line-height: 1.4 !important;
  padding: 1px 0 !important; background: none !important; }
#nav_ul_li_task_id > li > div > div > div:last-child a:hover { color: var(--main-color, #3B5BDB) !important; }
#nav_ul_li_task_id > li > div > div > div:first-child a {
  min-height: unset !important; height: auto !important; padding: 0 !important;
  display: inline-flex !important; align-items: center; color: var(--erpds-text-muted, #525A66) !important;
  font-size: 12px !important; text-decoration: none !important; }

aside nav > ul > li > a:not(.i0) {
  display: flex !important; align-items: center !important;
  height: 48px !important; padding-left: 16px !important; }
aside nav > ul > li > a:not(.i0) p.us-icon.us-icon-lmenu {
  margin-left: 0 !important; margin-right: 12px !important; }

/* ── Единый стиль nav: цвет/hover/radius как у журнала ── */

/* Top-level: цвет текста + hover */
#aside_left nav ul li:not(.journal-group-item) > a {
  color: var(--erpds-text, #0F172A) !important;
  border-radius: 4px; }
#aside_left nav ul li:not(.journal-group-item) > a:hover {
  background: var(--main-color-table-hover, #E5EAFB) !important;
  color: var(--erpds-text, #0F172A) !important; }

/* Active state: accent-soft pattern */
#aside_left nav ul li.active:not(.journal-group-item) > a {
  background-color: var(--erpds-accent-soft, #E0EAF6) !important;
  color: var(--erpds-accent, #3B5BDB) !important; }

/* Sub-items: стиль как у journal sub-type */
#aside_left nav ul li:not(.journal-group-item) ul li a {
  color: var(--erpds-text, #0F172A) !important;
  font-size: 15px !important;
  border-radius: 4px;
  line-height: 1.3 !important;
  min-height: 28px !important;
  height: auto !important;
  padding: 3px 6px 3px 12px !important; }

/* Десктоп: максимально компактно */
@media (min-width: 901px) {
  #aside_left nav ul li:not(.journal-group-item) ul li a {
    min-height: 24px !important;
    padding: 2px 6px 2px 10px !important;
    font-size: 14px !important;
    line-height: 1.3 !important; }
}
#aside_left nav ul li:not(.journal-group-item) ul li a:hover {
  background: var(--main-color-table-hover, #E5EAFB) !important;
  color: var(--erpds-text, #0F172A) !important;
  text-decoration: none !important; }

/* Ungrouped task type NAME link — spec (2,2,5), точечно; не затрагивает journal-group-link и AJAX sub-items */
#aside_left #nav_ul_li_task_id > li:not(.journal-group-item) > div > div > div:last-child a {
  font-size: 14px !important;
  min-height: unset !important;
  padding: 1px 0 !important;
  line-height: 1.4 !important; }
@media (min-width: 901px) {
  #aside_left #nav_ul_li_task_id > li:not(.journal-group-item) > div > div > div:last-child a {
    font-size: 14px !important;
    min-height: unset !important;
    padding: 1px 0 !important;
    line-height: 1.4 !important; }
}
/* Ungrouped counter link — Rule A (1,1,6) иначе ставил бы padding: 3px 6px */
#aside_left #nav_ul_li_task_id > li:not(.journal-group-item) > div > div > div:first-child a {
  padding: 0 !important; min-height: unset !important; height: auto !important; }
/* Восстанавливаем journal-group-link — spec (2,2,2) бьёт Rule A (1,1,6) */
#aside_left #nav_ul_li_task_id > li.journal-group-item > a.journal-group-link {
  padding: 5px 6px 5px 12px !important;
  min-height: unset !important; height: auto !important; font-size: 15px !important; }
/* Восстанавливаем journal-add-btn — spec (2,2,2) бьёт Rule A (1,1,6) */
#aside_left #nav_ul_li_task_id > li.journal-group-item > a.journal-add-btn {
  padding: 0 !important; min-height: unset !important;
  width: 24px !important; height: 24px !important; }

/* Active sub-item */
#aside_left nav ul li:not(.journal-group-item) ul li.active a,
#aside_left nav ul li:not(.journal-group-item) ul li a.span_bold {
  color: var(--main-color, #3B5BDB) !important;
  font-weight: 600;
  background: rgba(8,84,160,0.07) !important; }

@media (max-width: 600px) {
    .table_list_data thead {
        display: none !important;
    }

    .table_list_data,
    .table_list_data tbody,
    .table_list_data tr {
        display: block !important;
        width: 100% !important;
    }

    .table_list_data tr.table_item {
        border: 1px solid var(--erpds-border, #DDE1E8);
        border-radius: 6px;
        margin-bottom: 8px;
        padding: 6px 8px;
        background: #fff;
        position: relative;
        box-sizing: border-box;
    }

    .table_list_data tr.table_item_gray {
        background: var(--erpds-surface-2, #F6F7F9);
    }

    .table_list_data td {
        display: flex !important;
        width: 100% !important;
        padding: 3px 0;
        border: none !important;
        word-break: break-word;
        font-size: 13px;
        min-height: 0 !important;
        box-sizing: border-box;
    }

    .table_list_data td::before {
        content: attr(data-label);
        font-weight: 600;
        color: var(--erpds-text-muted, #525A66);
        min-width: 110px;
        flex-shrink: 0;
        font-size: 11px;
        padding-top: 2px;
    }

    .table_list_data td[data-label=""]::before {
        display: none;
    }

    .table_list_data tr.day_delimiter td {
        font-weight: bold;
        background: var(--erpds-accent-soft, #E0EAF6);
        border-radius: 4px;
        padding: 4px 8px;
        font-size: 12px;
    }

    .wn-mobile-filter-collapsed .div_filter_top {
        display: none !important;
    }

    .wn-mobile-filter-toggle {
        display: flex;
        align-items: center;
        gap: 6px;
        padding: 6px 12px;
        background: var(--main-color, #3B5BDB);
        color: #fff;
        border-radius: 4px;
        cursor: pointer;
        font-size: 13px;
        margin-bottom: 8px;
        width: fit-content;
    }

    /* Таблица деталей задания — обёртка с горизонтальным скроллом */
    #div_contentplace {
        overflow-x: auto !important;
    }
    #div_contentplace > table td,
    #div_contentplace > table th {
        word-break: break-word !important;
        overflow-wrap: break-word !important;
    }
    /* Календарь на дашборде — горизонтальный скролл */
    /* clear:both — иначе overflow:auto создаёт BFC и элемент сжимается рядом с float-nav */
    .slider_content,
    #div_news {
        overflow-x: auto !important;
        clear: both;
    }
    .table_data.calendar_all {
        min-width: 480px;
    }

    /* Кнопки смены статуса — переносить на мобиле */
    .working_menu_change_state {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 4px !important;
        min-width: 0 !important;
    }

    /* Скрыть второстепенные колонки */
    .table_list_data td[data-label="Автор задания"],
    .table_list_data td[data-label="Комментарии"] {
        display: none !important;
    }

    /* Описание — max 2 строки с ellipsis */
    .table_list_data td[data-label="Описание (расширенное)"] {
        display: block !important;
    }
    .table_list_data td[data-label="Описание (расширенное)"]::before {
        display: block;
        margin-bottom: 2px;
    }
    .table_list_data td[data-label="Описание (расширенное)"] > * ,
    .table_list_data td[data-label="Описание (расширенное)"] {
        overflow: hidden;
        display: -webkit-box !important;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        text-overflow: ellipsis;
        max-height: 3em;
    }

    /* Компактнее: убрать пустые td (иконка без label и без текста) */
    .table_list_data td[data-label=""]:empty {
        display: none !important;
    }

    /* Состояние задания — badge стиль */
    .table_list_data td[data-label="Состояние задания"] {
        font-size: 12px;
    }

    /* Дата + Исполнитель рядом на одной строке */
    .table_list_data td[data-label="Назначенная дата"],
    .table_list_data td[data-label="Исполнители"] {
        font-size: 12px;
        color: var(--erpds-text-muted, #525A66);
    }

    /* Карточки «Мои задания» — полная ширина на мобиле */
    .j_mywork_div {
        float: none !important;
        width: calc(100% - 10px) !important;
        min-width: 0 !important;
        max-width: none !important;
        box-sizing: border-box;
    }
    .j_mywork_div_create,
    .j_mywork_div_watch,
    .j_mywork_div_work,
    .j_mywork_div_wo_pers {
        max-width: none !important;
    }
    /* Горизонтальные бары chart (accountancy/fee) — не выходить за viewport */
    .green_block {
        max-width: calc(100vw - 155px) !important;
    }
    /* flags-container в блокноте — JS ставит inline width:844px, сбрасываем */
    .flags-container {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        box-sizing: border-box !important;
    }
    /* table_block — stack label/value rows on mobile */
    .table_block {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box;
    }
    .table_block .item {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        margin-bottom: 4px;
        gap: 2px;
    }
    .table_block .item > div {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box;
        overflow: hidden;
        word-break: break-word;
        overflow-wrap: break-word;
        white-space: normal;
        min-width: 0;
    }
    .table_block .left_data {
        text-align: left !important;
    }

    /* Фильтр абонентов — строки фильтра flex на мобиле */
    [id^="filter_selector_body_parent_"] {
        display: flex !important;
        flex-wrap: nowrap;
        align-items: center;
        width: 100% !important;
        gap: 4px;
        box-sizing: border-box;
    }
    [id^="filter_selector_body_parent_"] > div:first-child {
        flex: 1;
        min-width: 0;
    }
    [id^="filter_selector_body_parent_"] > div:first-child select {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
    [id^="filter_selector_body_parent_"] > div:last-child {
        flex-shrink: 0;
    }
    /* gray_block_left фильтры — flex на мобиле */
    .gray_block_left .table_block {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box;
    }
    .gray_block_left .table_block .item {
        display: flex !important;
        flex-wrap: wrap;
        width: 100% !important;
        gap: 4px;
        margin-bottom: 4px;
        align-items: center;
        box-sizing: border-box;
    }
    .gray_block_left .table_block .item > div.left_data {
        flex: 0 0 auto;
        white-space: nowrap;
    }
    .gray_block_left .table_block .item > div:not(.left_data) {
        flex: 1;
        min-width: 120px;
        box-sizing: border-box;
    }
    .gray_block_left .table_block .item > div:not(.left_data) input,
    .gray_block_left .table_block .item > div:not(.left_data) select {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
    .gray_block_left > div[style*="margin-right"] {
        margin-right: 0 !important;
    }
    /* inline-width контейнеры внутри gray_block_left */
    .gray_block_left > div[style*="width"] {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }
    .div_center {
        max-width: 100%;
        overflow-x: auto;
    }

    #div_failuremsg,
    .div-form-house-find,
    .div-form-customer-find {
        width: auto;
        max-width: 100%;
        box-sizing: border-box;
    }

    #div_failuremsg {
        margin-left: 8px;
        margin-right: 8px;
    }

    .main_content_inside_min {
        margin-left: 0;
        padding-left: 8px;
        padding-right: 8px;
    }

    .row {
        height: auto;
        margin-left: 0;
        margin-right: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .block-6,
    .block-5,
    .block-4,
    .block-3,
    .block-2,
    .block-1 {
        width: 100%;
        float: none;
        padding-left: 0;
        padding-right: 0;
        box-sizing: border-box;
    }

    ul#navigation,
    ul#navigation2 {
        height: auto;
        padding: 8px 0 0;
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
    }

    ul#navigation li,
    ul#navigation2 li {
        float: none;
        margin: 0;
    }

    ul#navigation li a:link,
    ul#navigation li a:visited,
    ul#navigation2 li a:link,
    ul#navigation2 li a:visited {
        height: auto;
        min-height: 40px;
        padding: 8px 12px;
        line-height: 1.25;
        float: none;
    }

    #to_top {
        bottom: calc(16px + env(safe-area-inset-bottom, 0px));
    }

    #to_top a {
        width: 60px;
        padding: 8px 4px 7px;
    }

    #to_top span {
        width: 30px;
        height: 30px;
        font-size: 20pt;
        padding-top: 2px;
    }

    .j_mywork_div {
        min-width: 0;
        max-width: 100%;
        width: calc(100% - 10px);
    }

    .j_mywork_div_create,
    .j_mywork_div_watch,
    .j_mywork_div_work,
    .j_mywork_div_wo_pers {
        max-width: 100%;
    }

    .j_card_label_div {
        float: none;
        display: inline-block;
        max-width: 100%;
    }

    .j_card_div,
    .j_card_label_div {
        box-sizing: border-box;
    }

    .lk_netdata .lk_netdata_text .lk_netdata_text_link .lk_lk_text {
        font-size: 16pt;
        top: 6px;
    }

    .lk_netdata .lk_netdata_text .lk_lk_userdata {
        top: 12px;
    }

    .c_attach_frame_div_right {
        position: static;
        right: auto;
        top: auto;
        width: auto;
        text-align: left;
    }

    .c_attach_frame_div_top {
        display: block;
    }

    .ui-dialog,
    .ui-dialog-content {
        max-width: calc(100vw - 16px) !important;
    }

    .ui-dialog-content {
        max-height: calc(100vh - 120px);
        overflow: auto;
    }

    .input_box,
    .textarea_class,
    #usersearch .field,
    #usersearch2 .field,
    #login_page #login_page_form .field,
    input[type="file"] {
        font-size: 16px;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    #login_page #login_page_form .field {
        min-height: 44px;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    #login_page #login_page_form .button {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .MuiDataGrid-root,
    .MuiTableContainer-root {
        max-width: 100%;
        overflow-x: auto;
    }

    .c_attach_frame_div,
    .div-form-house-find,
    .div-form-customer-find,
    #div_failuremsg,
    footer #down_support_div,
    .footer2 #down_support_div,
    #dialog-box,
    #map_add_obj_id {
        width: auto !important;
        max-width: calc(100vw - 16px) !important;
        box-sizing: border-box;
    }

    .c_attach_frame_div {
        min-width: 0;
    }

    .c_attach_frame_div_right {
        position: static;
        width: auto;
        right: auto;
        top: auto;
        text-align: left;
        padding-top: 8px;
    }

    footer #down_support_div,
    .footer2 #down_support_div {
        right: 8px;
        bottom: 8px;
        max-width: calc(100vw - 16px);
    }

    .footer2 #down_support,
    footer #down_support {
        width: auto;
        max-width: 150px;
    }

    .footer2 #down_finishinfo,
    .footer2 #down_finishinfo_full,
    .footer2 #down_finishinfo2_full {
        position: static;
        float: none;
        margin-right: 0;
        top: auto;
        width: auto;
        max-width: 100%;
    }

    nav {
        min-width: 0;
    }

    .lk_netdata .lk_logo {
        width: 96px;
        height: 96px;
        left: 50%;
        margin-left: -48px;
    }

    /* ─── Страница детали задания: вертикальное стекирование колонок ─── */
    .j-task-layout,
    .j-task-layout > tbody,
    .j-task-layout > tbody > tr {
        display: block !important;
        width: 100% !important;
    }

    .j-task-layout > tbody > tr > td {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box;
        padding-right: 0 !important;
    }

    /* Правая колонка (265px) — сброс фиксированной ширины */
    .j-task-layout > tbody > tr > td:last-child {
        width: 100% !important;
    }

    /* Метки в правой колонке — сброс min-width на мобиле */
    .j-task-layout .j_table_td_left_na {
        min-width: 0 !important;
        width: auto !important;
    }

    /* Карточки внутри колонок — занять всю ширину колонки */
    .j-task-layout .j_card_div,
    .j-task-layout .j_card_div_color {
        width: 100% !important;
        max-width: 100%;
        box-sizing: border-box;
        overflow-x: auto;
    }

    /* Таблицы внутри карточек — растянуть на всю карточку */
    .j-task-layout .j_card_div table,
    .j-task-layout .j_card_div_color table {
        width: 100% !important;
        max-width: 100%;
    }

    /* Длинный текст (адрес, описание) — перенос */
    .j-task-layout .j_card_div td,
    .j-task-layout .j_card_div_color td {
        word-break: break-word;
    }

    /* Восстановить table layout для карточек задания.
       Побиваем display:block на tr и td из @media (max-width:900px). */
    #div_contentplace .j-task-layout .j_card_div table tr:not(.rowCrossTask),
    #div_contentplace .j-task-layout .j_card_div_color table tr:not(.rowCrossTask) {
        display: table-row !important;
    }
    #div_contentplace .j-task-layout .j_card_div table tr:not(.rowCrossTask) td,
    #div_contentplace .j-task-layout .j_card_div_color table tr:not(.rowCrossTask) td {
        display: table-cell !important;
        width: auto !important;
        word-break: break-word;
    }

    /* table-layout:fixed — принудительный перенос, исключает переполнение */
    .j-task-layout .j_card_div .j_table,
    .j-task-layout .j_card_div_color .j_table {
        table-layout: fixed !important;
        width: 100% !important;
        font-size: 14px !important;
    }

    /* Label-колонка: фиксированная ширина 38%, перенос по словам */
    #div_contentplace .j-task-layout .j_card_div .j_table td:first-child,
    #div_contentplace .j-task-layout .j_card_div_color .j_table td:first-child {
        width: 38% !important;
        white-space: normal !important;
        word-break: break-word;
        overflow-wrap: break-word;
        overflow: hidden;
    }

    /* Value-колонка: всё оставшееся место, перенос длинных значений */
    #div_contentplace .j-task-layout .j_card_div .j_table td:last-child,
    #div_contentplace .j-task-layout .j_card_div_color .j_table td:last-child {
        width: 62% !important;
        word-break: break-word;
        overflow-wrap: break-word;
        overflow: hidden;
    }

    /* Чек-лист — чекбоксы увеличить для тача */
    #taskCheckListBody input[type="checkbox"] {
        width: 20px !important;
        height: 20px !important;
        cursor: pointer;
    }

    /* Иконки-кнопки (Исключить и пр.) внутри карточки задания */
    .j-task-layout .us-icon {
        min-width: 32px !important;
        min-height: 32px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 6px !important;
        box-sizing: border-box !important;
    }

    /* Тулбар задания — увеличить tap-target (базовый 24×24px) */
    .j_button {
        width: 36px !important;
        height: 36px !important;
        box-sizing: border-box !important;
        padding: 6px !important;
    }

    /* Кнопки смены состояния — главный CTA, touch-friendly */
    .button_state {
        min-height: 44px !important;
        box-sizing: border-box !important;
        padding: 6px 14px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* Связанные задания — карточный вид (12 TDs → flex-wrap, пустые скрыты) */
    #div_contentplace .rowCrossTask {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: flex-start !important;
        gap: 2px 8px !important;
        padding: 6px 4px !important;
        border-bottom: 1px solid var(--erpds-border, #DDE1E8) !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    #div_contentplace .rowCrossTask td {
        display: inline-flex !important;
        width: auto !important;
        padding: 2px 0 !important;
        font-size: 13px !important;
        word-break: break-word !important;
        vertical-align: top !important;
    }
    #div_contentplace .rowCrossTask td:empty {
        display: none !important;
    }

    ul#navigation, ul#navigation2 {
        height: auto !important;
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 2px;
        padding-bottom: 6px !important;
    }
    ul#navigation li, ul#navigation2 li {
        float: none !important;
        margin-bottom: 2px;
    }

    /* Шрифт в таблице данных абонента — читаемый размер */
    .table_block .item > div {
        font-size: 14px !important;
    }
    /* nanoGallery — скролл внутри, не распирать body */
    #c_attach_work_body_id,
    #c_attach_work_frame_id {
        max-width: 100% !important;
        overflow-x: auto !important;
    }
    /* Шрифт меток в правой колонке (left_data) */
    .table_block .item > div.left_data {
        font-size: 13px !important;
    }

    /* Левая навигация + правый контент — вертикальный стек */
    .menu_div_leftblock {
        float: none !important;
        width: 100% !important;
        margin-bottom: 8px;
    }
    .menu_div_rightblock {
        margin-left: 0 !important;
        width: 100% !important;
        box-sizing: border-box;
    }
    /* Лейбл настройки — полная ширина, стек над значением */
    .settings_option_name {
        width: 100% !important;
        float: none !important;
        text-align: left !important;
        padding-right: 0 !important;
        font-weight: bold;
        margin-bottom: 2px;
    }
    .settings_option_value {
        clear: both;
        width: 100% !important;
    }
    /* info_block — инлайн-элемент, не обрезать */
    .info_block {
        display: block !important;
        max-width: 100%;
        word-break: break-word;
    }
    /* Лимиты: .item — flex row */
    #menu_set_body .item {
        width: 100% !important;
        box-sizing: border-box;
    }
    #menu_set_body .item > div[style*="width"] {
        width: auto !important;
        max-width: 100% !important;
    }

    /* Фикс коллапса main_content на страницах с footer2 внутри flex-контейнера */
    #main_content {
        width: 100% !important;
        flex-basis: 100% !important;
        min-width: 0 !important;
        overflow-x: hidden;
    }
    /* Перенос длинных значений в полях формы редактирования */
    .table_block .item > div {
        word-break: break-word;
        overflow-wrap: break-word;
        max-width: 100%;
    }
    .table_block {
        overflow-x: hidden;
    }
    /* Поля фильтра и формы — 16px чтобы iOS не зумил, min-height 36px для касания */
    input[type="text"],
    input[type="search"],
    input[type="date"],
    input[type="number"],
    input[type="email"],
    input[type="tel"],
    select,
    textarea {
        font-size: 16px !important;
        min-height: 36px !important;
        box-sizing: border-box;
    }
    /* Кнопки фильтра — достаточная зона касания */
    .filter_apply, .filter_clear, button.btn, input[type="submit"], input[type="button"] {
        min-height: 36px !important;
        font-size: 14px !important;
    }

    /* ── Вложения: flex-layout вместо таблицы ── */
    #div_contentplace .c_attach_div_right_new table {
        display: block !important;
        width: 100% !important;
    }
    #div_contentplace .c_attach_div_right_new table tbody {
        display: block !important;
    }
    #div_contentplace .c_attach_div_right_new table tr {
        display: flex !important;
        flex-wrap: wrap;
        align-items: flex-start;
        width: 100% !important;
        padding: 8px 0;
        border-bottom: 1px solid var(--erpds-border, #DDE1E8);
        box-sizing: border-box;
    }
    /* превью-картинка */
    #div_contentplace .c_attach_div_right_new table td:first-child {
        width: 56px !important;
        flex: 0 0 56px !important;
        display: block !important;
    }
    #div_contentplace .c_attach_div_right_new table td:first-child img {
        width: 52px !important;
        height: 52px !important;
        object-fit: cover;
        border-radius: 4px;
        display: block;
    }
    /* имя файла */
    #div_contentplace .c_attach_div_right_new table td:nth-child(2) {
        flex: 1 1 0% !important;
        min-width: 0 !important;
        width: auto !important;
        display: block !important;
        word-break: break-all;
        font-size: 13px;
        padding-left: 6px;
        box-sizing: border-box;
    }
    /* дата загрузки */
    #div_contentplace .c_attach_div_right_new table td:nth-child(3) {
        flex: 0 0 100% !important;
        width: 100% !important;
        display: block !important;
        font-size: 11px;
        color: var(--erpds-text-muted, #525A66);
        padding-left: 62px;
        box-sizing: border-box;
        text-align: left !important;
    }
    /* имя оператора */
    #div_contentplace .c_attach_div_right_new table td:nth-child(4) {
        flex: 0 0 100% !important;
        width: 100% !important;
        display: block !important;
        font-size: 11px;
        color: var(--erpds-text-muted, #525A66);
        padding-left: 62px;
        box-sizing: border-box;
    }
    /* кнопки действий — ряд 44×44 */
    #div_contentplace .c_attach_div_right_new table td:nth-child(n+5) {
        flex: 0 0 44px !important;
        width: 44px !important;
        height: 44px !important;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
    }
    #div_contentplace .c_attach_div_right_new table td:nth-child(n+5) a,
    #div_contentplace .c_attach_div_right_new table td:nth-child(n+5) span {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        font-size: 18px;
    }

    /* Clipboard-меню и toggle-каретки: скрыты на мобиле — копирование через клик на #NNNNN */
    #clipboardMenuId,
    #copyClipLinkId,
    #copyClipLink2Id {
        display: none !important;
    }

    /* ─── Мобильная адаптация #dialog-box ─── */
    #dialog-box {
        left: 8px !important;
        right: 8px !important;
        width: auto !important;
        max-width: calc(100vw - 16px) !important;
        top: 60px !important;
        transform: none !important;
        margin-top: 0 !important;
        max-height: calc(100vh - 76px) !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        border-radius: 10px !important;
    }

    #dialog-box .dialog_header {
        margin: 0 !important;
        padding: 14px 16px !important;
        width: 100% !important;
        box-sizing: border-box !important;
        position: sticky !important;
        top: 0 !important;
        z-index: 2 !important;
        min-height: 50px !important;
        border-radius: 10px 10px 0 0 !important;
    }

    #dialog-box .dialog-content {
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    #dialog-box .table_block {
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    #dialog-box select,
    #dialog-box textarea,
    #dialog-box input[type="text"] {
        width: 100% !important;
        box-sizing: border-box !important;
        display: block !important;
        font-size: 15px !important;
        border-radius: 8px !important;
        border: 1.5px solid var(--erpds-border, #DDE1E8) !important;
        background-color: var(--erpds-surface-2, #F6F7F9) !important;
        padding: 8px 12px !important;
    }

    #dialog-box select,
    #dialog-box input[type="text"] {
        min-height: 44px !important;
    }

    #dialog-box textarea {
        height: 80px !important;
        min-height: 80px !important;
        max-height: 120px !important;
        resize: vertical !important;
    }

    #dialog-box .c_attach_div {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 4px 14px 8px !important;
        margin: 0 !important;
    }

    #dialog-box .c_attach_div .c_attach_div_right_new {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    #dialog-box .div_center {
        position: sticky !important;
        bottom: 0 !important;
        z-index: 2 !important;
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        flex-wrap: nowrap !important;
        padding: 10px 12px 12px !important;
        background: var(--erpds-surface-2, #F6F7F9) !important;
        border-top: 1px solid var(--erpds-border, #DDE1E8) !important;
        margin-top: 0 !important;
    }

    #dialog-box input[type="submit"] {
        flex: 1 1 auto !important;
        min-height: 44px !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        border-radius: 8px !important;
        border: none !important;
        margin: 0 !important;
    }

    #dialog-box .div_center a {
        font-size: 15px !important;
        padding: 10px 4px !important;
        white-space: nowrap !important;
    }
}

/* ============================================================
   ERPDS — Task Card v2 (Hero + Status Pill)
   Аддитивно поверх .label_h2 и .j_card_cur_state.
   Активируется только при наличии классов .erpds-task-title /
   .erpds-task-state — старая логика сохранена.
   ============================================================ */

.label_h2.erpds-task-title {
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--erpds-text, #0F172A);
    padding: 14px 16px;
    margin-top: 16px;
    margin-bottom: 12px;
    background: var(--erpds-surface, #FFFFFF);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-left: 4px solid var(--erpds-text-faint, #6B7280);
    border-radius: var(--erpds-radius, 12px);
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
    line-height: 1.25;
}
.label_h2.erpds-task-title a {
    color: var(--erpds-accent-text, #2D4AC7);
    text-decoration: none;
}
.label_h2.erpds-task-title a:hover { text-decoration: underline; }

.label_h2.erpds-task-title[data-system-role="run"]         { border-left-color: var(--erpds-warn, #E07A1F); }
.label_h2.erpds-task-title[data-system-role="successful"]  { border-left-color: var(--erpds-ok,   #2E8540); }
.label_h2.erpds-task-title[data-system-role="failed"]      { border-left-color: var(--erpds-bad,  #B62A26); }
.label_h2.erpds-task-title[data-system-role="holded"],
.label_h2.erpds-task-title[data-system-role="unfinished"]  { border-left-color: var(--erpds-hold, #C98A1A); }
.label_h2.erpds-task-title[data-system-role="cancelled"]   { border-left-color: var(--erpds-text-faint, #6B7280); }

/* --- Building title (hero-style) --- */
.label_h2.erpds-building-title {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--erpds-text, #0F172A);
    padding: 14px 16px;
    margin-top: 16px;
    margin-bottom: 12px;
    background: var(--erpds-surface, #FFFFFF);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-left: 4px solid var(--erpds-accent, #3B5BDB);
    border-radius: var(--erpds-radius, 12px);
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
    line-height: 1.25;
}
.label_h2.erpds-building-title .erpds-building-icon {
    color: var(--erpds-accent, #3B5BDB);
    font-size: 22px;
    opacity: 0.85;
    flex-shrink: 0;
}
.label_h2.erpds-building-title .label_backblack,
.label_h2.erpds-building-title .label_backyellow {
    padding: 2px 10px;
    border-radius: var(--erpds-radius-sm, 8px);
    font-size: 18px;
    font-weight: 600;
}

/* --- Tariff title (hero-style with price) --- */
.label_h2.erpds-tariff-title {
    display: flex;
    align-items: baseline;
    gap: 12px;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--erpds-text, #0F172A);
    padding: 14px 16px;
    margin-top: 16px;
    margin-bottom: 12px;
    background: var(--erpds-surface, #FFFFFF);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-left: 4px solid var(--erpds-orange, #E2602E);
    border-radius: var(--erpds-radius, 12px);
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
    line-height: 1.25;
    flex-wrap: wrap;
}
.label_h2.erpds-tariff-title .erpds-tariff-icon {
    color: var(--erpds-orange, #E2602E);
    font-size: 22px;
    opacity: 0.85;
    flex-shrink: 0;
    align-self: center;
}
.label_h2.erpds-tariff-title .erpds-tariff-price {
    font-size: 16px;
    font-weight: 600;
    color: var(--erpds-text-muted, #525A66);
    font-family: var(--erpds-mono, ui-monospace, monospace);
    margin-left: auto;
    min-width: 90px;
    text-align: right;
    background: var(--erpds-bg-2, #F2F4F7);
    padding: 4px 10px;
    border-radius: var(--erpds-radius-sm, 8px);
    letter-spacing: 0;
    white-space: nowrap;
}

/* --- Message / Communication history title (hero-style) --- */
.label_h2.erpds-message-title {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--erpds-text, #0F172A);
    padding: 14px 16px;
    margin-top: 16px;
    margin-bottom: 12px;
    background: var(--erpds-surface, #FFFFFF);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-left: 4px solid var(--erpds-info, #2563B8);
    border-radius: var(--erpds-radius, 12px);
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
    line-height: 1.25;
}
.label_h2.erpds-message-title .erpds-message-icon {
    color: var(--erpds-info, #2563B8);
    font-size: 22px;
    opacity: 0.85;
    flex-shrink: 0;
}

/* ============================================================
   ERPDS — Hero base (shared across page-titles)
   Один блок общих правил для всех .label_h2.erpds-*-title.
   Per-variant override остаётся выше: border-left-color, icon color.
   ============================================================ */
.label_h2.erpds-task-title,
.label_h2.erpds-building-title,
.label_h2.erpds-tariff-title,
.label_h2.erpds-message-title,
.label_h2.erpds-inventory-title {
    font-family: var(--erpds-sans, -apple-system, Inter, sans-serif);
}

/* --- Inventory title (purple-ish accent — distinct from task/customer) --- */
.label_h2.erpds-inventory-title {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--erpds-text, #0F172A);
    padding: 14px 16px;
    margin-top: 16px;
    margin-bottom: 12px;
    background: var(--erpds-surface, #FFFFFF);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-left: 4px solid #7E57C2;
    border-radius: var(--erpds-radius, 12px);
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
    line-height: 1.25;
}
.label_h2.erpds-inventory-title .erpds-inventory-icon {
    color: #7E57C2;
    font-size: 22px;
    opacity: 0.85;
    flex-shrink: 0;
}
.label_h2.erpds-inventory-title .erpds-inventory-title-body {
    flex: 1;
    min-width: 0;
}
.label_h2.erpds-inventory-title .erpds-inventory-title-caption {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--erpds-text, #0F172A);
}
.label_h2.erpds-inventory-title .erpds-inventory-title-sub {
    margin-top: 4px;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--erpds-text-muted, #525A66);
    letter-spacing: 0;
    text-transform: none;
}
.label_h2.erpds-inventory-title .erpds-inventory-sn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 8px;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--erpds-bg-2, #F2F4F7);
    color: var(--erpds-text, #0F172A);
    font-family: var(--erpds-mono, ui-monospace, monospace);
    font-size: 11.5px;
}
.label_h2.erpds-inventory-title .erpds-inventory-sn .fa {
    opacity: 0.55;
    font-size: 10px;
}

/* ============================================================
   ERPDS — Dialog / Modal redesign (#dialog-box, #dialogConfirmbox)
   Аддитивно поверх legacy. Старые классы (.dialog_header,
   .deleteDialog) сохранены — переопределяем визуал, не структуру.
   ============================================================ */
#dialog-box,
#dialogConfirmbox {
    background: var(--erpds-surface, #FFFFFF);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: var(--erpds-radius-lg, 14px);
    box-shadow: var(--erpds-shadow-lg, 0 12px 40px -12px rgba(15,23,42,0.16)), 0 4px 12px rgba(15,23,42,0.08);
    -webkit-box-shadow: var(--erpds-shadow-lg, 0 12px 40px -12px rgba(15,23,42,0.16)), 0 4px 12px rgba(15,23,42,0.08);
    overflow: hidden;
    display: none;
}
#dialog-box .dialog-content,
#dialogConfirmbox .dialog-content {
    margin: 0;
    padding: 14px 16px;
}
#dialog-box .dialog_header {
    background: var(--erpds-surface, #FFFFFF);
    color: var(--erpds-text, #0F172A);
    width: auto;
    margin: 0;
    padding: 10px 14px;
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
    border-left: 4px solid var(--erpds-accent, #3B5BDB);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.01em;
    cursor: move;
}
#dialog-box .deleteDialog {
    background: var(--erpds-bad-soft, #F5DDD9);
    color: var(--erpds-bad-text, #821B18);
    width: auto;
    margin: 0;
    padding: 10px 14px;
    border-bottom: 1px solid var(--erpds-bad, #B62A26);
    border-left: 4px solid var(--erpds-bad, #B62A26);
    font-size: 15px;
    font-weight: 700;
    cursor: move;
}
#dialog-box ul,
#dialogConfirmbox ul {
    padding: 8px 20px 12px 36px;
    margin: 0;
    list-style: disc outside;
}
#dialog-box li,
#dialogConfirmbox li {
    padding: 4px 0;
    color: var(--erpds-text, #0F172A);
}

/* Confirm box — accent border, smaller padding */
#dialogConfirmbox {
    border-top: 4px solid var(--erpds-accent, #3B5BDB);
}
#dialogConfirmbox:has(.erpds-confirm--delete) {
    border-top-color: var(--erpds-danger, #c0392b);
}
#dialogConfirmbox .dialogConfirmContent {
    margin: 0;
}
#dialogConfirmbox .dialog-content {
    padding: 14px 16px;
    font-size: 14px;
    color: var(--erpds-text, #0F172A);
    line-height: 1.5;
}
#dialogConfirmbox .erpds-confirm {
    width: min(420px, calc(100vw - 32px));
    min-height: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    padding: 24px 26px 22px;
    color: var(--erpds-text, #0F172A);
}
#dialogConfirmbox .erpds-confirm__head {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 16px;
    align-items: center;
}
#dialogConfirmbox .erpds-confirm__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 999px;
    background: var(--erpds-accent-soft, #E5EAFB);
    color: var(--erpds-accent, #3B5BDB);
    font-size: 20px;
    line-height: 1;
}
#dialogConfirmbox .erpds-confirm--delete .erpds-confirm__icon {
    background: color-mix(in srgb, var(--erpds-danger, #c0392b) 12%, #fff);
    color: var(--erpds-danger, #c0392b);
}
#dialogConfirmbox .erpds-confirm__title.dialog_header,
#dialogConfirmbox .erpds-confirm__title.deleteDialog {
    min-height: 0;
    width: auto;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--erpds-text, #0F172A);
    font-size: 20px;
    font-weight: 700;
    line-height: 1.25;
    cursor: default;
}
#dialogConfirmbox .erpds-confirm__body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
}
#dialogConfirmbox .erpds-confirm__message {
    margin: 20px 0 0;
    padding-left: 60px;
    color: var(--erpds-text-muted, #525A66);
    font-size: 15px;
    line-height: 1.55;
}
#dialogConfirmbox .erpds-confirm__message b {
    font-weight: 600;
}
#dialogConfirmbox .erpds-confirm__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: flex-end;
    margin-top: 24px;
    padding-top: 0;
}
#dialogConfirmbox .erpds-confirm__actions .div_center {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    text-align: left;
}
#dialogConfirmbox .erpds-confirm__actions [id^="submit_or_id"] {
    display: none;
}
#dialogConfirmbox .erpds-confirm__actions .link_dashed {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 120px;
    min-height: 44px;
    box-sizing: border-box;
    margin: 0 !important;
    padding: 0 18px !important;
    border: 1px solid var(--erpds-border-strong, #C4CAD4) !important;
    border-radius: var(--erpds-radius-sm, 8px);
    background: var(--erpds-surface, #FFFFFF) !important;
    color: var(--erpds-text-muted, #525A66);
    text-decoration: none;
    font-weight: 600;
}
#dialogConfirmbox .erpds-confirm__actions .link_dashed:hover {
    background: var(--erpds-bg-2, #F2F4F7) !important;
    color: var(--erpds-text, #0F172A);
}
#dialogConfirmbox .erpds-confirm--delete #submit_but_idsubmitConfirmButtonId {
    min-width: 118px;
    min-height: 42px;
    border-color: var(--erpds-danger, #c0392b);
    background: var(--erpds-danger, #c0392b);
}
#dialogConfirmbox .erpds-confirm--delete #submit_but_idsubmitConfirmButtonId:hover {
    border-color: var(--erpds-bad-bg-strong, #B62A26);
    background: var(--erpds-bad-bg-strong, #B62A26);
}
#dialogConfirmbox .erpds-confirm__loading {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    color: var(--erpds-text-muted, #525A66);
    font-size: 18px;
}

/* Inputs внутри dialog приобретают v2 look */
#dialog-box input[type="text"],
#dialog-box input[type="number"],
#dialog-box input[type="email"],
#dialog-box input[type="password"],
#dialog-box select,
#dialog-box textarea {
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: var(--erpds-radius-sm, 8px);
    padding: 7px 10px;
    background: var(--erpds-surface, #FFFFFF);
    color: var(--erpds-text, #0F172A);
    font-family: inherit;
    font-size: 13.5px;
    transition: border-color 0.12s ease, box-shadow 0.12s ease;
}
#dialog-box input[type="text"]:focus,
#dialog-box input[type="number"]:focus,
#dialog-box input[type="email"]:focus,
#dialog-box input[type="password"]:focus,
#dialog-box select:focus,
#dialog-box textarea:focus {
    border-color: var(--erpds-accent, #3B5BDB);
    box-shadow: 0 0 0 3px var(--erpds-accent-soft, #E5EAFB);
    outline: none;
}

/* --- Custom chevron for selects inside dialogs (replaces double-arrow on Safari) --- */
#dialog-box select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-right: 32px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23525A66' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 12px 12px;
}
#dialog-box select::-ms-expand {
    display: none;
}

#dialog-box .erpds-employee-dialog {
    width: min(620px, calc(100vw - 40px));
    box-sizing: border-box;
}

#dialog-box .erpds-employee-dialog-card.table_block.erpds-card {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    width: 100% !important;
    margin: 0 !important;
    padding: 14px !important;
    border: 1px solid var(--erpds-border, #DDE1E8) !important;
    border-radius: var(--erpds-radius-sm, 8px) !important;
    box-shadow: none !important;
    background: var(--erpds-surface-2, #F6F7F9) !important;
    box-sizing: border-box;
}

#dialog-box .erpds-employee-dialog-field:not([style*="display:none"]):not([style*="display: none"]) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
    min-height: 0;
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: none !important;
}

#dialog-box .erpds-employee-dialog-field--full {
    grid-column: 1 / -1;
}

#dialog-box .erpds-employee-dialog-field--compact {
    max-width: 290px;
}

#dialog-box .erpds-employee-dialog-field > .left_data {
    padding: 0 !important;
    background: transparent !important;
    text-align: left;
    white-space: normal;
    overflow-wrap: normal;
    color: var(--erpds-text-muted, #525A66);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1.25;
    text-transform: uppercase;
    width: auto !important;
    min-width: 0 !important;
}

#dialog-box .erpds-employee-dialog-field > div:not(.left_data) {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    width: 100%;
    padding: 0 !important;
    background: transparent !important;
    overflow-wrap: normal;
}

#dialog-box .erpds-employee-dialog-card select,
#dialog-box .erpds-employee-dialog-card textarea,
#dialog-box .erpds-employee-dialog-card input[type="text"] {
    width: 100% !important;
    inline-size: 100% !important;
    max-width: none !important;
    box-sizing: border-box;
}

#dialog-box .erpds-employee-dialog-card select,
#dialog-box .erpds-employee-dialog-card input[type="text"] {
    min-height: 38px;
}

#dialog-box .erpds-employee-dialog-card textarea {
    min-height: 110px;
    resize: vertical;
}

#dialog-box .erpds-employee-dialog-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin: 14px 0 0;
}

#dialog-box .erpds-employee-dialog-actions .div_center {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    margin: 0;
    text-align: right;
}

#dialog-box .erpds-employee-dialog-actions .div_center [id^="submit_or_id"] {
    color: var(--erpds-text-faint, #6B7280);
    font-size: 12px;
}

#dialog-box .erpds-employee-dialog-delete {
    margin-top: 10px;
}

#dialog-box .erpds-employee-dialog-delete #linkDeleteId {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 32px;
    color: var(--erpds-bad, #B62A26);
    font-weight: 600;
}

#dialog-box .erpds-employee-dialog-delete #linkDeleteId .us-icon {
    margin-right: 0;
}

#dialog-box .erpds-employee-unavailable-dialog {
    width: min(620px, calc(100vw - 40px));
    box-sizing: border-box;
}

#dialog-box .erpds-employee-unavailable-dialog-card.table_block.erpds-card {
    display: flex !important;
    flex-direction: column;
    gap: 12px;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    box-sizing: border-box;
}

#dialog-box .erpds-employee-unavailable-section {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: var(--erpds-radius-sm, 8px);
    background: var(--erpds-surface-2, #F6F7F9);
    box-sizing: border-box;
}

#dialog-box .erpds-employee-unavailable-section--absence {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

#dialog-box .erpds-employee-unavailable-field:not([style*="display:none"]):not([style*="display: none"]) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
    min-height: 0;
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: none !important;
}

#dialog-box .erpds-employee-unavailable-field--type {
    grid-column: 1 / -1;
    max-width: 290px;
}

#dialog-box .erpds-employee-unavailable-field > .left_data {
    padding: 0 !important;
    background: transparent !important;
    text-align: left;
    white-space: normal;
    overflow-wrap: normal;
    color: var(--erpds-text-muted, #525A66);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1.25;
    text-transform: uppercase;
    width: auto !important;
    min-width: 0 !important;
}

#dialog-box .erpds-employee-unavailable-field > div:not(.left_data) {
    display: block;
    align-items: center;
    min-width: 0;
    width: 100%;
    padding: 0 !important;
    background: transparent !important;
    overflow-wrap: normal;
}

#dialog-box .erpds-employee-unavailable-dialog-card select,
#dialog-box .erpds-employee-unavailable-dialog-card input[type="text"] {
    width: 100% !important;
    inline-size: 100% !important;
    max-width: none !important;
    box-sizing: border-box;
    min-height: 38px;
}

#dialog-box .erpds-employee-unavailable-dialog-card select {
    max-width: none !important;
}

#dialog-box .erpds-employee-unavailable-dialog-card input[type="text"].date-field {
    max-width: none !important;
}

#dialog-box .erpds-employee-unavailable-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin: 14px 0 0;
}

#dialog-box .erpds-employee-unavailable-actions .div_center {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    margin: 0;
    text-align: right;
}

#dialog-box .erpds-employee-unavailable-actions .div_center [id^="submit_or_id"] {
    color: var(--erpds-text-faint, #6B7280);
    font-size: 12px;
}

#dialog-box .erpds-employee-unavailable-delete {
    margin-top: 10px;
}

#dialog-box .erpds-employee-unavailable-delete #linkDeleteId {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 32px;
    color: var(--erpds-bad, #B62A26);
    font-weight: 600;
}

#dialog-box .erpds-employee-unavailable-delete #linkDeleteId .us-icon {
    margin-right: 0;
}

#dialog-box .erpds-address-dialog {
    width: min(720px, calc(100vw - 48px));
    box-sizing: border-box;
}

#dialog-box:has(.erpds-address-dialog) {
    height: auto !important;
    max-height: calc(100vh - 40px) !important;
    overflow-x: hidden !important;
    overflow-y: hidden !important;
}

#dialog-box:has(.erpds-address-dialog) .dialog-content {
    padding: 12px 18px 18px;
    max-height: calc(100vh - 40px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    box-sizing: border-box;
}

#dialog-box:has(.erpds-address-dialog) .label_h2 {
    display: block;
    margin: 6px 0 2px;
    color: var(--erpds-text, #0F172A);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.25;
}

#dialog-box:has(.erpds-address-dialog) #linkBuildingCardId {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--erpds-accent, #3B5BDB);
    font-size: 14px;
    font-weight: 600;
}

#dialog-box:has(.erpds-address-dialog) #linkBuildingCardId .us-icon {
    margin: 0;
}

#dialog-box .erpds-address-dialog-card.table_block.erpds-card {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    width: 100% !important;
    margin: 8px 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    box-sizing: border-box;
}

#dialog-box .erpds-address-dialog-card .item:not([style*="display:none"]):not([style*="display: none"]) {
    display: grid !important;
    grid-template-columns: minmax(145px, 185px) minmax(0, 1fr);
    align-items: start;
    gap: 14px;
    min-height: 0;
    margin: 0 !important;
    padding: 6px 0 !important;
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
}

#dialog-box .erpds-address-dialog-card .item > .left_data {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 3px 0 0 !important;
    background: transparent !important;
    color: var(--erpds-text-muted, #525A66);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    line-height: 1.35;
    text-align: left;
    text-transform: uppercase;
    white-space: normal;
    overflow-wrap: anywhere;
}

#dialog-box .erpds-address-dialog-card .item > div:not(.left_data) {
    min-width: 0;
    width: 100%;
    padding: 0 !important;
    background: transparent !important;
    color: var(--erpds-text, #0F172A);
    box-sizing: border-box;
}

#dialog-box .erpds-address-dialog-card input[type="text"],
#dialog-box .erpds-address-dialog-card select,
#dialog-box .erpds-address-dialog-card textarea {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

#dialog-box .erpds-address-dialog-card select,
#dialog-box .erpds-address-dialog-card input[type="text"] {
    min-height: 34px;
}

#dialog-box .erpds-address-dialog-card #localityTypeId {
    max-width: 260px;
}

#dialog-box .erpds-address-dialog-card #nameId {
    max-width: 380px;
}

#dialog-box .erpds-address-dialog-card #unitCoordId,
#dialog-box .erpds-address-dialog-card [id^="unitCoord_"] {
    max-width: 520px;
}

#dialog-box .erpds-address-dialog-card #colorOnMapId {
    width: 88px;
    min-height: 32px;
}

#dialog-box .erpds-address-dialog-card .erpds-pt-8 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    min-width: 0;
    padding-top: 0 !important;
    margin: 0 0 8px;
}

#dialog-box .erpds-address-dialog-card .erpds-pt-8:last-child {
    margin-bottom: 0;
}

#dialog-box .erpds-address-dialog-card .erpds-pt-8 select {
    width: min(360px, 100%);
    flex: 0 1 360px;
}

#dialog-box .erpds-address-dialog-card .erpds-pt-8 [id*="-add"],
#dialog-box .erpds-address-dialog-card .erpds-pt-8 [id^="addressUnitSelector"] {
    min-width: 0;
}

#dialog-box .erpds-address-dialog-card .item:has([id^="addressUnitSelectorId"]) > div:not(.left_data) {
    display: grid;
    grid-template-columns: minmax(0, 340px) 30px;
    gap: 6px 8px;
    max-width: 378px;
}

#dialog-box .erpds-address-dialog-card .item:has([id^="addressUnitSelectorId"]) .erpds-pt-8 {
    display: contents;
    margin: 0;
}

#dialog-box .erpds-address-dialog-card .item:has([id^="addressUnitSelectorId"]) span[id^="addressUnitSelector"]:not([id*="-add"]) {
    display: contents;
}

#dialog-box .erpds-address-dialog-card .item:has([id^="addressUnitSelectorId"]) .erpds-pt-8 select {
    grid-column: 1;
    width: 100%;
    min-width: 0;
    flex: none;
}

#dialog-box .erpds-address-dialog-card .item:has([id^="addressUnitSelectorId"]) .erpds-pt-8 [id*="-add"] {
    grid-column: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    min-width: 30px;
    height: 30px;
}

#dialog-box .erpds-address-dialog-card .item:has([id^="addressUnitSelectorId"]) .erpds-pt-8 [id*="-add"]:empty {
    display: none;
}

#dialog-box .erpds-address-dialog-card .item:has([id^="addressUnitSelectorId"]) .erpds-pt-8 [id*="-add"] .us-icon,
#dialog-box .erpds-address-dialog-card .item:has([id^="addressUnitSelectorId"]) .erpds-pt-8 [id*="-add"] a {
    margin: 0;
    line-height: 1;
}

#dialog-box .erpds-address-dialog-card #anotherAddressLinkId {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

#dialog-box .erpds-address-dialog-card #anotherAddressLinkId > div:not(.left_data) {
    display: flex;
    align-items: center;
    min-height: 28px;
}

#dialog-box .erpds-address-dialog-card .item:has(#unitCoordId) > div:not(.left_data) > div:first-child {
    max-width: 520px;
}

#dialog-box .erpds-address-dialog-card #buildingTypeDivId select {
    max-width: 360px;
}

#dialog-box .erpds-address-dialog-card .item:has(input[name="is_show_obj_on_map"]),
#dialog-box .erpds-address-dialog-card .item:has(#colorOnMapId),
#dialog-box .erpds-address-dialog-card .item:has(input[name="is_show_lbl_on_map"]),
#dialog-box .erpds-address-dialog-card .item:has(input[name="is_menu_link"]),
#dialog-box .erpds-address-dialog-card .item:has(input[name="is_hide"]) {
    grid-template-columns: minmax(145px, 185px) minmax(0, auto);
    align-items: center;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}

#dialog-box .erpds-address-dialog-card .item:has(input[name="is_show_obj_on_map"]) > div:not(.left_data),
#dialog-box .erpds-address-dialog-card .item:has(#colorOnMapId) > div:not(.left_data),
#dialog-box .erpds-address-dialog-card .item:has(input[name="is_show_lbl_on_map"]) > div:not(.left_data),
#dialog-box .erpds-address-dialog-card .item:has(input[name="is_menu_link"]) > div:not(.left_data),
#dialog-box .erpds-address-dialog-card .item:has(input[name="is_hide"]) > div:not(.left_data) {
    display: flex;
    align-items: center;
    min-height: 30px;
}

#dialog-box .erpds-address-dialog-card .div_space2 {
    margin-top: 6px;
    color: var(--erpds-text-faint, #6B7280);
    font-size: 13px;
}

#dialog-box .erpds-address-dialog-card .info_block {
    margin-top: 4px;
    color: var(--erpds-text-faint, #6B7280);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.35;
    text-transform: none;
}

#dialog-box .erpds-address-dialog-card input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin: 4px 0 0;
}

#dialog-box .erpds-address-dialog-actions {
    display: flex;
    justify-content: flex-end;
    margin: 14px 0 0;
    padding: 12px 0 0;
    border-top: 1px solid var(--erpds-border, #DDE1E8);
    background: transparent;
}

#dialog-box .erpds-address-dialog-actions .div_center {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin: 0;
    text-align: right;
}

#dialog-box .erpds-address-dialog-actions .div_center [id^="submit_or_id"] {
    color: var(--erpds-text-faint, #6B7280);
    font-size: 12px;
}

#dialog-box:has(.erpds-address-dialog) #linkDeleteId {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    color: var(--erpds-bad, #B62A26);
    font-weight: 600;
}

#dialog-box:has(.erpds-address-dialog) #dialog_message > .div_space:last-child {
    margin: 12px 0 0;
    padding-bottom: 2px;
    color: var(--erpds-text-muted, #525A66);
    font-size: 13px;
}

#dialog-box .erpds-address-dialog > .div_space {
    margin: 8px 0 0;
    padding-bottom: 6px;
    color: var(--erpds-text-muted, #525A66);
    font-size: 13px;
}

@media (max-width: 520px) {
    #dialog-box .erpds-employee-dialog {
        width: 100%;
    }

    #dialog-box .erpds-employee-dialog-card.table_block.erpds-card {
        grid-template-columns: minmax(0, 1fr);
        padding: 12px !important;
    }

    #dialog-box .erpds-employee-dialog-field--compact {
        max-width: none;
    }

    #dialog-box .erpds-employee-dialog-actions,
    #dialog-box .erpds-employee-dialog-actions .div_center {
        width: 100%;
    }

    #dialog-box .erpds-employee-dialog-actions .div_center {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto auto;
        justify-content: stretch;
    }

    #dialog-box .erpds-employee-dialog-actions .div_center .button {
        grid-column: 1 / -1;
        width: 100%;
    }

    #dialog-box .erpds-employee-dialog-actions .div_center [id^="submit_or_id"] {
        grid-column: 2;
    }

    #dialog-box .erpds-employee-dialog-actions .div_center .link_dashed {
        grid-column: 3;
        width: auto;
    }

    #dialog-box .erpds-employee-dialog-delete {
        margin-top: 0;
    }

    #dialog-box .erpds-employee-dialog-delete #linkDeleteId {
        min-height: 28px;
    }

    #dialog-box .erpds-employee-unavailable-dialog {
        width: 100%;
    }

    #dialog-box .erpds-employee-unavailable-section,
    #dialog-box .erpds-employee-unavailable-section--absence {
        grid-template-columns: minmax(0, 1fr);
    }

    #dialog-box .erpds-employee-unavailable-section {
        padding: 12px;
    }

    #dialog-box .erpds-employee-unavailable-field--type {
        max-width: none;
    }

    #dialog-box .erpds-employee-unavailable-actions,
    #dialog-box .erpds-employee-unavailable-actions .div_center {
        width: 100%;
    }

    #dialog-box .erpds-employee-unavailable-actions .div_center {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto auto;
        justify-content: stretch;
    }

    #dialog-box .erpds-employee-unavailable-actions .div_center .button {
        grid-column: 1 / -1;
        width: 100%;
    }

    #dialog-box .erpds-employee-unavailable-actions .div_center [id^="submit_or_id"] {
        grid-column: 2;
    }

    #dialog-box .erpds-employee-unavailable-actions .div_center .link_dashed {
        grid-column: 3;
        width: auto;
    }

    #dialog-box .erpds-employee-unavailable-delete {
        margin-top: 0;
    }

    #dialog-box .erpds-employee-unavailable-delete #linkDeleteId {
        min-height: 28px;
    }

    #dialog-box .erpds-address-dialog {
        width: 100%;
    }

    #dialog-box:has(.erpds-address-dialog) .dialog-content {
        padding: 0 12px 14px !important;
        max-height: calc(100vh - 128px) !important;
    }

    #dialog-box:has(.erpds-address-dialog) {
        max-height: calc(100vh - 128px) !important;
    }

    #dialog-box .erpds-address-dialog-card .item:not([style*="display:none"]):not([style*="display: none"]) {
        grid-template-columns: minmax(0, 1fr);
        gap: 6px;
        padding: 9px 0 !important;
    }

    #dialog-box .erpds-address-dialog-card .item:has(input[name="is_show_obj_on_map"]),
    #dialog-box .erpds-address-dialog-card .item:has(#colorOnMapId),
    #dialog-box .erpds-address-dialog-card .item:has(input[name="is_show_lbl_on_map"]),
    #dialog-box .erpds-address-dialog-card .item:has(input[name="is_menu_link"]),
    #dialog-box .erpds-address-dialog-card .item:has(input[name="is_hide"]) {
        grid-template-columns: minmax(0, 1fr);
    }

    #dialog-box .erpds-address-dialog-card .item > .left_data {
        padding-top: 0 !important;
    }

    #dialog-box .erpds-address-dialog-card #localityTypeId,
    #dialog-box .erpds-address-dialog-card #nameId,
    #dialog-box .erpds-address-dialog-card #unitCoordId,
    #dialog-box .erpds-address-dialog-card [id^="unitCoord_"] {
        max-width: none;
    }

    #dialog-box .erpds-address-dialog-card .erpds-pt-8 {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
    }

    #dialog-box .erpds-address-dialog-card .item:has([id^="addressUnitSelectorId"]) > div:not(.left_data) {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 30px;
        max-width: none;
    }

    #dialog-box .erpds-address-dialog-card .item:has([id^="addressUnitSelectorId"]) .erpds-pt-8 {
        display: contents;
        gap: 7px;
    }

    #dialog-box .erpds-address-dialog-card .item:has([id^="addressUnitSelectorId"]) span[id^="addressUnitSelector"]:not([id*="-add"]) {
        display: contents;
    }

    #dialog-box .erpds-address-dialog-card .erpds-pt-8 select {
        width: 100%;
        flex-basis: auto;
    }

    #dialog-box .erpds-address-dialog-card .item:has(#colorOnMapId) > div:not(.left_data) {
        display: flex !important;
        align-items: center;
        justify-content: flex-start;
        gap: 8px;
    }

    #dialog-box .erpds-address-dialog-card #colorOnMapId {
        flex: 0 0 88px;
        width: 88px !important;
        max-width: 88px !important;
    }

    #dialog-box .erpds-address-dialog-actions,
    #dialog-box .erpds-address-dialog-actions .div_center {
        width: 100%;
    }

    #dialog-box .erpds-address-dialog-actions {
        margin-top: 14px;
        padding-top: 12px;
    }

    #dialog-box .erpds-address-dialog-actions .div_center {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto auto;
        justify-content: stretch;
    }

    #dialog-box .erpds-address-dialog-actions .div_center .button {
        grid-column: 1 / -1;
        width: 100%;
    }
}

#dialog-box .erpds-route-object-dialog .item:not([style*="display:none"]):not([style*="display: none"]) {
    grid-template-columns: minmax(150px, 210px) minmax(0, 1fr);
}

#dialog-box .erpds-route-object-dialog .left_data {
    text-align: left;
}

#dialog-box .erpds-route-object-dialog .nodeFindSelectorDiv,
#dialog-box .erpds-route-object-dialog .nodeFindSelectorDiv .div_space,
#dialog-box .erpds-route-object-dialog [id^="nodeListDiv"] {
    max-width: 100%;
}

#dialog-box .erpds-route-object-dialog .div_space2 {
    margin-top: 8px;
}

#dialog-box .erpds-transit-duct-dialog .item:not([style*="display:none"]):not([style*="display: none"]) {
    grid-template-columns: minmax(110px, 170px) minmax(0, 1fr);
    align-items: start;
}

#dialog-box .erpds-transit-duct-dialog .left_data {
    text-align: left;
}

#dialog-box .erpds-transit-duct-dialog .field,
#dialog-box .erpds-transit-duct-dialog select,
#dialog-box .erpds-transit-duct-dialog #duct-list-id {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

#dialog-box .erpds-transit-duct-dialog #duct-list-id {
    margin-top: 8px;
}

#dialog-box .erpds-transit-duct-actions {
    margin-top: 10px;
}

@media (max-width: 560px) {
    #dialog-box .erpds-route-object-dialog .item:not([style*="display:none"]):not([style*="display: none"]) {
        grid-template-columns: minmax(0, 1fr);
    }

    #dialog-box .erpds-transit-duct-dialog .item:not([style*="display:none"]):not([style*="display: none"]) {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* --- Dialog form buttons (.button) — v2 polish --- */
#dialog-box .button,
#dialog-box input[type="submit"].button,
#dialogConfirmbox .button {
    background: var(--erpds-accent, #3B5BDB);
    border: 1px solid var(--erpds-accent, #3B5BDB);
    color: #FFFFFF;
    padding: 8px 16px;
    border-radius: var(--erpds-radius-sm, 8px);
    font-family: inherit;
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: -0.005em;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(15,23,42,0.08), inset 0 1px 0 rgba(255,255,255,0.10);
    transition: background 0.12s ease, transform 0.06s ease;
}
#dialog-box .button:hover,
#dialog-box input[type="submit"].button:hover,
#dialogConfirmbox .button:hover {
    background: var(--erpds-accent-hover, #2D4AC7);
    border-color: var(--erpds-accent-hover, #2D4AC7);
}
#dialog-box .button:active,
#dialogConfirmbox .button:active {
    transform: translateY(1px);
}
#dialog-box .link_dashed,
#dialogConfirmbox .link_dashed {
    color: var(--erpds-text-muted, #525A66);
    border: none;
    text-decoration: underline dashed;
    text-underline-offset: 3px;
    margin-left: 6px;
}
#dialog-box .link_dashed:hover,
#dialogConfirmbox .link_dashed:hover {
    color: var(--erpds-text, #0F172A);
}

/* Confirm actions must stay after generic dialog button rules. */
#dialogConfirmbox .erpds-confirm__actions .button,
#dialogConfirmbox .erpds-confirm__actions .link_dashed {
    min-width: 118px;
    height: 42px;
    min-height: 42px;
    box-sizing: border-box;
    margin: 0 !important;
    padding: 0 18px !important;
    border-radius: var(--erpds-radius-sm, 8px);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0;
    text-decoration: none;
}
#dialogConfirmbox .erpds-confirm__actions .link_dashed {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--erpds-border-strong, #C4CAD4) !important;
    background: var(--erpds-surface, #FFFFFF) !important;
    color: var(--erpds-text-muted, #525A66);
}
#dialogConfirmbox .erpds-confirm__actions .link_dashed:hover {
    background: var(--erpds-bg-2, #F2F4F7) !important;
    color: var(--erpds-text, #0F172A);
}
#dialogConfirmbox .erpds-confirm--delete #submit_but_idsubmitConfirmButtonId {
    border-color: var(--erpds-danger, #c0392b);
    background: var(--erpds-danger, #c0392b);
}
#dialogConfirmbox .erpds-confirm--delete #submit_but_idsubmitConfirmButtonId:hover {
    border-color: var(--erpds-bad-bg-strong, #B62A26);
    background: var(--erpds-bad-bg-strong, #B62A26);
}

@media (max-width: 520px) {
    #dialogConfirmbox .erpds-confirm {
        min-height: 280px;
        padding: 26px 22px 22px;
    }

    #dialogConfirmbox .erpds-confirm__head {
        grid-template-columns: 48px minmax(0, 1fr);
        gap: 14px;
    }

    #dialogConfirmbox .erpds-confirm__icon {
        width: 48px;
        height: 48px;
        font-size: 20px;
    }

    #dialogConfirmbox .erpds-confirm__title.dialog_header,
    #dialogConfirmbox .erpds-confirm__title.deleteDialog {
        font-size: 18px;
    }

    #dialogConfirmbox .erpds-confirm__message {
        padding-left: 62px;
    }

    #dialogConfirmbox .erpds-confirm__actions {
        flex-direction: column-reverse;
    }

    #dialogConfirmbox .erpds-confirm__actions .button,
    #dialogConfirmbox .erpds-confirm__actions .link_dashed {
        width: 100%;
    }
}

/* Commutation scheme wizard: keep two cable sides readable in narrow dialogs. */
#dialog-box .erpds-commutation-wizard {
    display: grid;
    gap: 10px;
    min-width: min(640px, calc(100vw - 64px));
}
#dialog-box .erpds-commutation-wizard > .item {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
    padding: 0 0 10px;
}
#dialog-box .erpds-commutation-wizard > .item:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}
#dialog-box .erpds-commutation-wizard > .item > div {
    display: block;
    width: auto;
    min-width: 0;
    padding: 0;
    border-bottom: 0;
}
#dialog-box .erpds-commutation-wizard select {
    max-width: 100%;
}
#dialog-box .erpds-commutation-wizard__ports {
    max-height: min(360px, 48vh);
    overflow: auto;
    padding-bottom: 2px;
}
#dialog-box .erpds-commutation-wizard__port-list {
    display: grid !important;
    gap: 0;
    min-width: 0;
    padding: 0 !important;
}
#dialog-box .erpds-commutation-wizard__port-row {
    display: grid !important;
    grid-template-columns: 28px 26px minmax(92px, 1fr) minmax(0, auto);
    align-items: center;
    gap: 6px;
    min-width: 0;
    padding: 7px 0;
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
}
#dialog-box .erpds-commutation-wizard__port-row:last-child {
    border-bottom: 0;
}
#dialog-box .erpds-commutation-wizard__port-row > div {
    min-width: 0;
    padding: 0;
    border-bottom: 0;
}
#dialog-box .erpds-commutation-wizard__port-number,
#dialog-box .erpds-commutation-wizard__port-check {
    text-align: center;
}
#dialog-box .erpds-commutation-wizard__port-check input[type="checkbox"] {
    margin: 0;
}
#dialog-box .erpds-commutation-wizard__port-name {
    overflow-wrap: anywhere;
    line-height: 1.35;
}
#dialog-box .erpds-commutation-wizard__port-name > div {
    max-width: 100%;
}
#dialog-box .erpds-commutation-wizard__port-name .div_cable_line_wire_color {
    float: none;
    flex: 0 0 12px;
    margin: 0;
}
#dialog-box .erpds-commutation-wizard__port-state {
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.25;
}

@media (max-width: 560px) {
    #dialog-box .erpds-commutation-wizard {
        min-width: 0;
    }
    #dialog-box .erpds-commutation-wizard > .item {
        grid-template-columns: minmax(0, 1fr);
    }
    #dialog-box .erpds-commutation-wizard > .item > div:nth-child(2) {
        text-align: center;
        color: var(--erpds-text-muted, #525A66);
    }
    #dialog-box .erpds-commutation-wizard__port-row {
        grid-template-columns: 24px 24px minmax(0, 1fr);
    }
    #dialog-box .erpds-commutation-wizard__port-state {
        grid-column: 3;
    }
}

/* --- Universal tabs polish (legacy .tabs / .tab_active patterns) --- */
.erpds-tabs,
.tab_panel {
    display: flex;
    gap: 2px;
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
    padding: 0 4px;
    margin-bottom: 12px;
}
.erpds-tabs > a,
.erpds-tabs > button,
.tab_panel > a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 14px;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    color: var(--erpds-text-muted, #525A66);
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    margin-bottom: -1px;
    transition: color 0.12s ease, border-color 0.12s ease;
}
.erpds-tabs > a:hover,
.tab_panel > a:hover {
    color: var(--erpds-text, #0F172A);
}
.erpds-tabs > a.active,
.erpds-tabs > .active,
.tab_panel > a.active,
.tab_panel > .active {
    color: var(--erpds-accent-text, #2D4AC7);
    border-bottom-color: var(--erpds-accent, #3B5BDB);
}

/* --- Status pill (replaces big bold centered text) --- */
.j_card_cur_state.erpds-task-state {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 14px;
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 600;
    text-align: left;
    background: var(--erpds-bg-2, #F2F4F7);
    color: var(--erpds-text-muted, #525A66);
    border: 1px solid transparent;
    line-height: 1.4;
    white-space: nowrap;
}
.j_card_cur_state.erpds-task-state .erpds-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
    flex-shrink: 0;
}
.j_card_cur_state.erpds-task-state[data-system-role="run"] {
    background: var(--erpds-warn-soft, #FBEDD9);
    color: var(--erpds-warn-text, #8A4A0A);
}
.j_card_cur_state.erpds-task-state[data-system-role="run"] .erpds-dot { background: var(--erpds-warn, #E07A1F); }

.j_card_cur_state.erpds-task-state[data-system-role="successful"] {
    background: var(--erpds-ok-soft, #E5F1E6);
    color: var(--erpds-ok-text, #1F5E2D);
}
.j_card_cur_state.erpds-task-state[data-system-role="successful"] .erpds-dot { background: var(--erpds-ok, #2E8540); }

.j_card_cur_state.erpds-task-state[data-system-role="failed"] {
    background: var(--erpds-bad-soft, #F5DDD9);
    color: var(--erpds-bad-text, #821B18);
}
.j_card_cur_state.erpds-task-state[data-system-role="failed"] .erpds-dot { background: var(--erpds-bad, #B62A26); }

.j_card_cur_state.erpds-task-state[data-system-role="holded"],
.j_card_cur_state.erpds-task-state[data-system-role="unfinished"] {
    background: var(--erpds-hold-soft, #FAF1DC);
    color: var(--erpds-hold-text, #7A540B);
}
.j_card_cur_state.erpds-task-state[data-system-role="holded"] .erpds-dot,
.j_card_cur_state.erpds-task-state[data-system-role="unfinished"] .erpds-dot { background: var(--erpds-hold, #C98A1A); }

.j_card_cur_state.erpds-task-state[data-system-role="cancelled"] {
    background: var(--erpds-bg-2, #F2F4F7);
    color: var(--erpds-text-faint, #6B7280);
    border-color: var(--erpds-border, #DDE1E8);
}
.j_card_cur_state.erpds-task-state[data-system-role="cancelled"] .erpds-dot { background: var(--erpds-text-faint, #6B7280); }

/* --- Task Timeline (history list) --- */
.table_block.erpds-task-timeline {
    position: relative;
    padding: 8px 0 8px 28px;
}
.table_block.erpds-task-timeline::before {
    content: "";
    position: absolute;
    left: 12px;
    top: 14px;
    bottom: 14px;
    width: 2px;
    background: var(--erpds-border, #DDE1E8);
    border-radius: 2px;
}
.table_block.erpds-task-timeline > .item {
    position: relative;
    padding: 8px 12px 8px 14px;
    margin-bottom: 6px;
    background: var(--erpds-surface, #FFFFFF);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: var(--erpds-radius-sm, 8px);
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
}
.table_block.erpds-task-timeline > .item::before {
    content: "";
    position: absolute;
    left: -22px;
    top: 14px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--erpds-surface, #FFFFFF);
    border: 2px solid var(--erpds-border-strong, #C4CAD4);
    box-sizing: border-box;
}
.table_block.erpds-task-timeline > .item:first-child::before {
    background: var(--erpds-accent, #3B5BDB);
    border-color: var(--erpds-accent, #3B5BDB);
    box-shadow: 0 0 0 4px var(--erpds-accent-soft, #E5EAFB);
}
.table_block.erpds-task-timeline > .item .left_data {
    font-size: 11px;
    font-weight: 600;
    color: var(--erpds-text-muted, #525A66);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 2px;
}

/* ============================================================
   ERPDS — Customer 360 (Customer card v2 polish)
   Скоупится только в пределах .erpds-customer-page —
   не задевает другие страницы, ничего не скрывает.
   ============================================================ */

.erpds-customer-page .div_info_block {
    padding: 12px 14px;
    background: var(--erpds-info-soft, #E0EAF6);
    border: 1px solid transparent;
    border-left: 3px solid var(--erpds-info, #2563B8);
    border-radius: var(--erpds-radius, 12px);
    margin-bottom: 10px;
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
}
.erpds-customer-page .div_info_block.important {
    background: var(--erpds-warn-soft, #FBEDD9);
    border-left-color: var(--erpds-warn, #E07A1F);
}
.erpds-customer-page .div_info_block .caption {
    font-size: 11px;
    font-weight: 700;
    color: var(--erpds-text-muted, #525A66);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 4px;
}
.erpds-customer-page .div_info_block .text {
    font-size: 13px;
    color: var(--erpds-text, #0F172A);
    line-height: 1.5;
}

.erpds-customer-page .item .left_data {
    color: var(--erpds-text-faint, #6B7280);
    font-weight: 500;
    font-size: 12px;
    letter-spacing: 0.02em;
}

.erpds-customer-page .bad_info_text {
    color: var(--erpds-bad-text, #821B18);
    background: var(--erpds-bad-soft, #F5DDD9);
    padding: 2px 9px;
    border-radius: 999px;
    font-weight: 600;
    font-size: 13px;
    display: inline-block;
    line-height: 1.5;
}
.erpds-customer-page .good_info_text {
    color: var(--erpds-ok-text, #1F5E2D);
    background: var(--erpds-ok-soft, #E5F1E6);
    padding: 2px 9px;
    border-radius: 999px;
    font-weight: 600;
    font-size: 13px;
    display: inline-block;
    line-height: 1.5;
}

.erpds-customer-page .info_block {
    display: inline-block;
    padding: 2px 8px;
    background: var(--erpds-bg-2, #F2F4F7);
    color: var(--erpds-text-muted, #525A66);
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 500;
    text-decoration: none;
}
.erpds-customer-page a.info_block:hover {
    background: var(--erpds-accent-soft, #E5EAFB);
    color: var(--erpds-accent-text, #2D4AC7);
}

/* --- Customer Hero (avatar + h1 + status pill + meta) --- */
.erpds-customer-hero {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 18px;
    margin: 0 0 14px;
    background: var(--erpds-surface, #FFFFFF);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: var(--erpds-radius-lg, 14px);
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
}
.erpds-customer-hero-avatar {
    width: 56px;
    height: 56px;
    flex-shrink: 0;
    border-radius: var(--erpds-radius, 12px);
    background: var(--erpds-accent-soft, #E5EAFB);
    color: var(--erpds-accent-text, #2D4AC7);
    display: grid;
    place-items: center;
    font-family: var(--erpds-mono, ui-monospace, monospace);
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.01em;
}
.erpds-customer-hero-body {
    flex: 1;
    min-width: 0;
}
.erpds-customer-hero-name {
    margin: 0 0 6px;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
    color: var(--erpds-text, #0F172A);
}
.erpds-customer-hero-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 12px;
    color: var(--erpds-text-muted, #525A66);
}
.erpds-customer-hero-id {
    color: var(--erpds-text-muted, #525A66);
    font-size: 12px;
}
@media (max-width: 560px) {
    .erpds-customer-hero { padding: 12px; gap: 12px; }
    .erpds-customer-hero-avatar { width: 44px; height: 44px; font-size: 16px; }
    .erpds-customer-hero-name { font-size: 18px; }
}

/* --- Employee Hero (shares pattern with Customer) --- */
.erpds-employee-hero {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 18px;
    margin: 12px 0 14px;
    background: var(--erpds-surface, #FFFFFF);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: var(--erpds-radius-lg, 14px);
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
}
.erpds-employee-hero-avatar,
.erpds-employee-hero-photo {
    width: 56px;
    height: 56px;
    flex-shrink: 0;
    border-radius: var(--erpds-radius, 12px);
    object-fit: cover;
}
.erpds-employee-hero-avatar {
    background: var(--erpds-info-soft, #E0EAF6);
    color: var(--erpds-info-text, #163E78);
    display: grid;
    place-items: center;
    font-family: var(--erpds-mono, ui-monospace, monospace);
    font-size: 20px;
    font-weight: 700;
}
.erpds-employee-hero-body { flex: 1; min-width: 0; }
.erpds-employee-hero-name {
    margin: 0 0 6px;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
    color: var(--erpds-text, #0F172A);
}
.erpds-employee-hero-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 12px;
    color: var(--erpds-text-muted, #525A66);
}
.erpds-employee-hero-meta .erpds-meta-icon {
    margin-right: 4px;
    opacity: 0.55;
    font-size: 10.5px;
}
.erpds-employee-hero-meta .erpds-meta-sep {
    display: inline-block;
    width: 4px;
    height: 4px;
    margin: 0 8px;
    background: var(--erpds-text-faint, #6B7280);
    border-radius: 50%;
    vertical-align: middle;
    opacity: 0.5;
}
@media (max-width: 560px) {
    .erpds-employee-hero { padding: 12px; gap: 12px; }
    .erpds-employee-hero-avatar,
    .erpds-employee-hero-photo { width: 44px; height: 44px; font-size: 16px; }
    .erpds-employee-hero-name { font-size: 18px; }
}

/* --- Customer Stat Strip (4 tiles after hero) --- */
.erpds-customer-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: var(--erpds-grid-gap, 12px);
    margin: 0 0 16px;
}
.erpds-customer-stats .erpds-stat-tile {
    /* erpds-stat-tile already defined in design-tokens.css — extend with tone variants */
    padding: 8px 12px;
    transition: border-color 0.12s ease;
    min-width: 0; /* Prevent content from expanding the column */
}
.erpds-customer-stats .erpds-stat-tile.tone-ok {
    border-color: var(--erpds-ok, #2E8540);
    background: var(--erpds-ok-soft, #E5F1E6);
}
.erpds-customer-stats .erpds-stat-tile.tone-ok .value {
    color: var(--erpds-ok-text, #1F5E2D);
    font-family: var(--erpds-mono, ui-monospace, monospace);
    font-feature-settings: "tnum";
}
.erpds-customer-stats .erpds-stat-tile.tone-bad {
    border-color: var(--erpds-bad, #B62A26);
    background: var(--erpds-bad-soft, #F5DDD9);
}
.erpds-customer-stats .erpds-stat-tile.tone-bad .value {
    color: var(--erpds-bad-text, #821B18);
    font-family: var(--erpds-mono, ui-monospace, monospace);
    font-feature-settings: "tnum";
}
.erpds-customer-stats .erpds-stat-tile.tone-warn {
    border-color: var(--erpds-warn, #F0A500);
    background: var(--erpds-warn-soft, #FFFBEB);
}
.erpds-customer-stats .erpds-stat-tile.tone-warn .value {
    color: var(--erpds-warn-text, #92400E);
    font-family: var(--erpds-mono, ui-monospace, monospace);
    font-feature-settings: "tnum";
}
.erpds-customer-stats .erpds-stat-tile.tone-neutral .value {
    color: var(--erpds-text, #0F172A);
}
.erpds-customer-stats .erpds-stat-tile .label > .fa {
    margin-right: 6px;
    opacity: 0.7;
    font-size: 11px;
}
.erpds-customer-stats .erpds-stat-tile .value .erpds-stat-sub {
    display: inline-block;
    margin-left: 6px;
    font-size: 12px;
    font-weight: 500;
    color: var(--erpds-text-muted, #525A66);
    font-family: var(--erpds-mono, ui-monospace, monospace);
    vertical-align: baseline;
}

/* --- Universal icon polish for new components --- */
.erpds-customer-hero-meta .erpds-meta-icon {
    margin-right: 4px;
    opacity: 0.55;
    font-size: 10.5px;
}
.erpds-customer-hero-meta .erpds-meta-sep {
    display: inline-block;
    width: 4px;
    height: 4px;
    margin: 0 8px;
    background: var(--erpds-text-faint, #6B7280);
    border-radius: 50%;
    vertical-align: middle;
    opacity: 0.5;
}

.erpds-task-meta-strip .erpds-meta-label > .fa {
    margin-right: 5px;
    opacity: 0.7;
    font-size: 11px;
}

.erpds-dashboard-hero-eyebrow > .fa,
.erpds-dashboard-hero-subtitle > .fa,
.erpds-dashboard-hero-clock > .fa {
    margin-right: 7px;
    opacity: 0.65;
}
.erpds-dashboard-hero-clock > .fa {
    font-size: 16px;
    opacity: 0.45;
}

/* ============================================================
   ERPDS — Working menu (state change buttons) — modernized
   Аддитивно поверх .working_menu_change_state .button_state.
   ============================================================ */
.working_menu_change_state {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 8px;
    padding: 12px 0 4px;
}
.working_menu_change_state .button_state {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 8px 14px;
    background-color: var(--erpds-accent, #3B5BDB);
    border: 1px solid var(--erpds-accent, #3B5BDB);
    border-radius: var(--erpds-radius-sm, 8px);
    transition: background 0.12s ease, transform 0.06s ease, box-shadow 0.12s ease;
    box-shadow: 0 1px 2px rgba(15,23,42,0.08), inset 0 1px 0 rgba(255,255,255,0.10);
    font-size: 13px;
    font-weight: 500;
}
.working_menu_change_state .button_state:hover {
    background-color: var(--erpds-accent-hover, #2D4AC7);
    border-color: var(--erpds-accent-hover, #2D4AC7);
    box-shadow: 0 2px 6px rgba(15,23,42,0.12), inset 0 1px 0 rgba(255,255,255,0.12);
}
.working_menu_change_state .button_state:active {
    transform: translateY(1px);
}
.working_menu_change_state .button_state a {
    color: #fff;
    text-decoration: none;
    letter-spacing: -0.005em;
}

/* --- State-button colour by target systemRole (skip if inline background set) ---
   Один общий приёмник --erpds-state-bg/--erpds-state-bg-hover; каждый role
   просто задаёт пару переменных. Не перебивает inline style.
*/
.working_menu_change_state .button_state[data-target-role]:not([style*="background-color"]) {
    background-color: var(--erpds-state-bg, var(--erpds-accent, #3B5BDB));
    border-color: var(--erpds-state-bg, var(--erpds-accent, #3B5BDB));
}
.working_menu_change_state .button_state[data-target-role]:not([style*="background-color"]):hover {
    background-color: var(--erpds-state-bg-hover, var(--erpds-accent-hover, #2D4AC7));
    border-color: var(--erpds-state-bg-hover, var(--erpds-accent-hover, #2D4AC7));
}
.working_menu_change_state .button_state[data-target-role="run"] {
    --erpds-state-bg: var(--erpds-warn, #E07A1F);
    --erpds-state-bg-hover: #C26618;
}
.working_menu_change_state .button_state[data-target-role="successful"] {
    --erpds-state-bg: var(--erpds-ok, #2E8540);
    --erpds-state-bg-hover: #246732;
}
.working_menu_change_state .button_state[data-target-role="failed"],
.working_menu_change_state .button_state[data-target-role="cancelled"] {
    --erpds-state-bg: var(--erpds-bad, #B62A26);
    --erpds-state-bg-hover: #931E1B;
}
.working_menu_change_state .button_state[data-target-role="holded"],
.working_menu_change_state .button_state[data-target-role="unfinished"] {
    --erpds-state-bg: var(--erpds-hold, #C98A1A);
    --erpds-state-bg-hover: #A36F12;
}
.working_menu_change_state .button_state[data-target-role="return_to_author"] {
    --erpds-state-bg: var(--erpds-text-muted, #525A66);
    --erpds-state-bg-hover: var(--erpds-ink, #0F172A);
}

.erpds-state-queue-toast {
    margin-top: 8px;
    padding: 8px 12px;
    font-size: 13px;
    border-radius: 6px;
    background: var(--erpds-warning-bg, #fff8e1);
    color: var(--erpds-warning-fg, #8a6d00);
    border: 1px solid var(--erpds-warning-border, #ffe08a);
}

.erpds-state-comment-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 16px;
}
.erpds-state-comment-box {
    background: var(--erpds-surface, #fff);
    color: var(--erpds-text, #222);
    width: 420px;
    max-width: 100%;
    border-radius: 8px;
    padding: 16px;
    box-shadow: 0 6px 24px rgba(0,0,0,.3);
}
.erpds-state-comment-title {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 8px;
}
.erpds-state-comment-ta {
    width: 100%;
    box-sizing: border-box;
    font-size: 14px;
    padding: 8px;
    border: 1px solid var(--erpds-border, #ccc);
    border-radius: 6px;
    resize: vertical;
}
.erpds-state-comment-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: 10px;
}
.erpds-state-comment-actions button {
    min-height: 40px;
    padding: 0 14px;
    border-radius: 6px;
    border: 1px solid var(--erpds-border, #ccc);
    background: var(--erpds-surface, #fff);
    color: var(--erpds-text, #222);
}
.erpds-state-comment-actions .erpds-state-comment-ok {
    background: var(--erpds-ok, #2E8540);
    color: #fff;
    border-color: var(--erpds-ok, #2E8540);
}

/* --- Task Meta Strip (v1 6-cell compact bar, condensed to N filled cells) --- */
.erpds-task-meta-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0;
    background: var(--erpds-surface, #FFFFFF);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: var(--erpds-radius, 12px);
    overflow: hidden;
    margin: 0 0 12px;
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
}
.erpds-task-meta-strip .erpds-meta-cell {
    padding: 10px 16px;
    border-right: 1px solid var(--erpds-border, #DDE1E8);
}
.erpds-task-meta-strip .erpds-meta-cell:last-child {
    border-right: none;
}
.erpds-task-meta-strip .erpds-meta-label {
    font-size: 10px;
    font-weight: 600;
    color: var(--erpds-text-faint, #6B7280);
    text-transform: uppercase;
    letter-spacing: 0.07em;
    margin-bottom: 4px;
}
.erpds-task-meta-strip .erpds-meta-value {
    font-size: 13px;
    font-weight: 500;
    color: var(--erpds-text, #0F172A);
    line-height: 1.35;
    word-break: break-word;
}
.erpds-task-meta-strip .erpds-meta-due {
    display: inline-block;
    margin-left: 4px;
    padding: 0 6px;
    background: var(--erpds-warn-soft, #FBEDD9);
    color: var(--erpds-warn-text, #8A4A0A);
    font-family: var(--erpds-mono, ui-monospace, monospace);
    font-size: 11px;
    font-weight: 600;
    border-radius: 4px;
}
@media (max-width: 720px) {
    .erpds-task-meta-strip .erpds-meta-cell {
        border-right: none;
        border-bottom: 1px solid var(--erpds-border, #DDE1E8);
    }
    .erpds-task-meta-strip .erpds-meta-cell:last-child {
        border-bottom: none;
    }
}

/* ============================================================
   ERPDS — Dashboard v2 (Today's pulse hero + admin_info polish)
   ============================================================ */

.erpds-dashboard-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    padding: 16px;
    margin: 0 0 12px;
    background: linear-gradient(135deg, var(--erpds-accent-soft, #E5EAFB) 0%, var(--erpds-surface, #FFFFFF) 70%);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: var(--erpds-radius-lg, 14px);
    box-shadow: var(--erpds-shadow, 0 1px 3px rgba(15,23,42,0.06), 0 8px 24px -16px rgba(15,23,42,0.08));
}
.erpds-dashboard-hero-eyebrow {
    font-size: 11px;
    font-weight: 600;
    color: var(--erpds-accent-text, #2D4AC7);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 4px;
}
.erpds-dashboard-hero-title {
    margin: 0 0 4px;
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.15;
    color: var(--erpds-text, #0F172A);
}
.erpds-dashboard-hero-subtitle {
    font-size: 13px;
    color: var(--erpds-text-muted, #525A66);
}
.erpds-dashboard-hero-clock {
    font-size: 30px;
    font-weight: 600;
    color: var(--erpds-text, #0F172A);
    letter-spacing: -0.02em;
    line-height: 1;
    padding: 8px 14px;
    background: var(--erpds-surface, #FFFFFF);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: var(--erpds-radius, 12px);
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
    flex-shrink: 0;
}
@media (max-width: 640px) {
    .erpds-dashboard-hero { flex-direction: column; align-items: stretch; padding: 12px; }
    .erpds-dashboard-hero-title { font-size: 22px; }
    .erpds-dashboard-hero-clock { font-size: 22px; align-self: flex-start; }
}

/* admin_info — стат-блоки сверху страницы (количество абонентов, время, IP) */
.erpds-dashboard-page #admin_info {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 18px;
}
.erpds-dashboard-page #admin_info .block {
    flex: 1 1 240px;
    background: var(--erpds-surface, #FFFFFF);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: 14px;
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
    padding: 14px 18px;
    display: grid;
    grid-template-columns: 1fr auto;
    column-gap: 16px;
    row-gap: 8px;
    align-items: center;
    position: relative;
    overflow: hidden;
    transition: box-shadow 0.18s ease, transform 0.08s ease, border-color 0.18s ease;
}
.erpds-dashboard-page #admin_info .block::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    background: var(--erpds-accent, #2D4AC7);
    opacity: 0.55;
}
.erpds-dashboard-page #admin_info .block:hover {
    box-shadow: var(--erpds-shadow, 0 4px 12px rgba(15,23,42,0.08));
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--erpds-accent, #2D4AC7) 25%, var(--erpds-border, #DDE1E8));
}
.erpds-dashboard-page #admin_info .block ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.erpds-dashboard-page #admin_info .block ul.first {
    grid-column: 1;
    text-align: left;
    border-right: none;
    margin-right: 0;
    padding-right: 0;
}
.erpds-dashboard-page #admin_info .block ul.second {
    grid-column: 2;
    text-align: right;
}
.erpds-dashboard-page #admin_info .block ul li {
    list-style: none;
    line-height: 1.3;
}
.erpds-dashboard-page #admin_info .block ul.first li {
    font-size: 10.5px;
    font-weight: 600;
    color: var(--erpds-text-faint, #6B7280);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}
.erpds-dashboard-page #admin_info .block ul.second li {
    font-size: 15px;
    font-weight: 700;
    color: var(--erpds-text, #0F172A);
    font-family: var(--erpds-sans, "Inter", system-ui, sans-serif);
    font-feature-settings: "tnum";
    letter-spacing: -0.01em;
}
.erpds-dashboard-page #admin_info .block ul.second li a {
    color: var(--erpds-accent-text, #2D4AC7);
    text-decoration: none;
}
.erpds-dashboard-page #admin_info .block ul.second li a:hover {
    text-decoration: underline;
}

/* --- Dashboard alert ribbons (.div_alert_news) — system warnings --- */
.erpds-dashboard-page #div_news > .div_alert_news {
    grid-column: 1 / -1;
    display: block;
    width: 100%;
    box-sizing: border-box;
}
.erpds-dashboard-page .div_alert_news {
    display: block;
    width: 100%;
    box-sizing: border-box;
    background: var(--erpds-bad-soft, #F5DDD9);
    border: 1px solid transparent;
    border-left: 4px solid var(--erpds-bad, #B62A26);
    border-radius: var(--erpds-radius, 12px);
    padding: 14px 18px;
    margin: 0 0 12px;
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
    color: var(--erpds-bad-text, #821B18);
}
.erpds-dashboard-page .div_alert_news h1 {
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--erpds-bad-text, #821B18);
}
.erpds-dashboard-page .div_alert_news .text {
    font-size: 13px !important;
    line-height: 1.5;
    color: var(--erpds-text, #0F172A);
}
.erpds-dashboard-page .div_alert_news .text a {
    color: var(--erpds-accent-text, #2D4AC7);
    font-weight: 500;
    text-decoration: none;
}
.erpds-dashboard-page .div_alert_news .text a:hover {
    text-decoration: underline;
}

/* erpds layout — modern flexbox containers */

.erpds-flex-container {
    display: flex !important;
    gap: 20px !important;
    align-items: flex-start !important;
    width: 100% !important;
}

.erpds-sidebar {
    flex: 0 0 400px !important;
    max-width: 400px !important;
    min-width: 280px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.erpds-main-content {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

@media (max-width: 1024px) {
    .erpds-flex-container {
        flex-direction: column !important;
    }
    .erpds-sidebar {
        max-width: 100% !important;
        flex: 1 1 auto !important;
    }
}

/* erpds employee page — modern details layout */

.erpds-employee-page .erpds-card {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

.erpds-employee-page .item {
    display: flex !important;
    align-items: flex-start !important;
    padding: 0 !important;
    border-bottom: none !important;
}

.erpds-employee-page .left_data {
    flex: 0 0 180px !important;
    max-width: 180px !important;
    text-align: left !important;
    background: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
}

.erpds-employee-page .item > div:not(.left_data) {
    flex: 1 1 auto !important;
    padding: 0 !important;
    display: block !important;
}

@media (max-width: 600px) {
    .erpds-employee-page .item {
        flex-direction: column !important;
        gap: 4px !important;
    }
    .erpds-employee-page .left_data {
        flex: 1 1 auto !important;
        max-width: 100% !important;
    }
}


/* ============================================================
   ADDRESS HERO  (AddressHtml::buildingList)
   ============================================================ */
.erpds-address-hero {
    --hero-accent: var(--erpds-accent, #3b6fd4);
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--erpds-surface-2, #f4f6fb);
    border-radius: var(--erpds-radius, 10px);
    margin-bottom: 12px;
    border-left: 4px solid var(--hero-accent);
}

.erpds-address-hero-icon {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--hero-accent) 12%, transparent);
    color: var(--hero-accent);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    flex-shrink: 0;
}

.erpds-address-hero-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.label_h2.erpds-address-title {
    margin: 0;
    padding: 0;
    border: none;
    font-size: 20px;
    font-weight: 700;
    color: var(--erpds-text-primary, #1a2233);
    font-family: var(--erpds-font, inherit);
}

.erpds-address-hero-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    color: var(--erpds-text-secondary, #6b7a99);
}

.erpds-address-hero-stat {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.erpds-address-hero-stat i {
    font-size: 12px;
    color: var(--hero-accent);
}

@media (max-width: 600px) {
    .erpds-address-hero {
        padding: 14px 12px;
        gap: 12px;
    }
    .erpds-address-hero-icon {
        width: 38px;
        height: 38px;
        font-size: 17px;
    }
    .label_h2.erpds-address-title {
        font-size: 17px;
    }
}

/* ============================================================
   NODE HERO  (NodeHtml::dialogAddShowEdit mode=show)
   ============================================================ */
.erpds-node-hero {
    --hero-accent: var(--erpds-accent, #3b6fd4);
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 16px;
    background: var(--erpds-surface-2, #f4f6fb);
    border-radius: var(--erpds-radius, 10px);
    border-left: 4px solid var(--hero-accent);
    margin-bottom: 12px;
}

.erpds-node-hero-icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--hero-accent) 12%, transparent);
    color: var(--hero-accent);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    flex-shrink: 0;
    margin-top: 2px;
}

.erpds-node-hero-body {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.label_h2.erpds-node-title {
    margin: 0;
    padding: 0;
    border: none;
    font-size: 20px;
    font-weight: 700;
    color: var(--erpds-text-primary, #1a2233);
    font-family: var(--erpds-font, inherit);
    white-space: normal;
    word-break: break-word;
}

.erpds-node-hero-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.erpds-node-type-badge {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 20px;
    background: color-mix(in srgb, var(--hero-accent) 12%, transparent);
    color: var(--hero-accent);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.erpds-node-hero-comment {
    font-size: 13px;
    color: var(--erpds-text-secondary, #6b7a99);
    font-style: italic;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: min(400px, 60vw);
}

@media (max-width: 600px) {
    .erpds-node-hero {
        padding: 12px;
        gap: 10px;
    }
    .erpds-node-hero-icon {
        width: 36px;
        height: 36px;
        font-size: 16px;
    }
    .label_h2.erpds-node-title {
        font-size: 17px;
    }
    .erpds-node-hero-comment {
        max-width: min(200px, 50vw);
    }
}

/* Node type badge — deterministic color by typeId % 6 */
.erpds-node-type-badge--0 { color: var(--erpds-accent,  #3b6fd4); background: var(--erpds-accent-soft,  #e8eeff); background: color-mix(in srgb, var(--erpds-accent,  #3b6fd4) 12%, transparent); }
.erpds-node-type-badge--1 { color: var(--erpds-ok,     #1e7e4e); background: var(--erpds-ok-soft,     #e5f1e6); background: color-mix(in srgb, var(--erpds-ok,     #1e7e4e) 12%, transparent); }
.erpds-node-type-badge--2 { color: var(--erpds-warn,   #b06000); background: var(--erpds-warn-soft,   #fbedd9); background: color-mix(in srgb, var(--erpds-warn,   #b06000) 12%, transparent); }
.erpds-node-type-badge--3 { color: var(--erpds-rose,   #b0205a); background: var(--erpds-rose-soft,   #fce7f0); background: color-mix(in srgb, var(--erpds-rose,   #b0205a) 12%, transparent); }
.erpds-node-type-badge--4 { color: var(--erpds-purple, #5520b0); background: var(--erpds-purple-soft, #ede8fd);  background: color-mix(in srgb, var(--erpds-purple, #5520b0) 12%, transparent); }
.erpds-node-type-badge--5 { color: var(--erpds-info,   #2563B8); background: var(--erpds-info-soft,   #e0eaf6); background: color-mix(in srgb, var(--erpds-info,   #2563B8) 12%, transparent); }
.erpds-node-type-badge--default {
    color: var(--erpds-text-primary, #1a2233);
    background: color-mix(in srgb, var(--erpds-text-primary, #1a2233) 8%, transparent);
    border: 1px solid rgba(26,34,51,0.2);
    border: 1px solid color-mix(in srgb, currentColor 20%, transparent);
}

/* Node hero — edit mode icon variant.
   Намеренно переопределяет --hero-accent: warn-цвет сигнализирует о режиме
   редактирования вне зависимости от типа узла. */
.erpds-node-hero-icon--edit {
    background: var(--erpds-warn-soft, #fff4e5);
    color: var(--erpds-warn, #b06000);
}

/* ── Hero Base (renderHeroBlock) ── */
.erpds-hero {
    --hero-accent: var(--erpds-accent, #1976d2);
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 14px 18px;
    margin-bottom: 12px;
    background: var(--erpds-surface, #fff);
    border-left: 4px solid var(--hero-accent);
    border-radius: 6px;
    box-shadow: 0 1px 4px rgba(0,0,0,.07);
}
.erpds-hero-icon {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: color-mix(in srgb, var(--hero-accent) 12%, transparent);
    font-size: 18px;
    color: var(--hero-accent);
}
.erpds-hero-body { flex: 1; min-width: 0; }
.erpds-hero-title {
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.erpds-hero-sub {
    font-size: 12px;
    color: var(--erpds-text-secondary, #666);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── TaskList Hero ── */
.erpds-tasklist-hero { --hero-accent: var(--erpds-warn, #f57c00); }

/* ── Owner Hero ── */
.erpds-owner-hero { --hero-accent: var(--erpds-info, #0288d1); }

/* ── Accountancy Hero ── */
.erpds-accountancy-hero { --hero-accent: var(--erpds-ok, #2E8540); }

/* Print: strip hero decorations */
@media print {
    .erpds-hero,
    .erpds-node-hero,
    .erpds-address-hero,
    .erpds-customer-hero,
    .erpds-employee-hero,
    .erpds-dashboard-hero {
        border: none !important;
        background: none !important;
        padding: 4px 0 !important;
        box-shadow: none !important;
    }
    .erpds-node-hero-icon,
    .erpds-address-hero-icon,
    .erpds-employee-hero-photo,
    .erpds-customer-hero-avatar {
        display: none !important;
    }
}

/* ============================================================
   DEVICE HERO  (DeviceHtml::index)
   ============================================================ */
.erpds-device-hero {
    --hero-accent: var(--erpds-accent, #3b6fd4);
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--erpds-surface-2, #f4f6fb);
    border-radius: var(--erpds-radius, 10px);
    border-left: 4px solid var(--hero-accent);
    margin-bottom: 12px;
}

.erpds-device-hero-icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--hero-accent) 12%, transparent);
    color: var(--hero-accent);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    flex-shrink: 0;
}

.erpds-device-hero-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.label_h2.erpds-device-title {
    margin: 0;
    padding: 0;
    border: none;
    font-size: 20px;
    font-weight: 700;
    color: var(--erpds-text-primary, #1a2233);
    font-family: var(--erpds-font, inherit);
}

.erpds-device-hero-sub {
    font-size: 13px;
    color: var(--erpds-text-secondary, #6b7a99);
    font-weight: 500;
}

@media (max-width: 600px) {
    .erpds-device-hero {
        padding: 12px;
        gap: 10px;
    }
    .erpds-device-hero-icon {
        width: 36px;
        height: 36px;
        font-size: 16px;
    }
    .label_h2.erpds-device-title {
        font-size: 17px;
    }
}

@media print {
    .erpds-device-hero {
        border: none !important;
        background: none !important;
        padding: 4px 0 !important;
    }
    .erpds-device-hero-icon { display: none !important; }
}

/* ============================================================
   React device page polish — additive MUI layer.
   Scope: NEW_ERP device pages rendered inside #main_content.
   ============================================================ */
#main_content {
    --wn-react-surface: var(--erpds-surface, #ffffff);
    --wn-react-surface-soft: var(--erpds-surface-2, #f6f7f9);
    --wn-react-border: var(--erpds-border, #dde1e8);
    --wn-react-border-soft: var(--erpds-border-soft, #edf0f5);
    --wn-react-text: var(--erpds-text, #0f172a);
    --wn-react-muted: var(--erpds-text-muted, #525a66);
    --wn-react-accent: var(--erpds-accent, #3b5bdb);
    --wn-react-accent-hover: var(--erpds-accent-hover, #2d4ac7);
    --wn-react-accent-soft: var(--erpds-accent-soft, #e5eafb);
    --wn-react-radius: var(--erpds-radius, 12px);
    --wn-react-shadow-sm: var(--erpds-shadow-sm, 0 1px 3px rgba(15, 23, 42, 0.06));
    color: var(--wn-react-text);
}

#main_content > .MuiBox-root {
    padding: 12px 14px 20px;
}

#main_content .MuiTypography-root {
    color: var(--wn-react-text);
}

#main_content .MuiBox-root .MuiBox-root:has(> .MuiButtonGroup-root) {
    background: var(--wn-react-surface);
    border: 1px solid var(--wn-react-border);
    border-radius: var(--wn-react-radius);
    box-shadow: var(--wn-react-shadow-sm);
    overflow: hidden;
}

#main_content .MuiButtonGroup-root {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
    border-radius: var(--wn-react-radius);
}

#main_content .MuiButtonGroup-root .MuiButtonBase-root {
    min-height: 54px;
    color: var(--wn-react-muted);
    background: var(--wn-react-surface);
    text-transform: none;
    font-weight: 600;
    transition: color .14s ease, background .14s ease, border-color .14s ease;
}

#main_content .MuiButtonGroup-root .MuiButtonBase-root:hover {
    color: var(--wn-react-accent-hover);
    background: color-mix(in srgb, var(--wn-react-accent) 6%, var(--wn-react-surface));
}

#main_content .MuiButtonGroup-root .wn-divider {
    background: var(--wn-react-border-soft) !important;
}

#main_content .MuiTabs-root {
    margin-top: 12px;
    border-bottom: 1px solid var(--wn-react-border);
}

#main_content .MuiTab-root {
    min-height: 44px;
    color: var(--wn-react-muted);
    text-transform: none;
    font-weight: 600;
    letter-spacing: 0;
}

#main_content .MuiTab-root.Mui-selected {
    color: var(--wn-react-accent-hover);
    background: color-mix(in srgb, var(--wn-react-accent) 7%, transparent);
}

#main_content .MuiTabs-indicator {
    height: 2px;
    background-color: var(--wn-react-accent);
    border-radius: 999px 999px 0 0;
}

#main_content .MuiTabs-root + .MuiBox-root {
    margin-top: 14px;
}

#main_content .MuiTabs-root + .MuiBox-root > .MuiBox-root:first-child {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

#main_content .MuiTabs-root + .MuiBox-root > .MuiBox-root:first-child:has(.MuiDataGrid-root) {
    display: block;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box;
}

#main_content .MuiTabs-root + .MuiBox-root > .MuiBox-root:first-child:has(.MuiDataGrid-root) > .MuiDataGrid-root {
    width: 100% !important;
    max-width: none !important;
}

#main_content .MuiTabs-root + .MuiBox-root .MuiBox-root:has(> .MuiDataGrid-root) {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box;
}

#main_content .MuiTabs-root + .MuiBox-root > .MuiBox-root:first-child .MuiButton-root {
    min-height: 34px;
    padding: 7px 12px;
    border-radius: 999px;
    color: var(--wn-react-accent-hover);
    background: var(--wn-react-surface-soft);
    border: 1px solid var(--wn-react-border);
    text-transform: none;
    font-weight: 700;
    box-shadow: none;
}

#main_content .MuiTabs-root + .MuiBox-root > .MuiBox-root:first-child .MuiButton-root:hover {
    background: color-mix(in srgb, var(--wn-react-accent) 8%, var(--wn-react-surface));
    border-color: color-mix(in srgb, var(--wn-react-accent) 35%, var(--wn-react-border));
}

#main_content .MuiDataGrid-root {
    background: var(--wn-react-surface);
    border: 1px solid var(--wn-react-border);
    border-radius: var(--wn-react-radius);
    box-shadow: var(--wn-react-shadow-sm);
    overflow: hidden;
}

#main_content .MuiDataGrid-toolbarContainer {
    min-height: 52px;
    padding: 8px 10px;
    gap: 8px;
    background: var(--wn-react-surface);
    border-bottom: 1px solid var(--wn-react-border-soft);
}

#main_content .MuiDataGrid-toolbarContainer .MuiButton-root,
#main_content .MuiDataGrid-toolbarContainer .MuiIconButton-root {
    border-radius: 9px;
    color: var(--wn-react-muted);
    text-transform: none;
    font-weight: 700;
}

#main_content .MuiDataGrid-columnHeaders,
#main_content .MuiDataGrid-columnHeader,
#main_content .MuiDataGrid-filler {
    background: var(--wn-react-surface-soft);
}

#main_content .MuiDataGrid-columnHeaderTitle {
    color: var(--wn-react-text);
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: .02em;
}

#main_content .MuiDataGrid-cell {
    border-color: var(--wn-react-border-soft);
    color: var(--wn-react-text);
    font-size: 13px;
}

#main_content .MuiDataGrid-row:hover .MuiDataGrid-cell {
    background: color-mix(in srgb, var(--wn-react-accent) 5%, transparent);
}

#main_content .MuiDataGrid-cell a {
    color: var(--wn-react-accent-hover);
    text-decoration: none;
    font-weight: 600;
}

#main_content .MuiDataGrid-cell a:hover {
    text-decoration: underline;
}

/* ONU DataGrid: расширяем рабочую область, не переопределяя ширины колонок. */
#main_content .MuiDataGrid-root:has(.MuiDataGrid-columnHeader[data-field="onuLink"]) {
    width: 100% !important;
    max-width: none !important;
}

#main_content .MuiBox-root:has(.MuiDataGrid-root:has(.MuiDataGrid-columnHeader[data-field="onuLink"])) {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box;
}

#main_content .MuiTabs-root + .MuiBox-root .MuiBox-root.css-2imjyh:has(> .MuiPaper-root .MuiTable-root) {
    display: grid !important;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, .95fr);
    gap: 14px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
}

#main_content .MuiTabs-root + .MuiBox-root .MuiBox-root.css-2imjyh:has(> .MuiPaper-root .MuiTable-root):empty {
    display: none !important;
}

#main_content .MuiTabs-root + .MuiBox-root .MuiBox-root.css-2imjyh:has(> .MuiPaper-root .MuiTable-root) > * {
    width: 100% !important;
    min-width: 0;
    max-width: 100%;
}

#main_content .MuiTabs-root + .MuiBox-root .MuiBox-root.css-2imjyh:has(> .MuiPaper-root .MuiTable-root) .MuiBox-root.css-h2czn5 {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: auto !important;
    min-width: 0;
}

#main_content .MuiTabs-root + .MuiBox-root .MuiBox-root.css-2imjyh:has(> .MuiPaper-root .MuiTable-root) .MuiPaper-root:not(.MuiPopover-paper) {
    border-radius: var(--wn-react-radius);
    border: 1px solid var(--wn-react-border);
    background: var(--wn-react-surface);
    box-shadow: var(--wn-react-shadow-sm);
    overflow: hidden;
}

#main_content .MuiTabs-root + .MuiBox-root .MuiBox-root.css-2imjyh:has(> .MuiPaper-root .MuiTable-root) .MuiPaper-root:not(.MuiPopover-paper):hover {
    border-color: color-mix(in srgb, var(--wn-react-accent) 22%, var(--wn-react-border));
}

#main_content .MuiTabs-root + .MuiBox-root .MuiBox-root.css-2imjyh:has(> .MuiPaper-root .MuiTable-root) .MuiTable-root {
    width: 100%;
    table-layout: auto;
    border-collapse: separate;
    border-spacing: 0;
}

#main_content .MuiTabs-root + .MuiBox-root .MuiBox-root.css-2imjyh:has(> .MuiPaper-root .MuiTable-root) .MuiTableCell-root {
    border-color: var(--wn-react-border-soft);
    padding: 8px 10px;
    color: var(--wn-react-text);
    vertical-align: top;
}

#main_content .MuiTabs-root + .MuiBox-root .MuiBox-root.css-2imjyh:has(> .MuiPaper-root .MuiTable-root) .MuiTableRow-root:nth-of-type(even) .MuiTableCell-root {
    background: var(--wn-react-surface-soft);
}

#main_content .MuiTabs-root + .MuiBox-root .MuiBox-root.css-2imjyh:has(> .MuiPaper-root .MuiTable-root) .MuiTableRow-root:hover .MuiTableCell-root {
    background: color-mix(in srgb, var(--wn-react-accent) 5%, var(--wn-react-surface));
}

#main_content .MuiTabs-root + .MuiBox-root .MuiBox-root.css-2imjyh:has(> .MuiPaper-root .MuiTable-root) .MuiTableCell-root:first-child {
    width: 38%;
    color: var(--wn-react-muted);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .02em;
}

#main_content .MuiTabs-root + .MuiBox-root .MuiBox-root.css-2imjyh:has(> .MuiPaper-root .MuiTable-root) .MuiTableCell-root:last-child {
    font-weight: 650;
    word-break: break-word;
    overflow-wrap: anywhere;
}

@media (max-width: 900px) {
    #main_content > .MuiBox-root {
        padding: 12px;
    }

    #main_content .MuiButtonGroup-root {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #main_content .MuiButtonGroup-root .MuiButtonBase-root {
        min-height: 48px;
        font-size: 12px;
    }

    #main_content .MuiTabs-root + .MuiBox-root .MuiBox-root.css-2imjyh:has(> .MuiPaper-root .MuiTable-root) {
        grid-template-columns: 1fr !important;
    }
}

/* ============================================================
   Header redesign (light) — additive layer.
   Scope: #top_topline_{current,plan,all}. Dark mirror lives
   in style_dark.css. Nothing hidden, only visual override.
   ============================================================ */
#top_topline_current,
#top_topline_plan,
#top_topline_all {
    box-sizing: border-box !important;
    background: var(--erpds-surface, #ffffff) !important;
    border-bottom: 1px solid var(--erpds-border, #e5e7eb) !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    height: 56px !important;
    min-height: 56px !important;
    padding: 0 16px !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px;
}
#top_topline_current *,
#top_topline_plan    *,
#top_topline_all     * { box-sizing: border-box; }
#top_topline_current #top_userbar_current,
#top_topline_plan    #top_userbar_plan,
#top_topline_all     #top_userbar_all {
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    height: 56px !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px;
    flex: 1 1 auto;
    min-width: 0;
}

/* Search ------------------------------------------------------- */
#top_topline_current #top_search,
#top_topline_plan    #top_search,
#top_topline_all     #top_search {
    position: relative;
    display: flex;
    align-items: center;
    width: 360px;
    max-width: 40vw;
    height: 36px;
    background: var(--erpds-surface-2, #f8fafc) !important;
    border: 1px solid var(--erpds-border, #e5e7eb) !important;
    border-radius: 8px !important;
    padding: 0 12px 0 36px !important;
    transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
    box-shadow: none !important;
}
#top_topline_current #top_search:hover,
#top_topline_plan    #top_search:hover,
#top_topline_all     #top_search:hover {
    background: #ffffff !important;
    border-color: #cbd5e1 !important;
}
#top_topline_current #top_search:focus-within,
#top_topline_plan    #top_search:focus-within,
#top_topline_all     #top_search:focus-within {
    background: #ffffff !important;
    border-color: #4f46e5 !important;
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.18) !important;
}
#top_topline_current #top_search::before,
#top_topline_plan    #top_search::before,
#top_topline_all     #top_search::before {
    content: "";
    position: absolute;
    left: 10px; top: 50%;
    width: 16px; height: 16px;
    transform: translateY(-50%);
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='7'/><path d='m21 21-4.3-4.3'/></svg>") center/contain no-repeat;
    pointer-events: none;
}
#top_topline_current #top_search::after,
#top_topline_plan    #top_search::after,
#top_topline_all     #top_search::after {
    content: "⌘ K";
    position: absolute;
    right: 10px; top: 50%;
    transform: translateY(-50%);
    font: 600 11px/1 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    color: #64748b;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    padding: 2px 6px;
    pointer-events: none;
    transition: opacity .15s ease;
}
#top_topline_current #top_search:focus-within::after,
#top_topline_plan    #top_search:focus-within::after,
#top_topline_all     #top_search:focus-within::after { opacity: 0; }

#top_topline_current #top_search #top_field,
#top_topline_plan    #top_search #top_field,
#top_topline_all     #top_search #top_field {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    height: 34px !important;
    width: 100% !important;
    padding: 0 48px 0 0 !important;
    margin: 0 !important;
    font: 500 13px/1.2 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    color: var(--erpds-text, #0f172a) !important;
    outline: none !important;
}
#top_topline_current #top_search #top_field::placeholder,
#top_topline_plan    #top_search #top_field::placeholder,
#top_topline_all     #top_search #top_field::placeholder {
    color: #94a3b8 !important;
    opacity: 1;
}
#top_topline_current #top_search #top_button,
#top_topline_plan    #top_search #top_button,
#top_topline_all     #top_search #top_button {
    position: absolute !important;
    width: 1px !important; height: 1px !important;
    padding: 0 !important; margin: -1px !important;
    border: 0 !important; background: transparent !important;
    clip: rect(0 0 0 0);
    overflow: hidden;
}

/* Top links — icon button row ---------------------------------- */
#top_topline_current #top_links,
#top_topline_plan    #top_links,
#top_topline_all     #top_links {
    margin-left: auto !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    list-style: none !important;
    background: transparent !important;
    height: 36px !important;
}
#top_topline_current #top_links > li,
#top_topline_plan    #top_links > li,
#top_topline_all     #top_links > li {
    display: inline-flex !important;
    align-items: center !important;
    height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}
#top_topline_current #top_links > li > a,
#top_topline_plan    #top_links > li > a,
#top_topline_all     #top_links > li > a {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 36px;
    height: 36px;
    padding: 0 8px !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: #475569 !important;
    text-decoration: none !important;
    border: 1px solid transparent !important;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
    font: 500 13px/1 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
#top_topline_current #top_links > li > a:hover,
#top_topline_plan    #top_links > li > a:hover,
#top_topline_all     #top_links > li > a:hover {
    background: #f1f5f9 !important;
    color: #0f172a !important;
}
#top_topline_current #top_links > li > a:focus-visible,
#top_topline_plan    #top_links > li > a:focus-visible,
#top_topline_all     #top_links > li > a:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.35);
}
#top_topline_current #top_links .us-icon,
#top_topline_plan    #top_links .us-icon,
#top_topline_all     #top_links .us-icon {
    color: #64748b !important;
    background: transparent !important;
    font-size: 15px !important;
    width: auto !important; height: auto !important;
    margin: 0 !important;
    text-shadow: none !important;
}
#top_topline_current #top_links > li > a:hover .us-icon,
#top_topline_plan    #top_links > li > a:hover .us-icon,
#top_topline_all     #top_links > li > a:hover .us-icon {
    color: #0f172a !important;
}

/* Region chip -------------------------------------------------- */
#top_topline_current #top_region,
#top_topline_plan    #top_region,
#top_topline_all     #top_region {
    color: #334155 !important;
    border: 0 !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    background-image: none !important;
}
#top_topline_current #top_region #top_region_text,
#top_topline_plan    #top_region #top_region_text,
#top_topline_all     #top_region #top_region_text {
    border-bottom: 0 !important;
    text-decoration: none !important;
    background-image: none !important;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Profile pill ------------------------------------------------- */
#top_topline_current #linkEmployeePersonalId,
#top_topline_plan    #linkEmployeePersonalId,
#top_topline_all     #linkEmployeePersonalId {
    padding: 0 10px 0 4px !important;
    gap: 8px;
}
#top_topline_current #linkEmployeePersonalId .us-icon.fa-user,
#top_topline_plan    #linkEmployeePersonalId .us-icon.fa-user,
#top_topline_all     #linkEmployeePersonalId .us-icon.fa-user {
    font-size: 15px !important;
}
#top_topline_current #top_user_text,
#top_topline_plan    #top_user_text,
#top_topline_all     #top_user_text {
    color: var(--erpds-text, #0f172a) !important;
    font-weight: 600 !important;
    font-size: 13px !important;
}

/* Logout — destructive ---------------------------------------- */
#top_topline_current #top_links #linkLogoutMenuId,
#top_topline_plan    #top_links #linkLogoutMenuId,
#top_topline_all     #top_links #linkLogoutMenuId { width: 36px; padding: 0 !important; }
#top_topline_current #top_links #linkLogoutMenuId:hover,
#top_topline_plan    #top_links #linkLogoutMenuId:hover,
#top_topline_all     #top_links #linkLogoutMenuId:hover {
    background: #fef2f2 !important;
    border-color: #fecaca !important;
    color: #dc2626 !important;
}
#top_topline_current #top_links #linkLogoutMenuId:hover .us-icon,
#top_topline_plan    #top_links #linkLogoutMenuId:hover .us-icon,
#top_topline_all     #top_links #linkLogoutMenuId:hover .us-icon { color: #dc2626 !important; }

/* Mobile buttons inside header -------------------------------- */
#top_topline_current > #mobile_menu_open_btn,
#top_topline_plan    > #mobile_menu_open_btn,
#top_topline_all     > #mobile_menu_open_btn,
#top_topline_current > #mobile_back_btn,
#top_topline_plan    > #mobile_back_btn,
#top_topline_all     > #mobile_back_btn,
#top_topline_current > #mobile_refresh_btn,
#top_topline_plan    > #mobile_refresh_btn,
#top_topline_all     > #mobile_refresh_btn {
    background: transparent;
    border: 1px solid transparent;
    color: #475569;
    border-radius: 8px;
}

/* Adaptive ----------------------------------------------------- */
@media (max-width: 1100px) {
    #top_topline_current #top_user_text,
    #top_topline_plan    #top_user_text,
    #top_topline_all     #top_user_text { display: none !important; }
}
@media (max-width: 760px) {
    #top_topline_current #top_search,
    #top_topline_plan    #top_search,
    #top_topline_all     #top_search {
        width: 180px;
        padding-right: 8px !important;
    }
    #top_topline_current #top_search::after,
    #top_topline_plan    #top_search::after,
    #top_topline_all     #top_search::after { display: none; }
}

/* Region chevron (▾) */
#top_topline_current #top_region::after,
#top_topline_plan    #top_region::after,
#top_topline_all     #top_region::after {
    content: "▾";
    margin-left: 6px;
    font-size: 13px;
    line-height: 1;
    color: #475569;
    display: inline-block;
    transform: translateY(-1px);
    text-decoration: none;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    #top_topline_current *,
    #top_topline_plan    *,
    #top_topline_all     * {
        transition: none !important;
        animation: none !important;
    }
}

/* Pill: обязательные фото не загружены */
.erpds-pill--danger {
    background:   var(--erpds-bad-soft, #fde8e8);
    color:        var(--erpds-bad-text, #b91c1c);
    border-color: var(--erpds-bad, #ef4444);
}

/* Pill: все обязательные фото загружены */
.erpds-pill--success {
    background:   var(--erpds-ok-soft, #e5f1e6);
    color:        var(--erpds-ok-text, #166534);
    border-color: var(--erpds-ok, #2e8540);
}

.erpds-required-photos-dot {
    position: absolute;
    top: 2px;
    right: 2px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--erpds-bad, #d23f3f);
    box-shadow: 0 0 0 1px rgba(255,255,255,0.6);
    pointer-events: none;
    z-index: 2;
}

/* === UX fix #3 (2026-05-19): button_state .link_dashed indicator ===
   Пунктир отключён блоком исключений выше (.button_state .link_dashed > span).
   Стрелка › — подсказка, что клик откроет диалог (комментарий/hold/инвентарь). */
.button_state .link_dashed,
.button_state .link_dashed:hover,
.button_state .link_dashed:active,
.button_state .link_dashed:focus {
    text-decoration: none;
}
.button_state .link_dashed::after {
    content: "›";
    display: inline-block;
    margin-left: 4px;
    font-weight: 600;
    color: var(--erpds-text, currentColor);
    opacity: 0.85;
    transform: translateY(-1px);
}

/* ===== Sticky левое меню (десктоп): не уезжает вверх при скролле ===== */
/* Высоту топбара пишет JS в --wn-topbar-h (BodyHtml::templatePageMain), 48px — fallback. */
@media (min-width: 901px) {
    /* Снимаем sticky-ловушку: overflow-y:auto делает #page_container314 scroll-контекстом,
       из-за чего position:sticky у потомков не цепляется к вьюпорту и тихо не работает.
       Вертикально контейнер не скроллит (высота по контенту), горизонтально
       #main_content{min-width:0} не даёт распирания — overflow:visible безопасен. */
    #page_container314 {
        overflow: visible;
    }
    #aside_left {
        position: sticky;
        top: var(--wn-topbar-h, 48px);
        max-height: calc(100vh - var(--wn-topbar-h, 48px));
        overflow-y: auto;
        /* Вертикальный скроллбар съедает ~15px ширины → пункты (≈300px) дают
           паразитный горизонтальный скролл. Меню вбок скроллить не нужно. */
        overflow-x: hidden;
        overscroll-behavior: contain;
    }
}

/* ===== Быстрый фильтр пунктов меню (инжектится JS в BodyHtml) ===== */
#aside_left .wn-menu-filter {
    margin: 8px 10px;
}
#aside_left .wn-menu-filter input {
    width: 100%;
    box-sizing: border-box;
    height: 34px;
    padding: 0 12px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: 8px;
    background: var(--erpds-surface, #fff);
    color: var(--erpds-text, #1a1a1e);
    font-size: 13px;
}
#aside_left .wn-menu-filter input::placeholder {
    color: var(--erpds-text-muted, #8A93A2);
}
#aside_left .wn-menu-filter input:focus-visible {
    outline: 2px solid var(--erpds-accent, #2563eb);
    outline-offset: 1px;
}
#aside_left nav ul li.wn-filter-hidden {
    display: none !important;
}
/* Форс-разворот секции при совпадении во вложенных пунктах (перебивает inline display:none) */
#aside_left nav ul.wn-filter-expand {
    display: block !important;
}

/* --- R1: баннер-итог массовой смены статуса (post-apply receipt) --- */
.group_action_result {
    margin: 0 0 14px;
    padding: 12px 16px;
    border: 1px solid transparent;
    border-left: 4px solid var(--erpds-warn, #B26B00);
    border-radius: var(--erpds-radius, 12px);
    background: var(--erpds-warn-soft, #FBEFD9);
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
    color: var(--erpds-text, #0F172A);
    font-size: 13px;
    line-height: 1.5;
}
.group_action_result.is-ok {
    border-left-color: var(--erpds-ok, #2E8540);
    background: var(--erpds-ok-soft, #DEF1E3);
}
.group_action_result_title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--erpds-text-muted, #64748B);
    margin-bottom: 4px;
}
.group_action_result_summary {
    font-weight: 600;
}
.group_action_result_summary .ok {
    color: var(--erpds-ok-text, #1C5A2C);
}
.group_action_result_summary .warn {
    color: var(--erpds-warn-text, #7A4A00);
}
.group_action_result_skipped {
    margin: 8px 0 0;
    padding-left: 0;
    list-style: none;
}
.group_action_result_skipped li {
    padding: 3px 0;
    border-top: 1px solid var(--erpds-border-faint, rgba(15,23,42,0.06));
    white-space: pre-line; /* photo-причина приходит многострочной (\n) */
}
.group_action_result_skipped li:first-child {
    border-top: 0;
}
.group_action_result_skipped a {
    color: var(--erpds-accent-text, #2D4AC7);
    text-decoration: none;
    font-weight: 600;
}
.group_action_result_skipped a:hover {
    text-decoration: underline;
}
.group_action_result_skipped .more {
    color: var(--erpds-text-muted, #64748B);
    font-style: italic;
}

/* === Workflow Graph Viewer === */

.wf-graph-section {
    margin-bottom: 10px;
}

.wf-graph-toggle {
    margin-bottom: 8px;
}

.wf-graph-container {
    display: none;
    border: 1px solid var(--erpds-border, #e0e0e0);
    border-radius: 6px;
    background: var(--erpds-surface, #fff);
    min-height: 100px;
    padding: 12px;
    color: var(--erpds-text-faint, #888);
    overflow: hidden;
}

.wf-graph-svg {
    display: block;
    width: 100%;
}

.wf-graph-toolbar {
    margin-bottom: 8px;
}

.wf-stub:hover {
    text-decoration: underline;
}

/* Полноэкранная карта цепочки заданий */
.wf-chain-overlay {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    flex-direction: column;
    background: var(--erpds-surface, #fff);
    min-width: 760px;
}

.wf-chain-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid var(--erpds-border, #e0e0e0);
    flex: 0 0 auto;
}

.wf-chain-title {
    font-weight: 600;
    color: var(--erpds-text, #1f2430);
}

.wf-chain-body {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.wf-chain-graph {
    flex: 1;
    min-width: 0;
    position: relative;
    overflow: hidden;
}

.wf-chain-side {
    width: 320px;
    flex-shrink: 0;
    overflow-y: auto;
    border-left: 1px solid var(--erpds-border, #d0d5dd);
    display: flex;
    flex-direction: column;
    background: var(--erpds-surface, #fff);
}

.wf-chain-svg {
    display: block;
    width: 100%;
    height: 100%;
}

.wf-chain-depth {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
    margin-right: 16px;
    color: var(--erpds-text-faint, #888);
    font-size: 13px;
}

.wf-depth-val {
    min-width: 14px;
    text-align: center;
    font-weight: 600;
    color: var(--erpds-text, #1f2430);
}

.wf-chain-depth-ctl {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: 12px;
}

/* Подсветка ребра при наведении — сигнал интерактивности */
.wf-chain-edge--hot {
    stroke: var(--erpds-info, #2563eb) !important;
    stroke-width: 2.5 !important;
}

/* Hover узла: гасим всё, подсвечиваем инцидентные связи и узлы */
.wf-chain-dim .wf-chain-edge,
.wf-chain-dim .wf-chain-node { opacity: 0.18; transition: opacity 120ms ease; }
.wf-chain-dim .wf-chain-edge--lit { opacity: 1; stroke-width: 2.5; }
.wf-chain-dim .wf-chain-node--hot { opacity: 1; }

/* Легенда + кнопка «Вписать» */
.wf-chain-legend {
    position: absolute;
    left: 16px;
    bottom: 14px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 8px 12px;
    background: var(--erpds-surface, #fff);
    border: 1px solid var(--erpds-border, #e0e0e0);
    border-radius: 8px;
    font-size: 12px;
    color: var(--erpds-text-faint, #666);
    box-shadow: 0 2px 8px rgba(0,0,0,.08);
}

.wf-leg { display: inline-flex; align-items: center; gap: 6px; }
.wf-leg::before { content: ''; width: 14px; height: 3px; border-radius: 2px; background: currentColor; }
.wf-leg--cur { color: var(--erpds-info, #2563eb); }
.wf-leg--cur::before { width: 12px; height: 12px; border-radius: 3px; }
.wf-leg--down { color: var(--erpds-ok, #16a34a); }
.wf-leg--up { color: var(--erpds-warn, #d97706); }

.wf-chain-fit { margin-left: 4px; }

.wf-chain-stats {
    margin-left: 12px;
    font-size: 12px;
    color: var(--erpds-text-faint, #888);
    white-space: nowrap;
}

/* Состояния загрузки/ошибки карты */
.wf-chain-state {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 100%;
    color: var(--erpds-text-faint, #888);
    font-size: 14px;
}

.wf-chain-state--err { color: var(--erpds-error, #C0392B); }

/* Шапка боковой панели */
.wf-chain-side-head {
    padding: 12px 16px;
    border-bottom: 1px solid var(--erpds-border, #d0d5dd);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

.wf-side-title {
    flex: 1;
    font-size: 13px;
    font-weight: 600;
    color: var(--erpds-text, #1f2430);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wf-side-settings,
.wf-side-back,
.wf-side-root {
    font-size: 12px;
    flex-shrink: 0;
}

/* Секции боковой панели */
.wf-chain-side-section {
    padding: 10px 16px 4px;
}

.wf-chain-side-sec-title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 6px;
}

.wf-chain-side-section--down .wf-chain-side-sec-title {
    color: var(--erpds-ok, #16a34a);
}

.wf-chain-side-section--up .wf-chain-side-sec-title {
    color: var(--erpds-warn, #d97706);
}

.wf-chain-side-row {
    padding: 6px 8px;
    font-size: 12px;
    color: var(--erpds-text, #1f2430);
    border-radius: 4px;
    cursor: pointer;
    margin-bottom: 2px;
    line-height: 1.4;
}

.wf-chain-side-row:hover,
.wf-chain-side-row:focus {
    background: var(--erpds-surface-hover, #f3f4f6);
    outline: none;
}

.wf-chain-side-row:focus-visible {
    outline: 2px solid var(--erpds-info, #2563eb);
    outline-offset: 1px;
}

.wf-chain-side-empty {
    padding: 4px 8px;
    font-size: 12px;
    color: var(--erpds-text-faint, #6b7280);
    font-style: italic;
}

.wf-chain-side-truncated {
    padding: 8px 16px;
    font-size: 11px;
    color: var(--erpds-warn, #d97706);
    border-top: 1px solid var(--erpds-border, #d0d5dd);
    margin-top: auto;
}

/* Responsive: вертикальная укладка на узких экранах */
@media (max-width: 760px) {
    .wf-chain-overlay { min-width: unset; }
    .wf-chain-body {
        flex-direction: column;
    }
    .wf-chain-side {
        width: 100%;
        max-height: 40vh;
        border-left: none;
        border-top: 1px solid var(--erpds-border, #d0d5dd);
    }
}

.wf-spinner {
    width: 18px;
    height: 18px;
    border: 2px solid var(--erpds-border, #d0d5dd);
    border-top-color: var(--erpds-info, #2563eb);
    border-radius: 50%;
    animation: wf-spin 0.7s linear infinite;
}

@keyframes wf-spin { to { transform: rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
    .wf-spinner { animation-duration: 2s; }
}

/* --- Task list hero: create button --- */
.task-list-hero { display: flex; align-items: center; justify-content: flex-end; padding: 8px 12px 4px; }

/* Refine C: контекст-шапка отфильтрованного по типу журнала — крошка слева + CTA справа (карточка-listhdr) */
.task-list-hero--context {
    justify-content: space-between;
    gap: 8px;
    margin: 6px 0 2px;
    padding: 9px 11px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: 10px;
    background: var(--erpds-bg-1, #fff);
}
.task-list-hero__crumb {
    font-size: 13px;
    color: var(--erpds-text-muted, #525A66);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.task-list-hero__crumb b { color: var(--erpds-text, #0F172A); font-weight: 700; }

.task-list-hero__btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 14px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--erpds-ok, #2E8540);
    background: transparent;
    border: 1px solid var(--erpds-ok, #2E8540);
    text-decoration: none;
    cursor: pointer;
    list-style: none;
    transition: background 0.15s, color 0.15s;
}
.task-list-hero__btn:hover,
.task-list-hero__picker[open] > .task-list-hero__btn {
    background: var(--erpds-ok, #2E8540);
    color: var(--erpds-text-on-accent, #fff);
    text-decoration: none;
}
.task-list-hero__btn:focus-visible {
    outline: 2px solid var(--erpds-ok, #2E8540);
    outline-offset: 2px;
}

.task-list-hero__picker { position: relative; }
.task-list-hero__picker summary::-webkit-details-marker { display: none; }

.task-list-hero__dropdown {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    left: auto;
    z-index: 200;
    min-width: 180px;
    max-height: 320px;
    overflow-y: auto;
    background: var(--erpds-surface, #fff);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: 6px;
    box-shadow: var(--erpds-shadow, 0 4px 12px rgba(0,0,0,.10));
    padding: 4px 0;
    display: flex;
    flex-direction: column;
}
.task-list-hero__item {
    padding: 7px 14px;
    font-size: 13px;
    color: var(--erpds-text, #0F172A);
    text-decoration: none;
    white-space: nowrap;
}
.task-list-hero__item:hover {
    background: var(--erpds-surface-2, #F6F7F9);
    color: var(--erpds-ok, #2E8540);
}

/* Mobile Bottom Tab Bar ----------------------------------------- */
.erpds-mobile-tab-bar {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60px;
    background: var(--erpds-surface, #ffffff);
    border-top: 1px solid var(--erpds-border, #e2e8f0);
    z-index: 10000;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    box-shadow: 0 -2px 10px rgba(0,0,0,0.05);
}

@media (max-width: 900px) {
    .erpds-mobile-tab-bar {
        display: flex;
        justify-content: space-around;
        align-items: stretch;
    }
    
    body.has-mobile-tab-bar {
        padding-bottom: calc(60px + env(safe-area-inset-bottom, 0px)) !important;
    }

    /* Поднимаем старую плавающую кнопку Наверх выше Tab Bar */
    #to_top {
        bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important;
    }

    /* Скрываем верхнюю кнопку меню, т.к. она дублируется в Tab Bar */
    #mobile_menu_open_btn {
        display: none !important;
    }

    /* Скрываем кнопку закрытия меню в сайдбаре, чтобы поднять пункты выше */
    #mobile_menu_close_btn {
        display: none !important;
    }

    /* Убираем отступ сверху у логотипа в мобильном меню, раз кнопки закрытия нет */
    #aside_left #menuLogo {
        margin-top: 0;
        padding-top: 8px;
    }
}

.erpds-tab-item {
    box-sizing: border-box;
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    color: var(--erpds-text-muted, #64748b);
    gap: 4px;
    padding: 4px 2px 3px;
    transition: color 0.2s;
    -webkit-tap-highlight-color: transparent;
}

.erpds-tab-item i {
    font-size: 20px;
}

.erpds-tab-icon-wrap {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.erpds-tab-badge {
    box-sizing: border-box;
    position: absolute;
    top: -8px;
    right: -12px;
    background: var(--erpds-error, #ef4444);
    color: #ffffff;
    font-size: 10px;
    font-weight: 700;
    min-height: 18px;
    padding: 2px 5px 1px;
    border-radius: 10px;
    min-width: 18px;
    text-align: center;
    border: 2px solid var(--erpds-surface, #ffffff);
    line-height: 13px;
}

.erpds-tab-item span {
    display: block;
    max-width: 100%;
    font-size: 10px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.erpds-tab-item.is-active {
    color: var(--erpds-accent, #4f46e5);
    background: color-mix(in srgb, var(--erpds-accent, #4f46e5) 8%, transparent);
    box-shadow: inset 0 3px 0 var(--erpds-accent, #4f46e5);
}

.erpds-tab-item:active {
    background: rgba(0,0,0,0.03);
}

.erpds-tab-item:focus-visible {
    outline: 2px solid var(--erpds-accent, #4f46e5);
    outline-offset: -4px;
}

/* === Profile Page Improvements === */

.erpds-profile-page {
    width: min(100%, 1180px);
    margin: 0 auto;
    padding: 0 0 88px;
}

.erpds-profile-topbar {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
}

.erpds-profile-topbar--secondary {
    margin-top: -2px;
}

.erpds-profile-back-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 32px;
    padding: 6px 10px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: 8px;
    background: var(--erpds-surface, #FFFFFF);
    color: var(--erpds-accent-text, #125d88);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: 0;
    text-decoration: none;
    transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}

.erpds-profile-back-link:hover {
    border-color: var(--erpds-accent, #1871a5);
    background: var(--erpds-accent-soft, #deedf5);
    color: var(--erpds-accent-hover, #125d88);
    text-decoration: none;
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
}

.erpds-profile-back-link:focus-visible {
    outline: 2px solid var(--erpds-focus, #1871a5);
    outline-offset: 2px;
}

.erpds-profile-page .label_h3_hr {
    margin: 20px 0 8px;
    padding: 0 0 7px;
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
    color: var(--erpds-text, #0F172A);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0;
}

.erpds-profile-page .erpds-card.table_block {
    margin: 0 0 14px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: 8px;
    background: var(--erpds-surface, #FFFFFF);
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
    overflow: hidden;
}

.erpds-profile-page .erpds-card.table_block .item:not([style*="display:none"]):not([style*="display: none"]) {
    grid-template-columns: minmax(180px, 260px) minmax(0, 1fr);
    column-gap: 16px;
    align-items: center;
    min-height: 42px;
    border-bottom-color: var(--erpds-border, #DDE1E8);
    transition: background-color 0.14s ease;
}

.erpds-profile-page .erpds-card.table_block .item:not([style*="display:none"]):not([style*="display: none"]):hover {
    background: var(--erpds-surface-2, #F6F7F9);
}

.erpds-profile-page .erpds-card.table_block .item > div {
    padding: 8px 12px;
}

.erpds-profile-page .erpds-card.table_block .left_data {
    max-width: none !important;
    color: var(--erpds-text-muted, #525A66);
    font-weight: 600;
    text-align: right;
}

.erpds-profile-page .erpds-card.table_block .item > div:not(.left_data) {
    color: var(--erpds-text, #0F172A);
    line-height: 1.45;
}

.erpds-profile-page .erpds-card.table_block input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin: 0 5px 0 10px;
    vertical-align: -3px;
    accent-color: var(--erpds-accent, #1871a5);
    cursor: pointer;
}

.erpds-profile-page .erpds-card.table_block input[type="checkbox"]:first-child {
    margin-left: 0;
}

.erpds-profile-page .erpds-card.table_block .input_box {
    width: min(100%, 360px);
}

/* Profile Section Accordion */
.erpds-profile-section {
    background: var(--erpds-surface, #ffffff);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: 8px;
    margin: 16px 0;
    overflow: hidden;
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
}

.erpds-profile-section__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    background: var(--erpds-bg-2, #F2F4F7);
    cursor: pointer;
    transition: background-color 0.2s ease;
    user-select: none;
    min-height: 48px;
}

.erpds-profile-section__header:hover {
    background: var(--erpds-border, #DDE1E8);
}

.erpds-profile-section__title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 600;
    font-size: 15px;
    color: var(--erpds-text, #0F172A);
}

.erpds-profile-section__title i {
    color: var(--erpds-accent, #1871a5);
    font-size: 16px;
}

.erpds-profile-section__counter {
    background: var(--erpds-accent-soft, #deedf5);
    color: var(--erpds-accent-text, #125d88);
    font-size: 12px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: var(--erpds-radius-pill, 999px);
    margin-left: 8px;
}

.erpds-profile-section__toggle {
    background: none;
    border: none;
    padding: 4px;
    cursor: pointer;
    color: var(--erpds-text-muted, #525A66);
    transition: transform 0.2s ease;
    border-radius: 6px;
}

.erpds-profile-section__toggle:hover {
    background: rgba(15, 23, 42, 0.06);
}

.erpds-profile-section__toggle.is-open {
    transform: rotate(180deg);
}

.erpds-profile-section__content {
    display: none;
    padding: 16px;
}

.erpds-profile-section__content.is-open {
    display: block;
}

/* Groups Toolbar */
.erpds-profile-groups-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 0 12px;
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
    margin-bottom: 12px;
    flex-wrap: wrap;
}

.erpds-profile-search {
    position: relative;
    flex: 0 0 min(320px, 100%);
    margin-left: auto;
}

.erpds-profile-search input {
    width: 100%;
    height: 38px;
    padding: 8px 12px 8px 34px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: var(--erpds-radius-sm, 8px);
    background: var(--erpds-surface, #FFFFFF);
    color: var(--erpds-text, #0F172A);
    font-size: 13px;
    line-height: 20px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.erpds-profile-search input:focus {
    outline: none;
    border-color: var(--erpds-accent, #1871a5);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--erpds-accent, #1871a5) 14%, transparent);
}

.erpds-profile-search i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--erpds-text-faint, #6B7280);
    font-size: 14px;
    pointer-events: none;
}

/* Groups List */
.erpds-profile-groups-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 8px;
    max-height: 400px;
    overflow-y: auto;
    padding-right: 4px;
}

.erpds-profile-groups-list::-webkit-scrollbar {
    width: 6px;
}

.erpds-profile-groups-list::-webkit-scrollbar-track {
    background: var(--erpds-bg-2, #F2F4F7);
    border-radius: 3px;
}

.erpds-profile-groups-list::-webkit-scrollbar-thumb {
    background: var(--erpds-border-strong, #C4CAD4);
    border-radius: 3px;
}

/* Checkbox Styles */
.erpds-profile-checkbox,
.erpds-profile-checkbox--master {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: var(--erpds-radius-sm, 8px);
    cursor: pointer;
    transition: all 0.15s ease;
    font-size: 14px;
    color: var(--erpds-text, #0F172A);
}

.erpds-profile-checkbox:hover,
.erpds-profile-checkbox--master:hover {
    background: var(--erpds-bg-2, #F2F4F7);
}

.erpds-profile-checkbox.is-checked {
    background: var(--erpds-accent-soft, #deedf5);
}

.erpds-profile-checkbox--master {
    font-weight: 600;
    background: var(--erpds-bg-2, #F2F4F7);
    padding: 12px 14px;
}

.erpds-profile-checkbox input[type="checkbox"],
.erpds-profile-checkbox--master input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: var(--erpds-accent, #1871a5);
}

.erpds-profile-checkbox.is-hidden {
    display: none;
}

/* Mobile Adaptations */
@media (max-width: 768px) {
    .erpds-profile-section__header {
        padding: 12px 14px;
    }

    .erpds-profile-section__title {
        font-size: 14px;
    }

    .erpds-profile-section__content {
        padding: 12px;
    }

    .erpds-profile-groups-toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .erpds-profile-search {
        flex: 0 0 auto;
        width: 100%;
        max-width: 100%;
        margin-left: 0;
    }

    .erpds-profile-groups-list {
        grid-template-columns: 1fr;
        max-height: 300px;
    }

    .erpds-profile-checkbox,
    .erpds-profile-checkbox--master {
        padding: 12px;
    }
}

@media (max-width: 480px) {
    .erpds-profile-section {
        margin: 12px 0;
        border-radius: var(--erpds-radius-sm, 8px);
    }

    .erpds-profile-section__counter {
        font-size: 11px;
        padding: 2px 8px;
    }

    .erpds-profile-groups-list {
        max-height: 250px;
    }
}

/* === Task Table Improvements === */

/* Tasks Toolbar */
.erpds-profile-tasks-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 0;
    margin-bottom: 12px;
    flex-wrap: wrap;
    border-bottom: 1px solid var(--erpds-border, #DDE1E8);
}

.erpds-profile-tasks-toolbar__label {
    font-weight: 600;
    color: var(--erpds-text-muted, #525A66);
    font-size: 14px;
    margin-right: 8px;
}

.erpds-profile-btn--small {
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 500;
    background: var(--erpds-bg-2, #F2F4F7);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: var(--erpds-radius-xs, 4px);
    cursor: pointer;
    transition: all 0.15s ease;
    color: var(--erpds-text-muted, #525A66);
}

.erpds-profile-btn--small:hover {
    background: var(--erpds-accent-soft, #deedf5);
    border-color: var(--erpds-accent, #1871a5);
    color: var(--erpds-accent-text, #125d88);
}

/* Table Wrapper for horizontal scroll */
.erpds-profile-table-wrapper {
    overflow-x: auto;
    max-width: 100%;
    border-radius: var(--erpds-radius-sm, 8px);
    border: 1px solid var(--erpds-border, #DDE1E8);
}

.erpds-profile-table-wrapper::-webkit-scrollbar {
    height: 8px;
}

.erpds-profile-table-wrapper::-webkit-scrollbar-track {
    background: var(--erpds-bg-2, #F2F4F7);
}

.erpds-profile-table-wrapper::-webkit-scrollbar-thumb {
    background: var(--erpds-border-strong, #C4CAD4);
    border-radius: 4px;
}

.erpds-profile-table-wrapper::-webkit-scrollbar-thumb:hover {
    background: var(--erpds-border-strongest, #9AA3AF);
}

.erpds-profile-table-wrapper .table_data {
    margin: 0;
    min-width: 800px;
}

.erpds-profile-table-wrapper .erpds-profile-task-rights-table {
    width: 100%;
    min-width: 860px;
    table-layout: fixed;
    margin: 0;
    border-collapse: collapse;
}

.erpds-profile-table-wrapper .erpds-profile-task-rights-table thead td:first-child,
.erpds-profile-table-wrapper .erpds-profile-task-rights-table tbody td:first-child {
    width: auto;
    min-width: 300px;
    max-width: none;
}

.erpds-profile-table-wrapper .erpds-profile-task-rights-table thead td:not(:first-child),
.erpds-profile-table-wrapper .erpds-profile-task-rights-table tbody td:not(:first-child) {
    width: 72px;
    min-width: 72px;
    max-width: 72px;
    text-align: center;
}

/* Task Name Styling */
.erpds-task-name {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Table Header Hints */
.erpds-profile-col-hint {
    cursor: help;
    color: var(--erpds-accent, #1871a5);
    font-size: 14px;
}

.erpds-profile-col-hint i {
    font-size: 14px;
}

/* Table Checkbox */
.erpds-profile-table-checkbox {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 4px;
    border-radius: var(--erpds-radius-xs, 4px);
    transition: background-color 0.15s ease;
}

.erpds-profile-table-checkbox:hover {
    background: var(--erpds-accent-soft, #deedf5);
}

.erpds-profile-table-checkbox input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: var(--erpds-accent, #1871a5);
}

/* Sticky First Column */
.erpds-profile-table-wrapper .table_data tr td:first-child,
.erpds-profile-table-wrapper .table_data tr th:first-child {
    position: sticky;
    left: 0;
    background: var(--erpds-surface, #FFFFFF);
    z-index: 10;
    min-width: 200px;
    max-width: 280px;
    box-shadow: 2px 0 4px rgba(0,0,0,0.05);
}

.erpds-profile-table-wrapper .table_data tr th:first-child {
    background: var(--erpds-bg-2, #F2F4F7);
    z-index: 11;
}

/* Improve table header */
.erpds-profile-table-wrapper .table_data thead th {
    background: var(--erpds-bg-2, #F2F4F7);
    font-weight: 600;
    font-size: 13px;
    color: var(--erpds-text-muted, #525A66);
    padding: 12px 8px;
    position: sticky;
    top: 0;
    z-index: 5;
}

.erpds-profile-table-wrapper .erpds-profile-task-rights-table thead td {
    background: var(--erpds-bg-2, #F2F4F7);
    font-weight: 600;
    font-size: 12px;
    color: var(--erpds-text-muted, #525A66);
    padding: 10px 8px;
    vertical-align: middle;
}

.erpds-profile-table-wrapper .erpds-profile-task-rights-table thead td:first-child {
    padding-left: 32px;
    text-align: left;
}

.erpds-profile-table-wrapper .table_data tbody td {
    padding: 8px;
    vertical-align: middle;
}

.erpds-profile-table-wrapper .erpds-profile-task-rights-table tbody td {
    padding: 8px;
    vertical-align: middle;
}

.erpds-profile-table-wrapper .erpds-profile-task-rights-table tbody td:first-child {
    padding-left: 32px;
}

/* Mobile Adaptations for Task Table */
@media (max-width: 768px) {
    .erpds-profile-tasks-toolbar {
        gap: 6px;
    }

    .erpds-profile-tasks-toolbar__label {
        width: 100%;
        margin-bottom: 4px;
    }

    .erpds-profile-btn--small {
        padding: 5px 10px;
        font-size: 11px;
    }

    .erpds-task-name {
        max-width: 180px;
    }

    .erpds-profile-table-wrapper .table_data {
        min-width: 700px;
    }

    .erpds-profile-table-wrapper .table_data tr td:first-child,
    .erpds-profile-table-wrapper .table_data tr th:first-child {
        min-width: 160px;
        max-width: 180px;
    }
}

@media (max-width: 480px) {
    .erpds-profile-table-wrapper {
        border-radius: 0;
        border-left: none;
        border-right: none;
        margin: 0 -12px;
    }

    .erpds-profile-tasks-toolbar {
        padding: 8px 0;
    }

    .erpds-task-name {
        max-width: 140px;
        font-size: 13px;
    }

    .erpds-profile-table-checkbox input[type="checkbox"] {
        width: 20px;
        height: 20px;
    }
}

/* === Profile Page Mobile Improvements === */

/* Improve touch targets for checkboxes on mobile */
@media (max-width: 768px) {
    .erpds-profile-section {
        margin: 12px 0;
    }

    .erpds-profile-section__header {
        min-height: 48px;
    }

    /* Larger checkboxes for touch */
    .erpds-profile-checkbox input[type="checkbox"],
    .erpds-profile-checkbox--master input[type="checkbox"] {
        width: 22px;
        height: 22px;
        min-width: 22px;
        min-height: 22px;
    }

    .erpds-profile-checkbox,
    .erpds-profile-checkbox--master {
        padding: 12px 14px;
        min-height: 48px;
    }

    /* Better spacing in groups list */
    .erpds-profile-groups-list {
        gap: 6px;
        max-height: 350px;
    }

    /* Improve table checkbox touch targets */
    .erpds-profile-table-checkbox {
        min-width: 44px;
        min-height: 44px;
    }

    .erpds-profile-table-checkbox input[type="checkbox"] {
        width: 22px;
        height: 22px;
    }
}

@media (max-width: 480px) {
    /* Even larger touch targets on small screens */
    .erpds-profile-checkbox,
    .erpds-profile-checkbox--master {
        padding: 14px 12px;
    }

    .erpds-profile-checkbox input[type="checkbox"],
    .erpds-profile-checkbox--master input[type="checkbox"] {
        width: 24px;
        height: 24px;
    }

    .erpds-profile-groups-list {
        max-height: 280px;
    }

    /* Ensure text doesn't overflow */
    .erpds-profile-checkbox span,
    .erpds-profile-checkbox--master span {
        word-break: break-word;
        line-height: 1.4;
    }

    /* Improve section headers */
    .erpds-profile-section__title {
        flex-wrap: wrap;
        gap: 6px;
    }

    .erpds-profile-section__counter {
        margin-left: 0;
    }

    /* Table improvements for very small screens */
    .erpds-profile-table-wrapper .table_data tbody td {
        font-size: 13px;
    }

    .erpds-task-name {
        max-width: 120px;
    }
}

/* Prevent horizontal scroll on profile page */
.erpds-profile-section,
.erpds-profile-table-wrapper {
    max-width: 100vw;
    box-sizing: border-box;
}

/* Improve form buttons at the bottom */
.erpds-profile-form-actions {
    padding: 14px 0 0;
    margin: 20px 0 0;
    border-top: 1px solid var(--erpds-border, #DDE1E8);
}

.erpds-profile-form-actions .div_center {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin: 0;
    padding: 0;
}

.erpds-profile-form-actions #submit_or_id,
.erpds-profile-form-actions [id^="submit_or_id"] {
    color: var(--erpds-text-faint, #6B7280);
    font-size: 12px;
}

.erpds-profile-form-actions [id^="linkCancelId"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 6px 10px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: 8px;
    background: var(--erpds-surface, #FFFFFF);
    color: var(--erpds-text-muted, #525A66);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0;
    text-decoration: none;
}

.erpds-profile-form-actions [id^="linkCancelId"]:hover {
    border-color: var(--erpds-border-strong, #C4CAD4);
    background: var(--erpds-bg-2, #F2F4F7);
    color: var(--erpds-text, #0F172A);
    text-decoration: none;
}

.erpds-profile-danger-zone {
    margin: 12px 0 0;
    padding: 12px;
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: 8px;
    background: var(--erpds-surface, #FFFFFF);
}

@media (max-width: 768px) {
    .erpds-profile-page {
        padding-bottom: 24px;
    }

    .erpds-profile-page .erpds-card.table_block .item:not([style*="display:none"]):not([style*="display: none"]) {
        grid-template-columns: 1fr;
        row-gap: 3px;
        align-items: start;
    }

    .erpds-profile-page .erpds-card.table_block .left_data {
        text-align: left;
        padding-bottom: 0;
    }

    .erpds-profile-page .erpds-card.table_block .item > div:not(.left_data) {
        padding-top: 2px;
    }

    .erpds-profile-form-actions {
        margin: 0;
        padding: 14px 0 0;
    }
}

@media (max-width: 480px) {
    .erpds-profile-form-actions {
        padding: 12px;
    }

    .erpds-profile-form-actions .div_center {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .erpds-profile-form-actions input[type="submit"],
    .erpds-profile-form-actions button,
    .erpds-profile-form-actions a {
        width: 100%;
        text-align: center;
        justify-content: center;
    }

    .erpds-profile-form-actions #submit_or_id,
    .erpds-profile-form-actions [id^="submit_or_id"] {
        display: none;
    }
}

/* Центр уведомлений (Ф1): колокол + бейдж + выпадающая панель. */
.notify-feed__bell {
    position: relative; display: inline-flex; align-items: center; justify-content: center;
    min-width: 44px; min-height: 44px; padding: 0; background: none; border: 0; cursor: pointer;
    color: inherit;
    /* Перенос колокола в правый край userbar-флекса: по умолчанию это первый
       ребёнок (слева от поиска). order:100 ставит его последним, margin-left:auto
       прижимает к правой группе (регион/тема/юзер/выход). */
    order: 100;
    margin-left: auto;
    border-radius: var(--erpds-radius-sm, 8px);
    transition: background-color .12s ease;
}
.notify-feed__bell:hover { background: rgba(255,255,255,0.12); }
.notify-feed__bell:focus-visible { outline: 2px solid var(--erpds-focus, #2563B8); outline-offset: 2px; }
.notify-feed__badge {
    position: absolute; top: 4px; right: 4px; min-width: 16px; height: 16px;
    padding: 0 4px; border-radius: 8px; background: var(--erpds-danger, #c0392b);
    color: #fff; font-size: 10px; line-height: 16px; text-align: center; font-weight: 700;
}
/* Пульс колокола при WS-инкременте: класс has-unread навешивает JS
   (notifyFeedBadgeIncrement), снимает при markSeen. Анимация на бейдже —
   привлекает внимание к новому, не дёргая весь топбар. */
.notify-feed__bell.has-unread .notify-feed__badge {
    animation: notifyBadgePulse 1.6s ease-in-out 3;
    transform-origin: center;
}
@keyframes notifyBadgePulse {
    0%, 100% { transform: scale(1); }
    25%      { transform: scale(1.28); }
    50%      { transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
    .notify-feed__bell.has-unread .notify-feed__badge { animation: none; }
}
.notify-feed__panel {
    position: absolute; top: var(--wn-topbar-h, 48px); right: 8px; width: 360px; max-width: calc(100vw - 16px);
    max-height: 70vh; overflow-y: auto; z-index: 1000;
    background: var(--erpds-surface, #fff); border: 1px solid var(--erpds-border, #e2e8f0);
    border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,.18);
}
.notify-feed__list { list-style: none; margin: 0; padding: 0; }
.notify-feed__header { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 11px 14px; background: var(--erpds-surface, #fff); border-bottom: 1px solid var(--erpds-border, #DDE1E8); }
.notify-feed__title { font-weight: 600; font-size: 13px; color: var(--erpds-text, #0F172A); }
.notify-feed__close { background: none; border: 0; cursor: pointer; font-size: 20px; line-height: 1; padding: 2px 7px; border-radius: var(--erpds-radius-sm, 8px); color: var(--erpds-text-faint, #6B7280); transition: background-color .12s ease, color .12s ease; }
.notify-feed__close:hover { background: var(--erpds-surface-2, #F6F7F9); color: var(--erpds-text, #0F172A); }
.notify-feed__close:focus-visible { outline: 2px solid var(--erpds-focus, #2563B8); outline-offset: 2px; }
.notify-feed__item {
  --sev: var(--erpds-info, #2563B8);
  --sev-tint: var(--erpds-info-soft, #E0EAF6);
  display: grid;
  grid-template-columns: 28px 1fr;
  grid-auto-rows: min-content;
  column-gap: 10px;
  padding: 11px 14px;
  border-bottom: 1px solid var(--erpds-border, #DDE1E8);
  transition: background-color .12s ease;
}
.notify-feed__item:hover { background: var(--erpds-surface-2, #F6F7F9); }
.notify-feed__item::before {
  content: "";
  grid-column: 1;
  grid-row: 1 / span 2;
  align-self: start;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 50%, var(--sev) 0 3.5px, transparent 4px),
    var(--sev-tint);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--sev) 22%, transparent);
}
.notify-feed__item.oper-notify--critical {
  --sev: var(--erpds-bad, #B62A26);
  --sev-tint: var(--erpds-bad-soft, #F5DDD9);
  background: color-mix(in srgb, var(--erpds-bad, #B62A26) 4%, transparent);
}
.notify-feed__item.oper-notify--critical:hover {
  background: color-mix(in srgb, var(--erpds-bad, #B62A26) 8%, transparent);
}
.notify-feed__item.oper-notify--low {
  --sev: var(--erpds-text-faint, #6B7280);
  --sev-tint: var(--erpds-surface-2, #F6F7F9);
}
@media (prefers-reduced-motion: reduce) { .notify-feed__item { transition: none; } }
.notify-feed__body { grid-column: 2; grid-row: 2; overflow-wrap: anywhere; font-size: 13px; line-height: 1.45; color: var(--erpds-text, #0F172A); }
.notify-feed__body :is(b, strong) { font-weight: 600; }
.notify-feed__body a { overflow-wrap: anywhere; }
/* Лента: embedded тёмная попап-карточка (промо/системные — не звонок/не task) ВЛИВАЕТСЯ в строку —
   убираем chrome (рамка/фон/тень/радиус), чтобы тело читалось плоско как у звонка/задачи (без card-in-card).
   Скоуп строго .notify-feed__body → живой попап #oper_notify_id не затрагивается.
   Токены --erpds-* → dark mode адаптируется через style_dark.css. */
.notify-feed__body .oper_notify_msg,
.notify-feed__body .oper_notify_msg.employee_notify_task_new_comment,
.notify-feed__body .oper_notify_msg.employee_notify_task_employee_assignment {
  background: transparent;
  color: var(--erpds-text, #0F172A);
  box-shadow: none;
  border: 0;
  border-radius: 0;
}
.notify-feed__body .oper_notify_msg:hover { background: transparent; }
.notify-feed__body .oper_notify_msg_body_text,
.notify-feed__body .oper-notify-phone,
.notify-feed__body .oper_notify_msg_ico_href { color: var(--erpds-text, #0F172A); }
.notify-feed__body .oper_notify_msg_title,
.notify-feed__body .oper_notify_msg_time,
.notify-feed__body .oper_notify_msg_ico_time { color: var(--erpds-text-faint, #6B7280); }
.notify-feed__body .oper_notify_body_label,
.notify-feed__body .oper_notify_msg_text a { color: var(--erpds-info, #2563B8); }
.notify-feed__body .oper_notify_msg_text a:hover { color: var(--erpds-info-strong, #1D4ED8); }
.notify-feed__body .oper_notify_msg_meta { border-bottom-color: var(--erpds-border, #DDE1E8); }
.notify-feed__body .oper-notify-action {
  background: var(--erpds-surface-3, #ECEFF3);
  color: var(--erpds-text, #0F172A);
  border-color: var(--erpds-border, #DDE1E8);
}
/* Мёртвый close-крестик в ленте (бьёт в несуществующий id попапа → no-op) — убрать. */
.notify-feed__body .oper_notify_close { display: none; }
/* Снять попап-сайзинг (min-height:62px рассчитан на живой #oper_notify_id) → компактнее в ленте. */
.notify-feed__body .oper_notify_msg { min-height: 0; }
.notify-feed__body .oper_notify_msg_text { min-height: 0; padding: 0; gap: 3px; }
.notify-feed__when { grid-column: 2; grid-row: 1; font-size: 11px; color: var(--erpds-text-faint, #6B7280); font-variant-numeric: tabular-nums; margin-bottom: 3px; }
.notify-feed__empty,
.notify-feed__loading { padding: 24px; text-align: center; color: var(--erpds-muted, #888); }
.notify-feed__error { padding: 8px 12px; font-size: 12px; color: var(--erpds-danger, #C0392B); text-align: center; }
.notify-feed__more {
  display: block; width: 100%; padding: 10px; font-size: 12px;
  border: 0; border-top: 1px solid var(--erpds-border, #DDE1E8);
  background: var(--erpds-surface, #fff); color: var(--erpds-accent, #2563B8);
  cursor: pointer; text-align: center; font-weight: 600;
  transition: background-color .12s ease;
}
.notify-feed__more:hover { background: var(--erpds-surface-2, #F6F7F9); }
.notify-feed__more:focus-visible { outline: 2px solid var(--erpds-focus, #2563B8); outline-offset: -2px; }
.notify-feed__more:disabled { opacity: .6; cursor: default; }
.notify-feed__item--unread { background: var(--erpds-info-soft, #E0EAF6); }
.notify-feed__item--unread:hover { background: var(--erpds-info-soft, #E0EAF6); }

/* Компактная строка фида (звонок): сбрасываем grid+padding базового item,
   чтобы ::before-кружок не рендерился, а строка-кнопка владела своей разметкой. */
.notify-feed__item--compact { display: block; padding: 0; }
.notify-feed__item--compact::before { content: none; }
.notify-feed__row {
  display: flex; align-items: center; gap: 8px; width: 100%;
  margin: 0; border: 0; background: none; cursor: pointer; text-align: start;
  padding: 11px 14px; font: inherit; color: var(--erpds-text, #0F172A);
  transition: background-color .12s ease;
}
.notify-feed__row:hover { background: var(--erpds-surface-2, #F6F7F9); }
.notify-feed__task-link { text-decoration: none; color: var(--erpds-text, #0F172A); }
.notify-feed__task-link:hover .notify-feed__name { text-decoration: underline; }
.notify-feed__row:focus-visible { outline: 2px solid var(--erpds-focus, #2563B8); outline-offset: -2px; }
@media (prefers-reduced-motion: reduce) { .notify-feed__row { transition: none; } }
.notify-feed__type-icon { flex: 0 0 auto; font-size: 15px; line-height: 1; color: var(--erpds-text-faint, #6B7280); }
.notify-feed__name {
  flex: 1 1 auto; min-width: 0; font-size: 13px; font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.notify-feed__tag-new {
  margin-right: 6px; padding: 0 5px; border-radius: var(--erpds-radius-sm, 8px);
  font-size: 10px; font-weight: 600; text-transform: uppercase;
  background: var(--erpds-info-soft, #E0EAF6); color: var(--erpds-info, #2563B8);
  vertical-align: 1px;
}
.notify-feed__row .notify-feed__when {
  flex: 0 0 auto; grid-column: auto; grid-row: auto; margin: 0;
}
.notify-feed__dot {
  flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%;
  background: var(--erpds-info, #2563B8);
}
.notify-feed__count {
  margin-left: 6px; padding: 0 6px; border-radius: var(--erpds-radius-sm, 8px);
  font-size: 11px; font-weight: 600;
  background: var(--erpds-surface-3, #ECEFF3); color: var(--erpds-text-2, #5A6472);
  vertical-align: 1px;
}
.notify-feed__detail {
  padding: 0 14px 12px;
}
.notify-feed__detail[hidden] { display: none; }
.notify-feed__burst-item + .notify-feed__burst-item {
  margin-top: 10px; padding-top: 10px;
  border-top: 1px solid var(--erpds-border, #E3E7EC);
}

/* aside collapse toggle — desktop only */
#aside_collapse_btn { display: none; }
@media (min-width: 901px) {
    #aside_collapse_btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        margin: 4px 4px 4px auto;
        border: 0;
        background: none;
        color: var(--erpds-text-secondary, #6b7280);
        cursor: pointer;
    }
    #aside_collapse_btn:hover { color: var(--erpds-text, #111827); }
}

@media (min-width: 901px) {
    body.aside-collapsed .journal-quick-links {
        justify-content: center;
        padding-left: 10px;
        padding-right: 10px;
    }
    body.aside-collapsed .journal-quick-create {
        width: 44px;
        min-width: 44px;
        padding: 0 !important;
        gap: 0;
    }
    body.aside-collapsed .journal-quick-create__label {
        display: none;
    }
    /* === Свёрнутый рельс сайдбара === */
    #aside_left { transition: width .2s ease, min-width .2s ease; }

    body.aside-collapsed #aside_left {
        width: 64px;
        min-width: 64px;
        /* #aside_left (position:sticky) — собственный stacking context; без подъёма
           z-index fixed-popout (z:10000) внутри него рендерится НИЖЕ контента дашборда
           (карточки перекрывают меню). Поднимаем контекст рельса выше контента и
           sticky-топбара (900), ниже центра уведомлений (9999). Рельс top:48px —
           с топбаром визуально не пересекается. */
        z-index: 901;
    }

    /* Сжать внутреннюю цепочку до ширины рельса, иначе центрированная иконка
       уезжает за 64px и клипается overflow-x:hidden у #aside_left */
    body.aside-collapsed #aside_left nav,
    body.aside-collapsed #aside_left nav > ul,
    body.aside-collapsed #aside_left nav > ul > li,
    body.aside-collapsed #aside_left nav > ul > li > a {
        width: 64px;
        min-width: 0;
        max-width: 64px;
        box-sizing: border-box;
    }
    /* Task/Map header-таблица и её ячейка — тоже в 64px */
    body.aside-collapsed #aside_left nav > ul > li .journal-header-table,
    body.aside-collapsed #aside_left nav > ul > li .journal-header-table td.journal-title-cell,
    body.aside-collapsed #aside_left nav > ul > li td a.i0 {
        width: 64px;
        max-width: 64px;
        box-sizing: border-box;
    }

    /* Скрыть текст разделов (голая текст-нода после <p>), оставить иконку по центру */
    body.aside-collapsed #aside_left nav > ul > li > a {
        position: relative;
        padding-left: 0;
        padding-right: 0;
        text-align: center;
        white-space: nowrap;
        overflow: hidden;
        font-size: 0;
    }
    body.aside-collapsed #aside_left nav > ul > li > a .us-icon-lmenu {
        margin: 0 auto;
        float: none;
        display: block;
        font-size: 18px !important;
        line-height: 1 !important;
    }
    body.aside-collapsed #aside_left nav > ul > li > a > font,
    body.aside-collapsed #aside_left nav > ul > li > a > span {
        display: none;
    }

    /* B2: Task/Map header-таблица в рельсе: только иконка, без текста/бейджей */
    body.aside-collapsed #aside_left nav > ul > li .journal-header-table,
    body.aside-collapsed #aside_left nav > ul > li .journal-header-table tr,
    body.aside-collapsed #aside_left nav > ul > li .journal-header-table tbody {
        display: block;
        width: 100%;
    }
    body.aside-collapsed #aside_left nav > ul > li .journal-header-table td:not(.journal-title-cell) {
        display: none !important;
    }
    body.aside-collapsed #aside_left nav > ul > li .journal-header-table td.journal-title-cell {
        display: block;
        width: 100%;
        padding: 0;
        text-align: center;
    }
    body.aside-collapsed #aside_left nav > ul > li td a.i0 {
        display: block;
        text-align: center;
        font-size: 0;
    }
    body.aside-collapsed #aside_left nav > ul > li td a.i0 .us-icon-lmenu {
        margin: 0 auto;
        float: none;
        display: block;
        font-size: 18px !important;
        line-height: 1 !important;
    }

    /* B7: Скрыть chevron-указатель раскрытия в свёрнутом рельсе */
    body.aside-collapsed #aside_left nav > ul > li > a.i0::after,
    body.aside-collapsed #aside_left nav > ul > li > button.i0::after,
    body.aside-collapsed #aside_left nav > ul > li td a.i0::after {
        display: none !important;
        content: '' !important;
    }

    /* DESIGN: Active-section accent-bar + тинт иконки (carry-over).
       Активный раздел верхнего уровня помечается классом .active на <li>
       (см. #aside_left nav ul li.active ... + JS click_left_menu);
       .is-active используется только на journal-внутренних ссылках. */
    body.aside-collapsed #aside_left nav > ul > li.active > a,
    body.aside-collapsed #aside_left nav > ul > li.active > a.i0,
    body.aside-collapsed #aside_left nav > ul > li.active td a.i0 {
        box-shadow: inset 3px 0 0 0 var(--erpds-accent, #0854a0);
    }
    body.aside-collapsed #aside_left nav > ul > li.active > a .us-icon-lmenu,
    body.aside-collapsed #aside_left nav > ul > li.active > .journal-header-table .us-icon-lmenu {
        color: var(--erpds-accent, #0854a0);
    }
    body.aside-collapsed #aside_left nav > ul > li.aside-popout-open > a,
    body.aside-collapsed #aside_left nav > ul > li.aside-popout-open td a.i0 {
        background: var(--erpds-hover, rgba(8,84,160,.10));
    }
    body.aside-collapsed #aside_left nav > ul > li > a:hover,
    body.aside-collapsed #aside_left nav > ul > li > a:focus-visible,
    body.aside-collapsed #aside_left nav > ul > li td a.i0:hover,
    body.aside-collapsed #aside_left nav > ul > li td a.i0:focus-visible {
        background: var(--erpds-hover, rgba(8,84,160,.10));
    }
    body.aside-collapsed #aside_left nav > ul > li > a:focus-visible,
    body.aside-collapsed #aside_left nav > ul > li td a.i0:focus-visible {
        outline: 2px solid var(--erpds-accent, #0854a0);
        outline-offset: -2px;
    }
    body.aside-collapsed #aside_left nav > ul > li > a,
    body.aside-collapsed #aside_left nav > ul > li td a.i0 {
        min-height: 40px;
        align-items: center;
    }
}

@media (min-width: 901px) {
    /* В рельсе секционные <ul> скрыты по умолчанию. JS открывает popout inline-стилем
       display:block (бьёт это правило без !important). Без этого активная секция на
       своей странице (её <ul> рендерится без inline display:none) висит пустой белой
       полоской-капсулой справа от иконки. */
    body.aside-collapsed #aside_left nav > ul > li > ul {
        display: none;
    }
    /* === Popout под-пунктов в свёрнутом рельсе (B1: !important бьёт :2974) === */
    body.aside-collapsed #aside_left nav ul li > ul {
        position: fixed;
        left: 64px;
        min-width: 240px;
        max-height: calc(100vh - var(--wn-topbar-h, 48px));
        overflow-y: auto;
        font-size: 14px;
        margin-left: 0 !important;
        border-left: none !important;
        background: var(--erpds-surface, #ffffff) !important;
        border-top: 1px solid var(--erpds-border, #e5e7eb);
        border-right: 1px solid var(--erpds-border, #e5e7eb);
        border-bottom: 1px solid var(--erpds-border, #e5e7eb);
        border-radius: 6px !important;
        box-shadow: 0 8px 24px rgba(0, 0, 0, .18) !important;
        padding: 6px 0 !important;
        z-index: 10000;
    }
    body.aside-collapsed #aside_left nav ul li > ul a {
        white-space: nowrap;
    }
    /* паритет hover/focus строк popout (светлая тема) */
    body.aside-collapsed #aside_left nav ul li > ul a:hover {
        background: var(--erpds-hover, rgba(8,84,160,.10));
    }
    body.aside-collapsed #aside_left nav ul li > ul a:focus-visible {
        outline: 2px solid var(--erpds-accent, #1871a5);
        outline-offset: -2px;
    }
}

@media (max-width: 640px) {
    .qcreate {
        width: 100%;
        max-height: 82vh;
        padding: 14px;
    }
    .qcreate__title {
        font-size: 17px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .journal-quick-create,
    .qcreate__row,
    .qcreate__close,
    .qcreate__retry {
        transition: none !important;
    }
    .journal-quick-create:active {
        transform: none;
    }
}

/* --- Drag-and-drop календаря задач --- */
.erpds-calendar-draggable { cursor: grab; }
.erpds-calendar-dragging { opacity: 0.4; }
/* Перетаскиваемый клон: размер фиксируется JS по оригиналу; здесь только вид «летящей» карты. */
.erpds-calendar-drag-helper { cursor: grabbing; box-shadow: 0 6px 18px rgba(0,0,0,0.28); opacity: 0.92; pointer-events: none; }
/* Целевая ячейка под курсором — заметная заливка + рамка, чтобы видеть куда ляжет. */
.erpds-calendar-drop-hover { outline: 2px solid var(--erpds-info, #2563eb); outline-offset: -2px; background: var(--erpds-info-bg, rgba(37,99,235,0.14)); box-shadow: inset 0 0 0 9999px rgba(37,99,235,0.06); }
.erpds-calendar-pending { opacity: 0.6; pointer-events: none; }
.erpds-calendar-flash { box-shadow: 0 0 0 2px var(--erpds-ok, #2E8540); transition: box-shadow 0.3s; }
.erpds-calendar-mode-overlay { position: fixed; inset: 0; z-index: 10001; background: rgba(0,0,0,0.35); display: flex; align-items: center; justify-content: center; }
.erpds-calendar-mode-dialog { background: var(--erpds-surface, #fff); border-radius: 8px; padding: 16px; min-width: 280px; display: flex; flex-direction: column; gap: 8px; }
.erpds-calendar-mode-title { font-weight: 600; margin-bottom: 4px; }

/* --- Density toggle button --- */
.calendar-toolbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding: 6px 0;
}

.calendar-toolbar__dept,
.calendar-toolbar__filter,
.calendar-toolbar__nav {
    float: none;
    display: inline-flex;
    align-items: center;
    padding: 0;
    margin: 0;
}

.calendar-toolbar__filter,
.calendar-toolbar__nav {
    margin-left: 14px;
    padding-left: 14px;
    border-left: 1px solid var(--erpds-border, #e1e4e8);
}

.calendar-toolbar__filter br {
    display: none;
}

.calendar-toolbar__dept a {
    display: inline-flex;
    align-items: center;
    height: 30px;
}

.calendar-toolbar__dept table {
    border-collapse: collapse;
    border-spacing: 0;
}

.calendar-toolbar__dept select {
    height: 30px;
    padding: 2px 8px;
    max-width: 220px;
    min-width: 140px;
}

.calendar-toolbar__dept table td:first-child {
    padding: 0 4px 0 0 !important;
}

.calendar-toolbar__dept table td:last-child {
    padding: 0 0 0 4px !important;
}

.calendar-toolbar__nav {
    gap: 8px;
    padding-right: 8px;
    margin-right: 8px;
}

.calendar-toolbar__nav a {
    padding: 4px;
}

.calendar-toolbar__nav #linkDayId,
.calendar-toolbar__nav #linkMonthId,
.calendar-toolbar__nav #linkWeekId,
.calendar-toolbar__nav .btn-cal-density {
    display: inline-flex;
    align-items: center;
    height: 28px;
    padding: 4px 10px;
    border: 1px solid var(--erpds-border, #d0d7de);
    border-radius: 6px;
    font-size: 13px;
    color: var(--erpds-text, #24292f);
    background: var(--erpds-surface, #fff);
    text-decoration: none;
    margin-left: 0;
}

.btn-cal-density {
    display: inline-flex;
    align-items: center;
    padding: 2px 10px;
    font-size: 0.85em;
    line-height: 1.6;
    border: 1px solid var(--erpds-border, #d1d5db);
    border-radius: 4px;
    background: var(--erpds-surface, #fff);
    color: var(--erpds-text, #374151);
    cursor: pointer;
    margin-left: 8px;
    vertical-align: middle;
}
.btn-cal-density:hover {
    background: var(--erpds-surface-hover, #f3f4f6);
}
.btn-cal-density[aria-pressed="true"] {
    background: var(--erpds-info-bg, rgba(37,99,235,0.10));
    border-color: var(--erpds-info, #2563eb);
    color: var(--erpds-info, #2563eb);
}

.calendar-axis-switch {
    display: inline-flex;
    align-items: stretch;
    margin-left: 8px;
    border: 1px solid var(--erpds-border, #d1d5db);
    border-radius: 6px;
    overflow: hidden;
    vertical-align: middle;
}

.calendar-axis-switch__option {
    min-height: 28px;
    padding: 3px 10px;
    border: 0;
    border-right: 1px solid var(--erpds-border, #d1d5db);
    background: var(--erpds-surface, #fff);
    color: var(--erpds-text, #374151);
    cursor: pointer;
    font-size: 0.85em;
    line-height: 1.4;
}

.calendar-axis-switch__option:last-child {
    border-right: 0;
}

.calendar-axis-switch__option:hover {
    background: var(--erpds-surface-hover, #f3f4f6);
}

.calendar-axis-switch__option[aria-pressed="true"] {
    background: var(--erpds-info-bg, rgba(37,99,235,0.10));
    color: var(--erpds-info, #2563eb);
    font-weight: 600;
}

.calendar-axis-switch__option:focus-visible {
    position: relative;
    z-index: 1;
    outline: 2px solid var(--erpds-info, #2563eb);
    outline-offset: -2px;
}

@media (max-width: 700px) {
    .calendar-toolbar__nav {
        flex-basis: 100%;
        flex-wrap: wrap;
        gap: 6px;
        margin: 6px 0 0;
        padding-left: 0;
        border-left: 0;
    }

    .calendar-axis-switch {
        margin-left: 0;
    }
}

/* --- Calendar compact (chip) mode --- */
.calendar_all_wrapper.is-compact .calendar_item_element .erpds-calendar-task-card {
    min-height: 32px;
    padding: 3px 8px;
    display: flex;
    align-items: flex-start;
    gap: 6px;
    white-space: normal;
    overflow: hidden;
    flex-direction: row;
}
/* Flatten head row: status-icon stays inline */
/* display:flex вместо display:contents — на старых движках contents выкидывает
   элемент и его детей (статусную иконку) из дерева доступности */
.calendar_all_wrapper.is-compact .calendar_item_element .erpds-cal-head {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}
/* Keep status icon visible and inline */
.calendar_all_wrapper.is-compact .calendar_item_element .erpds-cal-status-ico {
    flex-shrink: 0;
}
/* Time: bold, no wrap */
.calendar_all_wrapper.is-compact .calendar_item_element .erpds-cal-time {
    font-weight: 700;
    flex-shrink: 0;
}
/* Type dot only — hide text label */
.calendar_all_wrapper.is-compact .calendar_item_element .erpds-cal-type {
    flex-shrink: 0;
    font-size: 0;
}
.calendar_all_wrapper.is-compact .calendar_item_element .erpds-cal-type-dot {
    font-size: initial;
    flex-shrink: 0;
}
/* Address: до 2 строк, чтобы адрес влезал (было — один ellipsis-ряд, обрезалось).
   overflow-wrap:break-word (не anywhere) — anywhere учитывается в min-content
   таблицы (table-layout:auto) и схлопывает узкие колонки-сотрудники в 0px. */
.calendar_all_wrapper.is-compact .calendar_item_element .erpds-cal-addr {
    flex: 1;
    min-width: 64px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space: normal;
    overflow-wrap: break-word;
}
/* Meta: keep visible (photo dot, comment count), no wrap */
.calendar_all_wrapper.is-compact .calendar_item_element .erpds-cal-meta {
    flex-shrink: 0;
    white-space: nowrap;
}
/* Badge просрочки в компактном чипе: крошечный one-line индикатор, не ломает строку.
   Скрываем текстовую подпись (font-size:0), оставляем только иконку — решение критично, badge виден. */
.calendar_all_wrapper.is-compact .calendar_item_element .erpds-cal-overdue {
    flex-shrink: 0;
    gap: 0;
    padding: 1px 4px;
    font-size: 0;
}
.calendar_all_wrapper.is-compact .calendar_item_element .erpds-cal-overdue .us-icon {
    font-size: 11px;
}
/* Hide tag row in compact — recoverable via card tap */
.calendar_all_wrapper.is-compact .calendar_item_element .erpds-cal-tag,
.calendar_all_wrapper.is-compact .calendar_item_element .erpds-cal-tag-more {
    display: none;
}

/* Полная карточка не должна вылезать за ширину колонки: перенос адреса */
.calendar_all_wrapper .calendar_item_element .erpds-calendar-task-card {
    max-width: 100%;
    box-sizing: border-box;
}
.calendar_all_wrapper:not(.is-compact) .calendar_item_element .erpds-cal-addr {
    white-space: normal;
    overflow-wrap: break-word;
}

/* === Мобильный «мой день» для календаря ===
   ВАЖНО: правила тут, в style.css (грузится на всех порталах), а не в
   style_mobile.css — последний НЕ подключается на оператор-портале, где
   живёт календарь, поэтому мобильный вид там не применялся.
   Брейкпоинт 700px (не 900px) намеренно: телефоны получают одноколоночный
   вид «мой день»; планшеты (701-900px) сохраняют многоколоночную сетку. */
@media screen and (max-width: 700px) {
    .calendar_all_wrapper {
        overflow-x: hidden;
    }
    .calendar_all {
        width: 100% !important;
        table-layout: fixed;
    }
    .calendar_all .calendar_header_date:first-child,
    .calendar_all td:first-child {
        width: 48px;
        min-width: 48px;
        font-size: 11px;
        padding: 2px 4px;
    }
    /* Один мастер / «мой день»: час-колонка (td#1) + первая колонка-день
       (td#2), остальные дни (td#3+) скрыты. :first-of-type не годится —
       первый td это час-ячейка, а не calendar_day_col, поэтому ни один
       day_col не первый и пряталось ВСЁ. */
    .calendar_all .calendar_header th:nth-of-type(n+3),
    .calendar_all tr td.calendar_item_element:nth-of-type(n+3) {
        display: none;
    }
    .calendar_all td.calendar_item_element:nth-of-type(2) {
        width: auto;
    }
    .calendar_all .calendar_item_element {
        min-height: 44px;
        padding: 4px 6px;
        vertical-align: top;
    }
    .calendar_all .calendar_item_element .erpds-calendar-task-card {
        width: 100%;
        box-sizing: border-box;
        min-height: 44px;
        font-size: 13px;
        padding: 6px 8px;
        margin-bottom: 4px;
    }
    /* Адрес: не обрезать на мобиле — места достаточно. */
    .calendar_all_wrapper.is-compact .calendar_item_element .erpds-cal-addr {
        white-space: normal;
        overflow: visible;
        text-overflow: unset;
    }
    .calendar_all .calendar_item_element .erpds-cal-meta {
        flex-wrap: wrap;
    }
    /* Badge просрочки — всегда виден (title не работает на touch). */
    .calendar_all .calendar_item_element .erpds-cal-overdue {
        display: inline-flex;
    }
}

/* ============================================================
   Поповер фильтра «Типы заданий» в календаре.
   Эталон стиля — #region_select (см. выше в этом файле).
   ============================================================ */
.calendar-toolbar__filter.tt-filter { position: relative; }

.tt-filter .tt-popover {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 1000;
    width: max-content;
    min-width: 260px;
    max-width: min(480px, calc(100vw - 32px));
    padding: 8px;
    background-color: var(--erpds-surface, #fff);
    color: var(--erpds-text, #0F172A);
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: var(--erpds-radius, 12px);
    box-shadow: var(--erpds-shadow, 0 12px 32px -12px rgba(15,23,42,0.22));
    animation: erpds-find-pop 140ms cubic-bezier(0.16, 1, 0.3, 1);
}

.tt-filter .tt-popover select {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    max-height: min(60vh, 420px);
    border: none;
    outline: none;
}

.tt-popover select::-webkit-scrollbar { width: 6px; }
.tt-popover select::-webkit-scrollbar-thumb {
    background: var(--erpds-border-strong, #C4CAD4);
    border-radius: 3px;
}
.tt-popover select::-webkit-scrollbar-track { background: transparent; }

.tt-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    margin-left: 6px;
    padding: 0 5px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    border-radius: 9px;
    background: var(--erpds-accent-soft, #E5EAFB);
    color: var(--erpds-accent-text, #2D4AC7);
}

@media (prefers-reduced-motion: reduce) {
    .tt-popover { animation: none; }
}

/* ===== Дашборд заданий — стиль под систему (erpds-токены) ===== */
#dashboardCardsWrapper { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-start; padding: 4px 0; }

/* Карточка: нейтральная поверхность вместо легаси-розового _work */
#dashboardCardsWrapper .j_dashboard_card_wrap { position: relative; display: block; float: none; margin: 0; }
#dashboardCardsWrapper .j_mywork_div,
#dashboardCardsWrapper .j_dashboard_card_wrap .j_mywork_div {
    float: none !important;
    margin: 0 !important;
    min-width: 220px;
    max-width: none !important;
    text-align: left;
    background: var(--erpds-surface, #FFFFFF) !important;
    color: var(--erpds-text, #0F172A) !important;
    border: 1px solid var(--erpds-border, #DDE1E8);
    border-radius: var(--erpds-radius, 12px);
    box-shadow: var(--erpds-shadow-sm, 0 1px 2px rgba(15,23,42,0.04));
    padding: 14px 16px !important;
    transition: box-shadow .15s ease, border-color .15s ease;
}
#dashboardCardsWrapper .j_mywork_div:hover { box-shadow: var(--erpds-shadow, 0 1px 3px rgba(15,23,42,0.06)); border-color: var(--erpds-border-strong, #C4CAD4); }
#dashboardCardsWrapper .j_mywork_div_caption { font-size: 15px; font-weight: 600; color: var(--erpds-text, #0F172A); margin-bottom: 6px; }
#dashboardCardsWrapper .j_mywork_div_counter { padding: 0 0 8px; font-size: 26px; font-weight: 700; color: var(--erpds-accent, #1871a5); }
#dashboardCardsWrapper .j_mywork_div_counter a { color: var(--erpds-accent, #1871a5); text-decoration: none; }
/* счётчик-пилюля и панель списка: базовый #fff хардкод не темнеет — даём surface-2 (инсет в обеих темах) */
#dashboardCardsWrapper .j_mywork_div_counter span { background-color: var(--erpds-surface-2, #F6F7F9); color: var(--erpds-accent, #1871a5); }
#dashboardCardsWrapper .j_mywork_div_counter span:hover { background-color: var(--erpds-surface-3, #eef1f5); }
#dashboardCardsWrapper .j_mywork_div_list { background-color: var(--erpds-surface-2, #F6F7F9); color: var(--erpds-text, #0F172A); }
#dashboardCardsWrapper .j_mywork_div_list table { width: 100%; border-collapse: collapse; }
#dashboardCardsWrapper .j_mywork_div_list td { padding: 3px 0; font-size: 13px; color: var(--erpds-text-muted, #525A66); }
#dashboardCardsWrapper .j_mywork_div_list td:last-child { text-align: right; }
#dashboardCardsWrapper .j_mywork_div_list a { color: var(--erpds-accent-text, #125d88); text-decoration: none; font-weight: 600; }
#dashboardCardsWrapper .j_mywork_div_list a:hover { text-decoration: underline; }
/* семантические чипы: id-специфичность .j_mywork_div_list a НЕ должна затирать red_link */
#dashboardCardsWrapper .j_mywork_div_list a.red_link {
    color: #fff; background-color: var(--erpds-bad-bg-strong, #B62A26);
    padding: 1px 6px; border-radius: 3px; font-weight: 700;
}
#dashboardCardsWrapper .j_mywork_div_list a.red_link:hover { color: #fff; text-decoration: none; opacity: .85; }
#dashboardCardsWrapper .j_mywork_div_list a.red_link2 { color: var(--erpds-bad, #B62A26); background: none; font-weight: 700; }
#dashboardCardsWrapper .j_mywork_div_list a.red_link2:hover { text-decoration: underline; }

.erpds-card-view-switch {
    display: flex;
    gap: 6px;
    margin: 0 0 8px;
    padding: 3px;
    border: 1px solid var(--erpds-border, #e5e7eb);
    border-radius: 8px;
    background: var(--erpds-surface-2, #F6F7F9);
}
.erpds-card-view-mode {
    flex: 1 1 0;
    min-width: 0;
    min-height: 34px;
    padding: 7px 10px;
    font-size: 13px;
    line-height: 1.2;
    border-radius: 6px;
    border: 1px solid transparent;
    background: transparent;
    color: var(--erpds-muted, #6b7280);
    cursor: pointer;
}
.erpds-card-view-mode.is-active {
    border-color: var(--erpds-border, #e5e7eb);
    background: var(--erpds-surface, #fff);
    color: var(--erpds-accent, #185fa5);
    font-weight: 600;
}
.erpds-card-view-panel[hidden] {
    display: none !important;
}
@media (max-width: 480px) {
    .erpds-card-view-switch {
        gap: 4px;
        padding: 2px;
    }
    .erpds-card-view-mode {
        min-height: 36px;
        padding: 7px 6px;
        font-size: 12px;
    }
}

.erpds-monteur-modes { display: flex; gap: 6px; margin: 0 0 8px; }
.erpds-monteur-mode {
    flex: 1 1 0;
    min-width: 0;
    padding: 7px 10px;
    font-size: 13px;
    line-height: 1.2;
    border-radius: 8px;
    border: 1px solid var(--erpds-border, #e5e7eb);
    background: transparent;
    color: var(--erpds-muted, #6b7280);
}
.erpds-monteur-mode.is-active {
    background: var(--erpds-bg-accent, #e6f1fb);
    color: var(--erpds-accent, #185fa5);
    font-weight: 500;
}
.erpds-monteur-rows { display: flex; flex-direction: column; }
.erpds-monteur-row {
    position: relative;                 /* контекст для stretched overlay-ссылки */
    display: flex; align-items: flex-start; gap: 8px;
    min-height: 58px; padding: 9px 10px;
    border-bottom: 1px solid var(--erpds-border, #e5e7eb);
    color: var(--erpds-text, #1f2937);
}
.erpds-monteur-rowlink {            /* вся строка кликабельна -> /task/{id} */
    position: absolute; inset: 0; z-index: 1;
}
.erpds-monteur-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.erpds-monteur-title {
    display: flex; align-items: baseline; gap: 6px;
    min-width: 0;
    font-size: 14px; line-height: 1.25; font-weight: 600;
    color: var(--erpds-text, #1f2937);
}
.erpds-monteur-id {
    flex-shrink: 0;
    font-size: 12px; font-weight: 500;
    color: var(--erpds-muted, #6b7280);
}
.erpds-monteur-type {
    min-width: 0;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.erpds-monteur-line1 { display: flex; align-items: center; gap: 8px; min-width: 0; flex-wrap: wrap; }
.erpds-monteur-address {
    font-size: 13px; color: var(--erpds-text, #1f2937);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* Plan 3: интерактивные элементы строки (телефон-в-тап) должны быть position: relative; z-index: 2,
   чтобы лежать выше overlay-ссылки. Голый z-index на static-элементе не сработает. */
.erpds-monteur-call {
    position: relative; z-index: 2;
    flex-shrink: 0; width: 44px; height: 44px;
    display: flex; align-items: center; justify-content: center;
    margin-left: 8px; border-radius: 10px;
    border: 1px solid var(--erpds-border, #e5e7eb);
    color: var(--erpds-accent, #185fa5); text-decoration: none;
}
.erpds-monteur-chip {
    font-size: 12px; padding: 2px 8px; border-radius: 6px;
    background: var(--erpds-chip-bg, #eef2ff); white-space: nowrap;
}
.erpds-monteur-time { font-size: 13px; color: var(--erpds-muted, #6b7280); }
.erpds-monteur-dist { font-size: 12px; color: var(--erpds-muted, #6b7280); margin-left: auto; flex-shrink: 0; }
.erpds-monteur-flags { display: flex; gap: 6px; flex-shrink: 0; }
.erpds-monteur-flags--edge { margin-left: auto; }
.erpds-monteur-empty { padding: 12px; color: var(--erpds-muted, #6b7280); font-size: 14px; }
.erpds-monteur-stale {
    font-size: 12px; padding: 6px 10px;
    background: var(--erpds-bg-warning, #faeeda); color: var(--erpds-text-warning, #854f0b);
    border-radius: 8px; margin: 6px 0;
}
.erpds-monteur-task-stale {
    padding: 8px 12px;
    font-size: 13px;
    background: var(--erpds-warning-bg, #fff8e1);
    color: var(--erpds-warning-fg, #8a6d00);
    border-bottom: 1px solid var(--erpds-warning-border, #ffe08a);
    text-align: center;
}

/* Инструменты карточки */
#dashboardCardsWrapper .j_dashboard_card_tools { position: absolute; top: 8px; right: 10px; display: none; }
#dashboardCardsWrapper .j_dashboard_card_tools a { cursor: pointer; margin-left: 6px; text-decoration: none; font-size: 15px; color: var(--erpds-text-faint, #6B7280); }
#dashboardCardsWrapper .j_dashboard_card_tools a:hover { color: var(--erpds-accent, #1871a5); }
#dashboardCardsWrapper.dashboard-edit-mode .j_dashboard_card_tools { display: block; }
#dashboardCardsWrapper.dashboard-edit-mode .j_dashboard_card_wrap { cursor: grab; }
#dashboardCardsWrapper.dashboard-edit-mode .j_dashboard_card_wrap .j_mywork_div { border-style: dashed; border-color: var(--erpds-accent-soft-hover, #cce0ed); padding-left: 26px !important; }
#dashboardCardsWrapper.dashboard-edit-mode .j_dashboard_card_wrap::before { content: "\2630"; position: absolute; top: 14px; left: 9px; opacity: .5; color: var(--erpds-text-faint, #6B7280); font-size: 13px; }
/* индикатор места вставки при перетаскивании */
#dashboardCardsWrapper .j_dashboard_card_wrap.drag-over { box-shadow: -3px 0 0 0 var(--erpds-accent, #1871a5); }
#dashboardCardsWrapper .j_dashboard_card_wrap.dragging { opacity: .5; }

/* Индикатор активного шаблона */
.j_dashboard_active_tpl { width: 100%; font-weight: 600; font-size: 13px; color: var(--erpds-text-muted, #525A66); margin: 2px 0 4px; }

/* Кнопки-действия как кнопки системы */
#dashboardCardAdd, #dashboardResetLayout, #dashboardConfigure, #dashboardTemplates, #dashboardEditTemplate {
    display: inline-flex; align-items: center; gap: 6px;
    margin: 10px 8px 4px 0; padding: 8px 14px; cursor: pointer;
    font-size: 13px; font-weight: 600; line-height: 1;
    border-radius: var(--erpds-radius-pill, 999px);
    border: 1px solid var(--erpds-border-strong, #C4CAD4);
    background: var(--erpds-surface, #FFFFFF); color: var(--erpds-text, #0F172A);
    text-decoration: none; transition: background .15s ease, border-color .15s ease, color .15s ease;
}
#dashboardCardAdd:hover, #dashboardResetLayout:hover, #dashboardConfigure:hover, #dashboardTemplates:hover, #dashboardEditTemplate:hover {
    border-color: var(--erpds-accent, #1871a5); color: var(--erpds-accent, #1871a5); background: var(--erpds-accent-soft, #deedf5);
}
/* «+ Карточка» — основная кнопка */
#dashboardCardAdd { background: var(--erpds-accent, #1871a5); border-color: var(--erpds-accent, #1871a5); color: var(--erpds-text-on-accent, #FFFFFF); }
#dashboardCardAdd:hover { background: var(--erpds-accent-hover, #125d88); border-color: var(--erpds-accent-hover, #125d88); color: #FFFFFF; }

/* ===== Диалоги редактора (в #dialog_message) ===== */
.dashboard-card-editor, .dte { padding: 18px 20px; min-width: 340px; color: var(--erpds-text, #0F172A); font-size: 14px; }
.dashboard-card-editor .dce__row, .dte .dte__row { margin-bottom: 14px; display: flex; flex-direction: column; gap: 5px; }
.dashboard-card-editor label, .dte label { font-weight: 600; font-size: 13px; color: var(--erpds-text-muted, #525A66); }
.dashboard-card-editor input[type="text"], .dashboard-card-editor input[type="number"], .dashboard-card-editor select,
.dte input[type="text"], .dte input[type="number"], .dte select {
    width: 100%; box-sizing: border-box; padding: 8px 10px; font-size: 14px;
    border: 1px solid var(--erpds-border, #DDE1E8); border-radius: var(--erpds-radius-sm, 8px);
    background: var(--erpds-surface, #FFFFFF); color: var(--erpds-text, #0F172A);
}
.dashboard-card-editor input:focus, .dashboard-card-editor select:focus, .dte input:focus, .dte select:focus {
    outline: none; border-color: var(--erpds-accent, #1871a5); box-shadow: 0 0 0 3px var(--erpds-accent-soft, #deedf5);
}
.dashboard-card-editor select[multiple] { min-height: 120px; }
.dashboard-card-editor .btn, .dte .btn {
    display: inline-flex; align-items: center; padding: 9px 18px; cursor: pointer;
    font-size: 14px; font-weight: 600; border-radius: var(--erpds-radius-sm, 8px); border: none;
    background: var(--erpds-accent, #1871a5); color: var(--erpds-text-on-accent, #FFFFFF);
    transition: background .15s ease;
}
.dashboard-card-editor .btn:hover, .dte .btn:hover { background: var(--erpds-accent-hover, #125d88); }
.dte h3 { font-size: 16px; font-weight: 700; margin: 0 0 12px; }
.dte h4 { font-size: 14px; font-weight: 700; margin: 14px 0 8px; }
.dte hr { border: none; border-top: 1px solid var(--erpds-border, #DDE1E8); margin: 16px 0; }
.dte .dte__tpl { border: 1px solid var(--erpds-border, #DDE1E8); border-radius: var(--erpds-radius-sm, 8px); padding: 10px 12px; margin-bottom: 10px; background: var(--erpds-surface-2, #F6F7F9); }
.dte .dte__tpl-head { display: flex; align-items: center; gap: 8px; }
.dte .dte__scope { color: var(--erpds-text-faint, #6B7280); font-size: 12px; font-weight: 400; }
.dte .dte__tpl-del, .dte .dte__card-del { margin-left: auto; cursor: pointer; color: var(--erpds-text-faint, #6B7280); text-decoration: none; }
.dte .dte__tpl-del:hover, .dte .dte__card-del:hover { color: var(--erpds-danger, #b42318); }
.dte .dte__cards { list-style: none; margin: 8px 0; padding: 0; }
.dte .dte__cards li { display: flex; align-items: center; gap: 6px; padding: 4px 0; font-size: 13px; }
.dte .dte__card-add { display: inline-block; margin-top: 4px; cursor: pointer; color: var(--erpds-accent, #1871a5); font-weight: 600; font-size: 13px; }
.dte .dte__empty { color: var(--erpds-text-faint, #6B7280); font-size: 13px; }

/* Меню «Добавление» на карточке узла — убрать подчёркивание у пунктов */
.node-add-menu a.link_dashed,
.node-add-menu a.link_dashed > span { border-bottom: none; text-decoration: none; }

/* Пустое состояние перехода "Коммутация" с карточки оборудования */
.erpds-commutation-route-empty {
    min-height: 100vh;
    box-sizing: border-box;
    display: grid;
    place-items: start center;
    padding: 64px 16px 24px;
    background: var(--erpds-bg, #f5f7fa);
    color: var(--erpds-text, #0f172a);
    overflow-x: hidden;
}

.erpds-commutation-route-empty__panel {
    width: min(100%, 560px);
    box-sizing: border-box;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--erpds-border, #d9e0ea);
    border-radius: var(--erpds-radius-sm, 8px);
    background: var(--erpds-surface, #fff);
    box-shadow: 0 12px 34px rgba(15, 23, 42, .12);
}

.erpds-commutation-route-empty__icon {
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--erpds-radius-sm, 8px);
    background: var(--erpds-info-soft, #e0eaf6);
    color: var(--erpds-accent, #1871a5);
    font-size: 18px;
}

.erpds-commutation-route-empty__content {
    min-width: 0;
}

.erpds-commutation-route-empty__title {
    margin: 0 0 6px;
    font-size: 18px;
    line-height: 1.25;
    letter-spacing: 0;
    text-wrap: balance;
}

.erpds-commutation-route-empty__text {
    margin: 0;
    color: var(--erpds-text-muted, #525a66);
    font-size: 14px;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.erpds-commutation-route-empty__action {
    width: fit-content;
    min-height: 38px;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    padding: 8px 12px;
    border: 1px solid var(--erpds-accent, #1871a5);
    border-radius: var(--erpds-radius-sm, 6px);
    background: var(--erpds-accent, #1871a5);
    color: var(--erpds-text-on-accent, #fff);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    touch-action: manipulation;
    transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.erpds-commutation-route-empty__action:hover {
    background: var(--erpds-accent-hover, #125d88);
    border-color: var(--erpds-accent-hover, #125d88);
    color: var(--erpds-text-on-accent, #fff);
}

.erpds-commutation-route-empty__action:focus-visible {
    outline: 2px solid var(--erpds-accent, #1871a5);
    outline-offset: 3px;
    box-shadow: 0 0 0 4px var(--erpds-accent-soft, #deedf5);
}

@media (max-width: 520px) {
    .erpds-commutation-route-empty {
        padding: 52px 10px 18px;
    }

    .erpds-commutation-route-empty__panel {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
        padding: 14px;
    }

    .erpds-commutation-route-empty__icon {
        width: 38px;
        height: 38px;
    }

    .erpds-commutation-route-empty__action {
        width: 100%;
        justify-content: center;
    }
}

/* Заметка о неоднозначном индексе в биллинге (карточка абонента) — аддитивно,
   TD address-structure. Info-стиль, не warn: это не ошибка и не блокер для
   работы, ERP уже подставил рабочее значение — просто информация для тех,
   кто позже займётся дублями в биллинге. */
.erpds-address__conflict {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 6px 0;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.3;
    border-radius: 6px;
    background: var(--erpds-info-soft, #E0EAF6);
    color: var(--erpds-info-text, #163E78);
    border: 1px solid var(--erpds-info-border, #AFC7E8);
    border-left: 3px solid var(--erpds-info, #2563B8);
}
.erpds-address__conflict i {
    color: var(--erpds-info, #2563B8);
}