html,
body {
    font-size: .9rem;
    font-family: "Arial", serif;
}

label {
    white-space: nowrap;
}

div, span, input, select, option {
    outline: none !important;
}

.filter-btn{
    font-size: 11px;
    padding: 0.2rem 0.3rem;
}

.no-animate {
    -webkit-transition: none !important;
    transition: none !important;
}

.filter-item {
    margin-right: .25rem !important;
}

.in {
    opacity: 1 !important;
}

.width-10 {
    width: 10px!important;
}

.width-25 {
    width: 25px!important;
}

.width-50 {
    width: 50px!important;
}

.width-70 {
    width: 70px!important;
}

.width-75 {
    width: 75px!important;
}

.width-100 {
    width: 100px!important;
}

.vehicle-name-column {
    min-width: 280px;
}

.vehicle-rfid-column {
    min-width: 90px;
}

.vehicle-imei-column {
    min-width: 150px;
}

.width-200 {
    width: 200px!important;
}

.width-300 {
    width: 300px!important;
}

.width-400 {
    width: 400px!important;
}

.api-server-sync-date {
    display: inline-block;
    padding: 2px 6px;
    border: 1px solid #69bfd1;
    border-radius: 4px;
    background: #e7f7fb;
    color: #064b5a;
    cursor: pointer;
    white-space: nowrap;
}

.api-server-sync-date:hover {
    background: #d1f0f7;
    border-color: #12a2bd;
}

.width-110 {
    width: 110px!important;
}
.width-115 {
    width: 115px!important;
}
.width-120 {
    width: 120px!important;
}

.width-125 {
    width: 125px!important;
}

.w-10 {
    width: 10%!important;
}

.w-15 {
    width: 15%!important;
}

.w-20 {
    width: 20%!important;
}

.height-50 {
    height: 50px!important;
}

.height-70 {
    height: 70px!important;
}

.height-75 {
    height: 75px!important;
}

.height-100 {
    height: 100px!important;
}

.height-200 {
    height: 200px!important;
}

.height-300 {
    height: 300px!important;
}

.height-400 {
    height: 400px!important;
}

#toast-container {
    text-align: left;
}

.table {
    margin-bottom: auto;
}

.white-space-pre {
    white-space: pre;
}

/*
 * Login
 */

.login-body {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    padding-top: 40px;
    padding-bottom: 40px;
    color: var(--app-text);
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #101b2e 0%, #17253a 42%, #eef5fb 42.2%, #f7fbff 100%);
}

.login-body:before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
            linear-gradient(115deg, rgba(45, 168, 223, .28) 0 1px, transparent 1px 130px),
            linear-gradient(25deg, rgba(255, 255, 255, .12) 0 1px, transparent 1px 118px),
            radial-gradient(circle at 18% 24%, rgba(45, 168, 223, .38), transparent 23%),
            radial-gradient(circle at 70% 18%, rgba(22, 196, 214, .18), transparent 24%);
    opacity: .82;
}

.login-body:after {
    content: "";
    position: fixed;
    left: -8vw;
    bottom: -18vh;
    width: 70vw;
    height: 55vh;
    pointer-events: none;
    background:
            repeating-linear-gradient(90deg, rgba(45, 168, 223, .18) 0 1px, transparent 1px 58px),
            repeating-linear-gradient(0deg, rgba(255, 255, 255, .08) 0 1px, transparent 1px 58px);
    transform: perspective(720px) rotateX(62deg) rotateZ(-8deg);
    transform-origin: center;
    opacity: .7;
}

.login-body .card {
    position: relative;
    z-index: 1;
    background-color: var(--app-surface);
    border: 1px solid var(--app-border);
    box-shadow: 0 24px 70px rgba(5, 13, 26, .34), 0 0 0 1px rgba(45, 168, 223, .08);
}

.login-body .card.shadow {
    box-shadow: 0 24px 70px rgba(5, 13, 26, .34), 0 0 0 1px rgba(45, 168, 223, .08) !important;
}

.login-card {
    border-radius: 10px;
}

.login-card:before {
    content: "";
    position: absolute;
    left: 18px;
    right: 18px;
    top: -3px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, #2da8df 0%, #16c4d6 48%, #ffffff 100%);
    opacity: .95;
}

.login-card .card-body {
    position: relative;
    z-index: 1;
}

.login-card .row {
    background: rgba(255, 255, 255, .88);
    backdrop-filter: blur(2px);
}

.login-card img {
    box-shadow: 0 10px 28px rgba(23, 32, 51, .08);
}

/* Мобильная версия страницы входа — один столбец на всю ширину экрана,
   без иллюстрации сбоку (см. login-mobile.html). */
.login-card-mobile {
    border-radius: 10px;
    width: 100%;
    max-width: 420px;
}

.login-card-mobile:before {
    content: "";
    position: absolute;
    left: 18px;
    right: 18px;
    top: -3px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, #2da8df 0%, #16c4d6 48%, #ffffff 100%);
    opacity: .95;
}

.login-card-mobile .card-body {
    position: relative;
    z-index: 1;
}

.login-card-mobile .form-control-lg {
    font-size: 1.05rem;
}

/* ===== Мобильный раздел «Спутниковый мониторинг» и главный экран ===== */

.mobile-app-body {
    background: var(--app-bg);
    min-height: 100vh;
    padding-top: 52px;
}

.mobile-app-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 52px;
    z-index: 20;
    display: flex;
    align-items: center;
    background: var(--app-nav);
    color: #ffffff;
    padding: 0 8px;
}

.mobile-app-bar-btn {
    width: 40px;
    height: 40px;
    border: none;
    background: transparent;
    color: #ffffff;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.mobile-app-bar-title {
    flex: 1;
    text-align: center;
    font-size: 15px;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 0 8px;
}

.mobile-screen {
    padding: 16px;
}

.mobile-screen-centered {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - 52px);
}

/* Главный экран: сетка 2x2 цветных плиток */
.mobile-sections-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 8px;
}

.mobile-section-card {
    border: none;
    border-radius: 14px;
    padding: 24px 12px;
    text-align: center;
    color: #ffffff;
    box-shadow: 0 8px 20px rgba(23, 32, 51, .18);
}

.mobile-section-icon {
    font-size: 28px;
    display: block;
    margin-bottom: 10px;
}

.mobile-section-title {
    font-size: 13px;
    font-weight: 500;
    display: block;
}

.mobile-stub-card {
    text-align: center;
    max-width: 320px;
}

.mobile-stub-icon {
    font-size: 48px;
    color: var(--app-accent);
    margin-bottom: 12px;
    display: block;
}

/* Список объектов мониторинга */
.mobile-monitoring-list {
    padding: 12px;
}

.mobile-list-toolbar-row {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}

.mobile-view-toggle {
    display: flex;
    border: 1px solid var(--app-control-border);
    border-radius: 8px;
    overflow: hidden;
}

.mobile-view-toggle button {
    border: none;
    background: var(--app-surface);
    padding: 8px 12px;
    color: var(--app-text);
}

.mobile-view-toggle button.active {
    background: var(--app-accent);
    color: #ffffff;
}

.mobile-division-select {
    flex: 1;
}

.mobile-object-search {
    width: 100%;
    margin-bottom: 4px;
}

.mobile-list-body {
    margin-top: 8px;
}

.mobile-empty-state {
    text-align: center;
    color: var(--app-text-muted);
    padding: 24px 12px;
    font-size: 14px;
}

.mobile-empty-state i {
    font-size: 28px;
    display: block;
    margin-bottom: 8px;
}

.mobile-object-row {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border: none;
    border-bottom: 1px solid var(--app-border);
    background: var(--app-surface);
    padding: 12px 10px;
    text-align: left;
}

.mobile-object-main {
    min-width: 0;
}

.mobile-object-name {
    font-size: 14px;
    font-weight: 500;
    color: var(--app-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mobile-object-sub {
    font-size: 12px;
    color: var(--app-text-muted);
}

.mobile-object-status {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 17px;
    flex-shrink: 0;
}

.mobile-object-speed {
    font-size: 12px;
    color: var(--app-text-muted);
}

.mobile-group-header {
    padding: 8px 10px;
    font-size: 12px;
    font-weight: 500;
    color: var(--app-text-muted);
    background: var(--app-surface-muted);
}

.mobile-group-count {
    font-weight: 400;
}

/* Карточка объекта: карта + вкладки */
.mobile-object-detail {
    padding: 0;
}

.mobile-map-wrap {
    position: relative;
}

.mobile-object-map {
    width: 100%;
    height: 42vh;
}

.mobile-map-layer-switch {
    position: absolute;
    top: 10px;
    left: 10px;
    display: flex;
    background: rgba(255, 255, 255, .92);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 6px rgba(23, 32, 51, .25);
}

.mobile-map-layer-switch button {
    border: none;
    background: transparent;
    color: var(--app-text-muted);
    width: 32px;
    height: 32px;
    font-size: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mobile-map-layer-switch button.active {
    background: var(--app-accent);
    color: #ffffff;
}

.mobile-track-endpoint-marker {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 500;
    color: #ffffff;
    white-space: nowrap;
    box-shadow: 0 2px 6px rgba(23, 32, 51, .35);
}

.mobile-track-endpoint-start {
    background: #1D9E75;
}

.mobile-track-endpoint-end {
    background: #E24B4A;
}

.mobile-map-distance-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(23, 32, 51, .82);
    color: #ffffff;
    font-size: 12px;
    font-weight: 500;
    padding: 5px 10px;
    border-radius: 999px;
}

.mobile-object-address {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    font-size: 12px;
    color: var(--app-text-muted);
    border-bottom: 1px solid var(--app-border);
}

.mobile-object-coords {
    flex-shrink: 0;
    font-variant-numeric: tabular-nums;
    color: var(--app-text);
}

.mobile-copy-coords-btn {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: transparent;
    color: var(--app-accent);
    font-size: 15px;
    padding: 2px 4px;
    text-decoration: none;
}

.mobile-object-address-text {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mobile-object-address-right {
    text-align: right;
}

.mobile-object-address-loading {
    font-style: italic;
    opacity: .7;
}

.mobile-detail-tabs {
    display: flex;
    border-bottom: 1px solid var(--app-border);
}

.mobile-detail-tabs button {
    flex: 1;
    border: none;
    background: var(--app-surface);
    padding: 12px;
    font-size: 13px;
    color: var(--app-text-muted);
}

.mobile-detail-tabs button.active {
    background: var(--app-accent);
    color: #ffffff;
    font-weight: 500;
}

.mobile-object-sensors, .mobile-object-actions {
    padding: 4px 0 16px;
}

.mobile-sensor-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 14px;
    border-bottom: 1px solid var(--app-border);
    font-size: 13px;
}

.mobile-sensor-name {
    flex: 1;
    color: var(--app-text);
}

.mobile-sensor-value {
    font-weight: 500;
    color: var(--app-text);
}

.mobile-date-strip {
    display: flex;
    gap: 8px;
    padding: 10px 12px;
    overflow-x: auto;
    border-bottom: 1px solid var(--app-border);
}

.mobile-date-strip button {
    flex-shrink: 0;
    border: 1px solid var(--app-control-border);
    border-radius: 16px;
    background: var(--app-surface);
    padding: 6px 14px;
    font-size: 12px;
    color: var(--app-text-muted);
    white-space: nowrap;
}

.mobile-date-strip button.active {
    background: var(--app-accent);
    border-color: var(--app-accent);
    color: #ffffff;
    font-weight: 500;
}

.mobile-action-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 14px;
    border-bottom: 1px solid var(--app-border);
    font-size: 17px;
}

.mobile-action-row .bi-arrow-right-circle-fill {
    color: var(--app-accent);
}

.mobile-action-row .bi-pause-circle-fill {
    color: #888780;
}

.mobile-action-row.active {
    background: var(--app-accent-soft);
}

.mobile-action-main {
    flex: 1;
}

.mobile-action-time {
    font-size: 13px;
    color: var(--app-text);
}

.mobile-action-subtitle {
    font-size: 12px;
    color: var(--app-text-muted);
}

.login-body .form-control {
    color: var(--app-control-text);
    background-color: var(--app-control-bg);
    border-color: var(--app-control-border);
}

.login-body .form-control:focus {
    border-color: var(--app-accent);
    box-shadow: 0 0 0 .2rem var(--app-focus);
}

.login-body a {
    color: var(--app-accent);
}

.btn-primary {
    background-color: var(--app-accent);
    border-color: var(--app-accent);
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--app-accent-hover);
    border-color: var(--app-accent-hover);
}

.form-signin {
    width: 100%;
    max-width: 330px;
    padding: 15px;
    margin: auto;
}

.login-body .lang-select {
    /*word-spacing: 165px;*/
}

.login-body .lang-select option {
    /*word-spacing: 50px;*/
}


/*
 * Sidebar
 */

.sidebar {
    position: relative;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 100;
    padding: 0;
}

.sidebar-sticky {
    position: relative;
    top: 0;
    height: calc(100vh - 48px);
    padding-top: .5rem;
    overflow-x: hidden;
    overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
}

@supports ((position: -webkit-sticky) or (position: sticky)) {
    .sidebar-sticky {
        position: -webkit-sticky;
        position: sticky;
    }
}

/*
 * Navbar
 */

.navbar {
    height: 80px;
    min-width: 1300px;
}

.monitoring-navbar-datepicker-layer {
    position: relative;
    z-index: 2147482000;
    overflow: visible;
}

.monitoring-navbar-datepicker-layer .navbar-collapse,
.monitoring-navbar-datepicker-layer .navbar-nav,
.monitoring-navbar-datepicker-layer .nav-item,
.monitoring-navbar-datepicker-layer .nav-link,
.monitoring-navbar-datepicker-layer .dropdown {
    overflow: visible;
}

.monitoring-navbar-datepicker-layer .dropdown-menu.show {
    display: block !important;
    z-index: 2147482100 !important;
}

#sidebar-wrapper {
    min-height: calc(100vh - 80px);
    margin-left: -15rem;
    -webkit-transition: margin .25s ease-out;
    -moz-transition: margin .25s ease-out;
    -o-transition: margin .25s ease-out;
    transition: margin .25s ease-out;
}

#sidebar-wrapper .sidebar-heading {
    padding: 0.875rem 1.25rem;
    font-size: 1.2rem;
}

#sidebar-wrapper .list-group {
    width: 15rem;
}

#page-content-wrapper {
    min-width: 100vw;
}

#sidebar-wrapper.toggled {
    margin-left: 0 !important;
}

.list-group-item {
    cursor: pointer;
}

.table tr {
    height: 35px;
}

.account-operations-chart .table.table-sm tr {
    height: 23px;
}

.account-operations-chart .table-sm td, .account-operations-chart .table-sm th {
    padding: 0.1rem;
}

.modal-backdrop,
.modal-backdrop.show,
.modal-backdrop.in {
    opacity: 0.3 !important;
    background-color: #000;
}
.card-body .table.table-borderless.account-operations-table{
    white-space: pre-line;
}

.account-operations-table tr {
    white-space: nowrap;
    font-size: 11px;
    height: auto !important;
    cursor: pointer;
}

.account-operations-table td, .account-operations-table th {
    padding: 0.2rem 0.3rem;
}

/* Журнал "План посева" — 9 колонок с итогами, нужен более компактный шрифт, чем
   стандартные 11px account-operations-table (см. запрос пользователя 01.08.2026). */
.sowing-plan-journal-table tr {
    font-size: 10px;
}
.sowing-plan-journal-table td, .sowing-plan-journal-table th {
    padding: 0.15rem 0.25rem;
}

/* Верхняя половина раздела баланса: шапка и панель управления закреплены,
   прокручивается только таблица. Иначе на длинном списке выдач переключатель
   «Графики» уезжал за экран и до него нельзя было добраться. */
