/*
  custom_volt.css
  Мелкие стили для StatX3 поверх Volt.
  Тут нет логики проекта, только внешний вид.
*/

/* Chartist контейнеры: без высоты графики выглядят как "ничего" */
.ct-chart-sales-profit {
  height: 340px;
}

.ct-chart-cash-structure {
  height: 180px;
  position: relative;
}

.ct-chart-telemetry-donut {
  height: 210px;
  position: relative;
}

.ct-chart-cash-structure .ct-center-label {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-weight: 600;
  font-size: .9rem;
  color: #111;
  pointer-events: none;
  padding: 0 .35rem;
}

.ct-chart-telemetry-donut .ct-center-label {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-weight: 600;
  font-size: .9rem;
  color: #111;
  pointer-events: none;
  padding: 0 .35rem;
}

/* Лидеры продаж: делаем прогрессбар не микроскопическим */
.topgoods-block .progress {
  height: .85rem;
}

.topgoods-block .progress-wrapper:last-child {
  margin-bottom: 0 !important;
}

/* Sidebar: длинные пункты меню не должны обрезаться */
.sidebar .nav-link .sidebar-text {
  white-space: normal !important;
  word-break: break-word;
  line-height: 1.2;
}

/* Sidebar: prevent width jump before SimpleBar initializes */
#sidebarMenu[data-simplebar]:not([data-simplebar="init"]) {
  overflow-y: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

#sidebarMenu[data-simplebar]:not([data-simplebar="init"])::-webkit-scrollbar {
  width: 0;
  height: 0;
}

.sidebar .nav-link {
  height: auto;
  align-items: flex-start !important;
}

.sidebar .nav-link.d-flex > .sidebar-text,
.sidebar .nav-link.d-flex > .d-flex {
  min-width: 0;
}

.sidebar .nav-link .sidebar-icon,
.sidebar .nav-link .link-arrow {
  margin-top: .15rem;
  flex-shrink: 0;
}

.sidebar .nav-link .link-arrow.statx-leaf-link-arrow {
  width: .3rem;
  height: .3rem;
  min-width: .3rem;
  margin-top: .45rem;
  margin-right: .45rem;
  border-radius: 50%;
  background: currentColor;
  opacity: .4;
  transition: opacity .15s ease, transform .15s ease;
}

.sidebar .nav-link .link-arrow.statx-leaf-link-arrow .icon {
  display: none;
}

.sidebar .nav-link:hover .link-arrow.statx-leaf-link-arrow,
.sidebar .nav-link:focus .link-arrow.statx-leaf-link-arrow,
.sidebar .nav-link.active .link-arrow.statx-leaf-link-arrow {
  opacity: .85;
  transform: scale(1.08);
}

/* Mobile top bar: make brand logo rounded as in opened mobile sidebar */
@media (max-width: 991.98px) {
  .navbar.navbar-theme-primary.d-lg-none .navbar-brand .navbar-brand-dark {
    width: 32px !important;
    height: 32px !important;
    object-fit: cover;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.85);
    background: #fff;
  }
}

/* Project sidebar: desktop collapse to icon rail */
.statx-project-sidebar {
  --statx-project-sidebar-width: 260px;
  --statx-project-sidebar-collapsed-width: 92px;
  --statx-project-sidebar-flyout-width: 270px;
}