.balance-pane {
    display: flex;
    flex-direction: column;
    /* Без явной высоты flex-колонка растёт под содержимое, прокручивается уже вся
       страница, и закреплённая шапка вместе с панелью уезжает наверх. */
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.balance-pane > .balance-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.balance-pane > .balance-toolbar {
    flex: 0 0 auto;
}

/* Панель управления над таблицей баланса: группировка, наборы колонок, плотность. */
.balance-toolbar {
    font-size: 12px;
    border-bottom: 1px solid var(--app-border, rgba(0, 0, 0, .08));
    gap: 6px;
}

.balance-toolbar .bal-label {
    color: var(--app-text-muted, #6c757d);
    font-size: 11.5px;
    margin-right: 6px;
}

/* Сегментированный переключатель: активная секция залита акцентом,
   чтобы текущий режим читался с одного взгляда. */
.bal-seg .btn {
    font-size: 11px;
    padding: 0.12rem 0.6rem;
    border: 1px solid var(--app-border, rgba(0, 0, 0, .15));
    background: var(--app-surface, #fff);
    color: var(--app-text, #212529);
    box-shadow: none;
}

.bal-seg .btn:hover {
    background: rgba(13, 110, 253, .07);
}

.bal-seg .btn.active {
    background: rgba(13, 110, 253, .12);
    border-color: rgba(13, 110, 253, .45);
    color: #0d6efd;
    font-weight: 600;
}

.balance-toolbar .bal-tog {
    font-size: 11.5px;
    cursor: pointer;
    user-select: none;
}

.balance-toolbar .bal-tog input {
    vertical-align: middle;
    margin-right: 4px;
}

/* Шапка нижней панели: одна строка вместо двух рядов заголовочных размеров. */
.balance-local-head {
    font-size: 15px;
    line-height: 1.5;
    padding-top: 6px;
    padding-bottom: 6px;
    flex-wrap: wrap;
}

.balance-local-head .k {
    color: var(--app-text-muted, #6c757d);
    margin-right: 4px;
}

.balance-local-head .v {
    font-weight: 700;
    font-size: 16px;
}

/* Легенда под таблицей. */
.balance-legend {
    font-size: 10.5px;
    color: var(--app-text-muted, #6c757d);
    border-top: 1px solid var(--app-border, rgba(0, 0, 0, .08));
}

.balance-legend .badge {
    font-weight: 600;
}

/* Нижняя панель: отчёт занимает столько, сколько ему нужно, график забирает остаток
   высоты и прижат к низу. При подъёме разделителя растёт именно график. */
.balance-chart-pane,
.balance-chart-pane > .balance-chart-body,
.balance-chart-pane .balance-chart-col {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

.balance-chart-pane .balance-chart-col > * {
    flex: 0 0 auto;
}

.balance-chart-pane .balance-chart-col > .chart-container {
    flex: 1 1 auto;
    min-height: 160px;
}

/* Высоту в inline-стиле проставляет директива element-size; здесь она мешает —
   график должен тянуться за контейнером, а не держать посчитанные когда-то пиксели. */
#chartdiv.chartdiv {
    height: 100% !important;
    min-height: 160px;
}

/* Отчёт по автомобилю из своей базы. Карточка узкая по вертикали: панель открывается
   по клику и должна читаться целиком, без прокрутки. */
.lfr {
    font-size: 11px;
    padding: 4px 8px 8px;
}

.lfr-head {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 6px;
    padding: 2px 0 6px;
}

.lfr-title {
    font-weight: 700;
    font-size: 12.5px;
}

.lfr-sub {
    color: var(--app-text-muted, #6c757d);
}

.lfr-period {
    color: var(--app-text-muted, #6c757d);
}

.lfr-note {
    color: var(--app-text-muted, #6c757d);
    font-size: 10px;
}

/* Легенда графика в шапке: снизу она занимала целую строку. */
.lfr-legend {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-size: 10.5px;
    color: var(--app-text-muted, #6c757d);
}

.lfr-key {
    display: inline-flex;
    align-items: center;
}

.lfr-line {
    display: inline-block;
    width: 14px;
    height: 2px;
    margin-right: 4px;
}

.lfr-line-level {
    background: #6794dc;
}

.lfr-line-can {
    background: #b30000;
}

/* Широкие таблицы прокручиваются внутри себя, страница вбок не едет. */
.lfr-scroll {
    overflow-x: auto;
}

.lfr-table {
    width: 100%;
    border-collapse: collapse;
    background: var(--app-surface, #fff);
}

.lfr-table th,
.lfr-table td {
    border: 1px solid var(--app-border, rgba(0, 0, 0, .12));
    padding: 3px 6px;
    text-align: center;
    white-space: nowrap;
}

.lfr-table th {
    font-weight: 600;
    background: rgba(13, 110, 253, .05);
}

/* Группирующая шапка выделена акцентом: без неё 17 колонок сливаются в кашу. */
.lfr-table .lfr-grp th {
    background: rgba(13, 110, 253, .12);
    color: #0d6efd;
}

.lfr-table td {
    font-variant-numeric: tabular-nums;
}

.lfr-table .lfr-dev {
    color: #c47f00;
    font-weight: 600;
}

/* Заголовок второй таблицы живёт в её первой ячейке — отдельная строка над таблицей
   съедала высоту ради двух слов. Под этой же ячейкой идут даты, подпись им не нужна. */
/* Разделитель между показателями и заправками: две таблицы подряд без него
   читаются как одна с непонятной сменой колонок. */
.lfr-refuels {
    margin-top: 8px;
    border-top: 2px solid rgba(0, 0, 0, .75);
    padding-top: 8px;
}

.lfr-table th.lfr-caption {
    font-weight: 700;
    background: rgba(13, 110, 253, .12);
    color: #0d6efd;
}

.lfr-empty {
    color: var(--app-text-muted, #6c757d);
}

.lfr-pill {
    display: inline-block;
    padding: 0 6px;
    border-radius: 8px;
    font-size: 10px;
    font-weight: 600;
}

.lfr-pill.badge-success {
    background: rgba(25, 135, 84, .15);
    color: #198754;
}

.lfr-pill.badge-warning {
    background: rgba(255, 193, 7, .2);
    color: #997404;
}

.lfr-pill.badge-danger {
    background: rgba(220, 53, 69, .15);
    color: #dc3545;
}

.lfr-warn {
    color: var(--app-text-muted, #6c757d);
    font-size: 10px;
    padding-top: 4px;
}

.lfr-export {
    line-height: 1;
}

/* Кнопка перехода в полный отчёт: рядом с выгрузкой, но заметнее её —
   это переход на другую страницу, а не действие на месте. */
.lfr-btn {
    font-size: 10.5px;
    padding: 1px 8px;
    line-height: 1.4;
    border: 1px solid rgba(13, 110, 253, .45);
    background: rgba(13, 110, 253, .1);
    color: #0d6efd;
    font-weight: 600;
}

.lfr-btn:hover {
    background: rgba(13, 110, 253, .18);
    color: #0d6efd;
}

/* Шапка левой панели: что за список сейчас показан и сколько в нём строк. */
.bal-side-head {
    border-bottom: 1px solid var(--app-border, rgba(0, 0, 0, .08));
    padding-bottom: 6px;
}

.bal-side-title {
    font-size: 13px;
    font-weight: 600;
}

.bal-side-count {
    font-size: 11px;
    color: var(--app-text-muted, #6c757d);
}

/* «Плотно»: строки ужимаются, чтобы за период влезало больше выдач. */
.account-operations-table.balance-dense tr {
    font-size: 10px;
}

.account-operations-table.balance-dense td,
.account-operations-table.balance-dense th {
    padding: 0.05rem 0.25rem;
}

/* Список точек слева ужимается вместе с таблицей выдач: половины экрана должны
   выглядеть одинаково. !important — потому что базовый размер задан им же. */
.object-rfid-balance-table.balance-dense td,
.object-rfid-balance-table.balance-dense th {
    font-size: 10px !important;
    padding: 1px 3px;
}

/* Длинные названия авто переносятся, а не растягивают таблицу за край экрана.
   Остальные колонки остаются в одну строку — таблица от этого читается лучше. */
.account-operations-table td.balance-wrap,
.account-operations-table th.balance-wrap {
    white-space: normal;
    max-width: 260px;
    word-break: break-word;
}

/* Строка итогов по узлу: отделена сверху и не полосатится вместе с данными. */
.account-operations-table .balance-total td {
    border-top: 2px solid rgba(0, 0, 0, .25);
    background-color: rgba(0, 0, 0, .04);
}

.main-table-wrapper {
    max-height: 88.9vh;
}

.control-module-transactions-tab {
    height: calc(100vh - 128px);
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.control-module-transactions-tab > .card,
.control-module-transactions-tab > .row {
    flex: 0 0 auto;
}

.control-module-transactions-table-wrapper {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    max-height: none;
    overflow: auto !important;
}

.control-module-transactions-table-wrapper table {
    margin-bottom: 0;
    white-space: nowrap;
}

.control-module-transactions-table-wrapper thead th {
    position: sticky;
    top: 0;
    z-index: 2;
}

.object-rfid-balance-table-wrapper {
    max-height: 84vh;
    overflow-y: auto;
    overflow-x: auto;
}

.object-rfid-balance-table-wrapper .ellipsis {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/*.object-rfid-balance-table span {*/
/*    display: block;*/
/*}*/

.object-rfid-balance-table td, .object-rfid-balance-table th {
    font-size: 11px !important;
    padding: 3px;
}

.object-rfid-balance-table tr {
    height: auto !important;
    cursor: pointer;
}

table .tablesort-sortable:after {
    content: "";
    float: unset !important;
    margin-top: 7px;
    visibility: hidden;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: none;
    border-bottom: 4px solid #666 !important;
    margin-left: 10px;
}

table .tablesort-desc:after {
    border-top: 4px solid #666 !important;
    border-bottom: none !important;
}

table .tablesort-sortable:hover:after, table .tablesort-asc:after, table .tablesort-desc:after {
    display: inline-block !important;
}

.object-rfid-balance-table .tablesort-asc, .object-rfid-balance-table .tablesort-desc {
    background-color: transparent !important;
}

:root {
    --app-bg: #f5f7fb;
    --app-surface: #ffffff;
    --app-surface-raised: #ffffff;
    --app-surface-muted: #eef3f8;
    --app-nav: #172033;
    --app-nav-border: #263247;
    --app-sidebar: #ffffff;
    --app-sidebar-hover: #e8f1fb;
    --app-text: #172033;
    --app-text-muted: #5f6f85;
    --app-border: #d9e2ec;
    --app-border-strong: #c7d3e1;
    --app-accent: #1677c9;
    --app-accent-hover: #0f64ad;
    --app-accent-soft: #dff0ff;
    --app-control-bg: #ffffff;
    --app-control-text: #172033;
    --app-control-border: #cbd7e5;
    --app-table-head: #23324a;
    --app-table-head-text: #f7fbff;
    --app-row-hover: #edf6ff;
    --app-divider: #b9c7d8;
    --app-focus: rgba(22, 119, 201, .28);
}

html, body {
    height: 100%;
    min-height: 100%;
    margin: 0;
    padding: 0;
    background: var(--app-bg);
    color: var(--app-text);
}

.split-pane-divider {
    background: var(--app-divider);
    z-index: 1!important;
}

.split-pane-component {
    background: var(--app-bg);
}

/* Нижняя панель деталей должна тянуться на всю свою высоту, а её внутренняя обёртка —
   быть колонкой, иначе графики не прижимаются к низу при подъёме разделителя. */
.fmd-pane .pretty-split-pane-component-inner {
    height: 100%;
    min-height: 0;
}

/* Панель деталей — колонка: шапка/сводка/таблица по контенту, графики тянутся в остаток высоты,
   чтобы при подъёме нижней панели графики растягивались, а их низ прилипал к низу. */
.fuel-moving-detail-body {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.fuel-moving-detail-charts {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: 1fr;
    gap: 12px;
    padding: 10px;
    flex: 1 1 auto;
    min-height: 260px;
}

.fuel-moving-detail-chart {
    min-width: 0;
    min-height: 0;
    background: var(--app-surface);
    border: 1px solid var(--app-border);
}

/* Шапка-поток деталей перемещения (откуда → куда, объём, период). */
.fmd-header {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    background: #f7f9fc;
    border-bottom: 1px solid #e6ecf3;
    flex-wrap: wrap;
}

.fmd-badge {
    background: #e6f1fb;
    color: #0c447c;
    font-weight: 600;
    font-size: 13.5px;
    padding: 6px 12px;
    border-radius: 8px;
    white-space: nowrap;
}

.fmd-flow {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    min-width: 320px;
    flex-wrap: wrap;
}

.fmd-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid #e0e7f0;
    border-radius: 999px;
    padding: 6px 14px;
    font-size: 13.5px;
    font-weight: 500;
}

.fmd-chip i {
    color: #5f6f85;
    font-size: 16px;
}

.fmd-chip em {
    font-style: normal;
    color: #5f6f85;
}

.fmd-arrow {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    color: var(--app-accent);
    line-height: 1.1;
}

.fmd-arrow b {
    font-size: 13px;
}

.fmd-arrow i {
    font-size: 19px;
}

.fmd-time {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #5f6f85;
    font-size: 12.5px;
    white-space: nowrap;
}

/* Карточки: Источник / Операция / Получатель / Отклонения. */
.fmd-cards {
    display: grid;
    grid-template-columns: 1.15fr 1fr 1.15fr 0.9fr;
    gap: 12px;
    padding: 14px 16px 6px;
}

.fmd-card {
    min-width: 0;
    border: 1px solid #e6ecf3;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}

.fmd-card-head {
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fmd-head-src { background: #eef4fb; color: #0c447c; }
.fmd-head-op  { background: #f1eef8; color: #3c3489; }
.fmd-head-dst { background: #e6f5ee; color: #0f6e56; }
.fmd-head-dev { background: #f3eef0; color: #712b13; }

.fmd-card-body {
    padding: 8px 12px;
}

.fmd-line {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    padding: 5px 0;
    border-bottom: 1px dashed #eef2f7;
}

.fmd-line:last-child {
    border-bottom: 0;
}

.fmd-line > span {
    color: #5f6f85;
}

.fmd-line b i {
    color: #9aa6b5;
    font-weight: 400;
    font-style: normal;
}

.fmd-line-total {
    font-size: 14px;
    padding-top: 7px;
}

.fmd-accent-blue { color: #185fa5; }
.fmd-accent-green { color: #0f6e56; }

.fmd-dev {
    font-weight: 600;
    padding: 2px 9px;
    border-radius: 7px;
}

.fmd-dev.moving-deviation-ok { background: #e6f5ee; color: #0f6e56; }
.fmd-dev.moving-deviation-warn { background: #fbf1e0; color: #854f0b; }
.fmd-dev.moving-deviation-bad { background: #fbecec; color: #a32d2d; }

@media (max-width: 900px) {
    .fmd-cards {
        grid-template-columns: 1fr 1fr;
    }
}

.moving-deviation-ok {
    color: #15803d;
}

.moving-deviation-warn {
    color: #b45309;
}

.moving-deviation-bad {
    color: #b91c1c;
}

.sidebar-menu {
    /*width: 20em;*/
}

table.object-rfid-balance-table {
    border-collapse: collapse;
    /* Ширину колонок задаёт rz-resizer, поэтому при сдвиге разделителя вправо
       таблица оставалась узкой и между ней и правым окном зияла пустая полоса.
       min-width не даёт таблице быть уже своей половины, но и не мешает
       горизонтальной прокрутке, когда колонок реально больше. */
    min-width: 100%;
}

table.object-rfid-balance-table th {
    min-width: 10px;
    background-color: var(--app-surface-muted);
}

table.object-rfid-balance-table th, table.object-rfid-balance-table td {
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.rz-handle {
    background: repeating-linear-gradient(
            45deg, gray, transparent 2px, rgba(250, 249, 249, 0.05) 2px, rgba(0, 0, 0, 0.05) 4px) !important;
}

.left-panel-wrapper {
    background-color: var(--app-surface) !important;
    height: calc(100vh - 94px);
    overflow: hidden;
}

.object-management-left-panel,
.object-management-left-panel > div {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.object-management-left-panel {
    height: calc(100vh - 126px);
}

.object-management-left-panel > div {
    height: 100%;
    overflow: hidden;
}

.orders-left-mode .left-panel-wrapper > div {
    height: 100%;
}

body.bg-light, .bg-light {
    background-color: var(--app-bg) !important;
    color: var(--app-text);
}

.navbar-dark.bg-dark {
    background-color: var(--app-nav) !important;
    border-color: var(--app-nav-border) !important;
    box-shadow: 0 1px 0 rgba(15, 23, 42, .12);
}

.navbar-dark .nav-link,
.navbar-dark .navbar-nav .nav-link {
    color: rgba(247, 251, 255, .86) !important;
}

.navbar-dark .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:hover {
    color: #ffffff !important;
}

.nav-icon-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    margin: 0 5px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: rgba(247, 251, 255, .86) !important;
    font-size: 18px;
    line-height: 1;
    text-decoration: none !important;
    cursor: pointer;
}

.nav-icon-button:hover,
.nav-icon-button:focus {
    background: rgba(255, 255, 255, .09);
    color: #ffffff !important;
    outline: none;
}

.nav-super-button {
    color: #2da8df !important;
    font-size: 17px;
}

.nav-super-button:hover,
.nav-super-button:focus {
    color: #4fc0ee !important;
}

.nav-report-dropdown {
    position: relative;
}

.nav-report-button {
    min-width: 106px;
    height: 32px;
    border: 2px solid #2da8df;
    border-radius: 0;
    background: transparent;
    color: #2da8df;
    font-size: 13px;
    font-weight: 700;
}

.nav-report-button:hover,
.nav-report-button:focus {
    background: rgba(45, 168, 223, .12);
    color: #4fc0ee;
    box-shadow: none;
    outline: none;
}

.nav-highlight-select.form-control-sm {
    border-color: #2da8df;
}

.nav-highlight-select.form-control-sm:focus {
    border-color: #2da8df;
    box-shadow: 0 0 0 1px rgba(45, 168, 223, .35);
}

.nav-highlight-select.form-control-sm:disabled {
    border-color: rgba(45, 168, 223, .65);
}

.nav-report-dropdown .dropdown-menu {
    min-width: 162px;
    margin-top: 4px;
    border-radius: 4px;
}

.nav-report-dropdown .dropdown-item {
    font-size: 13px;
    cursor: pointer;
}

.user-gear-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    line-height: 1;
}

.user-gear-icon .bi-person-circle {
    font-size: 18px;
}

.user-gear-icon .bi-gear-fill {
    position: absolute;
    right: -3px;
    bottom: -2px;
    padding: 1px;
    border-radius: 50%;
    background: #172134;
    font-size: 9px;
}

.user-settings-tab .user-gear-icon .bi-gear-fill {
    background: #ffffff;
}

.invitation-log-modal-window .modal-dialog {
    max-width: 1140px;
}

.invitation-log-table-wrap {
    overflow-x: hidden;
}

.invitation-log-table {
    table-layout: fixed;
    width: 100%;
}

.soft-modal-backdrop.modal-backdrop {
    background: rgba(21, 32, 51, 0.18) !important;
    backdrop-filter: blur(1px) saturate(0.9);
}

.soft-modal-backdrop.modal-backdrop.show,
.soft-modal-backdrop.modal-backdrop.in {
    opacity: 1 !important;
}

.user-settings-window .modal-dialog {
    max-width: 990px;
}

.user-settings-window .modal-content {
    border: 0;
    border-radius: 4px;
    background: #ffffff;
    box-shadow: 0 18px 44px rgba(15, 23, 42, .26);
}

.user-settings-modal {
    min-height: 660px;
    overflow: hidden;
    border-radius: 4px;
}

.user-settings-header {
    display: flex;
    align-items: center;
    height: 54px;
    border-bottom: 1px solid #dbe8ef;
    background: #ffffff;
}

.user-settings-tab {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 54px;
    padding: 0 24px;
    border-bottom: 4px solid transparent;
    color: #334155;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
}

.super-countries-manage-link {
    display: inline-block;
    margin-top: 6px;
    font-size: 12px;
}

.user-settings-tab.active {
    border-bottom-color: #2da8df;
    color: #2698cf;
}

.user-settings-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    margin-left: auto;
    margin-right: 10px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #607386;
    font-size: 18px;
    cursor: pointer;
}

.user-settings-close:hover,
.user-settings-close:focus {
    background: #eef6fa;
    color: #2f86e7;
    outline: none;
}

.user-settings-body {
    min-height: 540px;
    padding: 22px 20px;
    background: #ffffff;
}

.user-settings-body .form-group {
    margin-bottom: 10px;
}

.user-settings-body .col-form-label {
    color: #1f2937;
    font-size: 13px;
    font-weight: 500;
}

.user-settings-body .form-control-sm {
    height: 28px;
    border-color: #b9cfdd !important;
    border-radius: 4px;
    font-size: 13px;
}

.user-settings-body .user-settings-readonly {
    background-color: #edf4f8 !important;
    color: #5d6f7f !important;
}

.user-settings-section-title {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0 0 12px;
    color: #0f7fa0;
    font-size: 13px;
    font-weight: 700;
}

.user-settings-section-spaced {
    margin-top: 20px;
    padding-top: 14px;
    border-top: 1px solid #dbe8ef;
}

/* 06.09.2026: заголовки групп полей в модалке редактирования компании — тот же язык, что и
   у .user-settings-section-title, своя граница сверху вместо доп. класса-обёртки. */
.company-edit-modal .company-edit-section-title {
    margin: 16px 0 10px;
    padding-top: 12px;
    border-top: 1px solid #dbe8ef;
    color: #0f7fa0;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .02em;
}

.company-edit-modal .company-edit-section-title:first-child {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}

/* 06.09.2026: без явного центрирования окно рендерилось от верха документа и при контенте
   выше видимой области заголовок уезжал за край экрана. Центрируем по вертикали и ограничиваем
   высоту самой модалки, чтобы длинный контент скроллился ВНУТРИ неё, а не раздувал страницу. */
.company-edit-modal-window .modal-dialog {
    display: flex;
    align-items: center;
    min-height: calc(100% - 3.5rem);
}

.company-edit-modal-window .modal-content {
    max-height: 90vh;
    overflow-y: auto;
}

.user-map-color-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.user-map-color-option {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    margin: 0;
    border: 1px solid #b9cfdd;
    border-radius: 4px;
    background: #ffffff;
    cursor: pointer;
}

.user-map-color-option.selected {
    border-color: #0f7fa0;
    box-shadow: 0 0 0 2px rgba(15, 127, 160, 0.18);
}

.user-map-color-option input {
    display: none;
}

.user-map-color-swatch {
    display: block;
    width: 18px;
    height: 18px;
    border-radius: 3px;
}

.user-map-color-picker {
    width: 32px;
    height: 28px;
    padding: 2px;
    border: 1px solid #b9cfdd;
    border-radius: 4px;
    background: #ffffff;
}

.user-map-color-value {
    min-width: 64px;
    color: #526779;
    font-size: 12px;
    font-weight: 600;
}

.user-settings-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: #172134;
    font-size: 14px;
}

.user-settings-toggle input {
    width: 16px;
    height: 16px;
}

.user-settings-footer {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 68px;
    padding: 0 20px;
    background: #e7f2f7;
}

.user-settings-footer .btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    height: 30px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
}

.support-request-window .modal-dialog {
    max-width: 620px;
}

.support-request-window .modal-content {
    border: 0;
    border-radius: 4px;
    background: #ffffff;
    box-shadow: 0 18px 44px rgba(15, 23, 42, .26);
}

.support-request-modal {
    overflow: hidden;
    border-radius: 4px;
}

.support-request-header {
    display: flex;
    align-items: center;
    height: 54px;
    border-bottom: 1px solid #dbe8ef;
    background: #ffffff;
}

.support-request-title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 54px;
    padding: 0 24px;
    border-bottom: 4px solid #2da8df;
    color: #2698cf;
    font-size: 16px;
    font-weight: 700;
}

.support-request-body {
    padding: 20px 22px 18px;
    background: #ffffff;
}

.support-request-note {
    margin-bottom: 14px;
    padding: 8px 10px;
    border: 1px solid #d7e4ec;
    border-radius: 4px;
    background: #f7fbfd;
    color: #42566b;
    font-size: 13px;
}

.support-request-body label {
    color: #1f2937;
    font-size: 13px;
    font-weight: 600;
}

.support-request-body .form-control-sm,
.support-request-body textarea.form-control {
    border-color: #b9cfdd !important;
    border-radius: 4px;
    font-size: 13px;
}

.support-request-footer {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 64px;
    padding: 0 22px;
    background: #e7f2f7;
}

.support-request-footer .btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    height: 30px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
}

.super-settings-window .modal-dialog {
    max-width: 560px;
}

.super-settings-modal {
    overflow: hidden;
    border-radius: 6px;
    background: #ffffff;
}

.super-settings-loading {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 72px;
    color: #53657d;
    font-size: 13px;
}

.super-provider-toggle {
    display: inline-flex;
    gap: 6px;
    padding: 3px;
    border: 1px solid #cdd7e3;
    border-radius: 6px;
    background: #eef3f8;
}

.super-provider-option {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 88px;
    height: 28px;
    margin: 0;
    padding: 0 12px;
    border-radius: 4px;
    color: #405269;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.super-provider-option input {
    display: none;
}

.super-provider-option.active {
    background: #168cc4;
    color: #ffffff;
    box-shadow: 0 1px 3px rgba(22, 140, 196, .28);
}

.sidebar-menu .list-group-item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.sidebar-menu-title {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

/* Иконка "Движение топлива за период" открывает отчёт отдельным окном по клику именно на неё
   (docs/report-fuel-moving-period-standalone/TZ.md) — курсор/hover подсказывают, что у неё
   своё поведение, отличное от клика по строке. */
.sidebar-menu-icon-linked {
    cursor: pointer;
}

.sidebar-menu-icon-linked:hover {
    color: #2da8df;
}

.sidebar-menu-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    border-radius: 6px;
    background: #e8f4fb;
    color: #1886bd;
    font-size: 15px;
    box-shadow: inset 0 0 0 1px rgba(45, 168, 223, .16);
}

.sidebar-menu .list-group-item:hover .sidebar-menu-icon,
.sidebar-menu .list-group-item:focus .sidebar-menu-icon {
    background: #2da8df;
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(45, 168, 223, .22);
}

.fuel-moving-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.fuel-moving-actions .btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    height: 30px;
    border: 0;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 5px 13px rgba(15, 23, 42, .14);
}

.fuel-moving-add-button {
    background: linear-gradient(180deg, #2fbd66 0%, #22964f 100%);
    color: #ffffff !important;
}

.fuel-moving-registry-button {
    background: linear-gradient(180deg, #2da8df 0%, #1f86bd 100%);
    color: #ffffff !important;
}

.fuel-moving-registry-button:disabled {
    opacity: .55;
    box-shadow: none;
}

.fuel-moving-registry-print {
    display: none;
}

.fuel-moving-print-header {
    display: grid;
    grid-template-columns: 1fr 1.5fr 1fr;
    align-items: start;
    gap: 16px;
    padding-bottom: 12px;
    border-bottom: 2px solid #172134;
}

.fuel-moving-print-brand {
    color: #1886bd;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: 0;
}

.fuel-moving-print-title {
    color: #172134;
    font-size: 20px;
    font-weight: 800;
    text-align: center;
}

.fuel-moving-print-muted {
    color: #64748b;
    font-size: 11px;
}

.fuel-moving-print-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 12px 0;
    color: #334155;
    font-size: 11px;
}

.fuel-moving-print-filters span {
    padding: 4px 8px;
    border: 1px solid #d7e4ec;
    border-radius: 4px;
    background: #f7fbfd;
}

.fuel-moving-print-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 11px;
}

.fuel-moving-print-table th {
    padding: 6px 7px;
    border: 1px solid #172134;
    background: #172134;
    color: #ffffff;
    text-align: left;
}

.fuel-moving-print-table td {
    padding: 5px 7px;
    border: 1px solid #cbd8e3;
}

.fuel-moving-print-table tbody tr:nth-child(even) td {
    background: #f2f6f9;
}

.fuel-moving-print-table tfoot td {
    border-top: 2px solid #172134;
    background: #e8f4fb;
    font-weight: 800;
}

.report-run-button {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    height: 30px;
    border: 0;
    border-radius: 6px;
    padding: 0 12px;
    background: linear-gradient(180deg, #2da8df 0%, #1f86bd 100%);
    color: #ffffff !important;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 5px 13px rgba(15, 23, 42, .14);
}

.report-run-button:hover,
.report-run-button:focus {
    color: #ffffff !important;
    background: linear-gradient(180deg, #33b4ed 0%, #237fb1 100%);
    box-shadow: 0 7px 16px rgba(15, 23, 42, .18);
}

.report-run-button i {
    font-size: 14px;
}

.form-control-sm, .form-control, .form-control-lg, .input-group-append .input-group-text {
    background-color: var(--app-control-bg) !important;
    color: var(--app-control-text) !important;
    border-color: var(--app-control-border) !important;
}

.form-control:focus, .form-control-sm:focus, .form-control-lg:focus {
    border-color: var(--app-accent) !important;
    box-shadow: 0 0 0 .2rem var(--app-focus) !important;
}

.btn-light {
    background-color: var(--app-surface-raised) !important;
    border-color: var(--app-control-border) !important;
    color: var(--app-text) !important;
}

.btn-light:hover, .btn-light:focus {
    background-color: var(--app-accent-soft) !important;
    border-color: var(--app-accent) !important;
    color: var(--app-accent-hover) !important;
}

.btn-dark {
    background-color: var(--app-table-head) !important;
    border-color: var(--app-table-head) !important;
    color: var(--app-table-head-text) !important;
}

.btn-dark:hover, .btn-dark:focus {
    background-color: var(--app-accent-hover) !important;
    border-color: var(--app-accent-hover) !important;
    color: #ffffff !important;
}

.dropdown-menu, .modal-content, .card {
    background-color: var(--app-surface-raised) !important;
    color: var(--app-text) !important;
    border-color: var(--app-border) !important;
}

.dropdown-item {
    color: var(--app-text) !important;
}

.dropdown-item:hover, .dropdown-item:focus {
    color: var(--app-accent-hover) !important;
    background-color: var(--app-accent-soft) !important;
}

.modal-footer {
    border-top-color: var(--app-border) !important;
}

.table {
    background-color: var(--app-surface) !important;
    color: var(--app-text) !important;
}

.table td, .table th {
    border-color: var(--app-border) !important;
}

.thead-dark th, .table .thead-dark th {
    background-color: var(--app-table-head) !important;
    border-color: var(--app-table-head) !important;
    color: var(--app-table-head-text) !important;
}

.table-hover tbody tr:hover {
    color: var(--app-text) !important;
    background-color: var(--app-row-hover) !important;
}

.sidebar {
    background-color: var(--app-sidebar) !important;
}

.sidebar-menu, .left-panel-wrapper {
    border-color: var(--app-border) !important;
    box-shadow: 0 1px 4px rgba(15, 23, 42, .08) !important;
}

.sidebar-menu a, .sidebar-menu .list-group-item {
    background-color: var(--app-sidebar) !important;
    color: var(--app-text) !important;
    border-color: var(--app-border) !important;
}

.sidebar-menu a:hover, .sidebar-menu .list-group-item:hover,
a.bg-light:focus, a.bg-light:hover, button.bg-light:focus, button.bg-light:hover {
    background-color: var(--app-sidebar-hover) !important;
    color: var(--app-accent-hover) !important;
}

.bi-moon {
    color: #9bd1ff !important;
}

.theme-toggle {
    cursor: pointer;
}

.theme-toggle .bi {
    font-size: 1.15rem;
}

.text-secondary {
    color: var(--app-text-muted) !important;
}

.badge-dark {
    color: #fff !important;
    background-color: #24324a !important;
}

.badge-secondary {
    color: #fff !important;
    background-color: #69778b !important;
}

.dark {
    --app-bg: #0f1724;
    --app-surface: #151f2e;
    --app-surface-raised: #1b2738;
    --app-surface-muted: #223149;
    --app-nav: #0b1220;
    --app-nav-border: #20304a;
    --app-sidebar: #121c2b;
    --app-sidebar-hover: #1f3148;
    --app-text: #e7eef7;
    --app-text-muted: #9db0c5;
    --app-border: #2a3b55;
    --app-border-strong: #38506f;
    --app-accent: #55b4ff;
    --app-accent-hover: #8bd0ff;
    --app-accent-soft: rgba(85, 180, 255, .14);
    --app-control-bg: #162235;
    --app-control-text: #e7eef7;
    --app-control-border: #314760;
    --app-table-head: #101927;
    --app-table-head-text: #e7eef7;
    --app-row-hover: #203550;
    --app-divider: #263a55;
    --app-focus: rgba(85, 180, 255, .3);
}

.dark .form-control-sm, .dark .form-control, .dark .form-control-lg, .dark .input-group-append .input-group-text {
    background-color: var(--app-control-bg) !important;
    color: var(--app-control-text) !important;
}

.dark .form-control-sm:not(.is-invalid), .dark .form-control:not(.is-invalid), .dark .form-control-lg:not(.is-invalid),
.dark .input-group-append .input-group-text:not(.is-invalid){
    border-color: var(--app-control-border) !important;
}

.dark .dropdown-item{
    color: var(--app-text) !important;
}

.dark .modal-footer {
    border-top-color: var(--app-border) !important;
}

.dark .table-hover tbody tr:hover {
    color: var(--app-text) !important;
    background-color: var(--app-row-hover) !important;
}

.dark.bg-light, .dark .bg-light, .dark .modal-content {
    background-color: var(--app-bg) !important;
    color: var(--app-text);
}

.rz-hide .rz-handle {
    display: none;
}

.dark .table {
    background-color: var(--app-surface) !important;
    color: var(--app-text) !important;
    border-color: var(--app-border) !important;
}

.dark .table td, .dark .table th {
    border-color: var(--app-border) !important;
}

.dark .bi-moon {
    color: var(--app-accent) !important;
}

.dark .thead-dark th, .dark .navbar-dark {
    background-color: var(--app-nav) !important;
}

.dark .sidebar-menu a {
    background-color: var(--app-sidebar) !important;
    color: var(--app-text) !important;
}

.dark .sidebar-menu.border-bottom, .dark .left-panel-wrapper.border-bottom {
    border-bottom-color: var(--app-border) !important;
}

.dark .sidebar-menu.border-right, .dark .left-panel-wrapper.border-right {
    border-right-color: var(--app-border) !important;
}

.dark .split-pane-divider {
    background-color: var(--app-divider) !important;
}

.dark a.bg-light:focus, .dark a.bg-light:hover, .dark button.bg-light:focus, .dark button.bg-light:hover {
    background-color: var(--app-sidebar-hover) !important;
}

.dark .table .thead-dark th {
    color: var(--app-table-head-text) !important;
}

.license-monitor-modal .modal-dialog {
    width: 86vw;
    max-width: none;
    margin: 92px auto 20px;
}

.license-monitor-modal .modal-content {
    min-width: 1000px;
    min-height: 620px;
    height: calc(100vh - 110px);
    max-width: calc(100vw - 24px);
    max-height: calc(100vh - 92px);
    display: flex;
    flex-direction: column;
    resize: both;
    overflow: hidden;
}

.license-modal-drag-handle {
    cursor: move;
    user-select: none;
}

.license-monitor {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 560px;
    min-width: 0;
    overflow: hidden;
}

.license-monitor-layout {
    display: grid;
    grid-template-columns: minmax(330px, 390px) minmax(760px, 1fr);
    gap: 8px;
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
}

.license-detail,
.license-list {
    min-height: 0;
    min-width: 0;
    overflow: auto;
}

.license-list table {
    min-width: 1050px;
}

.license-users {
    max-height: 260px;
    overflow: auto;
    border-top: 1px solid var(--app-border);
}

.license-summary {
    flex: 0 0 auto;
    display: flex;
    gap: 24px;
    padding: 6px 8px;
    border: 1px solid var(--app-border);
    background-color: var(--app-surface);
}

.license-detail-title {
    font-weight: 700;
    color: var(--app-table-head);
    margin-bottom: 4px;
}

.license-user {
    border-top: 1px solid var(--app-border);
    padding: 6px 0;
}

.license-row-expired td {
    color: #b00020;
    font-weight: 600;
}

.license-row-critical td {
    color: #d35400;
    font-weight: 600;
}

.license-row-warning td {
    color: #6f5500;
}

.dark .license-detail-title {
    color: var(--app-text);
}

.dark .license-summary {
    background-color: var(--app-surface);
}

.dark .navbar-nav .dropdown-menu {
    background-color: var(--app-surface-raised) !important;
    color: var(--app-text) !important;
}

.dark .uib-day button, .dark .uib-month button, .dark .uib-year button {
    color: var(--app-text) !important;
}

.dark .border-bottom {
    border-bottom: 1px solid var(--app-border) !important;
}

.table-fixed-head {
    overflow: auto;
    height: 250px;
}

.table-fixed-head thead th {
    position: sticky;
    top: 0;
    z-index: 1;
}

.upload-btn-wrapper input[type=file] {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    width: 100%;
    height: 50px;
}

.calibration-table .form-control-sm {
    height: 20px !important;
}

.dark .card, .dark .table {
    background-color: var(--app-surface) !important;
}

/*.tank-circle {*/
/*    width: 100px;*/
/*    height: 100px;*/
/*    background: #acacac;*/
/*    border-radius: 50%;*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*    overflow: hidden;*/
/*}*/

.tank-circle {
    width: 100px;
    height: 100px;
    background: var(--app-surface-muted);
    border-radius: 50%;
    overflow: hidden;
}

.tank-circle > .volume {
    border-radius: 0;
    height: 50%;
    border: 0;
}

.tank-circle > .volume:nth-child(n+3) {
    background: var(--app-accent);
}

.tank-pct {
    position: absolute;
    top: 40%;
    color: var(--app-text);
    font-weight: bold;
}

.fuel-storage .tank-pct {
    left: 30%;
}

.operator-menu .tank-pct {
    left: 39%;
}

.card-wrapper {
    min-width: 23vw;
}

.fuel-storage .row-cols-md-3 > .fixed-card {
    min-width: 350px;
    max-width: 23vw;
}

.fuel-storage .row-cols-md-1 > .fixed-card {
    min-width: 66vw;
    max-width: 66vw;
}

.operator-menu  .row-cols-md-5 > .fixed-card {
    min-width: 13vw;
    max-width: 13vw;
}

.uib-time .form-control {
    height: calc(1.5em + .5rem + 2px);
    padding: .25rem .5rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem;
}

.report-wrapper {
    width: 800px;
}
.dropdown-menu {
    z-index:10000!important
}
.A4 {
    background: white;
    width: 21cm;
    /*height: 29.7cm;*/
    display: block;
    padding: 10px 25px;
    margin: 0 auto 0.5cm;
    /*box-shadow: 0 0 0.5cm rgba(0, 0, 0, 0.5);*/
    /*overflow-y: scroll;*/
    box-sizing: border-box;
    font-size: 11pt;
}

.A4 .table tbody td.days-totals-td{
    text-align: right;
    border: aliceblue!important;
}

.A4 .table tbody td.counter-deviation-critical {
    color: #dc3545 !important;
}

.A4 .table tbody td.counter-rollback-info {
    color: #0d6efd !important;
    font-size: 12px;
    text-align: right;
}

.A4.album {
    width: 29.7cm!important;
    /*height: 21cm!important;*/
}

.dark .A4 .table, .A4 .table tbody td, .A4 .table thead th, .A4 .table tbody {
    background: white !important;
    color: black !important;
    border: 1px solid #dee2e6 !important;
}

.A4.album {
    font-size: 9pt;
    padding: 0.5rem;
}

table.table-fit {
    white-space: nowrap !important;
    table-layout: auto !important;
}

table.table-fit thead th, table.table-fit tfoot th {
    white-space: nowrap !important;
    width: 1% !important;
}

table.table-fit tbody td, table.table-fit tfoot td {
    white-space: nowrap !important;
    width: 1% !important;
}

.checkbox-sm {
    height: 15px !important;
    vertical-align: middle !important;
}

.slider {
    position: absolute;
    width: 100%;
    bottom: 0;
    /*height: 25vh;*/
    transition: all 0.5s;
    background-color: #fff;
}

.slider.close {
    top: 100%;
    height: 0;
}

.chart-container {
    position: relative;
    margin: auto;
}

[class^="raphael-group-"]{
    display: none;
}

[class^="raphael-group-1"]{
    display: block !important;
}
[class^="raphael-group-2"]{
    display: block !important;
}
[class^="raphael-group-3"]{
    display: block !important;
}
[class^="raphael-group-4"]{
    display: block !important;
}
[class^="raphael-group-5"]{
    display: block !important;
}
[class^="raphael-group-6"]{
    display: block !important;
}
[class^="raphael-group-7"]{
    display: block !important;
}
[class^="raphael-group-8"]{
    display: block !important;
}
[class^="raphael-group-9"]{
    display: block !important;
}

.chartdiv > div > div:nth-child(1) > div > canvas:nth-child(2){
    /*display: none;*/
}

.card-body.charts-preview{
    padding: 0
}

.td-hover:hover {
    background-color: #e5e5e5;
    box-shadow: 0 0 0.5cm rgb(0 0 0 / 50%);
    border-radius: 3px;
    color: #4c4c4c;
}

.photo-preview-container {
    overflow-y: auto;
    max-height: 55vh;
}

.resize-disabled{
    min-width: 0!important;
}

.account-operations-table thead, .object-rfid-balance-table thead  {
    position: sticky !important;
    top: 0;!important; /* Don't forget this, required for the stickiness */
    z-index: 9999;
}

/* Закрепление шапки прокручиваемых таблиц (журнал приходов, логи ёмкости).
   Sticky вешаем на сами ячейки th: sticky на элементе <thead> в части браузеров
   не срабатывает (шапка уезжала при прокрутке журнала вниз). Фон у th уже сплошной
   (.thead-dark th), поэтому строки под шапкой не просвечивают. */
.main-table-wrapper .account-operations-table thead th {
    position: sticky;
    top: 0;
    z-index: 5;
}

/* 30.08.2026, по прямому указанию пользователя: журнал "Весовые операции" (Процессы/
   Операции) — шапка таблицы sticky-правило выше УЖЕ есть, но без толку: базовый
   .main-table-wrapper даёт max-height:88.9vh — это верно для страниц-одиночных панелей
   (весь экран), а тут таблица сидит в ВЕРХНЕЙ 60%-й половине split-pane. 88.9vh физически
   больше видимой высоты этой половины, поэтому свой скролл у .main-table-wrapper ни разу
   не включался — прокручивалась внешняя split-pane панель ЦЕЛИКОМ, и шапка (при всём
   position:sticky) уезжала вместе с телом таблицы. Ограничиваем высоту реальным размером
   своей половины (100% от родителя, а не от вьюпорта) — тогда скроллится сама таблица,
   и sticky-шапка остаётся на месте. */
.weight-operations-journal-inner {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.weight-operations-journal-inner .nav-tabs {
    flex: 0 0 auto;
}

.weight-operations-journal-inner .main-table-wrapper {
    flex: 1 1 auto;
    max-height: none;
    min-height: 0;
    overflow-y: auto;
}

/* ui-select подбора ответственного (склады): на всю ширину ячейки/поля */
.sh-user-select.ui-select-container,
.sh-user-select .select2-container {
    width: 100% !important;
    display: block;
}

/* Журнал приходов: убрать двойную прокрутку. У .main-table-wrapper свой
   max-height:88.9vh + overflow-auto — а панель split-pane ВОКРУГ неё уже сама
   прокручиваемая (overflow:auto из библиотеки split-pane). Два независимых
   скролл-контейнера подряд давали два скроллбара и "уезжающую" sticky-шапку
   (see коммит про sticky-шапку выше). Прокручивает только внешняя панель
   split-pane, эта обёртка растёт вместе с контентом. */
.income-journal-table-wrapper {
    max-height: none;
}

@media (min-width: 992px){
    .navbar-expand-lg .navbar-nav .nav-link {
        padding-right: 0.2rem;
        padding-left: 0.2rem;
    }
}

.uib-time input {
    width: 35px;
}

.nav-link {
    display: block;
    padding: 0.5rem 1rem;
    white-space: nowrap;
}

.hours .dropdown-menu{
    min-width: 4rem;
}

.hours .dropdown-item{
    padding: 0 .75rem;
}

.ui-select-choices.ui-select-choices-content.ui-select-dropdown.dropdown-menu{
    display: block;
}

.input-group>.ui-select-bootstrap>input.ui-select-search.form-control {
    border-radius: 4px!important;
}

.selectize-control.single .selectize-input:after{
    display: none!important;
}

.select2 > .select2-choice.ui-select-match {
    /* Because of the inclusion of Bootstrap */
    height: 29px;
}

.selectize-control > .selectize-dropdown {
    top: 36px;
}

/*.btn.btn-default.form-control.ui-select-toggle{*/
/*    height: 22px;*/
/*    padding: 0;*/
/*    font-size: 12px;*/
/*    vertical-align: inherit;*/
/*    line-height: 1;*/
/*}*/

/*.form-control.ui-select-search {*/
/*    padding: .25rem .5rem;*/
/*    font-size: .875rem;*/
/*    line-height: 1.5;*/
/*    border-radius: 0;*/
/*    height: 22px;*/
/*    margin-top: -3px;*/
/*}*/

/*.ui-select-container.ui-select-bootstrap.dropdown{*/
/*    background-color: white;*/
/*    height: 22px;*/
/*}*/

/*.ui-select-placeholder.text-muted{*/
/*    color: black!important;*/
/*}*/

/*.ui-select-placeholder{*/
/*    background-color: white;*/
/*}*/

.datetimepicker .table td, .datetimepicker .table tr{
    height: auto;
}

.datetimepicker .table td, .datetimepicker .table th{
    padding: 0.15rem;
}

.datetimepicker .hour, .datetimepicker .minute {
    height: 26px!important;
    line-height: 24px!important;
}

.ng-hide {
    display: none;
}

h4.income-log-modal {
    margin-bottom: 10px;
    border-bottom: 2px solid #007bff;
    padding-bottom: 5px;
}


.chat-window {
    bottom: 0;
    /*position:fixed;*/
    /*float:right;*/
    /*margin-left: 10px;*/
}

.chat-window > div > .panel {
    border-radius: 5px 5px 0 0;
}

.icon_minim {
    padding: 2px 10px;
}

.msg_container_base {
    background: #e5e5e5;
    margin: 0;
    padding: 0 10px 10px;
    max-height: 300px;
    overflow-x: hidden;
}

.top-bar {
    background: #666;
    color: white;
    padding: 10px;
    position: relative;
    overflow: hidden;
}

.msg_receive {
    padding-left: 0;
    margin-left: 0;
    background-color: rgba(0, 0, 0, .075) !important;
}

.msg_sent {
    padding-bottom: 20px !important;
    margin-right: 0;
}

.messages {
    background: white;
    padding: 10px;
    border-radius: 2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    max-width: 100%;
}

.messages > p {
    font-size: 11px;
    margin: 0 0 0.1rem 0;
}

.messages > time {
    font-size: 10px;
    color: #ccc;
}

.msg_container {
    padding: 10px;
    overflow: hidden;
    display: flex;
}

img {
    display: block;
    width: 100%;
}

.avatar {
    position: relative;
}

.base_receive > .avatar:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 0;
    border: 5px solid #FFF;
    border-left-color: rgba(0, 0, 0, 0);
    border-bottom-color: rgba(0, 0, 0, 0);
}

.base_sent {
    justify-content: flex-end;
    align-items: flex-end;
}

.base_sent > .avatar:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 0;
    border: 5px solid white;
    border-right-color: transparent;
    border-top-color: transparent;
    box-shadow: 1px 1px 2px rgba(black, 0.2);
}

.msg_sent > time {
    float: right;
}

.msg_container_base::-webkit-scrollbar-track {
    /*-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);*/
    /*background-color: #F5F5F5;*/
}

.msg_container_base::-webkit-scrollbar {
    /*width: 12px;*/
    /*background-color: #F5F5F5;*/
}

.msg_container_base::-webkit-scrollbar-thumb {
    /*-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);*/
    /*background-color: #555;*/
}

.btn-group.dropup {
    position: fixed;
    left: 0;
    bottom: 0;
}

.zoom-container {
    position: relative;
    display: inline-block;
}
.thumbnail {
    cursor: pointer;
    transition: transform 0.3s;
    position: relative;
    z-index: 1;
}
.thumbnail.zoomed {
    transform: scale(3);
    position: fixed;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) scale(3) !important;
    z-index: 9999;
    box-shadow: 0 0 20px rgba(0,0,0,0.5);
    max-width: 90vw;
    max-height: 90vh;
}
.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);
    z-index: 9998;
    display: none;
}

/* Стили для модального окна увеличения */
.zoom-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.9);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    cursor: default;
}

.zoom-modal-content {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.image-container {
    position: relative;
    width: fit-content;
    height: fit-content;
    cursor: grab;
    user-select: none;
}

.image-container.dragging {
    cursor: grabbing;
}

.zoomed-image {
    max-width: 90vw;
    max-height: 90vh;
    transition: transform 0.1s ease-out;
    will-change: transform;
    display: block;
}

.zoom-controls {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1001;
    background: rgba(0, 0, 0, 0.7);
    padding: 12px;
    border-radius: 8px;
    display: flex;
    gap: 8px;
    align-items: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.zoom-btn {
    min-width: 44px;
    height: 44px;
    border-radius: 6px;
    border: none;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.zoom-btn.btn-primary {
    background: #4a90e2;
    color: white;
}

.zoom-btn.btn-primary:hover {
    background: #357ae8;
}

.zoom-btn.btn-secondary {
    background: #666;
    color: white;
}

.zoom-btn.btn-secondary:hover {
    background: #777;
}

.zoom-btn.btn-danger {
    background: #e74c3c;
    color: white;
}

.zoom-btn.btn-danger:hover {
    background: #c0392b;
}

.zoom-level {
    margin-left: 10px;
    font-weight: bold;
    min-width: 60px;
    text-align: center;
    color: white;
    font-size: 16px;
}

.income-bottom-log-layout {
    height: 100%;
}

/* Внутренняя обёртка нижнего пейна должна занимать всю высоту пейна,
   иначе панель анализатора (и график) не тянется до низа при подъёме разделителя. */
.income-bottom-pane-inner {
    height: 100%;
    min-height: 0;
}

.income-bottom-tabs {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #fff;
}

.income-bottom-tabbar {
    display: flex;
    align-items: center;
    gap: 4px;
    min-height: 38px;
    padding: 4px 8px;
    background: #f5f7fa;
    border-bottom: 1px solid #cfd8e3;
}

.income-bottom-tab {
    border: 1px solid #c2ccda;
    background: #fff;
    color: #1f3148;
    padding: 5px 14px;
    font-weight: 600;
    cursor: pointer;
}

.income-bottom-tab.active {
    background: #1f3148;
    border-color: #1f3148;
    color: #fff;
}

.income-bottom-tab-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
}

.income-bottom-tabcontent {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.income-analyzer-panel,
.income-tank-log-panel {
    background: #fff;
    min-height: 0;
}

.income-analyzer-panel {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100%;
}

.income-analyzer-left {
    display: none !important;
}

.income-analyzer-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    border-bottom: 1px solid #d7dee8;
}

.income-analyzer-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(120px, 1fr));
    gap: 4px;
    padding: 6px 8px;
    background: #f5f7fa;
    border-bottom: 1px solid #d7dee8;
}

.income-analyzer-grid {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 0;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

/* Перетаскиваемый мышью разделитель между списком ёмкостей и графиком/данными. */
.income-analyzer-divider {
    flex: 0 0 6px;
    cursor: col-resize;
    background: #d7dee8;
    position: relative;
    user-select: none;
}

.income-analyzer-divider:hover,
.income-analyzer-divider.dragging {
    background: #9fb0c4;
}

.income-analyzer-divider::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2px;
    height: 28px;
    transform: translate(-50%, -50%);
    background: #8091a5;
    border-radius: 1px;
}

.income-analyzer-summary-left {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.income-analyzer-summary div {
    display: flex;
    flex-direction: column;
    gap: 1px;
    white-space: nowrap;
}

.income-analyzer-summary span {
    color: #637083;
    font-size: 12px;
}

.income-analyzer-table-wrap {
    overflow: auto;
    min-height: 0;
    min-width: 0;
    flex: 1 1 auto;
}

/* При наличии графика ширина списка ёмкостей задаётся разделителем (ng-style),
   поэтому колонка не растягивается сама. Без графика — занимает всё (flex выше). */
.income-analyzer-grid.has-chart .income-analyzer-table-wrap {
    flex: 0 0 auto;
}

/* Правая колонка — flex-столбец: заголовок сверху, график/данные тянутся до низа. */
.income-analyzer-points {
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

.income-analyzer-table td,
.income-analyzer-table th {
    white-space: normal;
}

.income-analyzer-table-left td,
.income-analyzer-table-left th {
    line-height: 1.35;
    vertical-align: top;
}

.income-analyzer-active td:first-child {
    font-weight: 700;
}

.income-analyzer-selected {
    background-color: #e7ebf0 !important;
    box-shadow: inset 4px 0 0 #1f3148;
}

.income-analyzer-inactive {
    color: #7d8794;
    background-color: #f0f1f3;
}

.income-analyzer-start-point {
    box-shadow: inset 4px 0 0 #8a6d3b;
    background-color: #f4f1ea !important;
}

.income-analyzer-end-point {
    box-shadow: inset 4px 0 0 #1f3148;
    background-color: #eceff3 !important;
}

.income-analyzer-badge {
    display: inline-block;
    padding: 3px 6px;
    border: 1px solid #c2ccda;
    color: #1f3148;
    background: #eef1f5;
    font-weight: 600;
    line-height: 1;
}

.income-analyzer-badge.muted {
    border-color: #8d98a7;
    color: #637083;
}

.income-analyzer-points-title {
    padding: 5px 8px;
    background: #f5f7fa;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex: 0 0 auto;
}

/* Обёртка таблицы «Данные» — тянется до низа и скроллится. */
.income-analyzer-data-wrap {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

/* Переключатель График / Данные в панели точек анализатора */
.income-analyzer-subtabs {
    display: inline-flex;
    border: 1px solid #c2ccda;
    border-radius: 4px;
    overflow: hidden;
}

.income-analyzer-subtab {
    border: 0;
    background: #eef1f5;
    color: #1f3148;
    font-size: 12px;
    font-weight: 600;
    padding: 2px 10px;
    line-height: 18px;
    cursor: pointer;
}

.income-analyzer-subtab + .income-analyzer-subtab {
    border-left: 1px solid #c2ccda;
}

.income-analyzer-subtab.active {
    background: #1f3148;
    color: #fff;
}

/* Обёртка графика — тянется до низа панели вместе с ней. */
.income-analyzer-chart-wrap {
    padding: 6px 8px 4px;
    flex: 1 1 auto;
    min-height: 0;
}

/* Контейнер графика прихода (amCharts 5): заполняет обёртку целиком. */
.income-intake-chart {
    width: 100%;
    height: 100%;
    min-height: 180px;
}

.income-photo-viewer {
    position: fixed !important;
    z-index: 2147483000 !important;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.88);
}

.income-photo-viewer img {
    max-width: 96vw;
    max-height: 94vh;
    object-fit: contain;
    background: #111;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.55);
    transition: transform .12s ease;
    will-change: transform;
}

.income-photo-close {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 2147483001 !important;
}

/* Тулбар просмотрщика фото поступления (зум/поворот/удаление). */
.income-photo-toolbar {
    position: absolute;
    top: 12px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 255, 255, 0.94);
    padding: 6px 10px;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.45);
    z-index: 2147483001 !important;
}

.income-photo-scale {
    min-width: 46px;
    text-align: center;
    font-size: 13px;
    font-weight: 600;
}

.income-photo-nonimage {
    max-width: 90vw;
}

/* Миниатюра документа в карточке левой панели «Фото поступления». */
.income-photo-thumb {
    width: 48px;
    height: 48px;
    object-fit: cover;
    border-radius: 4px;
    background: #eef1f5;
    flex: 0 0 auto;
}

.income-photo-thumb--file {
    color: #6c757d;
    font-size: 22px;
}

.monitoring-fact-row {
    cursor: pointer;
}

.monitoring-orders-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 6px 8px;
    flex: 0 0 auto;
}

.monitoring-orders-page {
    height: calc(100vh - 75px);
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.monitoring-orders-search {
    width: 220px;
}

.monitoring-work-type-filter {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

.monitoring-orders-table th,
.monitoring-orders-table td {
    white-space: nowrap;
}

.monitoring-orders-table td {
    vertical-align: middle;
}

.monitoring-orders-table tfoot td {
    position: sticky;
    bottom: 0;
    z-index: 4;
    background: #edf7fb;
    border-top: 2px solid #10a8bd;
    box-shadow: 0 -3px 8px rgba(16, 48, 72, 0.12);
    font-weight: 700;
}

.monitoring-orders-table tfoot td:first-child {
    color: #12233a;
}

.monitoring-orders-table .monitoring-refresh-column {
    width: 24px;
    min-width: 24px;
    max-width: 24px;
    text-align: center !important;
    padding-left: 2px;
    padding-right: 2px;
}

.monitoring-distance-cell {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
}

.monitoring-no-coordinates-icon {
    color: #dc2626;
    font-size: 11px;
    line-height: 1;
}

.monitoring-fact-refresh {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.monitoring-fact-refresh span {
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #facc15;
    box-shadow: 0 0 0 1px rgba(133, 77, 14, 0.35);
}

.monitoring-fact-refresh.refreshing {
    cursor: default;
}

.monitoring-fact-refresh.refreshing span {
    width: 13px;
    height: 13px;
    border: 2px solid rgba(250, 204, 21, 0.35);
    border-top-color: #f59e0b;
    background: transparent;
    box-shadow: none;
    animation: monitoring-refresh-spin 0.8s linear infinite;
}

@keyframes monitoring-refresh-spin {
    to {
        transform: rotate(360deg);
    }
}

.orders-left-mode .sidebar-menu .list-group-item:not(:first-child) {
    display: none !important;
}

.monitoring-selected-row td {
    background-color: #cfe2ff !important;
    box-shadow: inset 0 1px 0 rgba(13, 110, 253, 0.18), inset 0 -1px 0 rgba(13, 110, 253, 0.18);
}

.monitoring-selected-row td:first-child {
    box-shadow: inset 4px 0 0 #0d6efd, inset 0 1px 0 rgba(13, 110, 253, 0.18), inset 0 -1px 0 rgba(13, 110, 253, 0.18);
}

.monitoring-track-panel {
    height: 100%;
    min-height: calc(100vh - 124px);
    background: #fff;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.monitoring-track-header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.monitoring-track-player {
    flex: 1 1 auto;
    max-width: 340px;
    display: grid;
    grid-template-columns: 28px 24px minmax(90px, 1fr) 24px auto;
    align-items: center;
    gap: 5px;
}

.monitoring-track-player-button,
.monitoring-track-player-step {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 24px;
    padding: 0;
    border: 1px solid #b8c4d2;
    border-radius: 3px;
    background: #ffffff;
    color: #1f6fd1;
    cursor: pointer;
}

.monitoring-track-player-button {
    width: 28px;
    background: #1f6fd1;
    border-color: #1f6fd1;
    color: #ffffff;
}

.monitoring-track-player-step {
    width: 24px;
    font-size: 11px;
}

.monitoring-track-player-range {
    width: 100%;
    min-width: 90px;
}

.monitoring-track-player-info {
    min-width: 118px;
    font-size: 11px;
    line-height: 1.1;
    color: #334155;
}

.monitoring-track-player-info strong,
.monitoring-track-player-info span {
    display: block;
    white-space: nowrap;
}

#monitoring_track_map {
    height: 100%;
    min-height: 0;
    width: 100%;
    background: #eef2f6;
}

.monitoring-track-map-area {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.monitoring-track-map-tools {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 670;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
}

.monitoring-track-tool-group {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #d5dde4;
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 2px 7px rgba(15, 23, 42, 0.16);
}

.monitoring-track-tool-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 0;
    border-bottom: 1px solid #e2e8f0;
    background: transparent;
    color: #557284;
    cursor: pointer;
    font-size: 15px;
    line-height: 1;
}

.monitoring-track-tool-button:last-child {
    border-bottom: 0;
}

.monitoring-track-tool-button:hover,
.monitoring-track-tool-button.active {
    background: #eaf5fb;
    color: #0f7fa0;
}

.monitoring-track-zoom-value {
    width: 28px;
    height: 24px;
    border-bottom: 1px solid #e2e8f0;
    color: #334155;
    font-size: 12px;
    line-height: 24px;
    text-align: center;
    background: #ffffff;
}

.monitoring-track-map-panel {
    position: absolute;
    top: 10px;
    right: 46px;
    z-index: 665;
    width: 154px;
    padding: 7px;
    border: 1px solid #d5dde4;
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 7px 18px rgba(15, 23, 42, 0.2);
}

.monitoring-track-map-switch {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.monitoring-track-map-switch label {
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 24px;
    margin: 0;
    padding: 2px 4px;
    border-radius: 4px;
    color: #1f2937;
    cursor: pointer;
    font-size: 12px;
    line-height: 1.2;
}

.monitoring-track-map-switch label:hover,
.monitoring-track-map-switch label.active {
    background: #eaf5fb;
}

.monitoring-track-map-switch input {
    margin: 0;
}

.monitoring-track-trips-toggle {
    position: absolute;
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%);
    z-index: 650;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 126px;
    height: 38px;
    padding: 0 14px;
    border: 2px solid #ffffff;
    border-radius: 999px;
    background: linear-gradient(180deg, #16b8ce 0%, #0f8fa8 100%);
    color: #ffffff;
    box-shadow: 0 7px 20px rgba(15, 23, 42, 0.34), 0 0 0 1px rgba(15, 143, 168, 0.28);
    cursor: pointer;
    font-size: 13px;
    font-weight: 700;
    text-shadow: 0 1px 1px rgba(15, 23, 42, 0.28);
}

.monitoring-track-trips-toggle:hover {
    background: linear-gradient(180deg, #20c6db 0%, #0c8199 100%);
}

.monitoring-track-trips-toggle i {
    font-size: 16px;
    line-height: 1;
}

.monitoring-track-trips-toggle strong {
    font-size: 13px;
    line-height: 1;
}

.monitoring-track-trips-toggle.expanded {
    bottom: 212px;
}

.monitoring-track-trips-toggle span {
    min-width: 26px;
    height: 22px;
    padding: 0 7px;
    border-radius: 999px;
    background: #ffffff;
    color: #0f8fa8;
    font-size: 12px;
    font-weight: 700;
    line-height: 22px;
    text-shadow: none;
}

.monitoring-track-trips-panel {
    position: absolute;
    left: 6px;
    right: 6px;
    bottom: 6px;
    z-index: 640;
    height: 190px;
    display: flex;
    flex-direction: column;
    background: rgba(255, 255, 255, 0.97);
    border: 1px solid #b9ccd8;
    border-radius: 7px 7px 4px 4px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.22);
    transform: translateY(calc(100% - 6px));
    transition: transform 0.18s ease;
    overflow: hidden;
}

.monitoring-track-trips-panel.expanded {
    transform: translateY(0);
}

.monitoring-track-trips-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 7px 9px;
    background: #eef6f9;
    border-bottom: 1px solid #c9d7df;
    color: #1f2d3d;
}

.monitoring-track-trips-title strong {
    font-size: 12px;
}

.monitoring-track-trips-title span {
    color: #64748b;
    font-size: 10px;
}

.monitoring-track-trips-table-wrap {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.monitoring-track-trips-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 11px;
}

.monitoring-track-trips-table th,
.monitoring-track-trips-table td {
    padding: 5px 6px;
    border: 1px solid #d6e0e7;
    white-space: nowrap;
    vertical-align: middle;
}

.monitoring-track-trips-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #f6fafc;
    color: #1f2d3d;
    font-weight: 700;
}

.monitoring-track-trips-table tbody tr {
    cursor: pointer;
}

.monitoring-track-trips-table tbody tr:hover td,
.monitoring-track-trips-table tbody tr.selected td {
    background: #dbeafe;
}

.monitoring-track-trip-address {
    min-width: 160px;
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.monitoring-fuel-report {
    background: #ffffff;
}

.monitoring-fuel-report-right {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.monitoring-fuel-content {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.monitoring-orders-journal-zone {
    flex: 1 1 auto;
    min-height: 150px;
    overflow: hidden;
}

.monitoring-orders-report-expanded .monitoring-orders-journal-zone {
    flex: 0 0 auto;
    max-height: 70vh;
}

.monitoring-orders-journal-zone .main-table-wrapper {
    height: 100%;
    max-height: none;
}

.monitoring-orders-bottom-toggle {
    position: relative;
    flex: 0 0 auto;
    height: 18px;
    cursor: row-resize;
    background: #152033;
    border-top: 1px solid #24344a;
    border-bottom: 1px solid #24344a;
    display: flex;
    align-items: center;
    justify-content: center;
}

.monitoring-orders-bottom-toggle:hover {
    background: #20314a;
}

.monitoring-orders-resizing,
.monitoring-orders-resizing * {
    cursor: row-resize !important;
    user-select: none !important;
}

.monitoring-orders-bottom-toggle:before {
    content: "";
    position: relative;
    width: 48px;
    height: 5px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 1px 0 rgba(71, 85, 105, 0.18);
}

.monitoring-orders-bottom-toggle:after {
    content: "";
    position: absolute;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #6f8794;
}

.monitoring-orders-bottom-toggle.expanded:after {
    border-bottom: 0;
    border-top: 5px solid #6f8794;
}

.monitoring-orders-bottom-toggle span {
    position: relative;
    width: 48px;
    height: 5px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 1px 0 rgba(71, 85, 105, 0.18);
}

.monitoring-orders-bottom-toggle span:after {
    content: "";
    position: absolute;
    left: 50%;
    top: -3px;
    transform: translateX(-50%);
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #6f8794;
}

.monitoring-orders-bottom-toggle.expanded span:after {
    top: 3px;
    border-bottom: 0;
    border-top: 5px solid #6f8794;
}

.monitoring-fuel-report-inner {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.monitoring-fuel-header {
    flex: 0 0 auto;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 2px 8px;
    border-bottom: 1px solid #b9c0c6;
    background: #ffffff;
}

.monitoring-fuel-title-line {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
    text-align: center;
    font-size: 12px;
    line-height: 1.15;
}

.monitoring-print-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 30px;
    padding: 4px 12px;
    border: 1px solid #0f8fa0;
    border-radius: 6px;
    background: linear-gradient(180deg, #22c4d6 0%, #1294a6 100%);
    color: #ffffff;
    font-weight: 700;
    line-height: 1.1;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.22);
    transition: background-color 0.12s ease, box-shadow 0.12s ease, transform 0.12s ease;
}

.monitoring-print-action:hover,
.monitoring-print-action:focus {
    border-color: #0b7280;
    background: linear-gradient(180deg, #1bb3c4 0%, #0e8090 100%);
    color: #ffffff;
    box-shadow: 0 2px 5px rgba(15, 23, 42, 0.24);
    transform: translateY(-1px);
}

.monitoring-print-action i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.18);
    font-size: 13px;
}

.monitoring-print-action-registry {
    flex: 0 0 auto;
}

.monitoring-regenerate-confirm {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 8px 12px;
    border-bottom: 1px solid #f3b4b4;
    background: #fff1f1;
    color: #991b1b;
}

.monitoring-regenerate-confirm-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 13px;
    line-height: 1.25;
}

.monitoring-regenerate-confirm-text strong {
    font-size: 14px;
}

.monitoring-regenerate-confirm-actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
}

.monitoring-toolbar-action,
.monitoring-type-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 30px;
    padding: 4px 12px;
    border: 1px solid #0f8fa0;
    border-radius: 6px;
    background: #ffffff;
    color: #0f7080;
    font-weight: 700;
    line-height: 1.1;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
    transition: background-color 0.12s ease, box-shadow 0.12s ease, transform 0.12s ease;
}

.monitoring-toolbar-action:hover,
.monitoring-toolbar-action:focus,
.monitoring-type-action:hover,
.monitoring-type-action:focus,
.monitoring-type-action.active {
    border-color: #0b7280;
    background: linear-gradient(180deg, #22c4d6 0%, #1294a6 100%);
    color: #ffffff;
    box-shadow: 0 2px 5px rgba(15, 23, 42, 0.2);
    transform: translateY(-1px);
}

.monitoring-fill-action {
    background: linear-gradient(180deg, #22c4d6 0%, #1294a6 100%);
    border-color: #0f8fa0;
    color: #ffffff;
}

.monitoring-fill-action:hover,
.monitoring-fill-action:focus {
    background: linear-gradient(180deg, #1bb3c4 0%, #0e8090 100%);
    border-color: #0b7280;
    color: #ffffff;
}

.monitoring-fuel-print-button {
    position: absolute;
    left: 8px;
    top: 2px;
    height: 26px;
    padding: 3px 9px;
}

.monitoring-object-data-toggle {
    position: absolute;
    left: 105px;
    top: 3px;
    width: 28px;
    height: 24px;
    padding: 0;
    border: 1px solid #0f8fa0;
    border-radius: 5px;
    background: #ffffff;
    color: #0f7080;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.14);
}

.monitoring-object-data-toggle:hover,
.monitoring-object-data-toggle:focus,
.monitoring-object-data-toggle.active {
    border-color: #0b7280;
    background: linear-gradient(180deg, #22c4d6 0%, #1294a6 100%);
    color: #ffffff;
}

.monitoring-object-data-panel {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.monitoring-object-data-wrapper {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    max-height: none;
    overflow: auto !important;
}

.monitoring-object-data-table {
    margin-bottom: 0;
    font-size: 12px;
    white-space: nowrap;
}

.monitoring-object-data-table th {
    position: sticky;
    top: 0;
    z-index: 2;
}

.monitoring-object-data-table tfoot td {
    position: sticky;
    bottom: 0;
    z-index: 2;
    background: #eaf7fb;
    color: #142033;
    font-weight: 700;
    border-top: 1px solid #9fb7c2;
}

.monitoring-period-print-panel {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    padding: 10px 12px;
    border-top: 1px solid #b8cad5;
    border-bottom: 1px solid #b8cad5;
    background: linear-gradient(180deg, #f7fbfd 0%, #e9f3f7 100%);
    box-shadow: inset 4px 0 0 #08a8c5;
}

.monitoring-period-print-title {
    min-width: 220px;
    color: #142033;
    line-height: 1.25;
}

.monitoring-period-print-title strong,
.monitoring-period-print-title span {
    display: block;
}

.monitoring-period-print-title span {
    color: #5b6b7a;
    font-size: 12px;
    margin-top: 3px;
}

.monitoring-period-print-fields {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    flex: 1;
}

.monitoring-period-print-fields label {
    margin: 0;
    font-size: 12px;
    color: #415466;
}

.monitoring-period-print-fields label > span {
    display: block;
    margin-bottom: 3px;
}

.monitoring-period-date-field {
    position: relative;
}

.monitoring-period-date-input {
    width: 215px;
}

.monitoring-period-date-input .form-control {
    height: 31px;
    font-size: 13px;
}

.monitoring-period-date-input .input-group-text {
    height: 31px;
    cursor: pointer;
    color: #26374d;
    background: #f8fafc;
}

.monitoring-period-date-menu {
    top: 54px;
    left: 0;
    z-index: 2050;
    min-width: 520px;
    padding: 8px;
    border: 1px solid #b8cad5;
    box-shadow: 0 12px 28px rgba(21, 32, 51, 0.18);
}

.monitoring-period-date-menu-right {
    left: auto;
    right: 0;
}

.monitoring-period-print-check {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    min-height: 31px;
    color: #142033 !important;
}

.monitoring-period-print-check input {
    margin: 0;
}

.monitoring-period-print-check span {
    margin: 0 !important;
}

.monitoring-period-print-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.monitoring-fuel-legend {
    position: absolute;
    right: 10px;
    top: 9px;
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    font-size: 12px;
    color: #334155;
}

.monitoring-fuel-inline-legend {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #334155;
}

.monitoring-fuel-chart-switch {
    display: inline-flex;
    align-items: center;
    border: 1px solid #aab7c4;
    background: #f4f7fa;
}

.monitoring-fuel-chart-switch button {
    height: 22px;
    padding: 0 8px;
    border: 0;
    border-right: 1px solid #aab7c4;
    background: transparent;
    color: #1f2937;
    font-size: 12px;
    line-height: 20px;
    cursor: pointer;
}

.monitoring-fuel-chart-switch button:last-child {
    border-right: 0;
}

.monitoring-fuel-chart-switch button.active {
    background: #1f6fd1;
    color: #ffffff;
}

.monitoring-fuel-source-switch {
    position: absolute;
    left: 142px;
    top: 4px;
    flex: 0 0 auto;
}

.legend-line {
    display: inline-block;
    width: 22px;
    height: 3px;
    margin-right: 4px;
    vertical-align: middle;
    border-radius: 2px;
}

.legend-tank {
    background: #2563eb;
}

.legend-engine {
    background: #dc2626;
}

.legend-speed {
    background: #16a34a;
}

.monitoring-fuel-table-wrapper {
    flex: 0 0 auto;
    overflow-x: auto;
}

.monitoring-fuel-events-row {
    flex: 0 0 auto;
    display: flex;
    align-items: stretch;
    gap: 10px;
    overflow: hidden;
}

.monitoring-fuel-refuel-wrapper {
    width: 65%;
    min-width: 760px;
    max-width: 100%;
}

.monitoring-fuel-drain-panel {
    flex: 1 1 auto;
    min-width: 300px;
    overflow-x: auto;
}

.monitoring-fuel-drain-title {
    height: 21px;
    padding: 2px 8px;
    color: #dc2626;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1.1;
}

.monitoring-fuel-table {
    min-width: 980px;
    font-size: 11px;
    background: #fff;
    color: #111827;
}

.monitoring-fuel-table tr {
    height: 20px !important;
}

.monitoring-fuel-table .monitoring-fuel-group-row {
    height: 17px !important;
}

.monitoring-fuel-table .monitoring-fuel-title-row {
    height: 21px !important;
}

.monitoring-fuel-refuel-table {
    min-width: 760px;
}

.monitoring-fuel-drain-table {
    min-width: 380px;
}

.monitoring-fuel-table th,
.monitoring-fuel-table td {
    height: 20px !important;
    padding: 1px 4px;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    border-color: #d8dde2 !important;
    line-height: 1.05;
}

.monitoring-fuel-title-row th {
    background: #697781 !important;
    color: #111827;
    font-weight: 700;
    border-color: #697781 !important;
    height: 21px !important;
    padding-top: 1px;
    padding-bottom: 1px;
    line-height: 1.05;
}

.monitoring-fuel-group-row th {
    background: #e8ebef !important;
    color: #111827;
    font-weight: 700;
    height: 17px !important;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 1;
}

.monitoring-fuel-table tbody tr:nth-child(odd) td {
    background: #ffffff;
}

.monitoring-fuel-table tbody tr:nth-child(even) td {
    background: #f3f5f7;
}

.monitoring-calibration-cell {
    cursor: pointer;
    color: #0f5fb6;
    font-weight: 700;
}

.monitoring-calibration-cell:hover {
    background: #e6f3ff !important;
    box-shadow: inset 0 0 0 1px #38a3d7;
}

.monitoring-calibration-confirm {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 7px 10px;
    border-top: 1px solid #b7c7d4;
    border-bottom: 1px solid #b7c7d4;
    background: #eef6fb;
    color: #111827;
    font-size: 12px;
}

.monitoring-calibration-confirm-title {
    font-weight: 700;
}

.monitoring-calibration-date-field {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    color: #334155;
    white-space: nowrap;
}

.monitoring-calibration-date-field .form-control {
    width: 140px;
}

.monitoring-calibration-confirm-info {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    color: #334155;
}

.monitoring-calibration-confirm-info span:not(:last-child)::after {
    content: "|";
    margin-left: 8px;
    color: #94a3b8;
}

.monitoring-calibration-confirm-actions {
    display: flex;
    gap: 6px;
    margin-left: auto;
}

.monitoring-fuel-chart {
    flex: 1 1 auto;
    min-height: 180px;
    height: auto;
    padding: 4px 8px 8px;
    border-top: 1px solid #d7dee8;
    background: #fff;
    overflow: hidden;
}

.monitoring-fuel-chart-status {
    flex: 1 1 auto;
    min-height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-top: 1px solid #d7dee8;
    background: #fff;
    color: #5b6b7a;
    font-size: 13px;
}

.monitoring-fuel-chart-error {
    color: #d81f1f;
}

.monitoring-fuel-amchart {
    width: 100%;
    height: 100%;
}

.monitoring-fuel-chart svg {
    width: 100%;
    height: 100%;
    border: 1px solid #d1d5db;
    background: #f9fafb;
    cursor: grab;
    user-select: none;
    touch-action: none;
}

.monitoring-fuel-chart svg:active {
    cursor: grabbing;
}

.monitoring-fuel-chart .chart-grid line {
    stroke: rgba(148, 163, 184, 0.42);
    stroke-width: 1;
}

.monitoring-fuel-chart .chart-time-axis text {
    fill: #475569;
    font-size: 12px;
    text-anchor: middle;
}

.monitoring-fuel-chart .chart-fuelings line {
    stroke: rgba(22, 163, 74, 0.35);
    stroke-width: 2;
    stroke-dasharray: 5 5;
}

.monitoring-fuel-chart polyline {
    fill: none;
    stroke-linejoin: round;
    stroke-linecap: round;
}

.monitoring-fuel-chart .chart-tank-line {
    stroke: #2563eb;
    stroke-width: 3;
}

.monitoring-fuel-chart .chart-engine-line {
    stroke: #dc2626;
    stroke-width: 3;
}

.monitoring-fuel-chart .chart-speed-line,
.monitoring-print-chart-svg .chart-speed-line {
    stroke: #16a34a;
    stroke-width: 2;
    stroke-dasharray: 6 4;
}

.monitoring-print-area {
    display: none;
}

.monitoring-print-header {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    align-items: center;
    gap: 12px;
    padding: 8px 10px;
    border-bottom: 3px solid #263445;
}

.monitoring-print-brand {
    color: #0f6db6;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: .8px;
}

.monitoring-print-title {
    color: #111827;
    font-size: 16px;
    font-weight: 800;
    text-align: center;
}

.monitoring-print-title small {
    display: block;
    margin-top: 2px;
    color: #4b5563;
    font-size: 11px;
    font-weight: 500;
}

.monitoring-print-muted {
    color: #5f6b77;
    font-size: 10px;
}

.monitoring-print-summary {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 6px;
    padding: 8px 0;
}

.monitoring-print-summary div {
    min-height: 40px;
    padding: 5px 7px;
    border: 1px solid #d5dce3;
    background: #f7f9fb;
}

.monitoring-print-summary span {
    display: block;
    color: #64748b;
    font-size: 9px;
}

.monitoring-print-summary b {
    display: block;
    margin-top: 2px;
    color: #111827;
    font-size: 12px;
    line-height: 1.2;
}

.monitoring-print-section-title {
    margin-top: 6px;
    padding: 4px 8px;
    background: #697781;
    color: #111827;
    font-size: 12px;
    font-weight: 800;
    text-align: center;
}

.monitoring-print-table {
    width: 100%;
    border-collapse: collapse;
    color: #111827;
    font-size: 9px;
}

.monitoring-print-table th,
.monitoring-print-table td {
    padding: 3px 4px;
    border: 1px solid #cfd6dd;
    text-align: center;
    vertical-align: middle;
}

.monitoring-print-table th {
    background: #e8ebef;
    font-weight: 800;
}

.monitoring-print-table tbody tr:nth-child(even) td {
    background: #f3f5f7;
}

.monitoring-print-table small {
    display: block;
    color: #64748b;
    font-size: 8px;
    line-height: 1.1;
}

.monitoring-print-group-row th {
    background: #dfe4ea;
    padding-top: 2px;
    padding-bottom: 2px;
    line-height: 1.05;
}

.monitoring-print-danger {
    color: #dc2626;
    font-weight: 800;
}

.monitoring-print-refuel-table {
    width: 65%;
    min-width: 720px;
}

.monitoring-print-map {
    margin-top: 4px;
    border: 1px solid #cfd6dd;
    background: #f8fafc;
    page-break-inside: avoid;
}

.monitoring-print-map svg {
    display: block;
    width: 100%;
    height: 210px;
}

.monitoring-print-map-image {
    display: block;
    width: 100%;
    height: 210px;
    object-fit: cover;
}

.monitoring-print-interactive-map {
    width: 100%;
    height: 210px;
    background: #eef3f8;
}

.monitoring-print-interactive-map .maplibregl-control-container {
    display: none;
}

.monitoring-print-map-caption,
.monitoring-print-empty {
    padding: 3px 6px;
    color: #475569;
    font-size: 9px;
    text-align: center;
}

.monitoring-print-map .print-map-bg {
    fill: #f7fbff;
}

.monitoring-print-map .print-map-grid line {
    stroke: rgba(148, 163, 184, 0.32);
    stroke-width: 1;
}

.monitoring-print-map .print-map-track-shadow {
    fill: none;
    stroke: #ffffff;
    stroke-width: 10;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.monitoring-print-map .print-map-track {
    fill: none;
    stroke: #1e8bff;
    stroke-width: 5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.monitoring-print-map .print-map-start {
    fill: #16a34a;
    stroke: #ffffff;
    stroke-width: 4;
}

.monitoring-print-map .print-map-finish {
    fill: #ef4444;
    stroke: #ffffff;
    stroke-width: 4;
}

.monitoring-print-chart-block {
    margin-top: 8px;
    page-break-inside: avoid;
}

.monitoring-print-chart-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 4px 8px;
    border: 1px solid #cfd6dd;
    border-bottom: 0;
    color: #111827;
    font-size: 11px;
    font-weight: 800;
}

.monitoring-print-chart-svg {
    display: block;
    width: 100%;
    height: 250px;
    border: 1px solid #cfd6dd;
    background: #ffffff;
}

.monitoring-print-chart-svg .chart-grid line {
    stroke: rgba(148, 163, 184, 0.55);
    stroke-width: 0.7;
}

.monitoring-print-chart-svg .chart-tank-line {
    fill: none;
    stroke: #2563eb;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.monitoring-print-chart-svg .chart-engine-line {
    fill: none;
    stroke: #dc2626;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.monitoring-print-chart-svg .chart-speed-line {
    stroke-width: 1.5;
}

.monitoring-print-chart-svg .chart-drain-markers line {
    stroke: #dc2626;
    stroke-width: 1.4;
    stroke-dasharray: 5 4;
}

.monitoring-print-chart-svg .chart-drain-markers text {
    fill: #dc2626;
    font-size: 11px;
    font-weight: 700;
}

.monitoring-print-chart-svg .chart-time-axis text {
    fill: #475569;
    font-size: 10px;
    text-anchor: middle;
}

.monitoring-print-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    padding: 8px 0;
    color: #334155;
    font-size: 11px;
}

.monitoring-print-registry-table {
    font-size: 8px;
}

.monitoring-print-registry-table tfoot td {
    background: #e8ebef;
    font-size: 10px;
    font-weight: 800;
    text-align: left;
}

@media print {
    @page monitoring-object-report {
        size: A4 portrait;
        margin: 2mm;
    }

    @page monitoring-registry-report {
        size: A4 landscape;
        margin: 2mm;
    }

    html,
    body {
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.monitoring-printing * {
        visibility: hidden !important;
    }

    body.monitoring-printing .monitoring-print-area {
        display: none !important;
    }

    body.monitoring-printing .monitoring-print-active,
    body.monitoring-printing .monitoring-print-active * {
        visibility: visible !important;
    }

    body.monitoring-printing .monitoring-print-active {
        display: block !important;
        position: absolute !important;
        left: 0 !important;
        top: 0;
        width: calc(100% - 4mm);
        background: #ffffff;
        color: #111827;
        transform: none !important;
        pointer-events: auto !important;
        z-index: 2147483000 !important;
        opacity: 1 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .monitoring-print-single.monitoring-print-active {
        page: monitoring-object-report;
        width: 206mm !important;
        max-width: 206mm !important;
        min-width: 206mm !important;
        margin: 0 auto !important;
    }

    .monitoring-print-registry.monitoring-print-active {
        page: monitoring-registry-report;
        width: 293mm !important;
        max-width: 293mm !important;
        min-width: 293mm !important;
        margin: 0 auto !important;
    }

    .monitoring-print-single .monitoring-print-header {
        grid-template-columns: 1fr 1.7fr 1fr;
        padding: 8px 0 7px;
    }

    .monitoring-print-single .monitoring-print-title {
        font-size: 16px;
    }

    .monitoring-print-single .monitoring-print-title small {
        font-size: 11px;
    }

    .monitoring-print-single .monitoring-print-brand {
        font-size: 19px;
    }

    .monitoring-print-single .monitoring-print-summary {
        grid-template-columns: repeat(2, 1fr);
        gap: 5px;
        padding: 7px 0;
    }

    .monitoring-print-single .monitoring-print-summary div {
        min-height: 34px;
        padding: 5px 7px;
    }

    .monitoring-print-single .monitoring-print-summary span {
        font-size: 10px;
    }

    .monitoring-print-single .monitoring-print-summary b {
        font-size: 13px;
    }

    .monitoring-print-single .monitoring-print-muted {
        font-size: 10px;
    }

    .monitoring-print-single .monitoring-print-section-title {
        font-size: 12px;
        padding: 4px 8px;
    }

    .monitoring-print-single .monitoring-print-table {
        font-size: 9.2px;
    }

    .monitoring-print-single .monitoring-print-table th,
    .monitoring-print-single .monitoring-print-table td {
        padding: 3.5px 4.5px;
    }

    .monitoring-print-single .monitoring-print-table small {
        font-size: 8px;
    }

    .monitoring-print-single .monitoring-print-refuel-table {
        width: 100%;
        min-width: 0;
    }

    .monitoring-print-single .monitoring-print-chart-svg {
        height: 235px;
    }

    .monitoring-print-single .monitoring-print-map svg {
        height: 205px;
    }

    .monitoring-print-single .monitoring-print-map-image {
        height: 205px;
    }

    .monitoring-print-single .monitoring-print-interactive-map {
        height: 205px;
    }

    .monitoring-print-single .monitoring-print-chart-title {
        font-size: 11px;
        padding: 4px 8px;
    }

    .monitoring-print-registry-table {
        font-size: 9.4px;
    }

    .monitoring-print-registry .monitoring-print-title {
        font-size: 17px;
    }

    .monitoring-print-registry .monitoring-print-brand {
        font-size: 19px;
    }

    .monitoring-print-registry .monitoring-print-filters {
        font-size: 11.5px;
    }

    .monitoring-print-table th,
    .monitoring-print-table td,
    .monitoring-print-summary div,
    .monitoring-print-chart-title,
    .monitoring-print-chart-svg {
        break-inside: avoid;
    }
}

.track-direction-arrow {
    background: transparent;
    border: 0;
    pointer-events: none;
}

.track-direction-arrow svg {
    display: block;
    width: 24px;
    height: 24px;
    opacity: 0.98;
    filter: drop-shadow(0 1px 2px rgba(15, 23, 42, 0.24));
    transform-origin: 50% 50%;
}

.track-direction-arrow-outline {
    fill: #ffffff;
    stroke: #ffffff;
    stroke-width: 2;
    stroke-linejoin: round;
}

.track-direction-arrow-fill {
    fill: currentColor;
    stroke: currentColor;
    stroke-width: 1.2;
    stroke-linejoin: round;
}

.track-edge-marker {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 3px solid rgba(255, 255, 255, 0.95);
    border-radius: 50%;
    color: #fff;
    font-size: 0;
    line-height: 1;
    box-shadow: 0 5px 12px rgba(15, 23, 42, 0.22), 0 0 0 2px rgba(37, 99, 235, 0.14);
}

.track-edge-marker span {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.track-start-marker {
    background: #0ea5e9;
}

.track-finish-marker {
    background: #ef4444;
    box-shadow: 0 7px 16px rgba(15, 23, 42, 0.25), 0 0 0 4px rgba(239, 68, 68, 0.14);
}

.track-stop-marker {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border: 3px solid #ff4f1f;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.2);
}

.track-stop-marker-wide {
    width: 34px !important;
    border-radius: 12px;
}

.track-stop-marker span {
    display: block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #ffffff;
}

.track-drain-marker {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 34px !important;
    height: 38px !important;
    border: 0;
    background: transparent;
    z-index: 24;
}

.track-drain-marker:before {
    content: "";
    position: absolute;
    left: 6px;
    top: 1px;
    width: 22px;
    height: 22px;
    transform: rotate(45deg);
    border: 2px solid rgba(255, 255, 255, 0.98);
    border-radius: 50% 50% 50% 4px;
    background: #dc2626;
    box-shadow: 0 8px 18px rgba(127, 29, 29, 0.35), 0 0 0 4px rgba(220, 38, 38, 0.18);
}

.track-drain-marker:after {
    content: "";
    position: absolute;
    left: 14px;
    top: 9px;
    width: 6px;
    height: 9px;
    border-radius: 7px 7px 7px 2px;
    background: #ffffff;
    transform: rotate(35deg);
    box-shadow: inset 0 -1px 0 rgba(127, 29, 29, 0.22);
}

.track-stop-tooltip,
.track-finish-tooltip,
.track-drain-tooltip {
    border: 1px solid rgba(59, 130, 246, 0.45);
    border-radius: 6px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.22);
    color: #1f2937;
    font-size: 12px;
    font-weight: 600;
}

.track-stop-tooltip {
    display: flex;
    align-items: center;
    gap: 4px;
    border-color: rgba(47, 134, 231, 0.35);
    border-radius: 999px;
    box-shadow: 0 5px 14px rgba(15, 23, 42, 0.16);
    color: #334155;
    font-size: 11px;
    font-weight: 700;
    padding: 3px 7px;
}

.track-stop-tooltip-number {
    color: #334155;
    font-weight: 700;
}

.track-stop-tooltip-parking {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 13px;
    height: 13px;
    border: 1px solid rgba(47, 134, 231, 0.45);
    border-radius: 3px;
    color: #2f86e7;
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
}

.track-drain-tooltip {
    border-color: rgba(220, 38, 38, 0.36);
    border-radius: 7px;
    color: #991b1b;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.25;
    padding: 4px 8px;
}

.track-player-marker {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 34px !important;
    height: 34px !important;
    border-radius: 50%;
    background: rgba(37, 99, 235, 0.16);
}

.track-player-marker span {
    display: block;
    width: 18px;
    height: 18px;
    border: 3px solid #ffffff;
    border-radius: 50%;
    background: #f59e0b;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.35), 0 0 0 4px rgba(245, 158, 11, 0.25);
}

.track-player-marker small {
    position: absolute;
    left: 50%;
    top: 26px;
    transform: translateX(-50%);
    padding: 1px 5px;
    border-radius: 4px;
    background: #ffffff;
    color: #111827;
    font-size: 10px;
    line-height: 1.2;
    white-space: nowrap;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.22);
}

.track-player-tooltip {
    border: 1px solid rgba(245, 158, 11, 0.45);
    border-radius: 6px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.22);
    color: #1f2937;
    font-size: 12px;
    font-weight: 600;
}

.monitoring-measure-active,
.monitoring-area-measure-active {
    cursor: crosshair;
}

.track-measure-label {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 82px;
    height: 26px;
    padding: 0 8px;
    border: 1px solid rgba(17, 24, 39, 0.25);
    border-radius: 6px;
    background: #fff;
    color: #111827;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.22);
}

.track-area-measure-label {
    border-color: #0f766e;
    color: #0f766e;
}

.monitoring-track-map-area .maplibregl-ctrl-attrib {
    display: none !important;
}

.track-finish-marker {
    z-index: 730 !important;
}

.track-start-tooltip.maplibregl-popup {
    z-index: 735;
}

.track-finish-tooltip.maplibregl-popup {
    z-index: 740;
}

.track-stop-tooltip.maplibregl-popup {
    z-index: 720;
}

.track-start-tooltip .maplibregl-popup-content,
.track-finish-tooltip .maplibregl-popup-content,
.track-drain-tooltip .maplibregl-popup-content,
.track-player-tooltip .maplibregl-popup-content {
    padding: 4px 8px;
    border-radius: 6px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.22);
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
}

.track-stop-tooltip .maplibregl-popup-content {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 8px;
    border: 1px solid #ff4f1f;
    border-radius: 6px;
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.18);
    color: #1f2937;
    font-size: 12px;
    line-height: 1.2;
    white-space: nowrap;
}

.track-stop-tooltip.maplibregl-popup {
    display: block;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.track-stop-tooltip.maplibregl-popup-anchor-bottom .maplibregl-popup-tip,
.track-stop-tooltip.maplibregl-popup-anchor-bottom-left .maplibregl-popup-tip,
.track-stop-tooltip.maplibregl-popup-anchor-bottom-right .maplibregl-popup-tip {
    border-top-color: #ff4f1f;
}

.track-stop-tooltip.maplibregl-popup-anchor-top .maplibregl-popup-tip,
.track-stop-tooltip.maplibregl-popup-anchor-top-left .maplibregl-popup-tip,
.track-stop-tooltip.maplibregl-popup-anchor-top-right .maplibregl-popup-tip {
    border-bottom-color: #ff4f1f;
}

.track-stop-tooltip.maplibregl-popup-anchor-left .maplibregl-popup-tip {
    border-right-color: #ff4f1f;
}

.track-stop-tooltip.maplibregl-popup-anchor-right .maplibregl-popup-tip {
    border-left-color: #ff4f1f;
}

.track-stop-tooltip-number {
    color: #1f2937;
}

.track-stop-tooltip-parking {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 13px;
    height: 13px;
    border: 1px solid #2f86e7;
    border-radius: 3px;
    color: #2f86e7;
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
}

.track-stop-detail-tooltip.maplibregl-popup {
    z-index: 750;
}

.track-stop-detail-tooltip .maplibregl-popup-content {
    padding: 0;
    border: 1px solid rgba(255, 79, 31, 0.45);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.28);
    overflow: hidden;
    min-width: 220px;
    max-width: 300px;
}

.track-stop-detail-tooltip.maplibregl-popup-anchor-bottom .maplibregl-popup-tip {
    border-top-color: #ff4f1f;
}

.track-stop-detail-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 6px 10px;
    background: #ff4f1f;
    color: #ffffff;
    font-size: 12px;
    line-height: 1.3;
}

.track-stop-detail-header strong {
    font-weight: 800;
    white-space: nowrap;
}

.track-stop-detail-header span {
    font-weight: 600;
    white-space: nowrap;
}

.track-stop-detail-table {
    width: 100%;
    max-height: 260px;
    border-collapse: collapse;
    font-size: 12px;
    color: #1f2937;
    display: block;
    overflow-y: auto;
    max-height: 240px;
}

.track-stop-detail-table tbody,
.track-stop-detail-table tr {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.track-stop-detail-name {
    padding: 5px 10px;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    color: #475569;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.track-stop-detail-name i {
    margin-right: 4px;
    color: #ff4f1f;
}

.track-stop-detail-value {
    padding: 5px 10px;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    font-weight: 700;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.track-stop-detail-empty {
    padding: 8px 10px;
    color: #94a3b8;
    text-align: center;
    font-style: italic;
}

.vehicle-sensors-panel .p-2 {
    padding: 4px 8px !important;
}

.vehicle-sensors-table {
    table-layout: fixed;
    margin-bottom: 0;
}

.vehicle-sensors-table th:first-child,
.vehicle-sensors-table td.vehicle-sensor-name-cell {
    width: 42%;
}

.vehicle-sensors-table th:last-child,
.vehicle-sensors-table td.vehicle-sensor-value-cell {
    width: 58%;
}

.vehicle-sensors-table td {
    padding-top: 1px;
    padding-bottom: 1px;
    vertical-align: middle;
    height: 25px;
    line-height: 1.15;
    font-size: 12px;
}

.vehicle-sensors-table th {
    padding-top: 3px;
    padding-bottom: 3px;
    height: 24px;
    line-height: 1.15;
}

.vehicle-sensor-name {
    max-width: 100%;
    margin-right: 0;
}

.vehicle-sensor-name .custom-control-label {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.vehicle-sensor-value {
    display: flex;
    align-items: center;
    min-height: 22px;
    gap: 6px;
}

.vehicle-sensor-icon-box {
    flex: 0 0 22px;
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.vehicle-sensor-icon {
    display: block;
    max-width: 16px;
    max-height: 16px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.vehicle-sensor-text {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.login-extra-title {
    color: #1b6fa8;
    font-size: 16px;
    font-weight: 700;
    margin: 14px 0 8px;
}

.login-extra-text {
    color: #43566a;
    font-size: 13px;
    line-height: 1.35;
    margin-bottom: 14px;
}

.object-management-panel {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    background: #f4f7fb;
    color: #1f2d3d;
    font-size: 11px;
}

.object-management-topbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    min-height: 34px;
    padding: 5px 8px;
    border-bottom: 1px solid #25364d;
    background: #152033;
}

.object-management-select-tools,
.object-management-view-tools,
.object-management-counts {
    display: flex;
    align-items: center;
    gap: 4px;
}

.object-management-counts {
    min-width: 0;
    flex: 1 1 56px;
    white-space: nowrap;
    color: #e6eef7;
    font-size: 11px;
}

/* При узкой панели набор кнопок переносится на вторую строку, а не наезжает на счётчики. */
.object-management-view-tools {
    flex-wrap: wrap;
    margin-left: auto;
}

.object-management-toolbar-button {
    width: 20px;
    height: 20px;
    padding: 0;
    color: #d7e4f1;
    line-height: 20px;
}

.object-management-tools {
    display: flex;
    gap: 6px;
    padding: 6px 8px;
    border-bottom: 1px solid #d6dee8;
    background: #ffffff;
}

.object-management-tools .input-group {
    min-width: 0;
}

.object-management-icon-button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid rgba(45, 168, 223, .22);
    border-radius: 6px;
    background: #e8f4fb;
    color: #1886bd;
    line-height: 1;
    box-shadow: inset 0 0 0 1px rgba(45, 168, 223, .08);
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.object-management-icon-button i {
    font-size: 14px;
    line-height: 1;
}

.object-management-icon-button:hover,
.object-management-icon-button:focus {
    border-color: #2da8df;
    background: #2da8df;
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(45, 168, 223, .22);
}

.object-management-icon-button:active {
    transform: translateY(1px);
}

.object-management-icon-button:disabled,
.object-management-icon-button.disabled {
    border-color: #d5e0eb;
    background: #f3f7fb;
    color: #9aaabc;
    box-shadow: none;
    opacity: 1;
}

.object-management-icon-button.active {
    border-color: #1886bd;
    color: #ffffff;
    background: #1886bd;
    box-shadow: 0 4px 12px rgba(24, 134, 189, .22);
}

.object-management-icon-button-primary {
    border-color: #1886bd;
    color: #ffffff;
    background: #1886bd;
    box-shadow: 0 4px 12px rgba(24, 134, 189, .2);
}

.object-management-icon-button-primary:hover,
.object-management-icon-button-primary:focus {
    border-color: #0f6ca2;
    background: #0f6ca2;
}

.object-management-danger-button {
    border-color: rgba(205, 67, 78, .25);
    background: #fff0f2;
    color: #b73b48;
}

.object-management-danger-button:hover,
.object-management-danger-button:focus {
    border-color: #c94553;
    background: #c94553;
    color: #ffffff;
}

.object-management-geozones-mode,
.object-management-objects-mode {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    flex-direction: column;
}

.geozone-tree-scroll {
    min-height: 120px;
}

.geozone-row .geozone-type-icon {
    flex: 0 0 18px;
    width: 18px;
    color: #1886bd;
    text-align: center;
}

.geozone-inline-edit {
    flex: 0 0 18px;
    color: #4d6580;
}

.geozone-row.selected .geozone-type-icon,
.geozone-row.selected .geozone-kind,
.geozone-row.selected .geozone-inline-edit {
    color: #ffffff;
}

.geozone-row.drop-target {
    outline: 1px dashed rgba(45, 168, 223, .5);
    outline-offset: -3px;
}

.geozone-name {
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* площадь поля в списке геозон — сразу после названия */
.geozone-area {
    flex: 0 0 auto;
    color: #2d6a3e;
    font-weight: 600;
    white-space: nowrap;
}

.geozone-row.selected .geozone-area {
    color: #ffffff;
}

.geozone-kind {
    flex: 0 0 auto;
    max-width: 120px;
    overflow: hidden;
    color: #60748a;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.geozone-editor-panel {
    flex: 0 0 245px;
    min-height: 180px;
    overflow: auto;
    padding: 8px;
    background: #ffffff;
}

.geozone-editor-title {
    min-height: 28px;
    margin-bottom: 8px;
    padding: 6px 8px;
    border-radius: 4px;
    background: #e8f4fb;
    color: #152033;
    font-weight: 600;
    text-align: center;
}

.geozone-selected-card,
.geozone-editor-form {
    min-height: 0;
}

.geozone-editor-form .form-group {
    display: grid;
    grid-template-columns: 124px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.geozone-editor-form label {
    margin-bottom: 0;
    color: #24364d;
    font-weight: 600;
}

.geozone-color-input {
    height: 30px;
    padding: 2px;
}

.geozone-toggle {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    min-height: 26px;
    margin: 0 0 7px 0;
    font-weight: 400 !important;
    line-height: 1.25;
}

.geozone-toggle input {
    flex: 0 0 auto;
    margin-top: 2px;
}

.geozone-toggle span {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
}

.geozone-draw-hint {
    display: flex;
    gap: 8px;
    margin: 0 0 8px;
    padding: 7px 9px;
    border-radius: 4px;
    background: #fff8e1;
    border: 1px solid #f0d98a;
    color: #5a4a12;
    font-size: 12px;
    line-height: 1.35;
}

.geozone-draw-hint i {
    flex: 0 0 auto;
    margin-top: 1px;
    color: #b9770e;
}

.geozone-toggle input {
    width: 16px;
    height: 16px;
}

.geozone-color-swatch {
    display: inline-block;
    width: 92px;
    height: 14px;
    border: 1px solid rgba(21, 32, 51, .18);
    border-radius: 999px;
    vertical-align: middle;
}

.geozone-editor-actions {
    display: flex;
    gap: 8px;
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px solid #d7e2ee;
    /* «Сохранить/Отмена» всегда видны внизу панели, не надо прокручивать форму */
    position: sticky;
    bottom: 0;
    padding-bottom: 6px;
    background: #ffffff;
}

.geozone-draw-area {
    margin: 0 0 8px;
    padding: 4px 9px;
    border-radius: 4px;
    background: #e8f4fb;
    color: #1f3448;
    font-size: 12px;
}

.object-management-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.object-management-splitter {
    position: relative;
    flex: 0 0 8px;
    height: 8px;
    border-top: 1px solid #24344a;
    border-bottom: 1px solid #24344a;
    background: #152033;
    cursor: row-resize;
    user-select: none;
}

.object-management-splitter span {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 42px;
    height: 3px;
    transform: translate(-50%, -50%);
    border-radius: 3px;
    background: #d7e4f1;
}

.object-management-splitter:hover {
    background: #20314a;
}

.object-management-resizing,
.object-management-resizing * {
    cursor: row-resize !important;
    user-select: none !important;
}

.object-management-list {
    min-height: 100%;
    padding: 3px 0 8px;
}

.object-management-row {
    display: flex;
    align-items: center;
    gap: 4px;
    min-height: 24px;
    padding: 1px 6px;
    border-left: 3px solid transparent;
    cursor: pointer;
}

.object-management-row:nth-child(even) {
    background: #eef2f7;
}

.object-management-row.selected {
    color: #fff;
    background: #26384f;
}

.object-management-row.checked:not(.selected) {
    border-left-color: #0f8fa8;
}

.object-management-check {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    margin: 0;
}

.object-management-check input {
    width: 13px;
    height: 13px;
}

.object-management-group-check.partial:after {
    content: "";
    display: block;
    width: 8px;
    height: 2px;
    margin-left: -10px;
    border-radius: 2px;
    background: #0f8fa8;
    pointer-events: none;
}

.object-management-object-icon {
    display: inline-flex;
    flex: 0 0 20px;
    align-items: center;
    justify-content: center;
    color: #0f8fa8;
    position: relative;
    text-align: center;
}

.object-management-object-icon-image {
    display: block;
    width: 20px;
    height: 20px;
    object-fit: contain;
}

.object-management-recalc-spin {
    animation: object-management-recalc-spin 0.9s linear infinite;
}

.object-management-recalc-badge {
    position: absolute;
    right: -5px;
    bottom: -3px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #159bd3;
    color: #fff;
    font-size: 9px;
    line-height: 12px;
    text-align: center;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.9);
    animation: object-management-recalc-spin 0.9s linear infinite;
}

.object-management-recalc-percent {
    flex: 0 0 auto;
    min-width: 24px;
    margin-left: 2px;
    color: #159bd3;
    font-size: 10px;
    font-weight: 600;
    line-height: 1;
    text-align: right;
}

.object-management-repair-icon {
    flex: 0 0 14px;
    color: #e53935;
    font-size: 13px;
    line-height: 14px;
    text-align: center;
}

.object-management-row.selected .object-management-repair-icon {
    color: #ffb7b2;
}

/* ===== Модалка карточки сервисного наряда (клик по оранжевой иконке) ===== */
.so-order-modal-window .modal-dialog { max-width: 1200px; }
.so-order-modal-window .modal-content { max-height: 92vh; overflow: auto; }

/* ===== Форма «Заявка на перевозку топлива» (нефтевоз) ===== */
.fto-window .modal-dialog { max-width: 1080px; }
.fto-window .modal-content { border: none; border-radius: 12px; overflow: hidden; }
.fto-modal { display: flex; flex-direction: column; max-height: 92vh; }
.fto-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 16px; color: #fff; background: linear-gradient(135deg, #2477e0, #0b47a1);
}
.fto-header .fto-veh { opacity: .9; font-weight: 400; margin-left: 6px; }
.fto-body { display: flex; gap: 0; height: 72vh; }
.fto-controls { width: 46%; padding: 14px 16px; overflow-y: auto; height: 100%; }
.fto-controls label { font-size: 12px; font-weight: 600; margin-bottom: 2px; }
/* Карта — как .sh-map-box в карточке склада: обычный flex-контейнер с min-height,
   MapLibre получает высоту напрямую (никакого position:absolute). */
.fto-map-wrap { width: 54%; height: 100%; display: flex; flex-direction: column; padding: 8px; background: #f4f6f8; }
.fto-map-box { flex: 1 1 auto; min-height: 360px; border: 1px solid #dee2e6; border-radius: 6px; overflow: hidden; }
.fto-map-layers { display: flex; gap: 0; margin-bottom: 6px; }
.fto-legend {
    display: flex; gap: 12px; margin-top: 6px; font-size: 12px; color: #495561;
}
/* Маркеры точек маршрута на карте (выезд/погрузка/выгрузка/финиш). */
.fto-mk { display: flex; flex-direction: column; align-items: center; transform: translateY(4px); }
.fto-mk-dot { width: 14px; height: 14px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.35); }
.fto-mk-lbl { margin-top: 2px; font-size: 11px; font-weight: 600; color: #22303c; background: rgba(255,255,255,.85);
    padding: 0 4px; border-radius: 4px; white-space: nowrap; }
/* Бейдж дистанции поверх карты. */
.fto-dist { position: absolute; right: 8px; top: 8px; z-index: 3; background: rgba(255,255,255,.92);
    border: 1px solid #cdd6df; border-radius: 6px; padding: 3px 10px; font-size: 13px; font-weight: 600; color: #22303c; }
/* ui-select геозон на всю ширину. */
.fto-gz-select { flex: 1 1 auto; min-width: 0; }
.fto-gz-select.ui-select-container, .fto-gz-select .select2-container { width: 100% !important; display: block; }
.fto-legend .fto-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 4px; }
/* Список геозон маршрута: номер строки + бейдж типа геозоны (склад/контрагент/без привязки). */
.fto-seq { min-width: 16px; text-align: right; font-size: 12px; }
.fto-type-badge {
    flex: 0 0 auto; max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    font-size: 11px; line-height: 1.4; padding: 1px 7px; border-radius: 10px; border: 1px solid transparent;
}
.fto-badge-sh { color: #1c7a45; background: #e6f6ec; border-color: #b9e4c9; }
.fto-badge-cp { color: #6b3fbf; background: #f0eafb; border-color: #d6c7f2; }
.fto-badge-none { color: #6b7480; background: #eef1f5; border-color: #dfe4ea; }
.fto-footer {
    display: flex; justify-content: space-between; gap: 8px;
    padding: 10px 16px; border-top: 1px solid #eef1f5; background: #fafbfc;
}
.fto-status { font-size: 12px; margin-top: 6px; }

/* ===== Конструктор импорта геозон из KML (модалка перед реальной загрузкой) =====
   Окно нарочно ресайзится вручную (за уголок .modal-content) — список геозон/карта
   растут вместе с ним; ResizeObserver в контроллере зовёт map.resize() при изменении.
   18.09.2026, повторный разбор: без явных height/max-height на .modal-content и
   min-height:0 на КАЖДОМ flex-контейнере в цепочке модалка при реальном объёме (249
   геозон) просто разрасталась по контенту (список без внутреннего скролла) и вылезала
   за экран — оттуда и "не по центру", и обрезанный футер снизу. Классическая ловушка
   вложенного flexbox: у flex-элемента min-height по умолчанию auto (= высота контента),
   что глушит flex:1 1 auto и overflow-y:auto у ЛЮБОГО потомка, если хоть один
   контейнер в цепочке модалка → gzim-body → gzim-columns → gzim-list-col →
   gzim-list-scroll не сбросит его в 0. */
/* 18.09.2026, повторный разбор: display:flex;align-items:center на .modal-dialog (как
   было раньше) конфликтовал с нативным resize:both на .modal-content — при ручном
   ресайзе flexbox пересчитывал центрирование и сдвигал верх окна за пределы экрана,
   окно "пропадало". Ни одна другая модалка в проекте так не центрируется (везде только
   max-width на .modal-dialog, см. .fto-window/.so-order-modal-window/...) — убрано,
   центрирование остаётся дефолтным (как у всех), конфликта с resize нет. */
.gzim-window .modal-dialog { max-width: 95vw; }
/* Перетаскивание окна за шапку — position:fixed выставляется в момент mousedown
   (startWindowDrag), до этого — обычное дефолтное позиционирование .modal-dialog. */
.gzim-header { cursor: move; user-select: none; }
.gzim-window .modal-content {
    width: 900px; max-width: 95vw; min-width: 620px;
    height: 640px; min-height: 480px; max-height: 92vh;
    resize: both; overflow: auto; border-radius: 12px;
}
.gzim-body { padding: 0; display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.gzim-columns { display: flex; flex: 1 1 auto; min-height: 0; border-bottom: 1px solid #eef1f5; }
.gzim-map-col { padding: 14px; border-right: 1px solid #eef1f5; display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.gzim-map-layers { margin-bottom: 8px; align-self: flex-end; }
.gzim-map-box { flex: 1 1 auto; min-height: 280px; border: 1px solid #dee2e6; border-radius: 6px; overflow: hidden; }
/* Перетаскиваемый разделитель ширины карта/список — тот же паттерн, что
   .object-management-splitter, но по горизонтали (col-resize). */
.gzim-splitter {
    position: relative;
    flex: 0 0 8px;
    width: 8px;
    border-left: 1px solid #eef1f5;
    border-right: 1px solid #eef1f5;
    background: #f4f6f8;
    cursor: col-resize;
    user-select: none;
}
.gzim-splitter span {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 3px;
    height: 42px;
    transform: translate(-50%, -50%);
    border-radius: 3px;
    background: #b9c3cd;
}
.gzim-splitter:hover, .gzim-splitter:hover span { background: #8a93a0; }
.gzim-list-col { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.gzim-check-all {
    flex: 0 0 auto;
    display: flex; align-items: center; gap: 8px; padding: 10px 14px; margin: 0;
    border-bottom: 1px solid #eef1f5; font-size: 13px; color: #495561; font-weight: 400;
}
.gzim-list-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.gzim-list-table { margin-bottom: 0; font-size: 13px; }
.gzim-list-table td { vertical-align: middle; padding: 6px 10px; }
.gzim-col-check { width: 28px; }
.gzim-col-area { white-space: nowrap; }
.gzim-color-dot { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 6px; }
.gzim-row-dup { background: #fff8e6; }
.gzim-fields { flex: 0 0 auto; padding: 14px; }
.gzim-group-field .input-group-append .btn { white-space: nowrap; }
.gzim-toggle { display: flex; align-items: center; gap: 8px; margin: 8px 0 0; font-size: 13px; font-weight: 400; }
.gzim-toggle-disabled { color: #9aa4af; }
.gzim-error { margin-top: 8px; font-size: 13px; }

/* Объект в ремонте, по которому есть незавершённый наряд «в работе» — оранжевая иконка. */
.object-management-repair-icon.object-management-repair-icon-active-order {
    color: #fb8c00;
}

.object-management-row.selected .object-management-repair-icon.object-management-repair-icon-active-order {
    color: #ffcc80;
}

.object-management-repair-icon.object-management-repair-icon-active-order:hover {
    color: #ef6c00;
}

.object-management-repair-icon:hover {
    color: #b71c1c;
    cursor: pointer;
}

@keyframes object-management-recalc-spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.object-management-main {
    min-width: 0;
    flex: 1 1 auto;
}

.object-management-name-line {
    display: flex;
    align-items: center;
    min-width: 0;
    height: 20px;
}

.object-management-edit-button {
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    padding: 0;
    color: #40566f;
    font-size: 10px;
    line-height: 18px;
}

.object-management-row.selected .object-management-edit-button,
.object-management-row.selected .object-management-object-icon {
    color: #e7f4ff;
}

.object-management-state-icons {
    display: grid;
    flex: 0 0 62px;
    grid-template-columns: repeat(4, 14px);
    gap: 2px;
    align-items: center;
    justify-content: end;
    font-size: 12px;
}

.object-management-group {
    margin-top: 2px;
}

.object-management-root-drop {
    display: flex;
    align-items: center;
    gap: 5px;
    min-height: 23px;
    padding: 3px 8px;
    border-bottom: 1px solid #d5e0ea;
    background: #f6f9fc;
    color: #557284;
    font-size: 11px;
    font-weight: 600;
}

.object-management-group-header {
    display: flex;
    align-items: center;
    gap: 5px;
    min-height: 24px;
    padding: 3px 8px;
    color: #334960;
    border-top: 1px solid #d5e0ea;
    border-bottom: 1px solid #d5e0ea;
    background: #e8f0f6;
    font-size: 11px;
    font-weight: 700;
    cursor: grab;
    user-select: none;
}

.object-management-group-header.selected {
    color: #ffffff;
    border-color: #6b7a8d;
    background: #718096;
}

.object-management-group-header.selected i,
.object-management-group-header.selected small {
    color: #ffffff;
}

.object-management-group-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 16px;
    width: 16px;
    height: 16px;
    padding: 0;
    border: 0;
    border-radius: 4px;
    background: #b8d5e2;
    color: #ffffff;
    font-size: 13px;
    line-height: 16px;
    cursor: pointer;
}

.object-management-group-toggle.empty {
    visibility: hidden;
}

.object-management-group-toggle:disabled {
    cursor: default;
}

.object-management-group-toggle i {
    color: inherit;
    line-height: 1;
}

.object-management-group-header.selected .object-management-group-toggle {
    background: rgba(255, 255, 255, 0.32);
}

.object-management-context-menu {
    position: fixed;
    z-index: 2000;
    min-width: 155px;
    padding: 4px;
    border: 1px solid #c8d4df;
    border-radius: 4px;
    background: #ffffff;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.22);
}

.object-management-context-menu button {
    display: flex;
    align-items: center;
    gap: 7px;
    width: 100%;
    min-height: 27px;
    padding: 4px 8px;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: #26384d;
    font-size: 12px;
    text-align: left;
    cursor: pointer;
}

.object-management-context-menu button:hover {
    background: #eaf5fb;
    color: #0f7fa0;
}

.object-management-context-menu button.danger {
    color: #a92323;
}

.object-management-context-menu button.danger:hover {
    background: #fdeaea;
    color: #8f1616;
}

.object-management-group-header i {
    color: #168bc7;
}

.object-management-group-header span {
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.object-management-group-header small {
    color: #5f7589;
    font-size: 10px;
    font-weight: 600;
}

.object-management-tree-row {
    padding-left: 15px;
}

.object-state-ok {
    color: #10a85a;
}

.object-state-motion {
    color: #1f7ae0;
}

.object-state-muted {
    color: #579ec5;
}

.object-state-off {
    color: #b7c0c8;
}

.object-state-offline {
    color: #e03131;
}

.object-state-unknown {
    color: #9aa7b3;
}

.object-ignition-on,
.object-ignition-off,
.object-ignition-unknown {
    position: relative;
    display: inline-block;
    width: 1em;
    text-align: center;
}

.object-ignition-off::after {
    content: "";
    position: absolute;
    left: 0.08em;
    top: 0.48em;
    width: 0.98em;
    height: 2px;
    background: currentColor;
    border-radius: 1px;
    transform: rotate(-42deg);
    transform-origin: center;
}

.object-ignition-unknown {
    opacity: 0.65;
}

.object-management-row.selected .object-state-ok,
.object-management-row.selected .object-state-motion,
.object-management-row.selected .object-state-muted,
.object-management-row.selected .object-state-off,
.object-management-row.selected .object-state-unknown {
    color: #eef6fb;
}

.object-management-row.selected .object-state-offline {
    color: #ff5c5c;
}

.object-management-empty {
    padding: 12px 8px;
    color: #64748b;
    text-align: center;
}

.object-management-info-panel {
    flex: 0 0 auto;
    min-height: 28px;
    max-height: none;
    border-top: 1px solid #24344a;
    background: #f6f8fb;
    box-shadow: 0 -3px 10px rgba(15, 23, 42, 0.08);
    overflow: hidden;
    z-index: 5;
}

.object-management-info-panel.collapsed {
    flex: 0 0 29px;
    height: 29px;
    min-height: 29px;
    max-height: 29px;
}

.object-management-info-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: 0 0 28px;
    width: 100%;
    height: 28px;
    min-height: 28px;
    padding: 4px 8px;
    border: 0;
    border-bottom: 1px solid #24344a;
    background: #152033;
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
}

.object-management-info-title span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.object-management-info-body {
    height: 100%;
    max-height: none;
    overflow: auto;
    padding: 4px 5px 6px;
}

.object-management-info-section {
    margin-bottom: 4px;
    overflow: hidden;
    border: 1px solid #c7d8e2;
    border-radius: 4px;
    background: #ffffff;
}

.object-management-info-section:last-child {
    margin-bottom: 0;
}

.object-management-info-section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 24px;
    padding: 3px 7px;
    border: 0;
    background: #dcecf3;
    color: #1f3448;
    font-size: 11px;
    font-weight: 700;
    text-align: left;
}

.object-management-info-section-title span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.object-management-info-section-body {
    padding: 2px 0;
}

.object-management-info-row {
    display: grid;
    grid-template-columns: 74px minmax(0, 1fr);
    gap: 6px;
    min-height: 19px;
    align-items: center;
    border-bottom: 1px solid #c9d8e2;
    color: #5d7284;
    padding: 0 7px;
}

.object-management-info-row:last-child {
    border-bottom: 0;
}

.object-management-info-row strong {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 4px;
    overflow: hidden;
    color: #22364b;
    font-weight: 600;
}

.object-management-info-row strong span,
.object-management-info-row strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.object-management-copyable-text,
.object-management-copyable-text * {
    cursor: text;
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}

.object-management-sensors-placeholder {
    min-height: 72px;
    background: #ffffff;
}

.object-management-sensor-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(76px, 42%);
    gap: 6px;
    min-height: 21px;
    align-items: center;
    border-bottom: 1px solid #c9d8e2;
    padding: 0 7px;
    color: #5d7284;
}

.object-management-sensor-chart-check {
    display: inline-flex;
    align-items: center;
    margin: 0;
}

.object-management-sensor-chart-check input[type="checkbox"] {
    margin: 0;
    cursor: pointer;
}

.object-management-sensor-row:last-child {
    border-bottom: 0;
}

.object-management-sensor-name,
.object-management-sensor-row strong {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.object-management-sensor-row strong {
    justify-content: flex-start;
    color: #22364b;
    font-weight: 600;
}

.object-management-sensors-empty {
    padding: 10px 7px;
    color: #6d8192;
    text-align: center;
}

.object-management-track-player .object-management-info-section-body {
    padding: 6px;
}

.object-management-player-head {
    display: grid;
    grid-template-columns: 24px 24px minmax(0, 1fr) 24px;
    gap: 5px;
    align-items: center;
    margin-bottom: 6px;
}

.object-management-player-tool,
.object-management-player-color {
    width: 24px;
    height: 24px;
    padding: 0;
}

.object-management-player-color {
    background: currentColor;
    border-color: #1f7ae0;
}

.object-management-player-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #1f3448;
    font-size: 11px;
    font-weight: 600;
}

.object-management-player-range {
    width: 100%;
    height: 18px;
    margin: 2px 0 4px;
}

.object-management-player-controls {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 6px;
}

.object-management-player-controls .btn {
    width: 24px;
    height: 22px;
    padding: 0;
    color: #527084;
    font-size: 10px;
}

.object-management-player-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: #37566d;
    font-size: 11px;
}

.object-management-player-meta span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.object-management-player-speed-select {
    flex: 0 0 72px;
    width: 72px;
    height: 24px;
    padding: 0 18px 0 6px;
    color: #37566d;
    font-size: 11px;
    line-height: 22px;
}

.object-management-list.tree-mode .object-management-row {
    padding-left: 15px;
}

.object-management-list.tree-mode .object-management-row:before {
    flex: 0 0 10px;
    width: 10px;
    height: 1px;
    background: #b8c8d6;
    content: "";
}

.object-management-table {
    table-layout: fixed;
    margin-bottom: 0;
    font-size: 12px;
}

.object-management-table th {
    padding: 5px 6px;
    line-height: 1.15;
}

.object-management-table td {
    padding: 5px 6px;
    vertical-align: middle;
    line-height: 1.15;
}

.object-management-table th:first-child,
.object-management-table td:first-child {
    width: 58%;
}

.object-management-table th:last-child,
.object-management-table td:last-child {
    width: 42%;
}

.object-management-name,
.object-management-imei {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.object-management-meta {
    margin-top: 2px;
    overflow: hidden;
    color: #64748b;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.object-management-table tr.badge-secondary .object-management-meta {
    color: #eef2f7;
}

.object-map-shell {
    position: relative;
    display: flex;
    height: 100%;
    width: 100%;
    min-height: 280px;
    flex-direction: column;
    overflow: hidden;
    background: #e8edf3;
}

.object-map-pane,
.object-map-pane-inner {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.object-map-pane-inner {
    position: relative;
}

.object-map-pane .main-table-wrapper {
    height: 100%;
    max-height: none;
    overflow: auto;
}

.object-monitoring-map-area {
    height: 100%;
}

.object-map-area {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

#object_map {
    position: absolute;
    inset: 0;
    height: 100%;
    min-height: 100%;
    width: 100%;
    background: #eef2f6;
}

#object_map .maplibregl-canvas {
    display: block;
}

.object-monitoring-map-area #monitoring_track_map {
    height: 100%;
    min-height: 100%;
}

/* Полоса активности за 10 дней — docs/activity-timeline/TZ.md */
.object-activity-timeline {
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    width: 88%;
    max-width: 600px;
    z-index: 660;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid #d5dde4;
    border-radius: 6px;
    box-shadow: 0 2px 7px rgba(15, 23, 42, 0.16);
    padding: 6px 10px 4px;
}

.object-activity-timeline-header {
    font-size: 11px;
    color: #6b7683;
    margin-bottom: 4px;
}

.object-activity-timeline-strip-wrap {
    position: relative;
    height: 20px;
}

.object-activity-timeline-canvas {
    width: 100%;
    height: 20px;
    display: block;
    border-radius: 4px;
    cursor: col-resize;
}

.object-activity-timeline-selection {
    position: absolute;
    top: 0;
    height: 20px;
    background: rgba(55, 138, 221, 0.22);
    border-left: 1.5px solid #185fa5;
    border-right: 1.5px solid #185fa5;
    pointer-events: none;
}

.object-activity-timeline-cursor {
    position: absolute;
    top: 0;
    width: 1px;
    height: 20px;
    background: rgba(0, 0, 0, 0.35);
    pointer-events: none;
}

.object-activity-timeline-days {
    display: flex;
    margin-top: 3px;
}

.object-activity-timeline-days span {
    flex: 1;
    text-align: center;
    font-size: 9px;
    color: #9aa3ad;
}

/* Хост директивы: у кастомного тега по умолчанию display:inline, и height:100%
   внутри него не с чем считать — панель тянется за высотой сплиттера только так. */
object-charts-panel {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
}

.object-charts-panel {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
    gap: 10px;
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    height: 100%;
    padding: 8px;
    box-sizing: border-box;
}

.object-charts-sidebar {
    display: flex;
    flex-direction: column;
    border: 1px solid #d5dde4;
    border-radius: 6px;
    padding: 8px;
    background: #ffffff;
    min-height: 0;
}

.object-charts-filter {
    margin-bottom: 6px;
}

.object-charts-sensor-list {
    flex: 1 1 auto;
    overflow-y: auto;
    min-height: 60px;
    margin-bottom: 8px;
}

.object-charts-sensor-row {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    padding: 2px 2px;
    margin: 0;
    cursor: pointer;
}

.object-charts-sensor-empty {
    font-size: 12px;
    color: #6d8192;
    text-align: center;
    padding: 10px 0;
}

.object-charts-group-toggle {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    border-top: 1px solid #e1e7ec;
    padding-top: 8px;
    margin: 0 0 8px;
}

.object-charts-build-row {
    display: flex;
    gap: 6px;
}

.object-charts-build-row select {
    flex: 1;
}

.object-charts-chart-area {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

.object-charts-toolbar {
    display: flex;
    justify-content: flex-end;
    gap: 6px;
    margin-bottom: 6px;
}

.object-charts-empty {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6d8192;
    font-size: 13px;
}

.object-charts-chart-container {
    flex: 1 1 auto;
    /* min-height держал график на 260px и не давал сжиматься вслед за панелью */
    min-height: 0;
}

/* 30.08.2026: график сырого веса в левой панели журнала весовых (weighing_chart_panel.directive.js) —
   упрощённая версия object-charts-panel без сайдбара выбора датчиков (колонка веса фиксирована).
   Высота по умолчанию — фиксированная (на случай использования вне weight-operation-left-panel);
   внутри неё явно растягивается на весь остаток (см. правило ниже). */
.weighing-chart-panel {
    display: flex;
    flex-direction: column;
    height: 220px;
    min-height: 0;
    padding: 8px;
    border-top: 1px solid #e1e7ee;
}

.weighing-chart-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 4px;
}

.weighing-chart-title {
    font-size: 12px;
    font-weight: 600;
    color: #40566f;
}

.weighing-chart-empty {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #6d8192;
    font-size: 12px;
    padding: 0 10px;
}

/* 30.08.2026, доработка по прямому указанию пользователя: раньше оба отрезка
   ("Процессы" — въезд/выезд) рисовались одним графиком на общей оси времени и
   схлопывались в тонкие иголки (пауза между въездом и выездом на порядки больше
   самих отрезков взвешивания). Теперь стопка отдельных мини-графиков — у каждого
   своя ось времени по границам СВОИХ данных. Один отрезок ("Операции") — единственный
   слот растягивается на всю высоту; два отрезка ("Процессы") — въезд сверху, выезд
   снизу, поровну. */
.weighing-chart-stack {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.weighing-chart-slot {
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.weighing-chart-slot + .weighing-chart-slot {
    border-top: 1px dashed #dde5ed;
    padding-top: 6px;
}

.weighing-chart-slot-title {
    font-size: 11px;
    font-weight: 600;
    color: #6d8192;
    margin-bottom: 2px;
}

.weighing-chart-slot-container {
    flex: 1 1 auto;
    min-height: 0;
    padding-bottom: 6px;
}

/* 30.08.2026, по прямому указанию пользователя: график — ОТДЕЛЬНАЯ нижняя панель левого
   окна, скрыта по умолчанию и появляется только при выделении операции/процесса
   (weighingChartVisible, см. sidebar.controller.js). .object-rfid-balance-table-wrapper —
   общий класс для МНОГИХ левых панелей (max-height:84vh + overflow:auto собственный
   скролл), трогать его нельзя — поэтому эта колонка-обёртка ИМЕННО журнала весовых
   получает свой класс: calc(100vh - 94px) — та же формула высоты, что и у
   .left-panel-wrapper (родитель через ng-include, % от него не работает — считаем от
   vh напрямую), таблица весовых по контенту, нижняя панель раскрывается на остаток. */
/* Двойной класс-селектор — специфичность выше, чем у одиночного .object-rfid-balance-table-wrapper
   (max-height:84vh + overflow-y:auto) выше по файлу, порядок объявления не важен. */
.object-rfid-balance-table-wrapper.weight-operation-left-panel {
    /* 30.08.2026, по прямому указанию пользователя: подписи времени по нижней оси графика
       упирались в самый край окна — не хватало запаса, -94px давал панели ровно всю высоту
       вьюпорта без зазора снизу. Увеличено до -114px (+20px зазор). */
    height: calc(100vh - 114px);
    max-height: calc(100vh - 114px);
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.weight-operation-left-panel > table {
    flex: 0 0 auto;
}

/* Свёрнута (высота 0, содержимое скрыто) до первого выделения строки; после —
   раскрывается на весь остаток высоты панели. Плавный переход высоты - transition
   на flex-basis не анимируется многими браузерами, поэтому анимируем max-height. */
.weight-operation-left-panel > .weighing-chart-pane {
    flex: 0 0 auto;
    max-height: 0;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: max-height .2s ease;
}

.weight-operation-left-panel > .weighing-chart-pane.weighing-chart-pane-visible {
    flex: 1 1 auto;
    max-height: none;
}

/* <weighing-chart-panel> — незарегистрированный (в смысле CSS) тег директивы, сам по
   умолчанию inline; делаем его полноценным флекс-контейнером на всю высоту .weighing-chart-pane,
   а вложенный в него div.weighing-chart-panel (корень шаблона директивы) — заполняющим его на 100%. */
weighing-chart-panel {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

.weighing-chart-pane .weighing-chart-panel {
    height: 100%;
    flex: 1 1 auto;
    min-height: 0;
}

@media print {
    body.object-charts-panel-active * {
        visibility: hidden;
    }

    body.object-charts-panel-active .object-charts-chart-container,
    body.object-charts-panel-active .object-charts-chart-container * {
        visibility: visible;
    }

    body.object-charts-panel-active .object-charts-chart-container {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        /* вне flex-потока высоту задать больше нечем */
        min-height: 260px;
    }
}

.object-bottom-pane-divider {
    /* при правке синхронизировать с dividerHeight в object.controller.js */
    height: 9px !important;
    z-index: 20 !important;
    border-top-color: #24344a !important;
    border-bottom-color: #24344a !important;
    background: #152033 !important;
}

.object-bottom-pane-divider:hover {
    background: #20314a !important;
    cursor: pointer;
}

/* В 9px стрелки-подсказки не помещаются и вылезали бы на карту: оставляем только
   ручку, направление сворачивания и так показывает шеврон на панели вкладок. */
.object-bottom-pane-divider:before,
.object-bottom-pane-divider span {
    width: 40px;
    height: 3px;
}

.object-bottom-pane-divider:after,
.object-bottom-pane-divider span:after {
    display: none;
}

.object-bottom-pane-divider:hover:before {
    background: #ffffff;
    box-shadow: 0 1px 0 rgba(71, 85, 105, 0.25), 0 0 0 1px rgba(15, 143, 168, 0.18);
}

.object-bottom-pane-divider:hover span {
    background: #ffffff;
    box-shadow: 0 1px 0 rgba(71, 85, 105, 0.25), 0 0 0 1px rgba(15, 143, 168, 0.18);
}

.object-bottom-pane-divider:hover:after {
    border-bottom-color: #0f8fa8;
}

.object-bottom-pane-divider:hover span:after {
    border-bottom-color: #0f8fa8;
}

.object-bottom-pane-divider.expanded:hover:after {
    border-top-color: #0f8fa8;
}

.object-bottom-pane-divider.expanded:hover span:after {
    border-top-color: #0f8fa8;
}

.object-bottom-pane.collapsed .pretty-split-pane-component-inner {
    overflow: hidden;
}

.object-bottom-pane .pretty-split-pane-component-inner,
.object-bottom-pane .main-table-wrapper {
    height: 100%;
    min-height: 0;
}

.object-bottom-panel-shell {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    background: #ffffff;
}

.object-bottom-tabs {
    display: flex;
    align-items: center;
    gap: 2px;
    min-height: 26px;
    padding: 0 6px;
    border-bottom: 1px solid #b9d2de;
    background: #f7fbfd;
}

.object-bottom-tab {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 25px;
    padding: 0 8px;
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: #23374d;
    font-size: 11.5px;
    line-height: 1;
    cursor: pointer;
}

.object-bottom-tab i {
    font-size: 12px;
}

.object-bottom-tab:hover,
.object-bottom-tab.active {
    color: #0f8fa8;
    border-bottom-color: #23a7d8;
}

.object-bottom-close {
    margin-left: auto;
    padding: 0 6px;
    font-size: 12px;
    line-height: 1;
    color: #65758a;
}

.object-bottom-tab-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

.object-bottom-toolbar {
    flex: 0 0 auto;
    padding: 7px 8px;
    border-bottom: 1px solid #d7e6ed;
    background: #eef7fb;
}

.object-data-journal-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
}

.object-data-journal-layout {
    display: grid;
    grid-template-columns: 310px 14px minmax(0, 1fr);
    flex: 1 1 auto;
    min-height: 0;
    background: #ffffff;
}

.object-data-journal-layout.columns-collapsed {
    grid-template-columns: 0 14px minmax(0, 1fr);
}

.object-data-column-panel {
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: #dcebf1;
    overflow: hidden;
    transition: width .16s ease;
}

.object-data-journal-layout.columns-collapsed .object-data-column-panel {
    width: 0;
}

.object-data-column-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    min-width: 14px;
    height: 100%;
    padding: 0;
    border: 0;
    border-left: 1px solid #bdd5e0;
    border-right: 1px solid #bdd5e0;
    background: #c6dce7;
    color: #5b798d;
    cursor: pointer;
}

.object-data-column-toggle:hover,
.object-data-column-toggle:focus {
    background: #b6d2df;
    color: #0f8fa8;
    outline: none;
}

.object-data-column-tools {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 32px 32px;
    gap: 6px;
    padding: 7px 8px;
    background: #dcebf1;
}

.object-data-load-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 31px;
    padding: 0;
    border: 1px solid #1d9bc1;
    background: #27a8d3;
    color: #ffffff;
}

.object-data-load-icon:hover,
.object-data-load-icon:focus {
    background: #168eb8;
    color: #ffffff;
    outline: none;
}

.object-data-column-list {
    flex: 1 1 auto;
    min-height: 0;
    margin: 0 8px;
    overflow: auto;
    overscroll-behavior: contain;
    background: #ffffff;
}

.object-data-column-row {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 22px;
    margin: 0;
    padding: 2px 7px;
    border-bottom: 1px solid #b9d2de;
    color: #2c4057;
    font-size: 12px;
    cursor: pointer;
}

.object-data-column-row input {
    flex: 0 0 auto;
}

.object-data-column-header {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #ffffff;
    color: #35617b;
}

.object-data-column-header i {
    margin-left: auto;
    font-size: 12px;
}

.object-data-column-empty {
    padding: 12px 10px;
    color: #607287;
    font-size: 12px;
}

.object-data-column-actions {
    display: flex;
    justify-content: flex-end;
    padding: 7px 8px;
    background: #dcebf1;
}

.object-data-result-panel {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    background: #ffffff;
}

.object-data-result-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    padding: 7px 8px;
    border-bottom: 1px solid #d7e6ed;
    background: #eef7fb;
}

.object-bottom-title {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 180px;
    max-width: 340px;
    overflow: hidden;
    color: #1d344c;
    font-weight: 600;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.object-data-filter {
    flex: 1 1 220px;
    max-width: 360px;
}

.object-data-limit-label {
    flex: 0 0 auto;
    color: #607287;
    font-size: 12px;
    white-space: nowrap;
}

.object-data-limit-control {
    flex: 0 0 138px;
}

.object-data-limit-control .input-group-text,
.object-data-limit-control .form-control {
    height: 28px;
    font-size: 12px;
}

.object-data-columns-dropdown {
    max-height: 280px;
    min-width: 240px;
    overflow: auto;
}

.object-data-columns-dropdown .dropdown-item {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 12px;
}

.object-bottom-table-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    overscroll-behavior: contain;
}

.object-bottom-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1 1 auto;
    min-height: 120px;
    color: #607287;
    font-size: 14px;
}

.object-bottom-pane .account-operations-table {
    margin-bottom: 0;
}

.object-bottom-pane .account-operations-table th {
    position: sticky;
    top: 0;
    z-index: 2;
}

.object-map-current-marker {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-width: 28px;
    height: 28px;
    padding: 0 8px;
    border: 2px solid #ffffff;
    border-radius: 14px;
    background: #0f8fa8;
    box-shadow: 0 5px 15px rgba(15, 23, 42, 0.32);
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    white-space: nowrap;
}

.object-map-current-marker span {
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 11px;
    line-height: 1;
}

.object-map-list-marker {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 22px;
    max-width: 180px;
    padding: 0 6px;
    border: 1px solid #ffffff;
    border-radius: 11px;
    background: rgba(96, 112, 128, 0.9);
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.22);
    color: #ffffff;
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
}

.object-map-list-marker.online {
    background: rgba(15, 143, 168, 0.9);
}

.object-map-list-marker span {
    overflow: hidden;
    text-overflow: ellipsis;
}

.object-map-state-marker {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-width: 130px;
    pointer-events: auto;
}

.object-map-state-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 2px solid #ffffff;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.28);
    overflow: hidden;
}

.object-map-state-icon img {
    display: block;
    width: 30px;
    height: 30px;
    object-fit: contain;
}

.object-map-state-marker.online .object-map-state-icon {
    border-color: #22c55e;
}

.object-map-state-marker.selected .object-map-state-icon {
    width: 38px;
    height: 38px;
    border-color: #16a34a;
    box-shadow: 0 0 0 2px rgba(22, 163, 74, 0.22), 0 5px 14px rgba(15, 23, 42, 0.32);
}

.object-map-state-marker.selected .object-map-state-icon img {
    width: 34px;
    height: 34px;
}

.object-map-state-label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    max-width: 220px;
    min-height: 24px;
    padding: 2px 8px;
    border: 1px solid rgba(203, 213, 225, 0.95);
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 4px 13px rgba(15, 23, 42, 0.22);
    color: #1f3448;
    font-size: 11px;
    line-height: 1;
    white-space: nowrap;
}

.object-map-state-marker.selected .object-map-state-label {
    border-color: #ffffff;
    background: rgba(15, 143, 168, 0.96);
    color: #ffffff;
    font-weight: 700;
}

.object-map-state-icons {
    display: inline-grid;
    grid-template-columns: repeat(4, 12px);
    gap: 3px;
    align-items: center;
    flex: 0 0 auto;
    font-size: 11px;
}

.object-map-state-label strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.object-map-state-marker.selected .object-state-ok,
.object-map-state-marker.selected .object-state-motion,
.object-map-state-marker.selected .object-state-muted,
.object-map-state-marker.selected .object-state-off,
.object-map-state-marker.selected .object-state-unknown {
    color: #eef6fb;
}

.object-map-current-popup .maplibregl-popup-content {
    padding: 0;
    border-radius: 8px;
    color: #1f2937;
    font-size: 12px;
    line-height: 1.35;
    overflow: hidden;
}

.object-map-current-popup .maplibregl-popup-tip {
    border-top-color: #ffffff;
}

.object-map-popup-card {
    min-width: 280px;
    max-width: 360px;
    background: #ffffff;
}

.object-map-popup-header {
    padding: 8px 12px;
    background: #dcecf5;
    color: #1f3448;
    font-size: 14px;
    font-weight: 700;
}

.object-track-stop-actions {
    padding: 6px 12px;
    border-bottom: 1px solid #e3ebf1;
}

.object-track-hide-stops-btn {
    width: 100%;
    padding: 4px 8px;
    border: 1px solid #c5d3dd;
    border-radius: 4px;
    background: #f4f8fb;
    color: #1f3448;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.object-track-hide-stops-btn:hover {
    background: #e3eef6;
}

.object-map-popup-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    padding: 6px 12px 2px;
}

.object-map-popup-links a {
    color: #2d82c7;
    font-size: 12px;
    text-decoration: none;
}

.object-map-popup-links a:hover {
    text-decoration: underline;
}

.object-map-popup-section-title {
    margin-top: 4px;
    padding: 7px 12px;
    background: #dcecf5;
    color: #1f3448;
    font-size: 13px;
    font-weight: 700;
}

.object-map-popup-table {
    width: 100%;
    border-collapse: collapse;
}

.object-map-popup-table th,
.object-map-popup-table td {
    padding: 4px 12px;
    border-top: 1px solid #d9e5ee;
    vertical-align: top;
}

.object-map-popup-table th {
    width: 108px;
    color: #374151;
    font-weight: 500;
    white-space: nowrap;
}

.object-map-popup-table td {
    color: #1f2937;
    word-break: break-word;
}

.object-track-direction-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    pointer-events: none;
}

.object-track-arrow-shape {
    position: relative;
    display: block;
    width: 4px;
    height: 18px;
    transform-origin: center;
}

.object-track-arrow-shape:before {
    position: absolute;
    left: 1px;
    top: 4px;
    width: 2px;
    height: 14px;
    border-radius: 2px;
    background: #1f7ae0;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.9);
    content: "";
}

.object-track-arrow-shape:after {
    position: absolute;
    left: -4px;
    top: 0;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 8px solid currentColor;
    filter: drop-shadow(0 0 1px #ffffff);
    content: "";
}

.object-track-edge-marker {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    position: relative;
    min-height: 34px;
    padding: 5px 10px 5px 6px;
    border: 1px solid rgba(255, 255, 255, 0.88);
    border-radius: 7px;
    background: #0f8fa8;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.30);
    color: #ffffff;
    white-space: nowrap;
}

.object-track-edge-marker:after {
    position: absolute;
    left: 18px;
    bottom: -6px;
    width: 12px;
    height: 12px;
    border-right: 1px solid rgba(255, 255, 255, 0.72);
    border-bottom: 1px solid rgba(255, 255, 255, 0.72);
    background: inherit;
    box-shadow: 4px 4px 10px rgba(15, 23, 42, 0.16);
    transform: rotate(45deg);
    content: "";
}

.object-track-edge-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.18);
    font-size: 13px;
}

.object-track-edge-text {
    display: inline-flex;
    flex-direction: column;
    position: relative;
    z-index: 1;
    line-height: 1.05;
}

.object-track-edge-text small {
    color: rgba(255, 255, 255, 0.78);
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

.object-track-edge-text strong {
    margin-top: 2px;
    color: #ffffff;
    font-size: 12px;
    font-weight: 800;
}

.object-track-start-marker {
    background: #16994f;
}

.object-track-finish-marker {
    background: #d62235;
}

.object-track-finish-marker:after {
    left: 70px;
}

.object-track-stop-point {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(31, 122, 224, 0.18);
    pointer-events: none;
}

.object-track-stop-point span {
    display: block;
    width: 12px;
    height: 12px;
    border: 3px solid #1f7ae0;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.22);
}

.object-track-stop-label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 24px;
    padding: 3px 8px 3px 7px;
    border: 1px solid rgba(191, 219, 254, 0.92);
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.96);
    color: #26364a;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.22);
    font-size: 12px;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
    pointer-events: auto;
}

/* Маркеры заправок/сливов на треке (TZ_EVENTS.md, п. 6) */
.object-track-fuel-event-marker {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    cursor: pointer;
    pointer-events: auto;
}

.object-track-fuel-event-count {
    padding: 2px 7px;
    border-radius: 5px;
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
    white-space: nowrap;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.28);
}

.object-track-fuel-event-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border: 2px solid #ffffff;
    border-radius: 50%;
    color: #ffffff;
    font-size: 13px;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.3);
}

.object-track-fuel-refuel .object-track-fuel-event-count,
.object-track-fuel-refuel .object-track-fuel-event-icon {
    background: #2FA84F;
}

.object-track-fuel-drain .object-track-fuel-event-count,
.object-track-fuel-drain .object-track-fuel-event-icon {
    background: #D9331E;
}

.object-track-stop-label:before {
    position: absolute;
    left: -5px;
    top: 50%;
    width: 10px;
    height: 10px;
    border-left: 1px solid rgba(191, 219, 254, 0.92);
    border-bottom: 1px solid rgba(191, 219, 254, 0.92);
    background: rgba(255, 255, 255, 0.96);
    transform: translateY(-50%) rotate(45deg);
    content: "";
}

.object-track-stop-number,
.object-track-stop-parking,
.object-track-stop-duration {
    position: relative;
    z-index: 1;
}

.object-track-stop-number {
    font-weight: 800;
}

.object-track-stop-parking {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    border-radius: 3px;
    background: #1f7ae0;
    color: #ffffff;
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
}

.object-track-stop-duration {
    font-weight: 600;
}

.object-geozone-vertex-marker {
    width: 12px;
    height: 12px;
    border: 2px solid #2da8df;
    border-radius: 50%;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 1px 6px rgba(21, 32, 51, .28);
    cursor: grab;
}

.object-geozone-vertex-marker:active {
    cursor: grabbing;
}

.object-geozone-hover-title {
    display: inline-block;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #233044;
    font-weight: 600;
}

.object-geozone-hover-crop {
    display: block;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #5b6b82;
    font-size: 12px;
}

.object-geozone-name-label {
    display: inline-flex;
    align-items: center;
    max-width: 180px;
    padding: 3px 8px;
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.9);
    color: #233044;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.18);
    font-size: 12px;
    line-height: 1.2;
}

.object-geozone-name-label strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.object-track-player-marker {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 50;
    width: 34px !important;
    height: 34px !important;
    border-radius: 50%;
    background: rgba(220, 38, 38, 0.14);
    pointer-events: none;
}

.object-track-player-marker span {
    display: block;
    width: 18px;
    height: 18px;
    border: 3px solid #ffffff;
    border-radius: 50%;
    background: #dc2626;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.35), 0 0 0 4px rgba(220, 38, 38, 0.24);
}

.object-track-player-marker small {
    position: absolute;
    left: 50%;
    top: 26px;
    transform: translateX(-50%);
    padding: 1px 5px;
    border-radius: 4px;
    background: #ffffff;
    color: #991b1b;
    font-size: 10px;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.22);
}

.object-map-measure-dot {
    width: 9px;
    height: 9px;
    border: 2px solid #ffffff;
    border-radius: 50%;
    background: #0f8fa8;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.28);
}

.object-map-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 46px;
    padding: 6px 10px;
    border-bottom: 1px solid #c3ceda;
    background: #f8fafc;
}

.object-map-current {
    min-width: 180px;
    max-width: 340px;
}

.object-map-current-title {
    overflow: hidden;
    color: #1e293b;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.object-map-current-meta {
    overflow: hidden;
    color: #64748b;
    font-size: 11px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.object-map-actions {
    display: flex;
    gap: 4px;
}

.object-map-actions .btn {
    flex: 0 0 32px;
    width: 32px;
    padding-left: 0;
    padding-right: 0;
}

.object-map-add-form {
    display: grid;
    flex: 1 1 auto;
    grid-template-columns: minmax(120px, 1fr) minmax(100px, 140px) minmax(130px, 170px) 32px;
    gap: 6px;
    min-width: 0;
}

.object-map-add-form .btn {
    padding-left: 0;
    padding-right: 0;
}

.object-display-map {
    position: relative;
    flex: 1 1 auto;
    min-height: 220px;
    background:
        linear-gradient(rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.78)),
        repeating-linear-gradient(0deg, transparent 0, transparent 35px, rgba(148, 163, 184, 0.25) 36px),
        repeating-linear-gradient(90deg, transparent 0, transparent 35px, rgba(148, 163, 184, 0.25) 36px),
        #dfe7ef;
}

.object-display-map-placeholder {
    position: absolute;
    left: 50%;
    top: 50%;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transform: translate(-50%, -50%);
    color: #475569;
    font-size: 14px;
    font-weight: 600;
}

.object-view-switcher {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    margin-left: 8px;
    vertical-align: middle;
}

.object-view-switch-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 23px;
    height: 23px;
    padding: 0;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    background: #ffffff;
    color: #334155;
    font-size: 13px;
    line-height: 1;
}

.object-view-switch-button:hover {
    border-color: #60a5fa;
    color: #0f172a;
}

.object-view-switch-button.active {
    border-color: #0284c7;
    background: #e0f2fe;
    color: #075985;
}

.object-properties-window {
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.object-properties-window .modal-dialog {
    width: min(960px, calc(100vw - 48px));
    max-width: 960px;
    margin: 0 auto;
}

.object-properties-window .modal-content {
    overflow: hidden;
    border: 0;
    border-radius: 6px;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.36);
}

.object-properties-modal {
    display: flex;
    flex-direction: column;
    min-height: 520px;
    background: #f6f8fb;
    color: #1f2d3d;
}

.object-properties-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 52px;
    padding: 0 14px;
    border-bottom: 1px solid #22334a;
    background: #152033;
}

.object-properties-tabs {
    display: flex;
    align-items: stretch;
    gap: 4px;
    min-width: 0;
}

.object-properties-tab {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 52px;
    padding: 0 13px;
    border: 0;
    background: transparent;
    color: #d7e4f1;
    font-size: 13px;
    font-weight: 700;
}

.object-properties-tab.active {
    color: #ffffff;
}

.object-properties-tab.active::after {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 0;
    height: 3px;
    border-radius: 3px 3px 0 0;
    background: #1da7c7;
}

.object-properties-tab.muted {
    color: #7f94aa;
    cursor: default;
}

.object-properties-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: #d7e4f1;
}

.object-properties-close:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
}

.object-properties-body {
    display: grid;
    flex: 1 1 auto;
    grid-template-columns: 190px minmax(0, 1fr);
    min-height: 0;
    background: #ffffff;
}

.object-properties-sidebar {
    padding: 20px 12px;
    border-right: 1px solid #d6dee8;
    background: #f6f8fb;
}

.object-properties-side-caption,
.object-properties-side-link {
    display: block;
    width: 100%;
    min-height: 30px;
    padding: 5px 10px;
    border: 0;
    border-left: 3px solid transparent;
    background: transparent;
    color: #40566f;
    font-size: 13px;
    font-weight: 700;
    text-align: left;
}

.object-properties-side-caption {
    margin-bottom: 4px;
    border-left-color: transparent;
    color: #7a8797;
    font-size: 11px;
    letter-spacing: 0;
    text-transform: uppercase;
}

.object-properties-side-link {
    padding-left: 22px;
    font-weight: 600;
}

.object-properties-side-link.active {
    border-left-color: #0f8fa8;
    color: #152033;
}

.object-properties-form {
    min-width: 0;
    padding: 26px 34px;
}

.object-properties-grid {
    display: grid;
    grid-template-columns: 170px minmax(220px, 330px);
    gap: 13px 24px;
    align-items: center;
}

.object-properties-profile-grid {
    grid-template-columns: 190px minmax(220px, 340px);
}

.object-properties-label {
    margin: 0;
    color: #24344a;
    font-size: 12px;
    font-weight: 600;
}

.object-properties-field {
    min-width: 0;
    color: #1f2d3d;
    font-size: 12px;
}

.object-properties-field .form-control {
    height: 30px;
    border-color: #b8c6d6;
    border-radius: 4px;
    color: #1f2d3d;
    font-size: 12px;
}

.object-properties-field .form-control:focus {
    border-color: #0f8fa8;
    box-shadow: 0 0 0 2px rgba(15, 143, 168, 0.16);
}

.object-properties-checkbox {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 30px;
    margin: 0;
    color: #24344a;
    font-size: 12px;
    font-weight: 500;
}

.object-properties-checkbox input {
    margin: 0;
}

.object-repair-diagnostics-window .modal-dialog {
    width: min(1120px, calc(100vw - 36px));
    max-width: 1120px;
}

.object-repair-modal-header {
    align-items: flex-start;
    background: #132033;
    color: #fff;
}

.object-repair-modal-header .close {
    color: #fff;
    opacity: 0.82;
}

.object-repair-modal-subtitle {
    margin-top: 4px;
    color: #cfe1f1;
    font-size: 12px;
}

.object-repair-modal-body {
    padding: 16px 18px 18px;
    background: #f4f7fa;
}

.object-repair-loading {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 90px;
    color: #2c4058;
    font-size: 13px;
}

.object-repair-summary {
    display: grid;
    grid-template-columns: minmax(260px, 1.7fr) repeat(3, minmax(110px, 0.7fr));
    gap: 8px;
    margin-bottom: 12px;
}

.object-repair-summary-item {
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid #d4dee8;
    border-radius: 6px;
    background: #fff;
    color: #54677c;
    font-size: 11px;
}

.object-repair-summary-item strong {
    display: block;
    margin-top: 4px;
    color: #1f2d3d;
    font-size: 14px;
    font-weight: 700;
}

.object-repair-summary-ok strong {
    color: #16884a;
}

.object-repair-summary-bad strong {
    color: #d93025;
}

.object-repair-table-wrap {
    max-height: min(62vh, 640px);
    overflow: auto;
    border: 1px solid #d4dee8;
    border-radius: 6px;
    background: #fff;
}

.object-repair-table {
    width: 100%;
    border-collapse: collapse;
    color: #26384d;
    font-size: 12px;
}

.object-repair-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 9px 10px;
    border-bottom: 1px solid #c9d6e2;
    background: #eef3f8;
    color: #24344a;
    font-size: 11px;
    font-weight: 700;
    text-align: left;
    white-space: nowrap;
}

.object-repair-table td {
    padding: 8px 10px;
    border-bottom: 1px solid #e4ebf2;
    vertical-align: top;
}

.object-repair-row-bad {
    background: #fff5f5;
}

.object-repair-sensor-name {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    min-width: 190px;
}

.object-repair-sensor-name > i {
    flex: 0 0 16px;
    margin-top: 1px;
    color: #0f8fa8;
}

.object-repair-sensor-name strong,
.object-repair-sensor-name small {
    display: block;
}

.object-repair-sensor-name small,
.object-repair-muted {
    color: #6d7f91;
    font-size: 11px;
}

.object-repair-status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
    font-weight: 700;
}

.object-repair-status-ok {
    color: #16884a;
}

.object-repair-status-bad {
    color: #d93025;
}

.object-properties-readonly {
    min-height: 30px;
    display: flex;
    align-items: center;
}

.object-properties-icon-field {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    gap: 8px;
    align-items: center;
}

.object-properties-site-field {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 32px 32px;
    gap: 6px;
    align-items: center;
}

.object-properties-output-field {
    grid-template-columns: minmax(0, 1fr) 32px 32px 32px 24px;
}

.object-properties-input-output-field {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 24px;
    gap: 8px;
    align-items: center;
}

.object-properties-output-toggle {
    width: 24px;
    min-width: 24px;
    height: 30px;
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.object-properties-output-toggle input {
    margin: 0;
}

.brand-model-manage-body {
    max-height: 60vh;
    overflow-y: auto;
}

.brand-model-manage-list {
    border: 1px solid #d5dde4;
    border-radius: 4px;
    max-height: 45vh;
    overflow-y: auto;
}

.brand-model-manage-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 6px 10px;
    border-bottom: 1px solid #eef1f4;
    font-size: 12px;
}

.brand-model-manage-row:last-child {
    border-bottom: 0;
}

.brand-model-manage-name {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.brand-model-manage-edit-input {
    flex: 1;
    min-width: 0;
    height: 26px;
}

.brand-model-manage-actions {
    display: flex;
    gap: 4px;
    flex-shrink: 0;
}

.brand-model-manage-empty {
    padding: 14px;
    text-align: center;
    color: #6d8192;
    font-size: 12px;
}

.object-properties-icon-button {
    width: 32px;
    min-width: 32px;
    height: 30px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.object-properties-icon-preview {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 30px;
    border: 1px solid #b8c6d6;
    border-radius: 4px;
    background: #f6f8fb;
    color: #0f8fa8;
    font-size: 17px;
}

.object-properties-icon-image {
    display: block;
    width: 26px;
    height: 26px;
    object-fit: contain;
}

.object-properties-error {
    max-width: 540px;
    margin-top: 18px;
    padding: 8px 10px;
    font-size: 12px;
}

.object-properties-footer {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 56px;
    padding: 10px 16px;
    border-top: 1px solid #d6dee8;
    background: #f1f4f8;
}

.object-properties-footer .btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 30px;
    border-radius: 4px;
    font-size: 12px;
}

.object-properties-sensors {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    padding: 14px 16px 10px;
    background: #ffffff;
}

.object-sensors-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 38px;
    padding: 6px;
    border-radius: 4px;
    background: #eef3f8;
}

.object-sensors-filter {
    display: grid;
    grid-template-columns: 24px minmax(180px, 300px);
    align-items: center;
    min-width: 260px;
    border: 1px solid #c8d4e0;
    border-radius: 4px;
    background: #ffffff;
    color: #0f8fa8;
}

.object-sensors-filter .bi {
    justify-self: center;
    font-size: 14px;
}

.object-sensors-filter .form-control {
    height: 28px;
    border: 0;
    box-shadow: none;
    font-size: 12px;
}

.object-sensors-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.object-sensors-actions .btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 28px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
}

.object-retranslations {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    padding: 14px 16px 10px;
    background: #ffffff;
}

.object-retranslation-form {
    padding: 10px 12px;
    border: 1px solid #d6dee8;
    border-radius: 4px;
    background: #f6f8fb;
}

.object-retranslation-grid {
    display: grid;
    grid-template-columns: 150px minmax(180px, 1fr) 90px minmax(110px, 160px);
    gap: 10px 12px;
    align-items: center;
}

.object-retranslation-form-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
}

.object-retranslation-form-actions .btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 28px;
    border-radius: 4px;
    font-size: 12px;
}

.object-retranslations-table-wrap {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    margin-top: 12px;
    overflow: auto;
    border: 1px solid #d6dee8;
    border-radius: 4px;
    background: #ffffff;
}

.object-retranslations-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 12px;
}

.object-retranslations-table th,
.object-retranslations-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e4ebf2;
    color: #24344a;
    vertical-align: middle;
}

.object-retranslations-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #eef3f8;
    color: #40566f;
    font-weight: 700;
    white-space: nowrap;
}

.object-retranslations-actions-col {
    width: 112px;
    text-align: right;
    white-space: nowrap;
}

.object-retranslations-actions-col .btn {
    margin-left: 4px;
}

.object-retranslation-status {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 2px 7px;
    border-radius: 4px;
    background: #eef3f8;
    color: #40566f;
    font-weight: 700;
    white-space: nowrap;
}

.object-retranslation-status.active {
    background: #dff5e8;
    color: #136f3a;
}

.object-retranslation-status.error {
    background: #fde8e8;
    color: #b42318;
}

.object-retranslation-offset-active {
    color: #b45309;
    font-weight: 700;
}

.object-retranslation-message {
    max-width: 220px;
    color: #6b7787;
    white-space: normal;
    word-break: break-word;
}

.object-sensors-table-wrap {
    position: relative;
    flex: 1 1 auto;
    min-height: 300px;
    overflow: auto;
    margin-top: 12px;
}

.object-sensors-table {
    width: 100%;
    min-width: 820px;
    border-collapse: collapse;
    color: #223247;
    font-size: 12px;
}

.object-sensors-table th {
    height: 38px;
    padding: 6px 10px;
    border-bottom: 1px solid #c5d1dd;
    color: #40566f;
    font-weight: 600;
    text-align: left;
    vertical-align: middle;
    background: #ffffff;
}

.object-sensors-table td {
    height: 26px;
    padding: 4px 10px;
    border-bottom: 1px solid #d7e0ea;
    vertical-align: middle;
}

.object-sensors-table tbody tr:hover {
    background: #f4f8fb;
}

.object-sensors-table tbody tr {
    cursor: pointer;
}

.object-sensors-table tbody tr.object-sensors-row-selected,
.object-sensors-table tbody tr.object-sensors-row-selected td {
    background: #d9edf5;
}

.object-sensors-table tbody tr.object-sensors-row-selected td:first-child {
    box-shadow: inset 4px 0 0 #0f8fa8;
}

.object-sensors-table tbody tr.object-sensors-row-selected td:nth-child(2) {
    color: #10263d;
    font-weight: 700;
}

.object-sensors-icon-col {
    width: 36px;
    text-align: center;
}

.object-sensors-icon-col .bi {
    color: #177fa0;
    font-size: 15px;
}

.object-sensors-source {
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.object-sensors-center {
    text-align: center !important;
}

.object-sensors-ok {
    color: #188d58;
}

.object-sensors-muted {
    color: #91a1b2;
}

.object-sensors-state {
    position: absolute;
    left: 0;
    right: 0;
    top: 96px;
    color: #66788d;
    font-size: 13px;
    text-align: center;
}

.object-sensors-count {
    min-height: 28px;
    padding: 8px 2px 0;
    border-top: 1px solid #d7e0ea;
    color: #40566f;
    font-size: 12px;
}

.object-recalc-modal-header {
    align-items: center;
    background: #f8fbfd;
    border-bottom: 1px solid #c8d7e3;
    padding: 12px 16px;
}

.object-recalc-window .modal-dialog {
    max-width: 500px;
}

.object-recalc-window .modal-content {
    overflow: visible;
}

.object-recalc-modal-header .modal-title {
    color: #34495e;
    font-size: 18px;
    font-weight: 600;
}

.object-recalc-modal-body {
    padding: 16px 18px;
    overflow: visible;
}

.object-recalc-form {
    display: grid;
    grid-template-columns: 132px minmax(0, 1fr);
    gap: 8px 12px;
    align-items: center;
}

.object-recalc-form label {
    color: #3c4f63;
    font-size: 13px;
    margin: 0;
}

.object-recalc-period-row {
    display: grid;
    grid-template-columns: minmax(120px, 1fr) 112px;
    gap: 6px;
}

.object-recalc-period-row .form-control,
.object-recalc-form > .form-control {
    min-width: 0;
}

.object-recalc-datetime {
    min-width: 0;
}

.object-recalc-datetime .input-group {
    cursor: pointer;
}

.object-recalc-datetime .form-control {
    min-width: 0;
}

.object-recalc-datepicker-menu {
    min-width: 280px;
    padding: 6px;
    border-color: #bfd1df;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.18);
}

.object-recalc-modal-footer {
    justify-content: flex-start;
    background: #edf5f9;
    border-top: 1px solid #d4e2eb;
    padding: 12px 18px;
}

.gps-sensor-modal {
    display: flex;
    flex-direction: column;
    min-height: 430px;
    overflow: hidden;
    border-radius: 4px;
    background: #ffffff;
    color: #1f2d3d;
}

.gps-sensor-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 48px;
    padding: 0 16px;
    background: #121f34;
    color: #ffffff;
}

.gps-sensor-title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
}

.gps-sensor-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: #c9d6e3;
}

.gps-sensor-close:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
}

.gps-sensor-body {
    flex: 1 1 auto;
    min-height: 0;
    padding: 18px 22px;
}

.gps-sensor-loading {
    padding-top: 80px;
    color: #60758c;
    text-align: center;
}

.gps-sensor-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.gps-sensor-field {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
}

.gps-sensor-field label {
    margin: 0;
    color: #25364c;
    font-size: 12px;
    font-weight: 600;
}

.gps-sensor-field .form-control {
    height: 30px;
    border-color: #b8c6d6;
    border-radius: 4px;
    color: #1f2d3d;
    font-size: 12px;
}

.gps-sensor-field .form-control:focus {
    border-color: #0f8fa8;
    box-shadow: 0 0 0 2px rgba(15, 143, 168, 0.16);
}

.gps-sensor-field-inline {
    margin-left: 190px;
    grid-template-columns: 86px 120px;
}

.gps-sensor-hint {
    grid-column: 1 / -1;
    margin: -4px 0 0;
    color: #60758c;
    font-size: 11px;
    line-height: 1.4;
}

.gps-sensor-section-title {
    margin-top: 6px;
    padding-top: 12px;
    border-top: 1px solid #dbe4ee;
    color: #60758c;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.gps-sensor-grid {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.gps-sensor-switch {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 28px;
    margin: 2px 0 0 190px;
    color: #25364c;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
}

.gps-sensor-switch input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.gps-sensor-switch-visual {
    position: relative;
    width: 32px;
    height: 18px;
    flex: 0 0 32px;
    border-radius: 18px;
    background: #8fa1b2;
    transition: background 0.15s ease;
}

.gps-sensor-switch-visual::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.25);
    transition: transform 0.15s ease;
}

.gps-sensor-switch input:checked + .gps-sensor-switch-visual {
    background: #0f8fa8;
}

.gps-sensor-switch input:checked + .gps-sensor-switch-visual::after {
    transform: translateX(14px);
}

.gps-sensor-error {
    margin: 4px 0 0;
    padding: 8px 10px;
    font-size: 12px;
}

.gps-sensor-footer {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 52px;
    padding: 10px 16px;
    border-top: 1px solid #d6dee8;
    background: #f1f4f8;
}

.gps-sensor-footer .btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 30px;
    border-radius: 4px;
    font-size: 12px;
}