.statx-project-sidebar .statx-top-icon {
  width: 1.1rem;
  min-width: 1.1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.statx-project-sidebar .statx-top-icon i {
  width: 1rem;
  text-align: center;
  line-height: 1;
  font-size: .95rem;
}

.statx-project-sidebar .statx-project-nav > .statx-top-nav-item > a.nav-link {
  display: flex;
  align-items: flex-start;
}

.statx-project-sidebar .statx-nav-head-link {
  min-width: 0;
  flex: 1 1 auto;
  text-decoration: none;
}

.statx-project-sidebar .statx-nav-head-link:hover,
.statx-project-sidebar .statx-nav-head-link:focus {
  text-decoration: none;
}

.statx-project-sidebar .statx-sidebar-collapse-btn {
  padding: 0 .2rem;
  margin: .05rem 0 0 .35rem;
  border: 0;
  color: rgba(255, 255, 255, 0.78);
  background: transparent;
  line-height: 1;
  box-shadow: none !important;
  text-decoration: none;
}

.statx-project-sidebar .statx-sidebar-collapse-btn:hover,
.statx-project-sidebar .statx-sidebar-collapse-btn:focus {
  color: #fff;
  background: rgba(255, 255, 255, 0.14);
  border-radius: .35rem;
}

.statx-project-sidebar .statx-sidebar-collapse-btn i {
  font-size: .78rem;
}

@media (min-width: 992px) {
  .statx-project-sidebar.is-collapsed {
    max-width: var(--statx-project-sidebar-collapsed-width);
    overflow: visible;
  }

  .statx-project-sidebar.is-collapsed + .content,
  .statx-project-sidebar.is-collapsed ~ .content,
  body.statx-sidebar-collapsed .content {
    margin-left: 92px !important;
  }

  .statx-project-sidebar.is-collapsed .sidebar-inner {
    padding-left: .65rem !important;
    padding-right: .65rem !important;
    overflow: visible;
  }

  .statx-project-sidebar.is-collapsed .simplebar-mask,
  .statx-project-sidebar.is-collapsed .simplebar-content-wrapper,
  .statx-project-sidebar.is-collapsed .simplebar-content {
    overflow: visible !important;
  }

  .statx-project-sidebar.is-collapsed .statx-menu-search,
  .statx-project-sidebar.is-collapsed .statx-sidebar-ad {
    display: none;
  }

  .statx-project-sidebar.is-collapsed .statx-nav-head {
    justify-content: center !important;
    gap: .32rem;
  }

  .statx-project-sidebar.is-collapsed .statx-nav-head-link {
    flex: 0 0 auto;
  }

  .statx-project-sidebar.is-collapsed .statx-sidebar-collapse-btn {
    margin-left: 0;
    padding: 0 .1rem;
  }

  .statx-project-sidebar.is-collapsed .statx-project-nav > .statx-top-nav-item {
    position: relative;
  }

  .statx-project-sidebar.is-collapsed .statx-project-nav > .statx-top-nav-item > .nav-link {
    justify-content: center !important;
    min-height: 2.45rem;
    padding-left: .55rem;
    padding-right: .55rem;
  }

  .statx-project-sidebar.is-collapsed .statx-project-nav > .statx-top-nav-item > .nav-link .sidebar-text,
  .statx-project-sidebar.is-collapsed .statx-project-nav > .statx-top-nav-item > .nav-link .link-arrow {
    display: none;
  }

  .statx-project-sidebar.is-collapsed .statx-project-nav > .statx-top-nav-item > .nav-link .sidebar-icon {
    margin: 0 !important;
  }

  .statx-project-sidebar.is-collapsed .statx-project-nav > .statx-top-nav-item > .multi-level {
    position: absolute;
    top: 0;
    left: calc(var(--statx-project-sidebar-collapsed-width) - .2rem);
    z-index: 1045;
    margin-left: .55rem;
    min-width: var(--statx-project-sidebar-flyout-width);
    max-width: min(440px, calc(100vw - var(--statx-project-sidebar-collapsed-width) - 2rem));
    max-height: min(70vh, calc(100vh - 2rem));
    overflow-y: auto;
    padding: .45rem .3rem;
    border-radius: .75rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: #1f2937;
    box-shadow: 0 14px 34px rgba(8, 15, 30, 0.42);
  }

  .statx-project-sidebar.is-collapsed .statx-project-nav > .statx-top-nav-item > .multi-level:not(.show) {
    display: none;
  }

  .statx-project-sidebar.is-collapsed .statx-project-nav > .statx-top-nav-item > .multi-level .nav-link {
    padding-right: .8rem;
  }

  .statx-project-sidebar.is-collapsed .statx-project-nav > .statx-top-nav-item.mt-3 {
    margin-top: .75rem !important;
  }
}

/* Sidebar: highlight Online cashdesk menu item */
.sidebar .nav-link.statx-nav-link--online-cashdesk .sidebar-text {
  color: #1ABB9C !important;
  font-weight: 600;
}

.sidebar .nav-link.statx-nav-link--online-cashdesk:hover .sidebar-text,
.sidebar .nav-link.statx-nav-link--online-cashdesk:focus .sidebar-text,
.sidebar .nav-link.statx-nav-link--online-cashdesk.active .sidebar-text {
  color: #24e1b5 !important;
}

/* Sidebar: promo block at the bottom */
.sidebar .sidebar-inner {
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

.sidebar .nav.flex-column {
  flex: 1 1 auto;
  margin-bottom: 0;
}

.statx-menu-search .form-label {
  color: rgba(255, 255, 255, 0.85);
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.statx-menu-search .input-group-text {
  color: rgba(255, 255, 255, 0.85);
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.22);
}

.statx-menu-search-icon {
  width: .9rem;
  height: .9rem;
  display: block;
}

.statx-menu-search .form-control {
  color: #fff;
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.22);
}

.statx-menu-search .form-control::placeholder {
  color: rgba(255, 255, 255, 0.62);
}

.statx-menu-search .form-control:focus {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.4);
  box-shadow: none;
}

.statx-menu-search-results {
  margin-top: .45rem;
  max-height: 280px;
  overflow-y: auto;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: .55rem;
}