.sensor-create-window .modal-dialog {
    max-width: 940px;
}

.sensor-create-modal {
    min-height: 560px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 4px;
    background: #ffffff;
    color: #26384d;
}

.sensor-create-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 52px;
    padding: 0 18px;
    border-bottom: 1px solid #c9d5df;
    background: #f8fbfd;
}

.sensor-create-header h5 {
    margin: 0;
    color: #3a4b5b;
    font-size: 19px;
    font-weight: 600;
}

.sensor-create-close {
    width: 30px;
    height: 30px;
    border: 0;
    background: transparent;
    color: #587084;
}

.sensor-create-body {
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    min-height: 0;
}

.sensor-create-tabs {
    padding: 18px 0 18px 18px;
    border-right: 1px solid #c8d6e1;
    background: #f7fafc;
}

.sensor-create-tabs button {
    display: block;
    width: 100%;
    min-height: 36px;
    padding: 0 16px;
    border: 0;
    border-left: 4px solid transparent;
    background: transparent;
    color: #546d80;
    text-align: left;
    font-size: 14px;
    font-weight: 600;
}

.sensor-create-tabs button.active {
    border-left-color: #2da8df;
    color: #2e4052;
    background: #ffffff;
}

.sensor-create-content {
    position: relative;
    padding: 18px 22px;
    min-width: 0;
}

.sensor-create-form {
    display: grid;
    grid-template-columns: 170px minmax(0, 410px);
    gap: 11px 18px;
    align-items: center;
}

.sensor-create-form label {
    margin: 0;
    color: #3a4e60;
    font-size: 13px;
    font-weight: 600;
}

.sensor-create-threshold-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.sensor-create-threshold-row input {
    flex: 1;
    min-width: 0;
}

.sensor-create-threshold-row span {
    color: #8a97a4;
}

.sensor-create-threshold-hint {
    margin: -4px 0 0;
    color: #8a97a4;
    font-size: 11.5px;
    line-height: 1.4;
}

.sensor-create-icon-picker {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.sensor-create-icon-option {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border: 1px solid #bdd0df;
    border-radius: 4px;
    background: #ffffff;
    color: #3d6178;
}

.sensor-create-icon-option.active {
    border-color: #2da8df;
    background: #e8f6fc;
    color: #1288b6;
}

.sensor-create-switch {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-weight: 500 !important;
}

.sensor-create-switch input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.sensor-create-switch span {
    position: relative;
    width: 32px;
    height: 18px;
    flex: 0 0 32px;
    border-radius: 18px;
    background: #8fa1b2;
}

.sensor-create-switch span::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #ffffff;
    transition: transform .15s ease;
}