.statx-menu-search-item {
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  color: #fff;
  background: rgba(255, 255, 255, 0.08);
  padding: .5rem .65rem;
}

.statx-menu-search-item:last-child {
  border-bottom: 0;
}

.statx-menu-search-item:hover,
.statx-menu-search-item:focus {
  color: #fff;
  background: rgba(255, 255, 255, 0.18);
}

.statx-menu-search-item__title {
  font-size: .8rem;
  font-weight: 600;
  line-height: 1.2;
}

.statx-menu-search-item__path {
  margin-top: .2rem;
  font-size: .68rem;
  opacity: .82;
}

.statx-menu-search-results__status {
  padding: .55rem .65rem;
  font-size: .8rem;
  color: rgba(255, 255, 255, 0.9);
  background: rgba(255, 255, 255, 0.08);
}

.statx-sidebar-ad {
  margin-top: auto;
  padding: 1rem 0 .5rem;
}

.statx-sidebar-ad__link {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  padding: .75rem .85rem;
  border-radius: .75rem;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #fff;
  text-decoration: none;
  transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}

.statx-sidebar-ad__link:hover,
.statx-sidebar-ad__link:focus {
  color: #fff;
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.2);
  transform: translateY(-1px);
}

.statx-sidebar-ad__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: .15rem;
  color: var(--bs-warning, #ffc107);
}

.statx-sidebar-ad__icon svg {
  display: block;
  width: 1.1rem;
  height: 1.1rem;
}

.statx-sidebar-ad__title {
  display: block;
  font-weight: 600;
  font-size: .9rem;
  line-height: 1.2;
}

.statx-sidebar-ad__cta {
  display: block;
  font-size: .75rem;
  opacity: .8;
  margin-top: .25rem;
}