.sensor-create-switch input:checked + span {
    background: #2da8df;
}

.sensor-create-switch input:checked + span::after {
    transform: translateX(14px);
}

.sensor-create-source-list {
    max-height: 250px;
    overflow: auto;
    border: 1px solid #c7d6e2;
    border-radius: 4px;
    background: #ffffff;
}

.sensor-create-source-list button {
    display: grid;
    /* третья колонка — последнее значение тега */
    grid-template-columns: minmax(0, 1fr) 150px 110px;
    gap: 12px;
    width: 100%;
    min-height: 34px;
    padding: 6px 9px;
    border: 0;
    border-bottom: 1px solid #edf2f6;
    background: transparent;
    color: #31465a;
    text-align: left;
    font-size: 12px;
}

.sensor-create-source-list button.active {
    background: #dff2fb;
}

.sensor-create-source-list span {
    color: #668093;
}

.sensor-create-source-value {
    color: #1256a0;
    font-style: normal;
    font-weight: 600;
    text-align: right;
    /* Длинные значения (адрес, строка статуса) не должны ломать сетку строки. */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sensor-create-source-empty {
    color: #b6c2cc;
    font-weight: 400;
}

.sensor-create-formula-tags {
    max-height: 140px;
}

.sensor-create-range {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.sensor-create-placeholder {
    max-width: 520px;
    padding: 18px;
    border: 1px solid #d4e0ea;
    border-radius: 4px;
    background: #f7fafc;
    color: #60758c;
    font-size: 13px;
}

.sensor-create-loading {
    padding-top: 100px;
    color: #60758c;
    text-align: center;
}

.sensor-create-error {
    margin-top: 14px;
    max-width: 598px;
}

.sensor-create-footer {
    display: flex;
    gap: 8px;
    min-height: 62px;
    padding: 14px 18px;
    border-top: 1px solid #d4e1eb;
    background: #edf5f9;
}

/* Исходящее SMS в статусе Sent, на которое пришёл возвратный Received —
   светло-зелёная подсветка строки, чтобы видеть наличие ответа. */
.comm-msg-answered > td {
    background-color: rgba(47, 168, 79, 0.14);
}
.table-hover tbody tr.comm-msg-answered:hover > td {
    background-color: rgba(47, 168, 79, 0.22);
}

/* Контекстное меню журнала приходных накладных. */
.income-ctx-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1080;
}

.income-ctx-menu {
    position: fixed;
    z-index: 1081;
    min-width: 210px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 6px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .18);
    padding: 4px 0;
}

.income-ctx-item {
    display: block;
    width: 100%;
    text-align: left;
    border: none;
    background: none;
    padding: 6px 14px;
    font-size: 13px;
    color: #212529;
}

.income-ctx-item:hover {
    background: rgba(13, 110, 253, .1);
}

/* Модалка-конструктор документов накладной. */
.income-photos-modal .ipm-tile {
    width: 140px;
    margin: 0 8px 12px 0;
    text-align: center;
}

.income-photos-modal .ipm-thumb,
.income-photos-modal .ipm-thumb-file {
    width: 140px;
    height: 100px;
    object-fit: cover;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 4px;
    background: #f6f6f6;
}

.income-photos-modal .ipm-thumb-file {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 34px;
    color: #adb5bd;
}

.income-photos-modal .ipm-name {
    font-size: 11px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 3px 0;
}

.income-photos-modal .ipm-del {
    padding: 0 6px;
    font-size: 11px;
}

/* ============================================================
   Приходная накладная — новый вид (модалка с вкладками).
   Палитра и стилистика перенесены из утверждённого макета.
   ============================================================ */
.inv-modal-window .modal-content,
.inv-modal-window .modal-body {
    --inv-accent: #2f6db3;
    --inv-accent-soft: rgba(47, 109, 179, .12);
    --inv-accent-line: rgba(47, 109, 179, .4);
    --inv-ink: #1b2733;
    --inv-ink-2: #5a6b7b;
    --inv-ink-3: #8a99a8;
    --inv-surface: #ffffff;
    --inv-surface-2: #f6f8fb;
    --inv-hair: rgba(27, 39, 51, .1);
    --inv-hair-2: rgba(27, 39, 51, .16);
    --inv-ok: #1f9d55;
    --inv-warn: #b9770a;
    --inv-bad: #d1495b;
    --inv-ok-soft: rgba(31, 157, 85, .13);
    --inv-warn-soft: rgba(185, 119, 10, .14);
    --inv-bad-soft: rgba(209, 73, 91, .13);
}