/* Chartist: задаём нормальные отличающиеся цвета и легенду */
:root {
  --statx-series-a: var(--bs-primary, #0d6efd);
  --statx-series-b: var(--bs-success, #198754);
  --statx-series-c: var(--bs-warning, #ffc107);
  --statx-series-d: var(--bs-info, #0dcaf0);
  --statx-series-e: #dc3545;
  --statx-series-f: #6f42c1;
}

/* Легка фонова сітка для графіка */
.ct-chart-sales-profit .ct-grid.ct-horizontal,
.ct-chart-sales-profit .ct-grid.ct-vertical {
  stroke: rgba(0, 0, 0, 0.05);
  stroke-width: 1px;
  stroke-dasharray: 0;
}

.ct-chart-sales-profit .ct-series-a .ct-line,
.ct-chart-sales-profit .ct-series-a .ct-point {
  stroke: var(--statx-series-a) !important;
}

.ct-chart-sales-profit .ct-series-a .ct-area {
  fill: var(--statx-series-a) !important;
  fill-opacity: .15;
}

.ct-chart-sales-profit .ct-series-b .ct-line,
.ct-chart-sales-profit .ct-series-b .ct-point {
  stroke: var(--statx-series-b) !important;
}

.ct-chart-sales-profit .ct-series-b .ct-area {
  fill: var(--statx-series-b) !important;
  fill-opacity: .12;
}

.ct-chart-cash-structure .ct-series-a .ct-slice-donut,
.ct-chart-cash-structure .ct-series-a .ct-slice-pie {
  stroke: var(--statx-series-a);
}

.ct-chart-cash-structure .ct-series-b .ct-slice-donut,
.ct-chart-cash-structure .ct-series-b .ct-slice-pie {
  stroke: var(--statx-series-b);
}

.ct-chart-cash-structure .ct-series-c .ct-slice-donut,
.ct-chart-cash-structure .ct-series-c .ct-slice-pie {
  stroke: var(--statx-series-c);
}

.ct-chart-cash-structure .ct-series-d .ct-slice-donut,
.ct-chart-cash-structure .ct-series-d .ct-slice-pie {
  stroke: var(--statx-series-d);
}

.ct-chart-telemetry-donut .ct-series-a .ct-slice-donut,
.ct-chart-telemetry-donut .ct-series-a .ct-slice-pie {
  stroke: var(--statx-series-a);
}

.ct-chart-telemetry-donut .ct-series-b .ct-slice-donut,
.ct-chart-telemetry-donut .ct-series-b .ct-slice-pie {
  stroke: var(--statx-series-b);
}

.ct-chart-telemetry-donut .ct-series-c .ct-slice-donut,
.ct-chart-telemetry-donut .ct-series-c .ct-slice-pie {
  stroke: var(--statx-series-c);
}

.ct-chart-telemetry-donut .ct-series-d .ct-slice-donut,
.ct-chart-telemetry-donut .ct-series-d .ct-slice-pie {
  stroke: var(--statx-series-d);
}

.ct-chart-telemetry-donut .ct-series-e .ct-slice-donut,
.ct-chart-telemetry-donut .ct-series-e .ct-slice-pie {
  stroke: var(--statx-series-e);
}

.ct-chart-telemetry-donut .ct-series-f .ct-slice-donut,
.ct-chart-telemetry-donut .ct-series-f .ct-slice-pie {
  stroke: var(--statx-series-f);
}

.legend-dot {
  width: .75rem;
  height: .75rem;
  border-radius: 999px;
  display: inline-block;
  flex-shrink: 0;
}

.legend-dot.series-a { background: var(--statx-series-a); }
.legend-dot.series-b { background: var(--statx-series-b); }
.legend-dot.series-c { background: var(--statx-series-c); }
.legend-dot.series-d { background: var(--statx-series-d); }
.legend-dot.series-e { background: var(--statx-series-e); }
.legend-dot.series-f { background: var(--statx-series-f); }

.multy-current-dot {
  width: .7rem;
  height: .7rem;
  border-radius: 999px;
  background: #198754;
  box-shadow: 0 0 0 2px rgba(25, 135, 84, 0.15);
  display: inline-block;
}

/* Multy: base cards (report/sync) — allow long db/user names to wrap,
   otherwise the switch can be pushed outside the card on ~1280px screens. */
.statx-multy-base-card .d-flex.justify-content-between.align-items-start > div:first-child {
  min-width: 0; /* allow flex item to shrink below min-content size */
}

.statx-multy-base-card .fw-extrabold,
.statx-multy-base-card .h6 {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.statx-multy-base-card .form-check {
  flex: 0 0 auto;
}

.multy-name-diff {
  color: #fd7e14;
  font-weight: 600;
}

.multy-unit-diff {
  background: #f8d7da;
  color: #842029;
  padding: 2px 6px;
  border-radius: 4px;
  display: inline-block;
  cursor: pointer;
  text-decoration: underline;
}

.multy-unit-diff:hover {
  color: #842029;
}

/* DataTables: випадаючий список кількості рядків (стрілка не повинна налазити на значення) */
.dt-length .form-select,
.dataTables_length .form-select,
.dt-length select.form-select,
.dataTables_length select.form-select {
  min-width: 4.75rem;
  padding-right: 2.6rem;
  background-position: right .75rem center;
}

/* DataTables: лейбл "Показати" не має накладатися на селект */
.dataTables_length label,
.dt-length label {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
}

.dataTables_length select,
.dt-length select {
  width: auto;
}

/* Telemetry dashboard: custom "10/20/50" selector in Top pages header */
.statx-top-pages-limit {
  min-width: 5.2rem;
  width: auto;
  padding-right: 2.4rem;
  background-position: right .75rem center;
}

/* Filters: multiselects should be taller and resizable */
.statx-filter-select[multiple] {
  min-height: 6rem;
  resize: vertical;
  overflow: auto;
}

/* Report filters: collapsible toolbar */
.statx-filters-form {
  position: relative;
}

.statx-filters-form .statx-hide-filters-switch .form-check-label {
  cursor: pointer;
}

.statx-filters-form .statx-hide-filters-dot {
  width: .55rem;
  height: .55rem;
  border-radius: 50%;
  background-color: #22c55e;
  box-shadow: 0 0 0 .2rem rgba(34, 197, 94, 0.18);
  opacity: 0;
  transform: scale(.75);
  transition: opacity .15s ease, transform .15s ease;
}

.statx-filters-form .statx-hide-filters-dot.is-active {
  opacity: 1;
  transform: scale(1);
}

.statx-filters-form .statx-filter-toggle {
  position: absolute;
  top: -.1rem;
  right: 0;
  z-index: 2;
  line-height: 1;
}

.statx-filters-form:not(.statx-filters-form--collapsed) .statx-filter-toggle {
  background-color: #eef2ff;
  border-color: #cfd7ff;
  color: #0d6efd;
}

.statx-filters-form--collapsed .statx-filter-fields,
.statx-filters-form--collapsed .statx-filter-toggles {
  display: none;
}

.statx-filters-form--with-hide-switch.statx-filters-form--collapsed .statx-filter-fields {
  display: flex;
}

.statx-filters-form--with-hide-switch.statx-filters-form--collapsed .statx-filter-fields > :not(.statx-filter-topline) {
  display: none !important;
}

.statx-filters-form--collapsed .statx-filter-actions {
  margin-top: 0 !important;
}

.statx-filters-form--collapsed {
  padding-top: .25rem;
  padding-bottom: .25rem;
}

/* report_sales_returns: tabs for secondary filters */
.statx-sales-returns-filters .statx-sales-returns-top-switches {
  min-height: 2rem;
}

.statx-sales-returns-filters .statx-hide-filters-switch .form-check-label {
  cursor: pointer;
}

.statx-sales-returns-filters .statx-hide-filters-dot {
  width: .55rem;
  height: .55rem;
  border-radius: 50%;
  background-color: #22c55e;
  box-shadow: 0 0 0 .2rem rgba(34, 197, 94, 0.18);
  opacity: 0;
  transform: scale(.75);
  transition: opacity .15s ease, transform .15s ease;
}

.statx-sales-returns-filters .statx-hide-filters-dot.is-active {
  opacity: 1;
  transform: scale(1);
}

.statx-sales-returns-filters .statx-sales-tabs-nav {
  border-bottom: 1px solid #dbe4f0;
}

.statx-sales-returns-filters .statx-sales-tab-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  color: #475569;
  font-weight: 500;
  border: 1px solid transparent;
  border-bottom: 0;
  margin-bottom: -1px;
  transition: color .15s ease, background-color .15s ease, border-color .15s ease;
}

.statx-sales-returns-filters .statx-sales-tab-btn .statx-sales-tab-icon {
  color: #64748b;
}

.statx-sales-returns-filters .statx-sales-tab-btn .statx-sales-tab-dot {
  width: .5rem;
  height: .5rem;
  border-radius: 50%;
  background-color: transparent;
  box-shadow: none;
}

.statx-sales-returns-filters .statx-sales-tab-btn.active {
  color: #0b305c;
  font-weight: 700;
  border-color: #a9c7ff #a9c7ff #fff;
  background-color: #f8fbff;
  box-shadow: inset 0 2px 0 #2f6fed, 0 1px 0 rgba(15, 23, 42, 0.06);
}

.statx-sales-returns-filters .statx-sales-tab-btn.statx-sales-tab--has-active:not(.active) {
  color: #166534;
  font-weight: 700;
}

.statx-sales-returns-filters .statx-sales-tab-btn.statx-sales-tab--has-active:not(.active) {
  background-color: transparent;
  border-color: transparent;
}

.statx-sales-returns-filters .statx-sales-tab-btn.statx-sales-tab--has-active .statx-sales-tab-icon {
  color: #15803d;
}

.statx-sales-returns-filters .statx-sales-tab-btn.statx-sales-tab--has-active .statx-sales-tab-dot {
  background-color: #22c55e;
  box-shadow: 0 0 0 .2rem rgba(34, 197, 94, 0.18);
}

.statx-sales-returns-filters .statx-sales-tab-content {
  border: 1px solid #dbe4f0;
  border-top: 0;
  border-radius: 0 0 .5rem .5rem;
  padding: .25rem .75rem .75rem;
  background-color: #fff;
}

.statx-sales-returns-filters .statx-sales-goods-pane-grid {
  --bs-gutter-x: .65rem;
  --bs-gutter-y: .5rem;
}

.statx-sales-returns-filters .statx-sales-goods-pane-grid .form-label {
  margin-bottom: .1rem !important;
  line-height: 1.15;
}

.statx-sales-returns-filters .statx-sales-goods-pane-grid .form-check {
  min-height: 1.25rem;
}

.statx-sales-returns-filters .statx-sales-goods-pane-grid .form-check-label {
  line-height: 1.15;
}

.statx-sales-returns-filters .statx-sales-goods-left-card,
.statx-sales-returns-filters .statx-sales-goods-right-card {
  border: 1px solid #e6edf7;
  border-radius: .5rem;
  padding: .45rem .55rem;
  background-color: #fbfdff;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.statx-sales-returns-filters .statx-sales-goods-left-card > .row {
  flex: 1 1 auto;
}

.statx-sales-returns-filters .statx-sales-goods-right-card .statx-sales-filter-field {
  margin-bottom: 0;
}

.statx-sales-returns-filters .statx-sales-goods-left-card .statx-sales-filter-field--categories {
  display: flex;
  flex-direction: column;
  margin-bottom: 0;
}

.statx-sales-returns-filters .statx-sales-goods-left-card .statx-filter-select--categories {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
}

@media (max-width: 991.98px) {
  .statx-sales-returns-filters .statx-sales-goods-left-card,
  .statx-sales-returns-filters .statx-sales-goods-right-card {
    padding: 0;
    border: 0;
    background-color: transparent;
    display: block;
  }

  .statx-sales-returns-filters .statx-sales-goods-left-card .statx-sales-filter-field--categories {
    display: block;
  }

  .statx-sales-returns-filters .statx-sales-goods-left-card .statx-filter-select--categories {
    min-height: 5.6rem;
    max-height: 6.2rem;
  }
}

@media (max-width: 767.98px) {
  .statx-sales-returns-filters .statx-sales-goods-pane-grid {
    --bs-gutter-y: .65rem;
  }

  .statx-sales-returns-filters .statx-sales-goods-pane-grid .statx-sales-filter-field--categories,
  .statx-sales-returns-filters .statx-sales-goods-pane-grid .statx-sales-filter-field--title {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* DataTables Buttons: трохи відступів, щоб не злипались */
.dt-buttons .btn {
  margin-right: .25rem;
  margin-bottom: .25rem;
}

/* Чеки повернення: легке підсвічування рядка */
.table > tbody > tr.statx-row-return > * {
  background-color: rgba(220, 53, 69, 0.08) !important;
}

/* report_tmc_code: підсвічування за типом документа */
.table > tbody > tr.statx-doc-pn > * {
  background-color: rgba(25, 135, 84, 0.08) !important; /* ПН */
}
.table > tbody > tr.statx-doc-rn > * {
  background-color: rgba(220, 53, 69, 0.08) !important; /* РН */
}
.table > tbody > tr.statx-doc-sn > * {
  background-color: rgba(255, 193, 7, 0.12) !important; /* СН */
}
.table > tbody > tr.statx-doc-iv > * {
  background-color: rgba(13, 110, 253, 0.08) !important; /* ИВ */
}
.table > tbody > tr.statx-doc-num > * {
  background-color: rgba(108, 117, 125, 0.08) !important; /* лише число */
}
/* report_sales_returns: drilldown links and popup row highlighting */
.statx-article-drilldown {
  color: #111827;
  text-decoration: underline !important;
  text-underline-offset: .14rem;
  text-decoration-thickness: 1.5px;
  font-weight: 500;
  cursor: pointer;
}

.statx-article-drilldown:visited {
  color: #111827;
}

.statx-article-drilldown:hover,
.statx-article-drilldown:focus {
  color: #000;
  text-decoration-thickness: 2px !important;
}

.table > tbody > tr.statx-article-row-in > * {
  background-color: rgba(25, 135, 84, 0.10) !important;
}

.table > tbody > tr.statx-article-row-out > * {
  background-color: rgba(220, 53, 69, 0.10) !important;
}
/* KPI: единицы измерения и стрелочки дельты */
.kpi-value{
  display:flex;
  align-items:baseline;
  gap:.35rem;
}

.kpi-unit{
  font-size:.75rem;
  color: var(--bs-gray-500, #6c757d);
  line-height:1;
  margin-bottom:.15rem;
  white-space: nowrap;
}

.delta-arrow{
  font-size:.95em;
  line-height:1;
}

/* KPI dashboard cards: equal height and stable text layout in multi-column view */
.statx-kpi-grid > [class*="col-"] {
  display: flex;
}

.statx-kpi-grid > [class*="col-"] > .card {
  flex: 1 1 auto;
}

.statx-kpi-grid > [class*="col-"] > .card > .card-body {
  display: flex;
  flex-direction: column;
}

.statx-kpi-grid .statx-kpi-delta {
  margin-top: auto !important;
  display: flex;
  align-items: center;
  gap: .35rem;
  min-width: 0;
  flex-wrap: nowrap;
  white-space: nowrap;
}

.statx-kpi-grid .statx-kpi-delta > :first-child {
  flex: 0 0 auto;
}

.statx-kpi-grid .statx-kpi-delta > :last-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.statx-kpi-grid .statx-online-cashdesk-link {
  display: block;
  max-width: 100%;
  font-size: clamp(1rem, 0.9rem + 0.55vw, 1.25rem);
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.statx-kpi-grid .card-body > .d-flex.justify-content-between.align-items-center {
  gap: .75rem;
}

.statx-kpi-grid .card-body > .d-flex.justify-content-between.align-items-center > :first-child {
  min-width: 0;
  flex: 1 1 auto;
}

.statx-kpi-grid .card-body > .d-flex.justify-content-between.align-items-center .icon-shape {
  flex: 0 0 auto;
  width: 3rem;
  height: 3rem;
  min-width: 3rem;
  min-height: 3rem;
}

.statx-kpi-grid .kpi-value {
  min-width: 0;
}

.statx-kpi-grid .kpi-value h3.fw-extrabold {
  min-width: 0;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.1;
  font-size: clamp(1.05rem, 0.86rem + 0.95vw, 1.45rem);
}

.statx-kpi-grid .kpi-value h3.fw-extrabold.statx-kpi-number--long {
  font-size: clamp(.95rem, .78rem + .82vw, 1.25rem);
}

.statx-kpi-grid .kpi-value h3.fw-extrabold.statx-kpi-number--xlong {
  font-size: clamp(.85rem, .72rem + .65vw, 1.08rem);
}

/* Dashboard drill-down cards/rows */
.statx-clickable-card {
  position: relative;
  transition: transform .16s ease, box-shadow .16s ease;
}

.statx-clickable-card:hover,
.statx-clickable-card:focus-within {
  transform: translateY(-2px);
  box-shadow: 0 .65rem 1.4rem rgba(15, 23, 42, 0.12) !important;
}

.statx-clickable-card:active {
  transform: translateY(0);
  box-shadow: 0 .45rem 1rem rgba(15, 23, 42, 0.10) !important;
}

.statx-clickable-card .statx-stretched-link {
  z-index: 2;
}

.statx-topgood-link {
  display: block;
  color: inherit;
  text-decoration: none;
  border-radius: .55rem;
  padding: .2rem .35rem .35rem;
  margin-left: -.35rem;
  margin-right: -.35rem;
  transition: background-color .16s ease;
}

.statx-topgood-link:hover,
.statx-topgood-link:focus {
  color: inherit;
  text-decoration: none;
  background: rgba(25, 135, 84, 0.08);
}

.statx-problems-list .statx-problem-item {
  border: 0;
  border-bottom: 1px solid rgba(17, 24, 39, 0.08);
  padding: .8rem 1rem;
  transition: background-color .16s ease;
}

.statx-problems-list .statx-problem-item:last-child {
  border-bottom: 0;
}

.statx-problems-list .statx-problem-item:hover,
.statx-problems-list .statx-problem-item:focus {
  background: rgba(13, 110, 253, 0.06);
}

.statx-problems-list .statx-problem-value {
  min-width: 2.5rem;
  text-align: center;
}

.statx-problems-list .statx-problem-text {
  min-width: 0;
}

.statx-problems-list .statx-problem-value.statx-badge-orange-dark {
  background-color: #b45309 !important;
  color: #fff;
}

.statx-problems-list .statx-problem-value.statx-badge-blue-dark {
  background-color: #1e3a8a !important;
  color: #fff;
}

.statx-attention-status {
  display: inline-flex;
  align-items: center;
  gap: .38rem;
  font-weight: 600;
}

.statx-attention-status .statx-attention-face,
.statx-kpi-status-face {
  width: 1.72rem;
  height: 1.72rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.statx-attention-status .statx-attention-face svg,
.statx-kpi-status-face svg {
  width: 100%;
  height: 100%;
  display: block;
}

.statx-attention-status .statx-attention-face .face-ring,
.statx-kpi-status-face .face-ring {
  fill: transparent;
  stroke: currentColor;
  stroke-width: 4;
}

.statx-attention-status .statx-attention-face .face-feature,
.statx-kpi-status-face .face-feature {
  fill: currentColor;
}

.statx-attention-status .statx-attention-face .face-stroke,
.statx-kpi-status-face .face-stroke {
  fill: none;
  stroke: currentColor;
  stroke-width: 4.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.statx-kpi-status-card .card-body {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.08) 0%, rgba(59, 130, 246, 0.04) 100%);
}

.statx-kpi-status-card .statx-kpi-status-icon {
  width: 3rem;
  height: 3rem;
  border-radius: .72rem !important;
  color: #fff;
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.08);
  border: 0;
}

.statx-kpi-status-card .statx-kpi-status-face {
  width: 1.9rem;
  height: 1.9rem;
}

.statx-kpi-status-card .statx-kpi-status-icon.statx-attention-status--critical {
  background-color: rgba(220, 53, 69, 0.72);
}

.statx-kpi-status-card .statx-kpi-status-icon.statx-attention-status--work {
  background-color: rgba(253, 126, 20, 0.72);
}

.statx-kpi-status-card .statx-kpi-status-icon.statx-attention-status--almost {
  background-color: rgba(255, 193, 7, 0.72);
}

.statx-kpi-status-card .statx-kpi-status-icon.statx-attention-status--little {
  background-color: rgba(40, 167, 69, 0.72);
}

.statx-kpi-status-card .statx-kpi-status-icon.statx-attention-status--ideal {
  background-color: rgba(25, 135, 84, 0.72);
}

.statx-attention-status--critical {
  color: #e11d48;
}

.statx-attention-status--work {
  color: #f97316;
}

.statx-attention-status--almost {
  color: #f0b429;
}

.statx-attention-status--little {
  color: #37b24d;
}

.statx-attention-status--ideal {
  color: #16a34a;
}

/* Login page: keep layout stable on small mobile viewports */
.statx-login {
  min-height: 100vh;
}

@supports (min-height: 100svh) {
  .statx-login {
    min-height: 100svh;
  }
}

/* Support forms: modern file upload (Dropzone-like without dependency) */
.statx-dropzone {
  position: relative;
  min-height: 160px;
  padding: 1.75rem 1.5rem;
  border: 2px dashed #cbd5e1;
  border-radius: 1rem;
  background: #f8fafc;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
}

.statx-dropzone:hover,
.statx-dropzone:focus-within,
.statx-dropzone.statx-dropzone--active {
  border-color: #0d6efd;
  background: #eef6ff;
  box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.12);
}

.statx-dropzone .dz-message {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .35rem;
  margin: 0;
  color: #6b7280;
  font-weight: 600;
}

.statx-dropzone .statx-dropzone-icon {
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: #e7f1ff;
  color: #0d6efd;
  display: flex;
  align-items: center;
  justify-content: center;
}

.statx-dropzone .statx-dropzone-title {
  color: #111827;
  font-weight: 600;
}

.statx-dropzone .statx-dropzone-sub {
  font-size: .85rem;
  font-weight: 500;
  color: #6b7280;
}

.statx-dropzone .fallback {
  position: absolute;
  inset: 0;
  margin: 0;
  z-index: 2;
}

.statx-dropzone.statx-dropzone--dz-active .fallback {
  display: none;
}

.statx-dropzone .fallback input[type="file"] {
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

/* Waybill quick search: убираем толстую рамку при фокусе */
#waybillQuickSearchContainer .form-control:focus,
#waybillQuickSearchContainer button:focus {
  box-shadow: none;
  outline: 0;
}

#waybillQuickCreatePrompt {
  width: 100%;
  margin-top: 0.35rem;
  padding-left: 0.1rem;
}

@media (max-width: 575.98px) {
  #waybillQuickSearchContainer {
    gap: 6px;
    flex-wrap: nowrap;
  }
  #waybillQuickSearchContainer .input-group {
    min-width: 0 !important;
    width: 70% !important;
    flex: 1 1 70%;
  }
  #waybillQuickSearchContainer .form-control {
    min-width: 0;
  }
  #waybillQuickSearchContainer .btn {
    flex: 0 0 auto;
    white-space: nowrap;
  }
  #waybillQuickCreatePrompt {
    margin-top: 0.2rem;
  }
}