/* Приглушённая подложка — экран под дымкой, не чёрное полотно. */
.modal-backdrop.inv-modal-backdrop {
    background-color: rgba(30, 42, 54, .34);
    opacity: 1 !important;
    backdrop-filter: blur(1.5px);
}

.inv-modal-window .modal-content {
    border: 1px solid var(--inv-hair-2);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .28);
}
.inv-modal-window .modal-body { padding: 0; }

.inv-form {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    color: var(--inv-ink);
    background: var(--inv-surface);
}

.inv-head {
    display: flex; align-items: center; gap: 12px;
    padding: 14px 18px; border-bottom: 1px solid var(--inv-hair);
}
.inv-head .inv-title { font-size: 15px; font-weight: 650; letter-spacing: -.01em; }
.inv-head .inv-docbadge {
    font-size: 12px; color: var(--inv-accent); background: var(--inv-accent-soft);
    border: 1px solid var(--inv-accent-line); padding: 1px 8px; border-radius: 20px;
    font-variant-numeric: tabular-nums;
}
.inv-head .inv-status { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--inv-ink-2); }
.inv-head .inv-dot { width: 8px; height: 8px; border-radius: 50%; }
.inv-head .inv-dot.draft { background: var(--inv-warn); }
.inv-head .inv-dot.done { background: var(--inv-ok); }
.inv-head .inv-x { border: none; background: none; color: var(--inv-ink-3); font-size: 20px; cursor: pointer; line-height: 1; padding: 2px 4px; }

.inv-tabs { display: flex; gap: 2px; padding: 0 12px; border-bottom: 1px solid var(--inv-hair); background: var(--inv-surface-2); }
.inv-tab {
    border: none; background: none; padding: 11px 14px 10px; font: inherit; font-size: 13px;
    color: var(--inv-ink-2); cursor: pointer; border-bottom: 2px solid transparent;
    display: inline-flex; gap: 7px; align-items: center;
}
.inv-tab:hover { color: var(--inv-ink); }
.inv-tab.on { color: var(--inv-accent); border-bottom-color: var(--inv-accent); font-weight: 600; }
.inv-tab .inv-cnt { font-size: 11px; background: var(--inv-accent-soft); color: var(--inv-accent); border-radius: 10px; padding: 0 6px; font-variant-numeric: tabular-nums; }

.inv-body { padding: 18px; min-height: 300px; max-height: 62vh; overflow-y: auto; }

.inv-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 18px; }
.inv-field { display: flex; flex-direction: column; gap: 4px; }
.inv-field.inv-full { grid-column: 1 / -1; }
.inv-lbl { font-size: 11.5px; color: var(--inv-ink-2); letter-spacing: .01em; margin: 0; }
.inv-ctrl {
    font: inherit; font-size: 13.5px; color: var(--inv-ink); padding: 7px 10px;
    border: 1px solid var(--inv-hair-2); border-radius: 7px; background: var(--inv-surface); width: 100%;
}
.inv-ctrl:focus { outline: none; border-color: var(--inv-accent); box-shadow: 0 0 0 3px var(--inv-accent-soft); }
.inv-ctrl.is-invalid { border-color: var(--inv-bad); box-shadow: 0 0 0 3px var(--inv-bad-soft); }

.inv-eyebrow {
    font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--inv-ink-3);
    margin: 2px 0 12px; display: flex; align-items: center; gap: 12px;
}
.inv-toggle { margin-left: auto; text-transform: none; letter-spacing: 0; font-size: 12px; color: var(--inv-ink-2); display: inline-flex; align-items: center; gap: 6px; cursor: pointer; margin-bottom: 0; }
.inv-scroll { overflow-x: auto; }