/* Waybill scanner overlay (_wb suffix to avoid conflicts) */
.scan-overlay_wb {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.8);
  display: block;
  padding: 10px;
  z-index: 1200;
  box-sizing: border-box;
  width: 100vw;
  height: 100vh;
  min-width: 100vw;
  min-height: 100vh;
  overflow: hidden;
}

@supports (height: 100dvh) {
  .scan-overlay_wb {
    width: 100dvw;
    height: 100dvh;
  }
}

.scan-overlay-inner_wb {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  width: min(94vw, 440px);
}

.scan-video-wrap_wb {
  position: relative;
  width: 100%;
  max-width: 420px;
  aspect-ratio: 4 / 3;
}

.scan-video-wrap_wb video {
  width: 100%;
  height: 100%;
  aspect-ratio: 4 / 3;
  border: 3px solid rgba(255, 255, 255, 0.2);
  border-radius: 12px;
  background: #000;
  object-fit: cover;
}

.scan-video-wrap_wb .scan-frame_wb {
  position: absolute;
  inset: 0;
  border: 3px solid rgba(13, 110, 253, 0.7);
  border-radius: 14px;
  pointer-events: none;
  z-index: 1;
}

.scan-overlay_wb .scan-hint_wb {
  color: #e5e7eb;
  font-weight: 600;
  text-align: center;
}

.scan-overlay_wb .scan-actions_wb {
  display: flex;
  gap: 10px;
}

/* Inventory diff cells (Razn) */
.iv-razn-cell {
  display: inline-block;
  min-width: 88px;
  text-align: right;
  padding: 1px 6px;
  border-radius: 4px;
}

.iv-razn-plus {
  background: rgba(25, 135, 84, 0.18);
  color: #0f5132;
  font-weight: 600;
}

.iv-razn-minus {
  background: rgba(220, 53, 69, 0.18);
  color: #842029;
  font-weight: 600;
}

/* Единый стиль кнопок "Додати" по проекту */
.btn.btn-statx-add {
  color: #fff !important;
  background-color: #166534 !important;
  border-color: #166534 !important;
}

.btn.btn-statx-add:hover,
.btn.btn-statx-add:focus,
.btn.btn-statx-add:active,
.btn-check:checked + .btn.btn-statx-add,
.btn.btn-statx-add.active,
.btn.btn-statx-add.show {
  color: #fff !important;
  background-color: #14532d !important;
  border-color: #14532d !important;
}

.btn.btn-statx-add:focus-visible {
  box-shadow: 0 0 0 .2rem rgba(22, 101, 52, .25) !important;
}