.inv-cmp { width: 100%; border-collapse: collapse; font-size: 13px; }
.inv-cmp th, .inv-cmp td { padding: 8px 10px; border-bottom: 1px solid var(--inv-hair); text-align: right; }
.inv-cmp th { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--inv-ink-3); font-weight: 600; }
.inv-cmp th.metric, .inv-cmp td.metric { text-align: left; color: var(--inv-ink); font-weight: 500; }
.inv-cmp tr.primary td { background: var(--inv-accent-soft); }
.inv-cmp tr.primary td.metric { font-weight: 650; }
.inv-cmp tr.muted-row td { color: var(--inv-ink-3); }
.inv-num {
    font: inherit; font-size: 13px; text-align: right; width: 120px; padding: 5px 8px;
    border: 1px solid var(--inv-hair-2); border-radius: 6px; background: var(--inv-surface);
    color: var(--inv-ink); font-variant-numeric: tabular-nums;
}
.inv-num:focus { outline: none; border-color: var(--inv-accent); box-shadow: 0 0 0 3px var(--inv-accent-soft); }
.inv-delta { display: inline-flex; align-items: center; padding: 1px 8px; border-radius: 20px; font-variant-numeric: tabular-nums; font-size: 12.5px; font-weight: 600; }
.inv-delta.ok { background: var(--inv-ok-soft); color: var(--inv-ok); }
.inv-delta.warn { background: var(--inv-warn-soft); color: var(--inv-warn); }
.inv-delta.bad { background: var(--inv-bad-soft); color: var(--inv-bad); }
.inv-delta.zero { color: var(--inv-ink-3); }
.inv-hint { font-size: 11.5px; color: var(--inv-ink-3); margin-top: 10px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.inv-hint .inv-delta { font-size: 11px; }

.inv-note { font-size: 12px; color: var(--inv-ink-2); background: var(--inv-surface-2); border: 1px solid var(--inv-hair); border-radius: 8px; padding: 9px 12px; margin-bottom: 14px; }
.inv-muted-sm { font-size: 12px; color: var(--inv-ink-3); }

.inv-docs-toolbar { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.inv-btn { font: inherit; font-size: 13px; padding: 7px 13px; border-radius: 7px; cursor: pointer; border: 1px solid var(--inv-hair-2); background: var(--inv-surface); color: var(--inv-ink); display: inline-flex; gap: 7px; align-items: center; }
.inv-btn.primary { background: var(--inv-accent); border-color: var(--inv-accent); color: #fff; }
.inv-btn.ghost { border-style: dashed; color: var(--inv-accent); border-color: var(--inv-accent-line); }
.inv-btn:disabled { opacity: .6; cursor: default; }

.inv-stage-tile { position: relative; width: 132px; margin: 0 8px 12px 0; text-align: center; }
.inv-stage-thumb { width: 132px; height: 92px; object-fit: cover; border: 1px solid var(--inv-hair-2); border-radius: 5px; background: var(--inv-surface-2); display: flex; align-items: center; justify-content: center; font-size: 30px; color: var(--inv-ink-3); }
.inv-stage-name { font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 3px 0; }
.inv-stage-role { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: var(--inv-ink-2); cursor: pointer; margin-bottom: 2px; }
.inv-stage-role input { margin: 0; cursor: pointer; }
.inv-stage-invoice .inv-stage-thumb { border-color: var(--inv-accent); box-shadow: 0 0 0 2px var(--inv-accent-line); }
.inv-stage-invoice .inv-stage-role { color: var(--inv-accent); font-weight: 600; }

/* Роль документа в реестре: накладная (распознаётся) vs вспомогательный. */
.inv-btn-xs { font-size: 11px; padding: 3px 8px; border-radius: 6px; }
.inv-badge-invoice { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 600; color: var(--inv-accent); background: var(--inv-accent-line); padding: 2px 8px; border-radius: 10px; white-space: nowrap; }
.inv-reg-invoice td { background: var(--inv-accent-line); }
.inv-invoice-check { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; margin: 0; font-size: 11px; }
.inv-invoice-check input { margin: 0; cursor: pointer; }
.inv-spin { display: inline-block; animation: inv-spin 1s linear infinite; color: var(--inv-accent); }
@keyframes inv-spin { to { transform: rotate(360deg); } }

/* Мини-панель распознанных цифр накладной в левом списке фото поступления. */
.income-ocr-mini { display: grid; grid-template-columns: repeat(2, auto); gap: 2px 10px; align-content: center; white-space: nowrap; }
.income-ocr-mini-item { font-size: 11px; line-height: 1.25; color: #495057; }
.income-ocr-mini-k { display: inline-block; min-width: 42px; color: #868e96; margin-right: 4px; }
.income-ocr-mini-item b { color: #212529; }

/* Красная подсветка строки журнала прихода: расхождение распознанных литров отгрузки и приёма > 5%. */
.inv-row-mismatch > td { background-color: #f8d7da !important; }
.inv-row-mismatch.badge-secondary > td { background-color: #f1b6bd !important; }

.inv-reg { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.inv-reg th, .inv-reg td { padding: 8px 10px; border-bottom: 1px solid var(--inv-hair); text-align: left; }
.inv-reg th { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--inv-ink-3); }
.inv-reg-thumb { width: 48px; height: 34px; border-radius: 5px; object-fit: cover; border: 1px solid var(--inv-hair-2); background: var(--inv-surface-2); display: inline-flex; align-items: center; justify-content: center; font-size: 11px; color: var(--inv-ink-3); }

.inv-iconbtn { border: 1px solid var(--inv-hair-2); background: var(--inv-surface); border-radius: 6px; min-width: 28px; height: 28px; cursor: pointer; color: var(--inv-ink-2); font-size: 13px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; padding: 0 6px; text-decoration: none; }
.inv-iconbtn:hover { color: var(--inv-accent); border-color: var(--inv-accent-line); }
.inv-iconbtn.danger:hover { color: var(--inv-bad); border-color: var(--inv-bad); }

.inv-foot { display: flex; align-items: center; gap: 10px; padding: 13px 18px; border-top: 1px solid var(--inv-hair); background: var(--inv-surface-2); }
.inv-foot .inv-spacer { margin-left: auto; }
.inv-req-note { font-size: 11.5px; color: var(--inv-ink-3); }

/* Вьюер документа с зумом. */
.inv-viewer { position: fixed; inset: 0; z-index: 1100; background: rgba(10, 15, 20, .82); display: flex; flex-direction: column; }
.inv-viewer-bar { display: flex; align-items: center; gap: 8px; padding: 10px 14px; background: rgba(20, 28, 36, .95); color: #e6edf3; }
.inv-viewer-bar .inv-iconbtn { background: transparent; border-color: rgba(255,255,255,.2); color: #cdd7e1; }
.inv-viewer-bar .inv-iconbtn:hover { color: #fff; border-color: #fff; }
.inv-viewer-name { font-size: 13px; }
.inv-viewer-zoom { font-size: 12px; min-width: 44px; text-align: center; color: #cdd7e1; font-variant-numeric: tabular-nums; }
.inv-viewer-stage { flex: 1; overflow: auto; display: flex; align-items: center; justify-content: center; padding: 16px; }
.inv-viewer-img { max-width: 100%; transform-origin: center; transition: transform .12s ease; }
.inv-viewer-frame { width: 90vw; height: 82vh; border: none; background: #fff; }

/* Тёмная тема: переопределяем токены. */
@media (prefers-color-scheme: dark) {
    .inv-modal-window .modal-content, .inv-modal-window .modal-body {
        --inv-accent: #5b9be0; --inv-accent-soft: rgba(91,155,224,.16); --inv-accent-line: rgba(91,155,224,.5);
        --inv-ink: #e6edf3; --inv-ink-2: #a3b1bf; --inv-ink-3: #6f7d8b;
        --inv-surface: #161e27; --inv-surface-2: #1c2732;
        --inv-hair: rgba(230,237,243,.1); --inv-hair-2: rgba(230,237,243,.17);
        --inv-ok-soft: rgba(31,157,85,.2); --inv-warn-soft: rgba(185,119,10,.22); --inv-bad-soft: rgba(209,73,91,.2);
    }
}

/* Панель "План посева" в разделе Геозоны (docs/agro-sowing-plan/TZ.md, раздел 2) —
   тот же механизм высоты, что у .geozone-editor-panel (getGeozoneEditorPanelStyle,
   растягивается тем же сплиттером .object-management-splitter): фиксированный
   flex-basis без роста/сжатия, высота — только через инлайн-стиль от Angular. */
.sowing-plan-panel {
    flex: 0 0 245px;
    min-height: 130px;
    overflow: auto;
    padding: 8px;
    background: #ffffff;
    border-top: 1px solid #d9e2ea;
}
.sowing-plan-tabs-row {
    margin-bottom: 6px;
}
.sowing-plan-tabs {
    margin-bottom: 8px;
}
.sowing-plan-body table td,
.sowing-plan-body table th {
    font-size: 12.5px;
    vertical-align: middle;
}
.sowing-plan-picker-list {
    max-height: 220px;
    overflow: auto;
    border-top: 1px solid #eef3f8;
    padding-top: 6px;
}
.sowing-plan-picker-list label {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 3px 0;
    font-size: 12.5px;
}

/* Модалка "Справочник культур" (docs/agro-sowing-plan/TZ.md, раздел 1.4) — центрирование
   и затемнение фона, как у остальных модалок в проекте (см. .modal-backdrop { opacity: .3 }
   — это уже задано глобально; здесь только позиционирование диалога и вид таблицы). */
.crops-directory-modal .modal-dialog {
    max-width: 900px;
    display: flex;
    align-items: center;
    min-height: calc(100% - 3.5rem);
    margin: 1.75rem auto;
}
.crops-directory-modal .modal-content {
    width: 100%;
}
.crops-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.crops-modal-body {
    padding: 1rem 1.25rem 1.25rem;
}

.crops-table {
    width: 100%;
    table-layout: fixed;
    font-size: 13px;
    margin-bottom: 14px;
}
.crops-table thead th {
    background: #172134;
    color: #fff;
    font-weight: 600;
    padding: 8px 10px;
    border: none;
    vertical-align: middle;
}
.crops-table td {
    padding: 6px 10px;
    vertical-align: middle;
    border-top: 1px solid #eef1f5;
}
.crops-row-inactive {
    opacity: 0.55;
}
.crops-col-name { width: 20%; }
.crops-col-color { width: 7%; }
.crops-col-code { width: 10%; }
.crops-col-group { width: 16%; }
.crops-col-yield { width: 13%; }
.crops-col-perennial { width: 11%; }
.crops-col-active { width: 8%; }
.crops-col-actions { width: 15%; text-align: right; white-space: nowrap; }

.crops-shared-badge {
    font-size: 10px;
    vertical-align: middle;
    margin-left: 4px;
}

.crops-color-swatch {
    display: inline-block;
    width: 26px;
    height: 26px;
    border-radius: 6px;
    border: 1px solid rgba(0, 0, 0, .15);
    box-shadow: inset 0 0 0 2px #fff;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    margin-bottom: 0;
}
.crops-color-swatch-lg {
    width: 32px;
    height: 32px;
}
.crops-color-swatch input[type="color"] {
    position: absolute;
    top: -4px;
    left: -4px;
    width: 40px;
    height: 40px;
    border: none;
    padding: 0;
    cursor: pointer;
}

.crops-status-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}
.crops-status-dot.is-active {
    background: #2e9e5b;
}
.crops-status-dot.is-inactive {
    background: #c6cdd6;
}

.crops-action-btn {
    padding: 2px 6px;
    color: #4a5568;
}
.crops-action-btn:hover {
    color: #172134;
}
.crops-action-danger:hover {
    color: #c0392b;
}

.dir-search { position: sticky; top: -1px; z-index: 3; display: flex; align-items: center; gap: 12px; margin: 0 0 6px; padding: 4px 0 8px; background: #fff; }
.dir-search input { max-width: 340px; }
.dir-search .dir-count { color: #6b7785; font-size: 12px; white-space: nowrap; }
.crops-add-row { position: sticky; bottom: -1px; z-index: 2; background: #fff; border-top: 1px solid #e3e8ee; padding-top: 8px; }
.crops-add-row {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    padding: 12px;
    background: #f7f9fb;
    border-radius: 8px;
    flex-wrap: wrap;
}
.crops-add-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.crops-add-field label {
    font-size: 11px;
    font-weight: 600;
    color: #6b7684;
    text-transform: uppercase;
    letter-spacing: .02em;
    margin-bottom: 0;
}
.crops-add-name { flex: 1 1 200px; }
.crops-add-color { flex: 0 0 auto; }
.crops-add-code { flex: 0 0 110px; }
.crops-add-group { flex: 1 1 180px; }
.crops-add-yield { flex: 0 0 150px; }
.crops-add-submit { flex: 0 0 auto; }

.crops-hint {
    font-size: 11.5px;
    color: #8a97a4;
    line-height: 1.5;
    margin-top: 10px;
}

/* Тех.карта культуры (виды работ по срокам) — раскрывающаяся панель под строкой культуры,
   аналог таб. части "Виды работ" в форме культуры 1С (см. запрос пользователя 02.08.2026). */
.crops-work-types-cell {
    background: #f7f9fb;
    padding: 10px 14px 14px !important;
    border-top: none !important;
}
.crops-work-types-panel { width: 100%; }
.crops-work-types-table {
    width: 100%;
    font-size: 12.5px;
    margin-bottom: 10px;
    background: #fff;
}
.crops-work-types-table thead th {
    background: #eef1f5;
    color: #4a5568;
    font-weight: 600;
    padding: 6px 8px;
    border: none;
}
.crops-work-types-table td {
    padding: 5px 8px;
    vertical-align: middle;
    border-top: 1px solid #eef1f5;
}
.crops-period-inputs {
    display: flex;
    align-items: center;
    gap: 6px;
}
.crops-period-inputs .form-control,
.crops-work-type-unit {
    display: inline-block;
}
.crops-period-day {
    width: 64px;
}
.crops-work-types-add-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.crops-work-types-add-row .form-control {
    width: auto;
    min-width: 110px;
}
.crops-work-type-unit {
    width: 80px !important;
    min-width: 80px !important;
}

/* ===== Мобильный раздел «Заказы» (заявки на поставку топлива) ===== */
.mobile-orders { padding: 12px; position: relative; padding-bottom: 88px; }
.mobile-order-card {
    background: #fff; border: 1px solid #e3e9ee; border-radius: 12px; padding: 12px 14px;
    margin-bottom: 10px; box-shadow: 0 1px 3px rgba(0,0,0,.05);
}
.mobile-order-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.mobile-order-dest { font-weight: 600; color: #22303c; font-size: 15px; }
.mobile-order-mid { display: flex; align-items: center; justify-content: space-between; color: #4a5763; font-size: 14px; margin-bottom: 4px; }
.mobile-order-vol { font-weight: 600; font-variant-numeric: tabular-nums; }
.mobile-order-bot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; color: #8a939b; font-size: 12.5px; }
.mobile-order-no { margin-left: auto; }
.fr-badge { display: inline-block; padding: 2px 9px; border-radius: 11px; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.fr-b-NEW { background: #e7eef5; color: #4a5763; }
.fr-b-REVIEW { background: #fff3cd; color: #8a6d00; }
.fr-b-CONFIRMED { background: #d6ecff; color: #1c66c7; }
.fr-b-PLANNED { background: #dfe3ff; color: #3b3fa0; }
.fr-b-IN_PROGRESS { background: #d9f2e3; color: #1e7a45; }
.fr-b-PARTIAL { background: #fde8cf; color: #a85b12; }
.fr-b-DONE { background: #d5f4dd; color: #1a7a3a; }
.fr-b-REJECTED { background: #fbdcdc; color: #b1352f; }
.fr-b-CANCELLED { background: #e6e6e6; color: #777; }

.mobile-fab {
    position: fixed; right: 18px; bottom: 22px; width: 56px; height: 56px; border-radius: 50%;
    background: #2477e0; color: #fff; border: none; font-size: 24px; box-shadow: 0 4px 14px rgba(36,119,224,.45);
    display: flex; align-items: center; justify-content: center; z-index: 20;
}
.mobile-fab:active { background: #1c66c7; }

.mobile-order-form { padding: 14px; }
.mobile-form-field { margin-bottom: 14px; }
.mobile-form-field > label { display: block; font-size: 13px; color: #4a5763; margin-bottom: 5px; font-weight: 600; }
.mobile-form-field select, .mobile-form-field input, .mobile-form-field textarea {
    width: 100%; border: 1px solid #cdd6df; border-radius: 8px; padding: 10px 12px; font-size: 15px; background: #fff; color: #22303c;
}
.mobile-form-actions { display: flex; gap: 10px; margin-top: 8px; }
.mobile-form-actions .btn { flex: 1; padding: 12px; font-size: 15px; border-radius: 8px; }

/* Мобильные детали заявки */
.mobile-order-card { cursor: pointer; }
.mobile-order-card:active { background: #f3f8ff; }
.mobile-order-detail-screen { padding: 14px; }
.mobile-order-detail-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 14px; }
.mobile-detail-grid { display: grid; grid-template-columns: 130px 1fr; gap: 8px 12px; font-size: 14px; }
.mobile-detail-grid .k { color: #8a939b; }
.mobile-detail-grid .v { color: #22303c; font-weight: 500; }
.mobile-detail-reject { color: #b1352f; }
.mobile-detail-section { margin: 18px 0 8px; font-weight: 700; color: #37424c; font-size: 14px; }
.mobile-detail-hist { list-style: none; margin: 0; padding: 0; font-size: 13px; }
.mobile-detail-hist li { padding: 8px 0; border-bottom: 1px dashed #e3e9ee; display: flex; flex-wrap: wrap; gap: 6px; }
.mobile-detail-hist .t { color: #8a939b; }
.mobile-detail-hist .a { font-weight: 600; color: #2477e0; }
.mobile-detail-hist .d { color: #4a5763; width: 100%; }
.mobile-form-actions .btn-danger { background: #d9534f; color: #fff; border: none; }

/* ==================== Модуль "Задачи" (docs/task-management-module/TZ.md) ==================== */

.wtask-page { padding: 12px 18px; }

/* Компактная шапка (было слишком много пустого места по требованию пользователя) */
.wtask-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; flex-wrap: wrap; gap: 10px; padding: 10px 14px; background: #fff; border-radius: 8px; }
.wtask-header h2 { margin: 0; font-weight: 800; color: #26374d; font-size: 20px; }
.wtask-header .wtask-subtitle { color: #7c8a9d; font-size: 12px; margin-top: 1px; }
.wtask-header-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
/* 11.09.2026: Bootstrap .form-control даёт width:100% — внутри flex-строки это растягивало
   поле поиска на всю ширину и сбрасывало кнопку "Фильтры" на новую строку. Явная ширина вместо
   растягивания на 100% — три элемента остаются в одну строку. */
.wtask-header-actions .form-control { width: 260px; min-width: 200px; height: 34px; flex: 0 0 auto; }
.wtask-header-actions .btn { height: 34px; display: inline-flex; align-items: center; flex: 0 0 auto; }

.wtask-tabs { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 10px; border-bottom: 2px solid #e7ecf1; }
.wtask-tab { padding: 6px 12px; cursor: pointer; color: #5b6b7c; font-size: 13px; border-bottom: 2px solid transparent; margin-bottom: -2px; white-space: nowrap; }
.wtask-tab:hover { color: #2da8df; }
.wtask-tab.active { color: #2da8df; border-bottom-color: #2da8df; font-weight: 700; }
.wtask-tab .badge { margin-left: 4px; }
.wtask-tab.wtask-tab-overdue.active { color: #dc3545; border-bottom-color: #dc3545; }

/* CSS Grid вместо <table> (см. комментарий в tasks.html) — колонки задаются один раз здесь
   и одинаково применяются и к строке заголовка, и к строкам данных, независимо от контента:
   никакого browser-driven auto-layout, который "уезжал" контентом одной колонки в соседнюю. */
.wtask-grid-wrap { background: #fff; border-radius: 8px; overflow: hidden; }
.wtask-grid {
    display: grid;
    grid-template-columns: 4% 19% 9% 8% 13% 13% 12% 11% 11%;
    align-items: center;
    column-gap: 8px;
    padding: 6px 8px;
    font-size: 12px;
}
/* 12.09.2026, по прямому указанию пользователя: колонка "Компания" перед "Статус" — только для
   супер-пользователей (tasks.html, ng-if="isSuper"). Модификатор добавляет 10-ю колонку и
   пересчитывает остальные — применяется синхронно к шапке и строкам (см. ng-class в шаблоне). */
.wtask-grid.wtask-grid-with-company {
    grid-template-columns: 4% 16% 10% 8% 7% 12% 12% 11% 10% 10%;
}
.wtask-grid > div { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wtask-cell-title { white-space: normal !important; }
.wtask-grid-head { font-weight: 700; font-size: 11px; text-transform: uppercase; color: #7c8a9d; border-bottom: 2px solid #e7ecf1; padding-top: 10px; padding-bottom: 10px; }
.wtask-row { cursor: pointer; border-bottom: 1px solid #f0f3f7; }
.wtask-row:hover { background: #f5f9fd; }
.wtask-row-overdue .wtask-deadline-cell { color: #dc3545; font-weight: 700; }
.wtask-deadline-edit { display: flex; align-items: center; gap: 4px; }
.wtask-deadline-edit input { width: auto; flex: 1; min-width: 0; }
.wtask-deadline-edit .bi-check-lg { color: #1e8449; }
.wtask-deadline-edit .bi-x-lg { color: #dc3545; }
.wtask-empty-row { text-align: center; color: #9aa7b5; padding: 30px 0; }

.wtask-status-badge, .wtask-priority-badge { display: inline-block; padding: 3px 10px; border-radius: 12px; font-size: 12px; font-weight: 700; white-space: nowrap; }
.wtask-status-NEW { background: #eef1f5; color: #5b6b7c; }
.wtask-status-IN_PROGRESS { background: #e3f1fb; color: #1a7fc1; }
.wtask-status-POSTPONED { background: #fdf1de; color: #b8860b; }
.wtask-status-DONE { background: #e4f6ea; color: #1e8449; }
.wtask-status-CANCELLED { background: #f1f1f1; color: #888; text-decoration: line-through; }
.wtask-status-OVERDUE { background: #fbe4e4; color: #dc3545; }

.wtask-priority-LOW { background: #eef1f5; color: #5b6b7c; }
.wtask-priority-NORMAL { background: #e3f1fb; color: #1a7fc1; }
.wtask-priority-HIGH { background: #fdece0; color: #d9730d; }
.wtask-priority-URGENT { background: #fbe4e4; color: #dc3545; }

.wtask-avatar { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: #2da8df; color: #fff; font-size: 12px; font-weight: 700; flex: 0 0 auto; }
.wtask-avatar-group { display: inline-flex; align-items: center; }
.wtask-avatar-group .wtask-avatar { margin-left: -8px; border: 2px solid #fff; }
.wtask-avatar-group .wtask-avatar:first-child { margin-left: 0; }
.wtask-avatar-more { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: #cfd8e3; color: #5b6b7c; font-size: 11px; font-weight: 700; margin-left: -8px; border: 2px solid #fff; }
.wtask-avatar-sm { width: 22px; height: 22px; font-size: 10px; }
.wtask-avatar-group .wtask-avatar-sm { margin-left: -6px; border-width: 1px; }
.wtask-avatar-group .wtask-avatar-more.wtask-avatar-sm { width: 22px; height: 22px; font-size: 9px; margin-left: -6px; border-width: 1px; }

/* Поле "Наблюдатели" (ui-select multiple) визуально схлопывалось в узкую полоску — у виджета
   не было явной ширины, а ни один другой ui-select в проекте раньше в multiple-режиме не
   использовался (только single, theme=select2), поэтому в общем CSS не было готового правила. */
.wtask-form-row .ui-select-container { width: 100%; }
.wtask-form-row .ui-select-container.ui-select-multiple { min-height: 38px; }
.wtask-form-row .ui-select-multiple .ui-select-match { display: inline-flex; flex-wrap: wrap; gap: 4px; width: 100%; }
.wtask-who { display: flex; align-items: center; gap: 6px; min-width: 0; }
.wtask-who-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.wtask-who-name { font-size: 13px; color: #354052; }

.wtask-pagination { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; color: #7c8a9d; font-size: 13px; }

/* --- Модалка создания/редактирования --- */

.wtask-form-row { margin-bottom: 14px; }
.wtask-form-row label { font-weight: 700; color: #354052; font-size: 13px; margin-bottom: 4px; display: block; }
.wtask-form-row .required::after { content: ' *'; color: #dc3545; }
.wtask-form-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.wtask-files-drop { border: 2px dashed #cbd7e6; border-radius: 8px; padding: 14px; text-align: center; color: #7c8a9d; font-size: 13px; cursor: pointer; }
.wtask-files-drop:hover { border-color: #2da8df; color: #2da8df; }
.wtask-file-chip { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border: 1px solid #e7ecf1; border-radius: 8px; margin-top: 6px; font-size: 13px; }
.wtask-file-chip .wtask-file-thumb { width: 32px; height: 32px; object-fit: cover; border-radius: 4px; flex-shrink: 0; }
.wtask-file-chip .wtask-file-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wtask-file-chip .wtask-file-size { color: #9aa7b5; font-size: 11px; }
.wtask-file-chip .wtask-file-remove { cursor: pointer; color: #dc3545; }

.wtask-editor-toolbar { border: 1px solid #cbd7e6; border-bottom: none; border-radius: 6px 6px 0 0; }
.wtask-editor-body { border: 1px solid #cbd7e6; border-radius: 0 0 6px 6px; min-height: 140px; }

/* --- Модалка карточки задачи ---
   11.09.2026, по прямому указанию пользователя: перекомпоновка по образцу карточки задачи
   Bitrix24 (скриншот от пользователя) — узкая левая колонка (описание/метаданные/файлы/история)
   + широкая ПОСТОЯННО видимая (не вкладка) панель чата справа, цветовая гамма чата — мягкий
   голубовато-зелёный градиент и bubble-сообщения, как в образце. */

.wtask-card-modal .modal-dialog { max-width: 1240px; width: 94vw; }
.wtask-card-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.wtask-card-title { font-weight: 800; color: #26374d; }
.wtask-card-modal-tabs { display: flex; gap: 2px; border-bottom: 2px solid #e7ecf1; margin: 0 0 12px; }
.wtask-card-modal-tabs .wtask-tab { padding: 6px 14px; }

.wtask-card-body { padding: 0; }
.wtask-card-columns { display: flex; align-items: stretch; height: 76vh; min-height: 480px; }

.wtask-left-pane { flex: 0 0 420px; max-width: 420px; overflow-y: auto; padding: 16px; background: #f4f6f9; border-right: 1px solid #e7ecf1; }
.wtask-left-card { background: #fff; border-radius: 10px; padding: 14px 16px; margin-bottom: 12px; box-shadow: 0 1px 2px rgba(38, 55, 77, 0.06); }
.wtask-meta-card .wtask-si-row:last-child { margin-bottom: 0; }

.wtask-si-row { font-size: 13px; margin-bottom: 12px; }
.wtask-si-label { color: #9aa7b5; font-size: 11px; text-transform: uppercase; margin-bottom: 3px; letter-spacing: .02em; }
/* та же причина, что и у .wtask-form-row .ui-select-multiple (создание задачи) — без явной
   ширины виджет схлопывается в узкую полоску. */
.wtask-si-row .ui-select-container { width: 100%; }
.wtask-si-row .ui-select-container.ui-select-multiple { min-height: 34px; }
.wtask-si-row .ui-select-multiple .ui-select-match { display: inline-flex; flex-wrap: wrap; gap: 4px; width: 100%; }

.wtask-description-html { font-size: 14px; color: #354052; line-height: 1.5; }
.wtask-description-html img { max-width: 100%; border-radius: 6px; margin: 6px 0; }
.wtask-description-html p { margin: 0 0 8px; }

/* Карточка-редактор описания — по образцу Bitrix (шапка/крестик, футер с кнопкой справа). */
.wtask-desc-edit { margin: -14px -16px; }
.wtask-desc-edit-head {
    display: flex; align-items: center; justify-content: space-between; font-weight: 700;
    color: #26374d; font-size: 15px; padding: 12px 16px; border-bottom: 1px solid #e7ecf1;
}
.wtask-desc-edit > .form-control, .wtask-desc-edit > .wtask-editor-body { margin-left: 16px; margin-right: 16px; width: calc(100% - 32px); }
.wtask-desc-edit > .form-control { margin-top: 12px; }
.wtask-desc-edit-foot { display: flex; justify-content: flex-end; padding: 10px 16px; border-top: 1px solid #e7ecf1; margin-top: 10px; }

/* Правая колонка — чат, растягивается на всю оставшуюся ширину и высоту модалки. */
.wtask-right-pane { flex: 1; min-width: 0; display: flex; flex-direction: column; background: #fff; }
.wtask-chat-panel-head { padding: 10px 18px; font-weight: 700; color: #26374d; font-size: 14px; border-bottom: 1px solid #e7ecf1; flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; }
.wtask-chat-panel-head .bi-chat-dots { color: #2da8df; margin-right: 4px; }
.wtask-chat-panel-head .text-muted { font-weight: 400; font-size: 12px; }
.wtask-add-to-chat { display: flex; align-items: center; gap: 10px; padding: 10px 18px; border-bottom: 1px solid #e7ecf1; flex: 0 0 auto; }
.wtask-add-to-chat .ui-select-container { flex: 1; }
/* мультиселект (та же причина, что и .wtask-si-row .ui-select-multiple) — без явной ширины
   схлопывается в узкую полоску. */
.wtask-add-to-chat .ui-select-container.ui-select-multiple { min-height: 34px; }
.wtask-add-to-chat .ui-select-multiple .ui-select-match { display: inline-flex; flex-wrap: wrap; gap: 4px; width: 100%; }

.wtask-chat { display: flex; flex-direction: column; flex: 1; min-height: 0; padding: 14px 18px; transition: box-shadow .15s ease; }
/* Мягкий голубовато-зелёный диагональный градиент — цветовая гамма из присланного образца. */
.wtask-chat-messages {
    flex: 1; overflow-y: auto; min-height: 0; padding: 14px; margin: -14px -18px 10px;
    background: linear-gradient(135deg, #e3f0fb 0%, #e8f6ec 100%);
}
.wtask-chat-dragover { box-shadow: inset 0 0 0 3px #2da8df; }
.wtask-chat-dragover .wtask-chat-messages { background: linear-gradient(135deg, #d5e9fa 0%, #d9f1e0 100%); }

.wtask-chat-message { display: flex; gap: 10px; margin-bottom: 14px; max-width: 72%; }
.wtask-chat-message-body { flex: 1; min-width: 0; }
.wtask-chat-bubble { background: #fff; border-radius: 12px; padding: 8px 12px; box-shadow: 0 1px 2px rgba(38, 55, 77, 0.10); display: inline-block; max-width: 100%; }
.wtask-chat-message-head { display: flex; align-items: baseline; gap: 8px; }
.wtask-chat-message-author { font-weight: 700; color: #26374d; font-size: 12.5px; }
.wtask-chat-message-time { color: #9aa7b5; font-size: 11px; }
.wtask-chat-message-text { margin-top: 2px; font-size: 13.5px; color: #354052; white-space: pre-wrap; word-break: break-word; }
.wtask-chat-attachment { display: inline-flex; align-items: center; gap: 8px; margin-top: 6px; padding: 6px 10px; background: #f5f8fb; border-radius: 8px; font-size: 12px; }
.wtask-chat-attachment img.wtask-thumb { width: 64px; height: 64px; object-fit: cover; border-radius: 6px; cursor: pointer; }

/* Свои сообщения — справа, аватар после пузыря, лёгкий синий тон (по образцу мессенджеров/Bitrix). */
.wtask-chat-message-own { flex-direction: row-reverse; margin-left: auto; }
.wtask-chat-message-own .wtask-chat-bubble { background: #dceafd; }
.wtask-chat-message-own .wtask-chat-message-body { text-align: right; }
.wtask-chat-message-own .wtask-chat-message-head { flex-direction: row-reverse; }

.wtask-chat-input-row { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; background: #f4f6f9; border-radius: 22px; padding: 6px 8px; }
.wtask-chat-input-row textarea {
    flex: 1; resize: none; border: none; background: transparent; padding: 6px 4px; font-size: 13.5px;
    max-height: 90px;
}
.wtask-chat-input-row textarea:focus { outline: none; box-shadow: none; }
.wtask-chat-icon-btn, .wtask-chat-send-btn {
    flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%; display: inline-flex;
    align-items: center; justify-content: center; padding: 0; border: none;
}
.wtask-chat-icon-btn { background: transparent; color: #7c8a9d; }
.wtask-chat-icon-btn:hover { background: #e7ecf1; color: #2da8df; }
.wtask-chat-send-btn { background: #2da8df; color: #fff; }
.wtask-chat-send-btn:hover { background: #1f92c6; color: #fff; }
.wtask-chat-hint { color: #9aa7b5; font-size: 11px; margin-top: 6px; text-align: center; flex: 0 0 auto; }

.wtask-history-list { list-style: none; margin: 0; padding: 0; font-size: 13px; }
.wtask-history-list li { padding: 8px 0; border-bottom: 1px dashed #e7ecf1; }
.wtask-history-time { color: #9aa7b5; margin-right: 6px; }
.wtask-history-actor { font-weight: 700; color: #26374d; }

@media (max-width: 991px) {
    .wtask-card-columns { flex-direction: column; height: auto; }
    .wtask-left-pane { flex: 0 0 auto; max-width: none; border-right: none; border-bottom: 1px solid #e7ecf1; }
    .wtask-right-pane { min-height: 480px; }
}

/* --- Колокольчик уведомлений (шапка) --- */

.wtask-bell { position: relative; cursor: pointer; }
.wtask-bell .badge { position: absolute; top: -4px; right: -6px; background: #dc3545; color: #fff; }
.wtask-notif-dropdown { width: 340px; max-height: 420px; overflow-y: auto; }
.wtask-notif-item { padding: 10px 14px; border-bottom: 1px solid #eef1f5; font-size: 13px; cursor: pointer; }
.wtask-notif-item:hover { background: #f5f9fd; }
.wtask-notif-item.unread { background: #eef7fd; }
.wtask-notif-time { color: #9aa7b5; font-size: 11px; }

/* Журнал принятых данных: кнопка удаления строки (крестик в конце выделенной строки) */
.object-data-del-col { width: 40px; text-align: center; }
.object-data-del-btn {
    border: none;
    background: transparent;
    color: #dc3545;
    cursor: pointer;
    padding: 2px 6px;
    line-height: 1;
    border-radius: 4px;
}
.object-data-del-btn:hover { background: #dc3545; color: #fff; }

/* Окно выбора дилера (форма компании): широкое, таблица со своей прокруткой, подсветка первой найденной строки */
.dealer-picker-window .modal-dialog {
    max-width: 1100px;
    /* по центру экрана по вертикали: окно открывается поверх другой модалки, и с верхним
       прижатием шапка уезжала под край */
    display: flex;
    align-items: center;
    min-height: calc(100% - 3.5rem);
}

.dealer-picker-window .modal-content {
    width: 100%;
}

.dealer-picker-table-wrap {
    max-height: 55vh;
    overflow: auto;
    border: 1px solid #dee2e6;
}

.dealer-picker-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    white-space: nowrap;
}

.dealer-picker-table tbody tr {
    cursor: pointer;
}

.dealer-picker-table tr.dealer-picker-active {
    outline: 2px solid #17a2b8;
    outline-offset: -2px;
}

/* Карточка дилера: блок «Генеральный пользователь» (пользователь с тем же email) */
.dealer-owner {
    margin-top: 4px;
}

.dealer-owner-card {
    border: 1px solid #dee2e6;
    border-left: 3px solid #17a2b8;
    border-radius: 3px;
    padding: 6px 10px;
    margin-bottom: 6px;
    background: #f8fafb;
}

/* Левая панель страницы «Дилеры»: таблицы со своей прокруткой, чтобы две таблицы помещались в панель */
.dealer-left-table-wrap {
    max-height: 38vh;
    overflow: auto;
}

/* Контекстное меню пользователя в левой панели «Дилеры» */
.dealer-context-menu {
    position: fixed;
    z-index: 2000;
    background: #fff;
    border: 1px solid #ced4da;
    border-radius: 4px;
    padding: 4px 0;
    min-width: 260px;
}

.dealer-context-item {
    padding: 6px 12px;
    font-size: 0.85rem;
    cursor: pointer;
    white-space: nowrap;
}

.dealer-context-item:hover {
    background: #e9f3fb;
}

/* Документы «План посева» / «План технологических операций» — модальное окно (11.10.2026) */
.spdoc-window .modal-dialog { max-width: 96vw; }
.spdoc-window .modal-content {
    width: 1180px; max-width: 96vw; min-width: 720px;
    height: 78vh; min-height: 460px; max-height: 94vh;
    resize: both; overflow: hidden; border-radius: 12px; display: flex; flex-direction: column;
}
.spdoc-window .modal-header { user-select: none; padding: 8px 14px; }
.spdoc-body { flex: 1 1 auto; overflow: auto; padding: 10px 14px; font-size: 13px; }
.spdoc-head-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; margin-bottom: 8px; }
.spdoc-head-row .form-group { margin: 0; min-width: 150px; flex: 1 1 150px; }
.spdoc-head-row label { font-size: 11px; margin: 0; color: #5b6b7b; }
.spdoc-actions { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 8px; align-items: center; }
.spdoc-tabs { margin-bottom: 8px; }
.spdoc-summary { margin-left: auto; font-size: 12px; color: #1f2937; }
.spdoc-table input.form-control, .spdoc-table select.form-control { height: 26px; padding: 1px 4px; font-size: 12px; }
.spdoc-table td { vertical-align: middle; }
.spdoc-table .num { text-align: right; white-space: nowrap; }
.spdoc-status-draft { color: #8a6d00; } .spdoc-status-ok { color: #1b7f3b; }