:root {
  --bg: #0f1117;
  --bg-elevated: #171b26;
  --bg-hover: #1e2433;
  --border: #2a3144;
  --text: #e8ecf4;
  --muted: #8b95a8;
  --accent: #6ea8fe;
  --accent-dim: #3d5a8a;
  --danger: #ff6b7a;
  --success: #5fd49a;
  --warning: #f0c674;
  --radius: 12px;
  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --j-bg: #151a24;
  --j-card: #1c2333;
  --j-card-elevated: #222b3d;
  --j-border: #2e3648;
  --j-hover: #252e42;
  --j-text: #e8ecf4;
  --j-muted: #8b95a8;
  --j-accent: #6ea8fe;
  --ui-card-radius: 12px;
  --ui-field-radius: 10px;
  --ui-state-ok-text: #4ade80;
  --ui-state-ok-bg: rgba(74, 222, 128, 0.16);
  --ui-state-ok-border: rgba(74, 222, 128, 0.45);
  --ui-state-bad-text: #f87171;
  --ui-state-bad-bg: rgba(248, 113, 113, 0.16);
  --ui-state-bad-border: rgba(248, 113, 113, 0.45);
  --ui-state-warn-text: #fb923c;
  --ui-state-warn-bg: rgba(251, 146, 60, 0.2);
  --ui-state-warn-border: rgba(251, 146, 60, 0.5);
  --ui-state-neutral-text: #94a3b8;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: var(--font);
  font-feature-settings: normal;
  font-variant-ligatures: none;
  font-kerning: normal;
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}

.hidden { display: none !important; }

.screen { min-height: 100vh; }

/* Login */
.login-card {
  max-width: 400px;
  margin: 12vh auto;
  padding: 2rem;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
}

.login-card h1 { margin: 0 0 .25rem; font-size: 1.5rem; }

.login-hint {
  margin: .75rem 0 0;
  padding: .65rem .75rem;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: .85rem;
  color: var(--muted);
  line-height: 1.5;
}

label {
  display: block;
  margin-top: 1rem;
  font-size: .85rem;
  color: var(--muted);
}

input[type="email"],
input[type="password"],
input[type="search"],
input[type="text"],
input[type="number"],
input[type="tel"] {
  width: 100%;
  margin-top: .35rem;
  padding: .65rem .75rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg);
  color: var(--text);
  font-size: 1rem;
}

input:focus {
  outline: 2px solid var(--accent-dim);
  border-color: var(--accent);
}

button {
  margin-top: 1.25rem;
  width: 100%;
  padding: .75rem;
  border: none;
  border-radius: 8px;
  background: var(--accent);
  color: #0b1020;
  font-weight: 600;
  font-size: 1rem;
  cursor: pointer;
}

button:hover { filter: brightness(1.08); }

button.ghost {
  width: auto;
  margin: 0;
  background: transparent;
  color: var(--muted);
  border: 1px solid var(--border);
}

.error { color: var(--danger); font-size: .9rem; margin-top: .75rem; }
.muted { color: var(--muted); font-size: .9rem; }

/* Main layout — compact header */
.topbar button {
  width: auto;
  margin-top: 0;
}

.topbar {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .4rem 1rem;
  border-bottom: 1px solid var(--border);
  background: var(--bg-elevated);
  min-height: 2.25rem;
}

.topbar-title {
  margin: 0;
  font-size: .92rem;
  font-weight: 600;
  white-space: nowrap;
}

.topbar-meta {
  flex: 1;
  font-size: .72rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.btn-sm {
  padding: .25rem .55rem !important;
  font-size: .75rem !important;
  border-radius: 6px;
}

.btn-admin {
  width: auto;
  margin: 0;
  padding: .35rem .75rem;
  font-size: .78rem;
  border-radius: 8px;
  border: 1px solid var(--accent);
  background: var(--accent-dim);
  color: var(--text);
  cursor: pointer;
}

.btn-add-contractor {
  border-color: var(--success);
  background: #1e3a2f;
  color: var(--success);
  font-weight: 700;
}

.btn-add-contractor:hover {
  background: #2d5a44;
}

.btn-admin:hover {
  background: #4a6a9a;
}

.calendar-panel {
  padding: .35rem 1rem .45rem;
  border-bottom: 1px solid var(--border);
  background: var(--bg-elevated);
}

.calendar-header {
  display: flex;
  align-items: center;
  gap: .35rem;
  flex-wrap: wrap;
  margin-bottom: .35rem;
}

.calendar-title {
  flex: 1;
  min-width: 120px;
  font-weight: 600;
  font-size: .78rem;
  color: var(--muted);
}

.cal-nav {
  padding: .15rem .45rem !important;
  margin: 0 !important;
  font-size: .75rem !important;
}

.week-row {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: .3rem;
}

.day-btn {
  margin: 0;
  width: 100%;
  padding: .28rem .15rem .22rem;
  background: var(--bg);
  border: 1px solid var(--border);
  color: var(--text);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.05rem;
  border-radius: 6px;
  overflow: visible;
  line-height: 1.25;
}

.day-btn .day-name {
  font-size: .7rem;
  color: var(--muted);
  text-transform: none;
  letter-spacing: 0.02em;
  line-height: 1.3;
  min-height: 0.9rem;
}

.day-btn .day-num {
  font-size: .85rem;
  font-weight: 700;
  line-height: 1.25;
}

.day-btn.today { border-color: var(--accent-dim); }
.day-btn.future-day {
  opacity: .45;
  background: transparent;
  border-style: dashed;
}
.day-btn.selected {
  background: var(--accent-dim);
  border-color: var(--accent);
}

.month-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: .35rem;
}

.month-head {
  text-align: center;
  font-size: .7rem;
  color: var(--muted);
  padding: .25rem;
}

.month-day {
  margin: 0;
  width: 100%;
  padding: .3rem;
  background: var(--bg);
  border: 1px solid var(--border);
  color: var(--text);
  font-weight: 600;
  font-size: .78rem;
  border-radius: 6px;
}

.month-day.other { opacity: .35; }
.month-day.today { border-color: var(--accent-dim); }
.month-day.future-day {
  opacity: .45;
  background: transparent;
  border-style: dashed;
}
.month-day.selected {
  background: var(--accent-dim);
  border-color: var(--accent);
}

.summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .45rem;
  padding: .45rem 1rem;
}

.summary-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: .45rem .6rem;
}

.summary-card .label {
  font-size: .62rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--muted);
  line-height: 1.2;
}

.summary-card .value {
  margin-top: .2rem;
  font-size: .95rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}

.summary-card.negative .value { color: var(--danger); }
.summary-card.positive .value { color: var(--success); }
.summary-card .value.empty-value {
  color: var(--muted);
  font-weight: 500;
}

.summary-card.debt-card .value,
.summary-card.debt-card .summary-input {
  color: var(--danger);
  font-weight: 600;
}

.summary-card.editable-card .label .hint {
  font-size: .65rem;
  color: var(--muted);
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
}

.summary-input {
  width: 100%;
  margin-top: .2rem;
  padding: .3rem .45rem;
  border: 1px solid var(--accent-dim);
  border-radius: 6px;
  background: var(--bg);
  color: var(--danger);
  font-size: .95rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.summary-hint {
  margin-top: .2rem;
  font-size: .62rem;
  color: var(--muted);
  line-height: 1.2;
}

.upload-btn {
  display: inline-flex;
  align-items: center;
  margin: 0;
  width: auto;
  padding: .55rem .85rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg-elevated);
  color: var(--accent);
  font-size: .88rem;
  font-weight: 600;
  cursor: pointer;
}

.upload-btn:hover {
  border-color: var(--accent);
  background: var(--bg-hover);
}

.btn-send-tg {
  margin: 0;
  width: auto;
  padding: .55rem 1rem;
  font-size: .88rem;
  border-radius: 8px;
}

#export-excel-btn {
  width: auto;
  margin: 0;
}

.tg-float-bar {
  display: none;
}

.tg-float-bar-count {
  font-size: .9rem;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
}

.tg-float-bar-btn {
  flex: 1 1 auto;
  min-height: 2.75rem;
  font-weight: 600;
}

.modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .55);
}

.modal-card {
  position: relative;
  width: min(480px, 100%);
  padding: 1.25rem 1.35rem;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: 0 24px 64px rgba(0, 0, 0, .45);
}

.modal-card h2 {
  margin: 0 0 .5rem;
  font-size: 1.15rem;
}

.modal-desc {
  margin: 0 0 .85rem;
  color: var(--muted);
  font-size: .9rem;
  line-height: 1.45;
}

.modal-list {
  max-height: 220px;
  overflow-y: auto;
  margin: 0 0 .75rem;
  padding: 0;
  list-style: none;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg);
}

.modal-list li {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  padding: .55rem .75rem;
  font-size: .88rem;
  border-bottom: 1px solid var(--border);
}

.modal-list li:last-child { border-bottom: none; }

.modal-list .ok { color: var(--success); }
.modal-list .skip { color: var(--muted); }

.modal-warn {
  margin: 0 0 .75rem;
  padding: .55rem .75rem;
  border-radius: 8px;
  background: #3d3520;
  color: var(--warning);
  font-size: .85rem;
  line-height: 1.4;
}

.modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: .65rem;
}

.modal-actions button {
  margin: 0;
  width: auto;
  min-width: 6.5rem;
  padding: .6rem 1rem;
  font-size: .9rem;
}

.modal-actions button:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.session-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  padding: 0 1rem .45rem;
  align-items: stretch;
}

.session-field {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.session-field label {
  margin-top: 0;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 2.6rem;
  line-height: 1.3;
}

.session-field input {
  margin-top: .35rem;
  width: 100%;
}

.session-field input:disabled {
  opacity: .6;
  cursor: not-allowed;
}

.table-toolbar {
  display: flex;
  gap: 1rem;
  align-items: center;
  padding: 0 1.5rem 1rem;
  flex-wrap: wrap;
}

.table-toolbar input[type="search"] {
  max-width: 280px;
  margin: 0;
}

.toggle {
  display: flex;
  align-items: center;
  gap: .5rem;
  color: var(--muted);
  font-size: .9rem;
  cursor: pointer;
}

.table-wrap {
  margin: 0 1rem 1.5rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: auto;
  max-height: calc(100vh - 300px);
  background: var(--bg-elevated);
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: .92rem;
}

th, td {
  padding: .65rem .85rem;
  border-bottom: 1px solid var(--border);
  text-align: left;
}

th {
  position: sticky;
  top: 0;
  background: #12151e;
  z-index: 1;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--muted);
}

td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }

tbody tr:hover { background: var(--bg-hover); }

td.negative { color: var(--danger); }
td.positive { color: var(--success); }

tfoot td {
  font-weight: 700;
  background: #12151e;
  position: sticky;
  bottom: 0;
}

.cell-input {
  width: 110px;
  margin: 0;
  padding: .4rem .5rem;
  text-align: right;
}

.status {
  display: inline-block;
  padding: .2rem .55rem;
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 600;
}

.status-none { background: #2a3144; color: var(--muted); }
.status-pending { background: #3d3520; color: var(--warning); }
.status-confirmed { background: #1e3a2f; color: var(--success); }
.status-rejected { background: #3a1e24; color: var(--danger); }

.tg-badge {
  display: inline-block;
  padding: .2rem .5rem;
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 600;
}

.tg-badge.linked {
  background: #1e3a2f;
  color: var(--success);
}

.tg-link {
  color: var(--accent);
  font-size: .85rem;
  text-decoration: none;
}

.tg-link:hover { text-decoration: underline; }

.actions-col { width: 48px; text-align: center; }

.btn-send {
  width: auto;
  margin: 0;
  padding: .35rem .55rem;
  font-size: .75rem;
  font-weight: 700;
  background: #2d4a7a;
  color: var(--text);
  border-radius: 6px;
}

.btn-send:disabled {
  opacity: .35;
  cursor: not-allowed;
}

.phone-input { width: 170px; text-align: left; }

.tg-cell {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .2rem;
}

.tg-unlink {
  padding: 0 .25rem;
  font-size: .68rem;
  line-height: 1.2;
  color: var(--muted);
}

.payment-col { min-width: 180px; }

.payment-cell {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: .35rem;
}

.currency-picker {
  display: flex;
  gap: .25rem;
}

.cur-btn {
  margin: 0;
  width: auto;
  padding: .2rem .45rem;
  font-size: 1rem;
  line-height: 1;
  background: var(--bg);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 6px;
  opacity: .55;
  cursor: pointer;
}

.cur-btn:hover { opacity: .85; }

.cur-btn.active {
  opacity: 1;
  border-color: var(--accent);
  background: var(--accent-dim);
  box-shadow: 0 0 0 1px var(--accent-dim);
}

.cur-btn.cur-btc {
  color: #f7931a;
  font-weight: 800;
  font-size: 1.05rem;
  opacity: .75;
}

.cur-btn.cur-btc.active {
  border-color: #f7931a;
  background: rgba(247, 147, 26, 0.18);
  box-shadow: 0 0 0 1px rgba(247, 147, 26, 0.45);
  color: #ffb347;
  opacity: 1;
}

.btc-icon {
  color: #f7931a;
  font-weight: 800;
}

.payment-crypto-amount,
.payment-view.payment-crypto,
.payment-input.payment-crypto {
  color: #ffb347;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.payment-input.payment-crypto {
  border-color: rgba(247, 147, 26, 0.55);
  background: rgba(247, 147, 26, 0.08);
}

.payment-input.payment-crypto:focus {
  border-color: #f7931a;
  outline-color: rgba(247, 147, 26, 0.45);
}

.payment-input {
  width: 100px;
  margin: 0;
  padding: .4rem .5rem;
  text-align: right;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg);
  color: var(--text);
  font-size: .92rem;
}

.payment-view { white-space: nowrap; }

.topbar .btn-admin,
#users-btn { display: none !important; }

.contractors-cards {
  margin: 0 .5rem .75rem;
  display: flex;
  flex-direction: column;
  gap: .35rem;
}

@media (max-width: 900px) {
  #settlements-view .table-toolbar .btn-send-tg {
    display: none;
  }

  #settlements-view.tg-float-active {
    padding-bottom: calc(4.75rem + env(safe-area-inset-bottom, 0px));
  }

  .tg-float-bar:not(.hidden) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 200;
    padding: .65rem .85rem calc(.65rem + env(safe-area-inset-bottom, 0px));
    background: color-mix(in srgb, var(--bg-elevated) 94%, transparent);
    border-top: 1px solid var(--border);
    box-shadow: 0 -8px 28px rgba(0, 0, 0, .35);
    backdrop-filter: blur(8px);
  }
}

.contractor-card {
  padding: .4rem .5rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg-elevated);
}

.select-col {
  width: 2.25rem;
  text-align: center;
  vertical-align: middle;
  padding: .35rem .25rem !important;
}

.tg-select {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  cursor: pointer;
}

.tg-select-cb {
  width: 1.05rem;
  height: 1.05rem;
  margin: 0;
  cursor: pointer;
  accent-color: var(--accent);
}

.contractor-card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: .35rem;
  margin-bottom: .25rem;
  padding-bottom: .25rem;
  border-bottom: 1px solid var(--border);
}

.contractor-card-head .tg-select {
  flex-shrink: 0;
  padding-top: .05rem;
}

.contractor-card-head .contractor-card-name {
  flex: 1;
  min-width: 0;
}

.contractor-card-name {
  font-weight: 600;
  font-size: .78rem;
  line-height: 1.25;
  min-width: 0;
  word-break: break-word;
}

.contractor-card-debt {
  font-size: .75rem;
  font-weight: 600;
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
}

.contractor-card-payment-row {
  display: flex;
  align-items: center;
  gap: .3rem;
  min-width: 0;
}

.contractor-card-label {
  font-size: .58rem;
  text-transform: uppercase;
  letter-spacing: .02em;
  color: var(--muted);
  font-weight: 600;
  flex-shrink: 0;
  width: 2.6rem;
}

.contractor-card-payment-row .payment-cell {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: .2rem;
  flex: 1;
  min-width: 0;
}

.contractor-card-payment-row .currency-picker {
  flex-shrink: 0;
  gap: .15rem;
}

.contractor-card-payment-row .cur-btn {
  margin: 0;
  width: auto;
  min-width: 1.5rem;
  min-height: 1.5rem;
  padding: .1rem .25rem;
  font-size: .75rem;
  line-height: 1;
}

.contractor-card-payment-row .payment-input {
  width: 3.5rem;
  flex: 1;
  min-width: 2.5rem;
  max-width: 5rem;
  min-height: 1.5rem;
  margin: 0;
  padding: .15rem .3rem;
  font-size: .78rem;
  text-align: right;
}

.contractor-card-balance {
  font-size: .72rem;
  font-weight: 600;
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
  max-width: 5rem;
  text-align: right;
}

.contractor-card-meta {
  display: flex;
  margin-top: .2rem;
  padding-top: .35rem;
  border-top: 1px solid var(--border);
  justify-content: space-between;
  align-items: flex-start;
  gap: .5rem;
}

.contractor-card-meta-side {
  display: flex;
  flex-direction: column;
  gap: .15rem;
  min-width: 0;
}

.contractor-card-meta-side.right {
  align-items: flex-end;
  text-align: right;
  flex-shrink: 0;
}

.contractor-card-meta-side .contractor-card-label {
  width: auto;
}

.contractor-card-tg-left {
  text-align: left;
}

.contractor-card-tg-left .tg-link,
.contractor-card-tg-left .tg-badge,
.contractor-card-tg-left .tg-unlink {
  font-size: .68rem;
}

.contractor-card-tg-left .tg-cell {
  flex-direction: row;
  align-items: center;
  gap: .25rem;
}

.contractor-card-meta .status {
  flex-shrink: 0;
  margin-left: .35rem;
  padding: .1rem .35rem;
  font-size: .62rem;
}

.manual-badge {
  display: inline-block;
  margin-left: .35rem;
  padding: .12rem .45rem;
  border-radius: 6px;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: lowercase;
  color: #f7f3ff;
  background: linear-gradient(135deg, #8f6ae0 0%, #6b4db8 100%);
  border: 1px solid rgba(143, 106, 224, 0.75);
  box-shadow: 0 1px 0 rgba(28, 22, 48, 0.12);
  vertical-align: middle;
}

html.theme-light .manual-badge,
body.theme-light .manual-badge {
  color: #f7f3ff !important;
  background: linear-gradient(135deg, #8f6ae0 0%, #6b4db8 100%) !important;
  border: 1px solid rgba(143, 106, 224, 0.75) !important;
}

.contractor-name-cell {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  flex-wrap: wrap;
}

.contractor-delete-btn {
  flex-shrink: 0;
  min-width: 1.6rem !important;
  padding: .1rem .35rem !important;
  color: #b91c1c !important;
  border-color: rgba(185, 28, 28, 0.35) !important;
}

.contractor-delete-btn:hover {
  background: rgba(248, 113, 113, 0.18) !important;
  border-color: rgba(185, 28, 28, 0.55) !important;
}

.contractor-card-head .contractor-delete-btn {
  align-self: flex-start;
}

.contractor-card-totals {
  border-color: var(--accent-dim);
  background: #12151e;
}

.contractor-card-totals-row {
  justify-content: flex-start;
}

.contractor-card-totals-row .num {
  font-size: .75rem;
  font-weight: 600;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"] {
  -moz-appearance: textfield;
}

@media (max-width: 768px) {
  html {
    -webkit-text-size-adjust: 100%;
    touch-action: pan-x pan-y pinch-zoom;
  }

  body {
    max-width: 100%;
    touch-action: pan-x pan-y pinch-zoom;
  }

  #main-screen {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .login-card {
    margin: 6vh 1rem;
    padding: 1.5rem;
  }

  .topbar {
    flex-wrap: wrap;
    padding: .5rem .75rem;
    gap: .5rem;
  }

  .topbar-meta {
    flex-basis: 100%;
    order: 3;
    font-size: .78rem;
  }

  .topbar .ghost.btn-sm {
    min-height: 2.25rem;
    padding: .4rem .75rem !important;
  }

  .calendar-panel {
    padding: .5rem .75rem;
  }

  .calendar-header .ghost,
  .cal-nav {
    min-height: 2.25rem;
    padding: .4rem .65rem !important;
    font-size: .8rem !important;
  }

  .day-btn {
    min-height: 2.75rem;
    padding: .35rem .15rem;
  }

  .day-btn .day-name { font-size: .65rem; }
  .day-btn .day-num { font-size: .95rem; }

  .month-day {
    min-height: 2.5rem;
    padding: .4rem .2rem;
    font-size: .85rem;
  }

  .summary-grid {
    grid-template-columns: 1fr 1fr;
    padding: .5rem .75rem;
    gap: .5rem;
  }

  .summary-card .label { font-size: .68rem; }
  .summary-card .value { font-size: 1rem; }

  .session-panel {
    padding: 0 .75rem .5rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem;
  }

  .session-field label {
    font-size: .68rem;
    min-height: 2.4rem;
  }

  .table-toolbar {
    flex-direction: column;
    align-items: stretch;
    gap: .6rem;
    padding: .75rem .75rem 1rem;
    border-top: 1px solid var(--border);
  }

  .table-toolbar input[type="search"] {
    max-width: none;
    width: 100%;
  }

  .table-toolbar .btn-admin,
  .table-toolbar #add-contractor-btn,
  .table-toolbar .upload-btn,
  .table-toolbar #export-excel-btn,
  .table-toolbar .btn-send-tg {
    width: 100%;
    justify-content: center;
    min-height: 2.75rem;
    text-align: center;
  }

  .table-toolbar .toggle {
    min-height: 2.25rem;
  }

  .modal {
    padding: .75rem;
    align-items: flex-end;
  }

  .modal-card,
  .modal-card-wide {
    width: 100%;
    max-height: 92vh;
    overflow-y: auto;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }

  .modal-actions {
    flex-direction: column-reverse;
    gap: .5rem;
  }

  .modal-actions button {
    width: 100%;
    min-height: 2.75rem;
  }
}

@media (max-width: 400px) {
  .summary-grid { grid-template-columns: 1fr; }
}

.modal-card-wide {
  max-width: 640px;
  width: min(640px, 96vw);
}

.users-create-form {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: .5rem;
  align-items: end;
  margin-bottom: .75rem;
}

.users-create-form label {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  font-size: .78rem;
  color: var(--muted);
}

.users-create-form input,
.users-create-form select {
  width: 100%;
  padding: .45rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
}

.users-create-form button {
  height: 2.1rem;
  align-self: end;
}

.users-filters {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .65rem;
}

.users-filters label {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  font-size: .78rem;
  color: var(--muted);
}

.users-filters select {
  width: 100%;
  padding: .45rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
}

.users-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: .75rem 1rem;
  margin: 0 0 1rem;
  padding: .75rem .85rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-elevated, rgba(255, 255, 255, 0.02));
}

.users-toolbar label {
  display: flex;
  flex-direction: column;
  gap: .3rem;
  font-size: .78rem;
  color: var(--muted);
  min-width: 9rem;
}

.users-toolbar select,
.users-search-wrap input {
  min-width: 11rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  font: inherit;
}

.users-search-wrap {
  flex: 1 1 14rem;
}

.users-page-header-top {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: .5rem 1rem;
}

.users-create-details {
  margin: 0 0 1rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .35rem .85rem .85rem;
  background: var(--bg-elevated, rgba(255, 255, 255, 0.02));
}

.users-create-details.hidden {
  display: none;
}

.users-create-summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .92rem;
  padding: .45rem 0;
  list-style: none;
}

.users-create-summary::-webkit-details-marker {
  display: none;
}

/* 2–3 колонки: слева раздел, справа «может править» — без переноса текста */
.user-perms-panel.user-perms-panel--simple {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(15.5rem, 1fr));
  gap: .4rem .75rem;
  max-width: none;
  padding: .35rem 0 .5rem;
}

.user-perm-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem .75rem;
  min-width: 0;
  padding: .45rem .65rem;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
}

.user-perm-row--nested {
  margin-left: 1rem;
  background: rgba(255, 255, 255, 0.015);
  border-left: 2px solid rgba(255, 255, 255, 0.08);
}

.user-perm-access-check,
.user-perm-edit-check {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-size: .85rem;
  line-height: 1.2;
  cursor: pointer;
  white-space: nowrap;
}

.user-perm-access-check {
  flex: 1 1 auto;
  min-width: 0;
}

.user-perm-access-check span {
  overflow: hidden;
  text-overflow: ellipsis;
}

.user-perm-edit-check {
  flex: 0 0 auto;
}

.user-perm-edit-check.is-disabled {
  opacity: .45;
}

.user-perm-edit-hint {
  flex: 0 0 auto;
  font-size: .8rem;
  color: var(--muted);
  white-space: nowrap;
}

.users-invite-result {
  margin-bottom: .75rem;
  padding: .65rem .75rem;
  border: 1px solid #2d5a44;
  border-radius: 8px;
  background: #1e3a2f;
}

.users-invite-label {
  margin: 0 0 .4rem;
  font-size: .78rem;
  color: var(--success);
}

.users-invite-row {
  display: flex;
  gap: .4rem;
}

.users-invite-row input {
  flex: 1;
  min-width: 0;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  font-size: .78rem;
}

.users-table-wrap {
  max-height: 420px;
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 8px;
  margin-bottom: .75rem;
}

.users-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .82rem;
}

.users-table th,
.users-table td {
  padding: .45rem .55rem;
  border-bottom: 1px solid var(--border);
  text-align: left;
}

.users-table th {
  position: sticky;
  top: 0;
  background: var(--surface);
  z-index: 1;
  color: var(--muted);
  font-weight: 600;
}

.user-access-cell {
  min-width: 9rem;
}

.user-access-summary {
  display: block;
  font-size: .78rem;
  color: var(--muted);
  margin-bottom: .2rem;
}

.user-perms-panel {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
  gap: .35rem .75rem;
  padding: .5rem 0;
}

.user-perm-check {
  display: flex;
  align-items: center;
  gap: .35rem;
  font-size: .8rem;
  cursor: pointer;
}

.user-perms-note {
  margin: .35rem 0 .5rem;
  font-size: .78rem;
}

.users-perms-hint {
  font-size: .82rem;
  line-height: 1.45;
  margin-top: -.25rem;
}

.users-actions {
  white-space: nowrap;
  text-align: right;
}

.user-fio-cell {
  min-width: 210px;
}

.user-fio-cell span {
  display: inline-block;
  margin-right: .45rem;
}

.user-ts-badge {
  display: inline-block;
  margin-right: .4rem;
  padding: 0.1rem 0.4rem;
  border-radius: 6px;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  vertical-align: middle;
  white-space: nowrap;
}

.user-ts-badge--ok {
  color: #166534;
  background: rgba(34, 197, 94, 0.18);
  border: 1px solid rgba(22, 101, 52, 0.28);
}

.user-ts-badge--miss {
  color: #92400e;
  background: rgba(245, 158, 11, 0.22);
  border: 1px solid rgba(180, 83, 9, 0.35);
}

.user-ts-badge--dismissed {
  color: #991b1b;
  background: rgba(239, 68, 68, 0.16);
  border: 1px solid rgba(185, 28, 28, 0.35);
}

.users-table tbody tr.users-row--ts-miss > td {
  background: rgba(245, 158, 11, 0.14) !important;
}

.users-table tbody tr.users-row--ts-dismissed > td {
  background: rgba(239, 68, 68, 0.1) !important;
}

.user-role-select {
  padding: .25rem .35rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  font-size: .78rem;
}

.user-status.pending { color: var(--warning); }
.user-status.active { color: var(--success); }
.user-status.online { color: var(--success); font-weight: 600; }
.user-status.recent { color: var(--muted); }
.user-status.offline { color: var(--muted); }

.users-online-summary {
  margin: 0 0 .75rem;
  font-size: .82rem;
  color: var(--success);
}

.users-page {
  max-width: 1200px;
  margin: 0 auto;
  padding: 1rem 1.25rem 2rem;
}

.users-page-header {
  margin-bottom: 1rem;
}

.users-page-title {
  margin: 0 0 0.35rem;
  font-size: 1.35rem;
}

.users-page-desc {
  margin: 0 0 0.5rem;
  font-size: 0.9rem;
  color: var(--muted);
}

.users-table-wrap--page {
  max-height: none;
  overflow: visible;
}

@media (max-width: 768px) {
  .users-create-form {
    grid-template-columns: 1fr;
  }

  .user-perms-panel.user-perms-panel--simple {
    grid-template-columns: 1fr;
  }

  .users-filters,
  .users-toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .users-toolbar label,
  .users-toolbar select,
  .users-search-wrap input {
    width: 100%;
    min-width: 0;
  }

  .users-create-form button {
    width: 100%;
    min-height: 2.75rem;
  }

  .users-invite-row {
    flex-direction: column;
  }

  .users-invite-row button {
    width: 100%;
    min-height: 2.5rem;
  }

  .users-table-wrap {
    max-height: none;
    overflow: visible;
    border: none;
    background: transparent;
  }

  .users-table {
    display: block;
    font-size: .85rem;
  }

  .users-table thead { display: none; }

  .users-table tbody { display: block; }

  .users-table tbody tr {
    display: block;
    margin-bottom: .6rem;
    padding: .5rem .65rem;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg);
  }

  .users-table th,
  .users-table td {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .5rem;
    padding: .45rem 0;
    border-bottom: 1px solid var(--border);
    text-align: left;
  }

  .users-table tbody td:last-child { border-bottom: none; }

  .users-table tbody td::before {
    content: attr(data-label);
    font-size: .7rem;
    text-transform: uppercase;
    color: var(--muted);
    font-weight: 600;
    flex-shrink: 0;
  }

  .users-table tbody td[data-label="Email"] {
    font-weight: 600;
    font-size: .92rem;
    border-bottom: 2px solid var(--border);
    justify-content: flex-start;
  }

  .users-table tbody td[data-label="Email"]::before { display: none; }

  .users-table tbody td.users-actions {
    flex-direction: column;
    align-items: stretch;
    gap: .4rem;
  }

  .users-table tbody td.users-actions::before { display: none; }

  .users-table .user-invite-btn,
  .users-table .user-delete-btn {
    width: 100%;
    min-height: 2.5rem;
    text-align: center;
  }

  .user-role-select {
    min-height: 2.25rem;
    font-size: .85rem;
  }
}

/* Journal module */
.topbar-nav {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: .35rem;
  flex: 0 0 auto;
}

.topbar-nav-btn {
  width: auto;
  margin: 0;
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text);
  padding: .4rem .75rem;
  border-radius: .5rem;
  cursor: pointer;
  font-size: .9rem;
  font-family: inherit;
  line-height: 1.35;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
  white-space: nowrap;
}

.topbar-nav-btn.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.topbar-nav-btn.hidden { display: none; }

/* Пока грузятся права — не кликаем по разделам (гонка Розлив → readonly) */
#main-screen.module-nav-loading .topbar-nav {
  pointer-events: none;
  opacity: 0.72;
}

.module-stub-view {
  padding: 3rem 1.5rem;
  display: flex;
  justify-content: center;
}

.module-stub {
  text-align: center;
  max-width: 28rem;
  padding: 2.5rem 2rem;
  border: 1px dashed var(--border);
  border-radius: .75rem;
  background: rgba(255, 255, 255, 0.03);
}

.module-stub__title {
  margin: 0 0 .75rem;
  font-size: 1.5rem;
  font-weight: 700;
}

.module-stub__text {
  margin: 0;
  color: var(--muted, #8a93a6);
  font-size: 1.05rem;
}

/* ── Розлив: подвкладки как в Логистике ── */
#bottling-view button {
  width: auto;
  max-width: none;
  margin: 0;
  margin-top: 0;
  flex: 0 0 auto;
}

#bottling-view .journal-header {
  flex-wrap: wrap;
  position: relative;
  z-index: 30;
}

#bottling-view .bottling-subtabs {
  flex: 1 1 100%;
  margin-top: .15rem;
  display: flex;
  gap: .35rem;
  flex-wrap: wrap;
  padding: .2rem;
  background: var(--j-bg);
  border: 1px solid var(--j-border);
  border-radius: 10px;
}

#bottling-view .journal-subtab,
#bottling-view .bottling-subtab {
  width: auto;
  margin: 0;
  filter: none;
  background: transparent;
  border: 1px solid transparent;
  color: var(--j-muted);
  padding: .42rem .9rem;
  border-radius: 8px;
  cursor: pointer;
  font-size: .86rem;
  font-weight: 600;
  transition: background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

#bottling-view .journal-subtab:hover,
#bottling-view .bottling-subtab:hover {
  filter: none;
  background: var(--j-hover);
  color: var(--j-text);
}

#bottling-view .journal-subtab.active,
#bottling-view .bottling-subtab.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  filter: none;
  box-shadow: 0 2px 8px rgba(110, 168, 254, 0.35);
}

@media (max-width: 900px) {
  #bottling-view .bottling-subtabs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: .25rem;
    width: 100%;
    padding: .15rem;
  }

  #bottling-view .bottling-subtab {
    padding: .38rem .25rem;
    font-size: .72rem;
    text-align: center;
  }
}

/* ── Розлив: табель / отпуска ── */
#bottling-view .bottling-month-nav {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem 0.5rem;
  width: 100%;
}

#bottling-view .bottling-month-nav.hidden {
  display: none;
}

#bottling-view #bottling-header-tools {
  flex: 1 1 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem 0.75rem;
  margin-top: 0.25rem;
}

#bottling-view #bottling-header-tools.hidden {
  display: none;
}

#bottling-view .bt-ts-toolbar {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 1rem;
}

#bottling-view .bt-ts-toolbar-search {
  flex: 0 1 auto;
  min-width: 12rem;
}

#bottling-view .bt-ts-toolbar-search .wh-ts-search {
  min-width: 14rem;
  max-width: 22rem;
}

#bottling-view .bt-ts-toolbar-right {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.75rem;
  margin-left: auto;
}

#bottling-view .bt-ts-toolbar-right .bt-ts-add-staff {
  background: color-mix(in srgb, #b28eff 42%, #fff);
  border: 1px solid rgba(143, 106, 224, 0.5);
  color: #1c1630;
  font-weight: 650;
}

#bottling-view .bt-ts-add-row {
  display: flex;
  justify-content: flex-start;
  padding: 0.75rem 0.25rem 0.25rem;
}

#bottling-view .bt-ts-add-row .bt-ts-add-staff {
  background: color-mix(in srgb, #b28eff 36%, #fff);
  border: 1px solid rgba(143, 106, 224, 0.45);
  color: #1c1630;
  font-weight: 650;
}

#bottling-view .bt-ts-table {
  --wh-ts-name-width: 200px;
}

#bottling-view .bt-ts-table.bt-ts-hide-job .bt-ts-col--job,
#bottling-view .bt-ts-table.bt-ts-hide-job .co-ts-col--job {
  display: none;
}

#bottling-view .bt-ts-table.bt-ts-hide-shift .bt-ts-col--shift,
#bottling-view .bt-ts-table.bt-ts-hide-shift .co-ts-col--shift {
  display: none;
}

#bottling-view .bt-ts-table.bt-ts-hide-schedule .bt-ts-col--schedule,
#bottling-view .bt-ts-table.bt-ts-hide-schedule .co-ts-col--schedule {
  display: none;
}

#bottling-view .bt-ts-table.bt-ts-hide-bday .bt-ts-col--bday {
  display: none;
}

#bottling-view .bt-ts-table.bt-ts-hide-comment .bt-ts-col--comment {
  display: none;
}

#bottling-view .bt-ts-col--comment,
#bottling-view .bt-ts-comment-input {
  min-width: 9rem;
  max-width: 14rem;
  width: 10.5rem;
}

#bottling-view th.bt-ts-col--comment {
  font-weight: 700;
  white-space: nowrap;
}

#bottling-view .bt-ts-comment-input {
  width: 100%;
  box-sizing: border-box;
  font: inherit;
  padding: 0.28rem 0.4rem;
  border: 1px solid var(--j-border, rgba(90, 50, 160, 0.35));
  border-radius: 6px;
  color: var(--j-text, var(--text, #e8ecf4));
  background: color-mix(in srgb, var(--brand, #b28eff) 22%, var(--j-card, #1c2333));
  caret-color: var(--j-text, var(--text, #e8ecf4));
}

#bottling-view .bt-ts-comment-input::placeholder {
  color: var(--j-muted, var(--muted, #8b95a8));
  opacity: 0.9;
}

html.theme-light #bottling-view .bt-ts-comment-input,
body.theme-light #bottling-view .bt-ts-comment-input {
  color: var(--brand-ink, #1a1228);
  background: color-mix(in srgb, #fff 70%, #b28eff);
  border-color: rgba(90, 50, 160, 0.35);
  caret-color: var(--brand-ink, #1a1228);
}

html.theme-light #bottling-view .bt-ts-comment-input::placeholder,
body.theme-light #bottling-view .bt-ts-comment-input::placeholder {
  color: rgba(26, 18, 40, 0.45);
}

#bottling-view .bt-ts-col--schedule,
#bottling-view .co-ts-col--schedule {
  min-width: 4.8rem;
  width: 4.8rem;
  text-align: center;
}

#bottling-view th.bt-ts-col--schedule,
#bottling-view th.co-ts-col--schedule {
  font-weight: 700;
  white-space: nowrap;
}

#bottling-view .bt-ts-schedule-select {
  min-width: 4.2rem;
  width: 100%;
}

#bottling-view .wh-ts-chip-row--wrap {
  flex-wrap: wrap;
  max-width: min(52rem, 70vw);
}

#bottling-view .bt-ts-job-filters .wh-ts-chip {
  max-width: 9.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#bottling-view .bt-ts-col--bday {
  width: 6.5rem;
  min-width: 6.5rem;
  max-width: 7.5rem;
  white-space: nowrap;
}

#bottling-view .bt-ts-col--hours {
  width: 4.2rem;
  min-width: 4.2rem;
  max-width: 4.5rem;
  text-align: center;
}

#bottling-view .bt-ts-birthday,
#bottling-view .bt-ts-work-hours {
  width: 100%;
  max-width: 7rem;
  margin: 0;
  padding: 0.15rem 0.2rem;
  border-radius: 5px;
  border: 1px solid var(--j-border, #2e3648);
  background: #12161f;
  color: var(--j-text, #e8ecf4);
  font-size: 0.72rem;
}

/* Дрэшки: свой календарь (не системный белый) */
#bottling-view .bt-ts-bday-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  max-width: 8.5rem;
  width: 100%;
}

#bottling-view .bt-ts-bday-wrap .bt-ts-birthday {
  flex: 1 1 auto;
  min-width: 0;
  max-width: none;
  cursor: pointer;
  color-scheme: dark;
}

#bottling-view .bt-ts-bday-wrap .bt-ts-birthday::-webkit-calendar-picker-indicator {
  opacity: 0;
  width: 0;
  padding: 0;
  margin: 0;
  pointer-events: none;
}

#bottling-view .bt-ts-bday-cal-btn {
  flex: 0 0 auto;
  width: 1.7rem;
  height: 1.7rem;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--j-text, #e8ecf4) !important;
  background: var(--j-card, #1c2333) !important;
  border: 1px solid var(--j-border, #2e3648) !important;
  border-radius: 6px;
}

#bottling-view .bt-ts-bday-cal-btn:hover {
  color: var(--j-text, #e8ecf4) !important;
  background: var(--j-hover, #252e42) !important;
  border-color: var(--j-muted, #8b95a8) !important;
}

#bottling-view .bt-ts-bday-cal-btn svg {
  stroke: currentColor;
}

#bottling-view .bt-ts-bday-popup {
  right: 0;
  left: auto;
  z-index: 90;
  background: var(--j-card-elevated, #222b3d) !important;
  border: 1px solid var(--j-border, #2e3648) !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.55) !important;
  color: var(--j-text, #e8ecf4) !important;
}

#bottling-view .bt-ts-bday-popup .journal-cal-title {
  color: var(--j-text, #e8ecf4);
}

#bottling-view .bt-ts-bday-popup .journal-cal-nav {
  color: var(--j-muted, #8b95a8);
  background: var(--j-bg, #151a24);
  border-color: var(--j-border, #2e3648);
}

#bottling-view .bt-ts-bday-popup .journal-cal-day {
  background: var(--j-bg, #151a24);
  border-color: var(--j-border, #2e3648);
  color: var(--j-text, #e8ecf4);
}

#bottling-view .bt-ts-bday-popup .journal-cal-day:hover {
  background: var(--j-hover, #252e42);
}

#bottling-view .bt-ts-bday-popup .journal-cal-day.selected {
  background: var(--j-accent, #6ea8fe);
  border-color: var(--j-accent, #6ea8fe);
  color: #fff;
}

#bottling-view .bt-ts-bday-popup .journal-cal-day.other {
  opacity: 0.4;
}

#bottling-view .bt-ts-bday-popup .journal-cal-today,
#bottling-view .bt-ts-bday-popup .journal-cal-footer button {
  color: var(--j-accent, #6ea8fe);
}

#bottling-view .bt-ts-bday-popup .journal-cal-footer {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
}

#bottling-view .bt-ts-day--vacation_planned .co-ts-vac-input,
#bottling-view .co-ts-day--vacation_planned .co-ts-vac-input {
  background: #FFF2CC !important;
  color: #1a1a1a !important;
  border-color: transparent !important;
  border-style: dashed;
}

#bottling-view .bt-ts-day--vac-mismatch {
  position: relative;
}

#bottling-view .bt-ts-day--vac-mismatch .co-ts-mismatch-tip {
  position: absolute;
  top: -2px;
  right: -2px;
  z-index: 2;
}

#bottling-view .bt-ts-day--birthday {
  position: relative;
}

#bottling-view .bt-ts-day--birthday .wh-ts-cell-input,
#bottling-view .bt-ts-day--birthday .co-ts-cell-input {
  box-shadow: inset 0 0 0 1.5px rgba(255, 170, 60, 0.85);
}

#bottling-view .bt-ts-bday-badge {
  position: absolute;
  top: -3px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  font-size: 0.72rem;
  line-height: 1;
  pointer-events: none;
  filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.45));
}

/* Штрафы — Розлив */
#bottling-view .bt-fines-page .output-mode-badge {
  margin: 0 0 0.75rem;
}

#bottling-view .bt-fines-table .bt-fines-comment {
  min-width: 16rem;
  max-width: 28rem;
  white-space: normal;
  vertical-align: top;
}

#bottling-view .bt-fines-table textarea.bt-fines-comment-input,
#bottling-view .bt-fines-table .bt-fines-comment-input {
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 2.6rem;
  margin: 0;
  padding: 0.35rem 0.45rem;
  resize: vertical;
  font: inherit;
  font-size: 0.78rem;
  line-height: 1.35;
  background: #12161f;
  border: 1px solid var(--j-border, var(--border));
  border-radius: 6px;
  color: var(--j-text, var(--text));
  color-scheme: dark;
}

#bottling-view .bt-fines-table textarea.bt-fines-comment-input:focus {
  outline: none;
  border-color: var(--j-accent, #5b9cf5);
}

#bottling-view .bt-fines-table tr.bt-fines-row--has-fine > td {
  background: rgba(200, 120, 60, 0.12);
}

#bottling-view .bt-fines-table tr.bt-fines-row--has-fine .output-sticky-name {
  background: #2a241c !important;
}

#bottling-view .bt-fines-table tr.bt-fines-row--not-in-ts > td {
  background: rgba(220, 80, 80, 0.14);
}

#bottling-view .bt-fines-table tr.bt-fines-row--not-in-ts .output-sticky-name {
  background: #2a1a1c !important;
}

#bottling-view .bt-fines-table tr.bt-fines-row--not-in-ts.bt-fines-row--has-fine > td {
  background: rgba(220, 100, 60, 0.18);
}

#bottling-view .bt-fines-name-warn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 1.15rem;
  height: 1.15rem;
  margin-left: 0.2rem;
  border: 1px solid rgba(255, 120, 100, 0.55);
  border-radius: 4px;
  background: rgba(220, 70, 70, 0.25);
  color: #ffb4a8;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1;
  cursor: help;
}

#bottling-view .bt-fines-reconcile {
  margin: 0 0 0.75rem;
}

#bottling-view .bt-fines-date-cell {
  min-width: 9.5rem;
  vertical-align: middle;
}

#bottling-view .bt-fines-date-wrap {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

#bottling-view .bt-fines-date-wrap .bt-fines-date-input {
  flex: 1 1 auto;
  min-width: 0;
  color-scheme: dark;
}

#bottling-view .bt-fines-date-wrap .bt-fines-date-input::-webkit-calendar-picker-indicator {
  opacity: 0;
  width: 0;
  padding: 0;
  margin: 0;
  pointer-events: none;
}

#bottling-view .bt-fines-cal-btn {
  flex: 0 0 auto;
  width: 1.85rem;
  height: 1.85rem;
  color: var(--j-text, #e8ecf4);
  background: #1a2230;
  border-color: var(--j-border, #3a455c);
}

#bottling-view .bt-fines-cal-btn:hover {
  color: #fff;
  background: var(--j-hover, #243044);
  border-color: var(--j-muted, #8b95a8);
}

#bottling-view .bt-fines-date-popup {
  right: 0;
  left: auto;
  z-index: 80;
}

#bottling-view .bt-fines-date-popup .journal-cal-footer {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
}

#bottling-view .bt-fines-table .bt-fines-amount-input {
  min-width: 5.5rem;
  font-variant-numeric: tabular-nums;
}

/* ── Розлив → Выработка (layout B) ── */
#bottling-view .bt-out-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
}

#bottling-view .bt-out-tools .wh-ts-search {
  min-width: 12rem;
  flex: 1 1 12rem;
}

#bottling-view .bt-out-page {
  padding: 0 0 0.5rem;
}

#bottling-view .bt-out-miss-hint {
  margin: 0 0 0.35rem;
  padding: 0.2rem 0.55rem;
  font-size: 0.72rem;
  font-weight: 600;
  line-height: 1.25;
  color: #b91c1c;
  background: rgba(220, 38, 38, 0.08);
  border: 1px solid rgba(185, 28, 28, 0.28);
  border-radius: 8px;
  display: inline-block;
}

#bottling-view .bt-out-wrap {
  max-height: calc(100vh - 11.5rem);
  overflow: auto;
  border: 1px solid var(--j-border);
  border-radius: 12px;
  background: var(--j-bg, #fff);
}

#bottling-view .bt-out-table {
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.78rem;
  min-width: max-content;
}

#bottling-view .bt-out-table thead th {
  position: sticky;
  top: 0;
  z-index: 4;
  background: color-mix(in srgb, var(--brand-cell, #e8dff8) 70%, #fff);
  color: var(--brand-ink, #1c1630);
  font-weight: 600;
  white-space: nowrap;
  border-bottom: 1px solid var(--brand-line, rgba(143, 106, 224, 0.48));
  padding: 0.35rem 0.3rem;
  text-align: center;
}

#bottling-view .bt-out-table th.bt-out-sticky,
#bottling-view .bt-out-table td.bt-out-sticky {
  position: sticky;
  left: 0;
  z-index: 3;
  background: color-mix(in srgb, var(--brand-cell, #e8dff8) 55%, #fff);
  text-align: left;
  box-shadow: 2px 0 0 color-mix(in srgb, var(--brand-line, rgba(143, 106, 224, 0.48)) 55%, transparent);
}

#bottling-view .bt-out-table thead th.bt-out-sticky {
  z-index: 5;
}

#bottling-view .bt-out-sticky--name {
  left: 0;
  min-width: 10rem;
  max-width: 13rem;
  vertical-align: middle;
}

#bottling-view .bt-out-job {
  min-width: 10.5rem;
  max-width: 15rem;
  vertical-align: middle;
}

#bottling-view .bt-out-job-wrap {
  display: flex;
  align-items: stretch;
  gap: 0.25rem;
  width: 100%;
}

#bottling-view .bt-out-job-input,
#bottling-view .bt-out-job-text {
  width: 100%;
  box-sizing: border-box;
  font: inherit;
  line-height: 1.3;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  resize: none;
  cursor: text;
  appearance: none;
  -webkit-appearance: none;
}

#bottling-view .bt-out-job-wrap .bt-out-job-input {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 2.4rem;
  overflow: hidden;
}

#bottling-view .bt-out-job-arrow {
  flex: 0 0 auto;
  align-self: center;
  width: 1.55rem;
  height: 1.55rem;
  padding: 0;
  border: 1px solid var(--brand-line, rgba(143, 106, 224, 0.48));
  border-radius: 8px;
  background: var(--brand-cell, #e8dff8);
  color: var(--brand-ink, #1c1630);
  font-size: 0.85rem;
  line-height: 1;
  cursor: pointer;
}

#bottling-view .bt-out-job-arrow:hover {
  background: var(--brand-cell-strong, #d4c2f5);
}

#bottling-view .bt-out-job-input:focus {
  outline: none;
  border-color: var(--brand-line, rgba(143, 106, 224, 0.7));
  background: color-mix(in srgb, var(--brand-cell-strong, #d4c2f5) 55%, #fff);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand-cell-active, #b28eff) 35%, transparent);
}

.bt-out-job-suggest {
  position: fixed;
  z-index: 90;
  max-height: 12rem;
  overflow: auto;
  padding: 0.3rem;
  border-radius: 10px;
  border: 1px solid var(--brand-line, rgba(143, 106, 224, 0.48));
  background: var(--brand-cell, #e8dff8) !important;
  color: var(--brand-ink, #1c1630);
  box-shadow: 0 10px 24px rgba(70, 40, 130, 0.14);
}

.bt-out-job-suggest__item {
  display: block;
  width: 100%;
  text-align: left;
  padding: 0.4rem 0.55rem;
  border: none;
  border-radius: 8px;
  background: color-mix(in srgb, #fff 35%, var(--brand-cell, #e8dff8));
  color: var(--brand-ink, #1c1630);
  font: inherit;
  font-size: 0.8rem;
  line-height: 1.3;
  white-space: normal;
  cursor: pointer;
  margin-bottom: 0.15rem;
}

.bt-out-job-suggest__item:last-child {
  margin-bottom: 0;
}

.bt-out-job-suggest__item:hover {
  background: var(--brand-cell-strong, #d4c2f5);
}

#bottling-view .bt-out-metric {
  min-width: 7.8rem;
  white-space: nowrap;
  vertical-align: middle;
}

#bottling-view .bt-out-soft-cell {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.3rem 0.4rem;
  min-height: 1.7rem;
  padding: 0.28rem 0.4rem;
  border-radius: 8px;
  border: 1px solid var(--brand-line, rgba(143, 106, 224, 0.48));
  background: var(--brand-cell, #e8dff8);
  color: var(--brand-ink, #1c1630);
  line-height: 1.25;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.22);
}

#bottling-view .bt-out-metric-cell {
  font-weight: 500;
  color: var(--brand-ink, #1c1630);
  white-space: nowrap;
}

#bottling-view .bt-out-what {
  min-width: 2.6rem;
  width: 2.6rem;
  padding: 0.2rem 0.15rem !important;
  text-align: center;
  vertical-align: middle;
  background: color-mix(in srgb, var(--brand-cell-strong, #d4c2f5) 28%, #fff);
}

#bottling-view .bt-out-what-cell {
  justify-content: center;
  min-height: 1.55rem;
  padding: 0.2rem 0.15rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  white-space: nowrap;
}

#bottling-view .bt-out-day {
  min-width: 2.75rem;
  width: 2.75rem;
  padding: 0.2rem 0.12rem !important;
  text-align: center;
  vertical-align: middle;
}

#bottling-view .bt-out-day-num {
  display: block;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
  color: var(--brand-ink, #1c1630);
}

#bottling-view .bt-out-day-wd {
  display: block;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--brand-muted, #6d6680);
  line-height: 1.1;
  margin-top: 0.1rem;
}

#bottling-view .bt-out-day--weekend .bt-out-day-wd {
  color: #b45309;
}

#bottling-view .bt-out-day--odd {
  background: color-mix(in srgb, var(--brand-cell, #e8dff8) 22%, #fff);
}

#bottling-view .bt-out-day--even {
  background: color-mix(in srgb, var(--brand-cell-strong, #d4c2f5) 18%, #fff);
}

#bottling-view .bt-out-cell-input {
  width: 100%;
  min-width: 2.2rem;
  max-width: 3.4rem;
  padding: 0.22rem 0.2rem;
  border: 1px solid transparent;
  border-radius: 8px;
  background: color-mix(in srgb, #fff 70%, var(--brand-cell, #e8dff8));
  color: var(--brand-ink, #1c1630);
  text-align: right;
  font-size: 0.76rem;
  font-variant-numeric: tabular-nums;
}

#bottling-view .bt-out-cell-input:focus {
  outline: none;
  border-color: var(--brand-line, rgba(143, 106, 224, 0.7));
  background: #fff;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand-cell-active, #b28eff) 35%, transparent);
}

#bottling-view .bt-out-name {
  font-weight: 600;
  color: var(--brand-ink, #1c1630);
}

#bottling-view .bt-out-dismissed {
  font-size: 0.7rem;
  color: #b45309;
  font-weight: 600;
}

#bottling-view .bt-out-dismiss {
  padding: 0 0.35rem;
  min-height: 1.4rem;
  line-height: 1;
  opacity: 0.65;
}

#bottling-view .bt-out-mismatch-tip {
  flex: 0 0 auto;
  width: 1.25rem;
  height: 1.25rem;
  padding: 0;
  margin: 0;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #dc2626;
  color: #fff;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.1rem;
  cursor: pointer;
  box-shadow: 0 0 0 1px #991b1b, 0 1px 3px rgba(127, 29, 29, 0.35);
}

#bottling-view .bt-out-mismatch-tip:hover {
  background: #ef4444;
  transform: scale(1.08);
}

#bottling-view .bt-out-shifts-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem;
  min-width: 3.2rem;
}

#bottling-view .bt-out-shifts-val {
  font-variant-numeric: tabular-nums;
}

#bottling-view .bt-out-row--first > td {
  border-top: 2px solid var(--brand-line, rgba(143, 106, 224, 0.35));
}

#bottling-view .bt-out-row--dismissed {
  opacity: 0.72;
}

/* Итого внизу таблицы — не прилипает при скролле */
#bottling-view .bt-out-table tfoot td {
  position: static !important;
  bottom: auto !important;
  background: color-mix(in srgb, var(--brand-cell-strong, #d4c2f5) 32%, #fff);
  font-weight: 600;
  border-top: 1px solid var(--brand-line, rgba(143, 106, 224, 0.4));
}

#bottling-view .bt-out-table tfoot .bt-out-sticky {
  position: sticky !important;
  left: 0;
  z-index: 2;
}

#bottling-view .bt-out-metric-total,
#bottling-view .bt-out-shifts {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  min-width: 3.6rem;
}

#bottling-view .bt-out-metric-total {
  min-width: 4.2rem;
  background: color-mix(in srgb, var(--brand-cell-strong, #d4c2f5) 22%, #fff);
  font-weight: 600;
}

#bottling-view .bt-out-table .co-ts-hours--mismatch,
#bottling-view .bt-out-table tr.co-ts-row--hours-mismatch .bt-out-shifts-val {
  color: #c62828;
  font-weight: 700;
}

/* ── Розлив → Справка по бонусам ── */
#bottling-view .bt-bonus-page {
  padding: 0.35rem 0 1.25rem;
  max-width: min(100%, 88rem);
  width: 100%;
}

#bottling-view .bt-bonus-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  align-items: start;
}

#bottling-view .bt-bonus-grid--3 {
  grid-template-columns: repeat(3, minmax(18rem, 1fr));
  margin-bottom: 1rem;
}

#bottling-view .bt-bonus-card--wide {
  margin: 1rem 0;
}

#bottling-view .bt-bonus-card--wide .bt-bonus-table {
  table-layout: fixed;
}

#bottling-view .bt-bonus-card--wide .bt-bonus-table th:nth-child(1),
#bottling-view .bt-bonus-card--wide .bt-bonus-table td:nth-child(1) {
  width: 18%;
}

#bottling-view .bt-bonus-card--wide .bt-bonus-table th:nth-child(2),
#bottling-view .bt-bonus-card--wide .bt-bonus-table td:nth-child(2),
#bottling-view .bt-bonus-card--wide .bt-bonus-table th:nth-child(3),
#bottling-view .bt-bonus-card--wide .bt-bonus-table td:nth-child(3) {
  width: 12%;
}

#bottling-view .bt-bonus-card--wide .bt-bonus-table th:nth-child(4),
#bottling-view .bt-bonus-card--wide .bt-bonus-table td:nth-child(4) {
  width: 58%;
}

#bottling-view .bt-bonus-cell--note {
  font-size: 0.78rem;
  color: var(--brand-muted, #6d6680);
  white-space: normal;
  overflow-wrap: anywhere;
}

@media (max-width: 1100px) {
  #bottling-view .bt-bonus-grid--3 {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 860px) {
  #bottling-view .bt-bonus-grid {
    grid-template-columns: 1fr;
  }
}

#bottling-view .bt-bonus-card {
  border: 1px solid var(--brand-line, rgba(143, 106, 224, 0.48));
  border-radius: 14px;
  background: var(--brand-cell, #e8dff8);
  box-shadow: 0 10px 24px rgba(70, 40, 130, 0.08);
  padding: 0.85rem 0.9rem 1rem;
}

#bottling-view .bt-bonus-card__title {
  margin: 0;
  font-family: "Fraunces", Georgia, serif;
  font-weight: 650;
  font-size: 1.15rem;
  color: var(--brand-ink, #1c1630);
}

#bottling-view .bt-bonus-card__hint {
  margin: 0.25rem 0 0.75rem;
  font-size: 0.8rem;
  color: var(--brand-muted, #6d6680);
  line-height: 1.35;
}

#bottling-view .bt-bonus-table-wrap {
  overflow: auto;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand-line, rgba(143, 106, 224, 0.48)) 70%, transparent);
  background: color-mix(in srgb, #fff 28%, var(--brand-cell, #e8dff8));
}

#bottling-view .bt-bonus-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.86rem;
}

#bottling-view .bt-bonus-table th,
#bottling-view .bt-bonus-table td {
  padding: 0.45rem 0.5rem;
  border-bottom: 1px solid color-mix(in srgb, var(--brand-line, rgba(143, 106, 224, 0.48)) 45%, transparent);
  text-align: left;
  vertical-align: middle;
}

#bottling-view .bt-bonus-table th {
  background: color-mix(in srgb, var(--brand-cell-strong, #d4c2f5) 45%, #fff);
  color: var(--brand-ink, #1c1630);
  font-weight: 700;
  white-space: nowrap;
}

#bottling-view .bt-bonus-table th.num,
#bottling-view .bt-bonus-table td.num {
  text-align: right;
}

#bottling-view .bt-bonus-table tbody tr:last-child td {
  border-bottom: none;
}

#bottling-view .bt-bonus-cell,
#bottling-view .bt-bonus-input {
  width: 100%;
  box-sizing: border-box;
  min-height: 2rem;
  padding: 0.35rem 0.45rem;
  border-radius: 8px;
  border: 1px solid var(--brand-line, rgba(143, 106, 224, 0.48));
  background: var(--brand-cell, #e8dff8);
  color: var(--brand-ink, #1c1630);
  font: inherit;
}

#bottling-view .bt-bonus-input {
  text-align: inherit;
}

#bottling-view td.num .bt-bonus-input {
  text-align: right;
  font-variant-numeric: tabular-nums;
  min-width: 4.5rem;
}

#bottling-view .bt-bonus-grid--3 .bt-bonus-table th:nth-child(3),
#bottling-view .bt-bonus-grid--3 .bt-bonus-table td:nth-child(3) {
  min-width: 5.75rem;
  width: 30%;
}

#bottling-view .bt-bonus-grid--3 .bt-bonus-table th:nth-child(2),
#bottling-view .bt-bonus-grid--3 .bt-bonus-table td:nth-child(2) {
  min-width: 5.25rem;
  width: 28%;
}

#bottling-view .bt-bonus-grid--3 .bt-bonus-table td.num .bt-bonus-cell,
#bottling-view .bt-bonus-grid--3 .bt-bonus-table td.num .bt-bonus-input {
  overflow: visible;
  white-space: nowrap;
  padding-right: 0.55rem;
}

#bottling-view .bt-bonus-input:focus {
  outline: none;
  border-color: var(--brand-line, rgba(143, 106, 224, 0.75));
  background: color-mix(in srgb, var(--brand-cell-strong, #d4c2f5) 40%, #fff);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand-cell-active, #b28eff) 30%, transparent);
}

#bottling-view .bt-bonus-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem 1rem;
  margin-top: 1rem;
}

#bottling-view .bt-bonus-actions__note {
  font-size: 0.78rem;
  color: var(--brand-muted, #6d6680);
}

/* ── Розлив → Мотивация (ячейки как Выработка → Отбор) ── */
#bottling-view .bt-mot-page {
  padding: 0.2rem 0 1rem;
}

#bottling-view .bt-mot-legend {
  margin: 0 0 0.55rem;
  font-size: 0.78rem;
  color: var(--brand-muted, #6d6680);
  line-height: 1.4;
}

#bottling-view .bt-mot-legend__mark {
  display: inline-block;
  min-width: 1.1rem;
  text-align: center;
  font-weight: 800;
  color: #b45309;
}

#bottling-view .bt-mot-legend__swatch {
  display: inline-block;
  width: 0.85rem;
  height: 0.85rem;
  border-radius: 4px;
  vertical-align: -0.1rem;
  margin: 0 0.15rem;
  border: 1px solid transparent;
}

#bottling-view .bt-mot-legend__swatch--bad {
  background: rgba(248, 113, 113, 0.28);
  border-color: rgba(185, 28, 28, 0.65);
}

#bottling-view .bt-mot-legend__swatch--warn {
  background: rgba(251, 146, 60, 0.32);
  border-color: rgba(180, 83, 9, 0.65);
}

#bottling-view .bt-mot-wrap {
  max-height: calc(100vh - 12rem);
  overflow: auto;
  border: 1px solid var(--brand-line, rgba(143, 106, 224, 0.48));
  border-radius: 12px;
  background: color-mix(in srgb, #fff 20%, var(--brand-cell, #e8dff8));
}

#bottling-view .bt-mot-table {
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.72rem;
  min-width: max-content;
}

#bottling-view .bt-mot-table thead th {
  position: sticky;
  top: 0;
  z-index: 4;
  background: color-mix(in srgb, var(--brand-cell-strong, #d4c2f5) 50%, #fff);
  color: var(--brand-ink, #1c1630);
  font-weight: 700;
  padding: 0.35rem 0.3rem;
  border-bottom: 1px solid var(--brand-line, rgba(143, 106, 224, 0.45));
  white-space: nowrap;
  text-align: center;
}

#bottling-view .bt-mot-table thead tr:first-child th {
  top: 0;
}

#bottling-view .bt-mot-table thead tr:nth-child(2) th {
  top: 1.7rem;
  z-index: 3;
}

#bottling-view .bt-mot-table td {
  padding: 0.22rem 0.2rem;
  border-bottom: 1px solid color-mix(in srgb, var(--brand-line, rgba(143, 106, 224, 0.35)) 50%, transparent);
  vertical-align: middle;
}

/* Разделители групп колонок (кол-во / ₽ / планы / ЗП) */
#bottling-view .bt-mot-table th.bt-mot-gstart,
#bottling-view .bt-mot-table td.bt-mot-gstart {
  border-left: 3px solid rgba(88, 50, 160, 0.55);
  padding-left: 0.5rem;
}

#bottling-view .bt-mot-table th.bt-mot-gbefore,
#bottling-view .bt-mot-table td.bt-mot-gbefore {
  padding-right: 0.45rem;
}

#bottling-view .bt-mot-table thead th.bt-mot-gstart {
  box-shadow: inset 3px 0 0 rgba(88, 50, 160, 0.55);
  border-left-color: transparent;
}

#bottling-view .bt-mot-sticky {
  position: sticky;
  left: 0;
  z-index: 5;
  min-width: 10.5rem;
  max-width: 13rem;
  background: var(--brand-cell, #e8dff8);
  text-align: left !important;
  box-shadow: 2px 0 0 color-mix(in srgb, var(--brand-line, rgba(143, 106, 224, 0.48)) 50%, transparent);
}

#bottling-view .bt-mot-table thead th.bt-mot-sticky {
  z-index: 6;
}

/* Полукруглые ячейки — как Отбор */
#bottling-view .bt-mot-soft,
#bottling-view .bt-mot-input,
#bottling-view .bt-mot-select {
  width: 100%;
  box-sizing: border-box;
  min-height: 1.55rem;
  padding: 0.28rem 0.35rem;
  border-radius: 8px;
  border: 1px solid rgba(143, 106, 224, 0.48);
  background: color-mix(in srgb, #b28eff 36%, #fff);
  color: #1c1630;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
  font: inherit;
  line-height: 1.25;
  font-variant-numeric: tabular-nums;
}

#bottling-view .bt-mot-soft {
  display: block;
  text-align: inherit;
}

#bottling-view td.num .bt-mot-soft,
#bottling-view .bt-mot-input {
  text-align: right;
}

#bottling-view .bt-mot-name-cell {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem 0.35rem;
  font-weight: 700;
  text-align: left;
}

#bottling-view .bt-mot-job-cell {
  margin-top: 0.3rem;
  font-size: 0.68rem;
  color: var(--brand-muted, #6d6680);
  font-weight: 500;
  text-align: left;
}

#bottling-view .bt-mot-input,
#bottling-view .bt-mot-select {
  min-width: 3.2rem;
  max-width: 7.5rem;
}

#bottling-view .bt-mot-select {
  text-align: left;
  max-width: 8.5rem;
  min-width: 6.5rem;
}

#bottling-view .bt-mot-input:focus,
#bottling-view .bt-mot-select:focus {
  outline: none;
  background: color-mix(in srgb, var(--brand-cell-strong, #d4c2f5) 40%, #fff);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand-cell-active, #b28eff) 30%, transparent);
}

#bottling-view .bt-mot-manual:not(.bt-mot-field-diff) {
  box-shadow: inset 0 0 0 1.5px rgba(180, 83, 9, 0.45);
}

#bottling-view .bt-mot-total:not(.bt-mot-field-diff) {
  background: color-mix(in srgb, var(--brand-cell-strong, #d4c2f5) 42%, #fff);
  font-weight: 700;
}

/* Красный — дни ≠ табель (как output-shift-missing) */
#bottling-view .bt-mot-shift-missing {
  background: rgba(248, 113, 113, 0.28) !important;
  border-color: rgba(185, 28, 28, 0.65) !important;
  color: #991b1b !important;
  box-shadow: none;
  cursor: pointer;
}

/* Оранжевый — не совпало с эталоном Excel (как output-field-diff) */
#bottling-view .bt-mot-field-diff,
#bottling-view .bt-mot-input.bt-mot-field-diff {
  background: rgba(251, 146, 60, 0.32) !important;
  border-color: rgba(180, 83, 9, 0.65) !important;
  color: #9a3412 !important;
  box-shadow: none;
  cursor: pointer;
}

#bottling-view .bt-mot-calc-tip {
  cursor: help;
}

#bottling-view .bt-mot-row--mixed {
  box-shadow: inset 3px 0 0 #d97706;
}

#bottling-view .bt-mot-mixed-badge {
  display: inline-block;
  border-radius: 6px;
  background: rgba(251, 146, 60, 0.35);
  border: 1px solid rgba(180, 83, 9, 0.55);
  color: #9a3412;
  font-size: 0.62rem;
  font-weight: 800;
  padding: 0.05rem 0.3rem;
  white-space: nowrap;
}

/* ── Ведомость ── */
.vedomost-header {
  padding-bottom: .4rem;
}

.vedomost-header-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .55rem .75rem;
  width: 100%;
}

.vedomost-missing-host {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  flex: 0 1 auto;
  min-width: 0;
}

.vedomost-search-host {
  flex: 0 1 16rem;
  min-width: 12rem;
}

.vedomost-search-host:empty {
  display: none;
}

.vedomost-search-host .journal-search-input {
  width: 100%;
  margin: 0;
}

.vedomost-missing--compact {
  margin: 0;
  padding: .28rem .55rem;
  font-size: .78rem;
  max-width: min(22rem, 100%);
}

.vedomost-missing--compact .vedomost-missing-list {
  columns: 1;
  max-height: 12rem;
  overflow: auto;
  margin-top: .35rem;
}

.vedomost-mark-strip {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  min-width: max-content;
  box-sizing: border-box;
  padding: .4rem .55rem;
  background: #1c2333;
  border-bottom: 1px solid var(--j-border, #2e3648);
  position: sticky;
  top: 0;
  z-index: 6;
}

.vedomost-wrap--has-filters {
  border: 1px solid var(--j-border, #2e3648);
  border-radius: 10px;
}

.vedomost-wrap--has-filters .vedomost-mark-strip {
  border-radius: 10px 10px 0 0;
}

.vedomost-wrap--has-filters .vedomost-table thead th {
  top: 2.7rem;
}

.vedomost-mark-bar {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: .4rem .55rem;
  overflow-x: auto;
  max-width: 100%;
}

.vedomost-mark-bar__hint {
  font-size: .62rem;
  margin-left: .15rem;
  white-space: nowrap;
}

.vedomost-mark-chip {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  margin: 0;
  padding: .18rem .5rem;
  border: 1px solid var(--j-border, #2e3648);
  border-radius: 6px;
  background: rgba(18, 22, 31, 0.95);
  font: inherit;
  font-size: .72rem;
  line-height: 1.2;
  color: var(--j-muted, #8b95a8);
  white-space: nowrap;
  cursor: pointer;
}

.vedomost-mark-chip:hover {
  color: var(--j-text, #e8ecf4);
  border-color: rgba(110, 168, 254, 0.4);
}

.vedomost-mark-chip.is-on {
  background: rgba(110, 168, 254, 0.2);
  border-color: rgba(110, 168, 254, 0.65);
  color: var(--j-text, #e8ecf4);
  box-shadow: 0 0 0 1px rgba(110, 168, 254, 0.25);
}

.vedomost-mark-chip__code {
  font-weight: 700;
  color: var(--j-text, #e8ecf4);
  min-width: 1.35rem;
  text-align: center;
}

.vedomost-mark-chip__label {
  color: inherit;
}

.vedomost-toggle {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  margin-left: .25rem;
  font-size: .82rem;
  color: var(--muted, #8a93a6);
  cursor: pointer;
  user-select: none;
}

.vedomost-toggle input {
  accent-color: var(--accent, #3b82f6);
}

.vedomost-fio-hint {
  font-size: .78rem;
}

.vedomost-fio-wrap {
  display: flex;
  align-items: center;
  gap: .2rem;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

.vedomost-print-cb {
  flex: 0 0 auto;
  width: .85rem;
  height: .85rem;
  margin: 0 .15rem 0 0;
  accent-color: var(--accent, #3b82f6);
  cursor: pointer;
}

.vedomost-fio-th {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  min-width: 0;
}

.vedomost-fio-th .vedomost-print-select-all {
  margin: 0 .2rem 0 0;
}

.vedomost-print-btn {
  white-space: nowrap;
}

.vedomost-print-btn:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.vedomost-excel-btn,
.vedomost-sync-btn {
  white-space: nowrap;
}

.vedomost-print-host {
  gap: 0.35rem;
}

.vedomost-missing-head {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
}

.vedomost-col-filter-btn {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  padding: 0;
  text-align: inherit;
  width: 100%;
}

.vedomost-th--filterable.is-filtered .vedomost-col-filter-btn {
  color: #6b4db8;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.vedomost-col-filter-menu {
  position: absolute;
  z-index: 40;
  top: calc(100% + 4px);
  left: 0;
  min-width: 11rem;
  padding: .35rem;
  border-radius: 8px;
  background: #fff;
  border: 1px solid rgba(143, 106, 224, 0.35);
  box-shadow: 0 8px 24px rgba(28, 22, 48, 0.14);
  display: flex;
  flex-direction: column;
  gap: .2rem;
}

.vedomost-col-filter-menu button {
  appearance: none;
  border: 0;
  background: transparent;
  text-align: left;
  padding: .35rem .5rem;
  border-radius: 6px;
  cursor: pointer;
  font: inherit;
  font-size: .82rem;
  color: #1c1630;
}

.vedomost-col-filter-menu button:hover,
.vedomost-col-filter-menu button.is-on {
  background: color-mix(in srgb, #b28eff 22%, #fff);
}

.vedomost-cell-wrap {
  display: inline-flex;
  align-items: center;
  gap: .2rem;
  width: 100%;
  min-width: 0;
}

.vedomost-cell-wrap .vedomost-cell-input,
.vedomost-cell-wrap .vedomost-cell-ro {
  flex: 1;
  min-width: 0;
}

.vedomost-comment-tip {
  flex-shrink: 0;
  width: 1.15rem;
  height: 1.15rem;
  padding: 0;
  border-radius: 999px;
  border: 1px solid rgba(143, 106, 224, 0.45);
  background: color-mix(in srgb, #b28eff 18%, #fff);
  color: #6b4db8;
  font-size: .7rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  opacity: .55;
}

.vedomost-comment-tip.has-text {
  opacity: 1;
  background: #8f6ae0;
  color: #f7f3ff;
  border-color: #6b4db8;
}

.vedomost-comment-pop {
  position: absolute;
  z-index: 45;
  top: calc(100% + 4px);
  right: 0;
  width: min(18rem, 70vw);
  padding: .55rem .65rem;
  border-radius: 10px;
  background: #fff;
  border: 1px solid rgba(143, 106, 224, 0.4);
  box-shadow: 0 10px 28px rgba(28, 22, 48, 0.16);
}

.vedomost-comment-pop__title {
  font-size: .75rem;
  font-weight: 700;
  color: #6b4db8;
  margin-bottom: .35rem;
}

.vedomost-comment-pop__input {
  width: 100%;
  resize: vertical;
  min-height: 4rem;
  font: inherit;
  font-size: .85rem;
  padding: .4rem .5rem;
  border-radius: 8px;
  border: 1px solid rgba(143, 106, 224, 0.35);
  box-sizing: border-box;
}

.vedomost-comment-pop__body {
  font-size: .85rem;
  color: #1c1630;
  white-space: pre-wrap;
}

.vedomost-comment-pop__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin-top: .45rem;
}

.vedomost-print-root {
  display: none;
}

@media print {
  body.vedomost-printing * {
    visibility: hidden !important;
  }
  body.vedomost-printing #vedomost-print-root,
  body.vedomost-printing #vedomost-print-root * {
    visibility: visible !important;
  }
  body.vedomost-printing #vedomost-print-root {
    display: block !important;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    padding: 0;
    margin: 0;
    background: #fff;
    color: #000;
  }
  .vedomost-print-page {
    page-break-after: always;
    break-after: page;
    padding: 12mm 14mm;
  }
  .vedomost-print-page:last-child {
    page-break-after: auto;
    break-after: auto;
  }
  .vedomost-print-title {
    font-size: 14pt;
    margin: 0 0 6pt;
    font-weight: 700;
  }
  .vedomost-print-name {
    font-size: 16pt;
    margin: 0 0 12pt;
    font-weight: 700;
  }
  .vedomost-print-table {
    width: 100%;
    border-collapse: collapse;
  }
  .vedomost-print-table th,
  .vedomost-print-table td {
    border: 1px solid #333;
    padding: 6pt 8pt;
    text-align: left;
    font-size: 11pt;
    vertical-align: top;
  }
  .vedomost-print-table th {
    width: 48%;
    background: #f3f3f3;
    font-weight: 600;
  }
}

.vedomost-fio-wrap .vedomost-cell-input {
  flex: 1 1 auto;
  min-width: 0;
  max-width: none;
}

.vedomost-fio-btn {
  flex: 0 0 1.15rem;
  width: 1.15rem;
  height: 1.15rem;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(110, 168, 254, 0.45);
  border-radius: 999px;
  background: rgba(110, 168, 254, 0.16);
  color: #bfdbfe;
  cursor: pointer;
  font-size: .68rem;
  font-weight: 700;
  line-height: 1.1;
  text-align: center;
}

.vedomost-fio-btn:hover {
  color: #fff;
  border-color: var(--accent, #3b82f6);
  background: rgba(59, 130, 246, 0.35);
}

.vedomost-fio-btn--warn {
  border-color: rgba(248, 113, 113, 0.55);
  background: rgba(248, 113, 113, 0.2);
  color: #fecaca;
}

.vedomost-fio-btn--warn:hover {
  border-color: #f87171;
  background: rgba(248, 113, 113, 0.4);
  color: #fff;
}

button.vedomost-fio-link {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  text-align: left;
  cursor: pointer;
  color: #93c5fd;
  text-decoration: underline;
  text-underline-offset: 2px;
  background: inherit;
  overflow: hidden;
  text-overflow: ellipsis;
}

button.vedomost-fio-link:hover {
  color: #bfdbfe;
}

.vedomost-modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.vedomost-modal.hidden {
  display: none;
}

.vedomost-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(8, 12, 20, 0.62);
}

.vedomost-modal__card {
  position: relative;
  z-index: 1;
  width: min(52rem, 96vw);
  max-height: min(88vh, 40rem);
  overflow: auto;
  padding: 1.1rem 1.25rem 1.25rem;
  border: 1px solid var(--border, #2e3648);
  border-radius: .75rem;
  background: var(--j-card, #1c2333);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.45);
}

.vedomost-modal__close {
  position: absolute;
  top: .45rem;
  right: .55rem;
  margin: 0;
  padding: .1rem .45rem;
  border: 0;
  background: transparent;
  color: var(--muted, #8a93a6);
  font-size: 1.4rem;
  line-height: 1;
  cursor: pointer;
}

.vedomost-person-title {
  margin: 0 1.5rem .2rem 0;
  font-size: 1.15rem;
}

.vedomost-person-sub {
  margin: 0 0 .85rem;
  font-size: .9rem;
}

.vedomost-person-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .85rem;
}

.vedomost-person-grid--bonuses {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-height: min(58vh, 520px);
  overflow: auto;
  padding-right: .15rem;
}

.vedomost-person-dl--top {
  margin: 0 0 .85rem;
  max-width: 28rem;
}

.vedomost-person-col--warn {
  border-color: rgba(248, 113, 113, 0.45);
  background: rgba(248, 113, 113, 0.08);
}

@media (max-width: 780px) {
  .vedomost-person-grid {
    grid-template-columns: 1fr;
  }
  .vedomost-person-grid--bonuses {
    grid-template-columns: 1fr;
  }
}

.vedomost-person-col {
  padding: .65rem .75rem;
  border: 1px solid var(--border, #2e3648);
  border-radius: .55rem;
  background: rgba(255, 255, 255, 0.02);
}

.vedomost-person-col h4 {
  margin: 0 0 .5rem;
  font-size: .92rem;
}

.vedomost-person-dl {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .28rem .6rem;
  margin: 0;
  font-size: .82rem;
}

.vedomost-person-dl dt {
  color: var(--muted, #8a93a6);
}

.vedomost-person-dl dd {
  margin: 0;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.vedomost-person-tips {
  margin: .75rem 0 0;
  font-size: .8rem;
}

.vedomost-badge {
  display: inline-block;
  padding: .08rem .35rem;
  border-radius: .3rem;
  font-size: .75rem;
  border: 1px solid transparent;
}

.vedomost-badge--ok {
  background: rgba(46, 160, 90, 0.22);
  border-color: rgba(46, 160, 90, 0.45);
}

.vedomost-badge--bad {
  background: rgba(220, 80, 80, 0.2);
  border-color: rgba(220, 80, 80, 0.5);
}

.vedomost-charts--hero {
  grid-template-columns: 1fr;
  gap: 1.1rem;
  margin-bottom: 1.1rem;
}

.vedomost-chart-card--hero {
  padding: 1rem 1.15rem 1.15rem;
}

.vedomost-chart-card--hero .vedomost-chart-title {
  font-size: 1.05rem;
  margin-bottom: .65rem;
}

.vedomost-chart-card--hero .vedomost-chart-svg {
  min-height: 12rem;
}

.vedomost-chart-svg--vbar {
  width: 100%;
  max-width: 100%;
  overflow: visible;
}

.vedomost-chart-periods {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .75rem;
}

.vedomost-chart-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .5rem .75rem;
  margin: 0 0 .75rem;
}

.vedomost-chart-head .vedomost-chart-title {
  margin: 0;
}

.vedomost-chart-controls {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .45rem .65rem;
}

.vedomost-chart-period-select-wrap {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  margin: 0;
  font-size: .82rem;
  white-space: nowrap;
}

.vedomost-chart-period-select {
  margin: 0;
  min-width: 8.5rem;
  max-width: 14rem;
  padding: .28rem .55rem;
  border: 1px solid var(--border, #2e3648);
  border-radius: .4rem;
  background: var(--bg-elevated, rgba(255, 255, 255, 0.04));
  color: inherit;
  font: inherit;
  font-size: .85rem;
  cursor: pointer;
}

.vedomost-chart-period {
  margin: 0;
  padding: .22rem .55rem;
  border: 1px solid var(--border, #2e3648);
  border-radius: .4rem;
  background: rgba(255, 255, 255, 0.03);
  color: inherit;
  font: inherit;
  font-size: .78rem;
  cursor: pointer;
}

.vedomost-chart-period:hover {
  border-color: var(--accent, #3b82f6);
}

.vedomost-chart-period.is-active {
  background: rgba(59, 130, 246, 0.22);
  border-color: rgba(59, 130, 246, 0.6);
  color: #fff;
}

.vedomost-summary-table-details {
  margin: .5rem 0 1rem;
  border: 1px solid var(--border, #2e3648);
  border-radius: .55rem;
  padding: .35rem .75rem .75rem;
  background: rgba(255, 255, 255, 0.015);
}

.vedomost-summary-table-summary {
  cursor: pointer;
  font-weight: 600;
  padding: .45rem 0;
  list-style-position: outside;
}

.vedomost-wrap--summary {
  max-height: calc(100vh - 16rem);
  margin-top: .4rem;
}

.vedomost-sheet-picker-wrap {
  position: relative;
  z-index: 20;
}

.vedomost-sheet-picker-inner {
  position: relative;
  display: inline-block;
}

.vedomost-sheet-picker-btn {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  margin: 0;
  padding: .4rem .75rem;
  border: 1px solid var(--border, #2e3648);
  border-radius: .5rem;
  background: rgba(255, 255, 255, 0.04);
  color: inherit;
  font: inherit;
  cursor: pointer;
}

.vedomost-sheet-picker-btn__prefix {
  color: var(--muted, #8a93a6);
  font-size: .85rem;
}

.vedomost-sheet-picker-btn__value {
  font-weight: 700;
}

.vedomost-sheet-picker-btn__chev {
  color: var(--muted, #8a93a6);
  font-size: .75rem;
}

.vedomost-sheet-picker-menu {
  position: absolute;
  top: calc(100% + .35rem);
  left: 0;
  min-width: 17rem;
  max-width: min(22rem, 92vw);
  padding: .75rem;
  border: 1px solid var(--border, #2e3648);
  border-radius: .65rem;
  background: var(--j-card, #1c2333);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
  z-index: 40;
}

.vedomost-sheet-picker-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .35rem;
}

.vedomost-sheet-picker-extra {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin-top: .55rem;
  padding-top: .55rem;
  border-top: 1px solid var(--border, #2e3648);
}

.vedomost-picker-item {
  margin: 0;
  padding: .35rem .45rem;
  border: 1px solid var(--border, #2e3648);
  border-radius: .4rem;
  background: transparent;
  color: inherit;
  font-size: .85rem;
  cursor: pointer;
}

.vedomost-picker-item:hover {
  border-color: var(--accent, #3b82f6);
}

.vedomost-picker-item.is-active {
  background: var(--accent, #3b82f6);
  border-color: var(--accent, #3b82f6);
  color: #fff;
}

.vedomost-picker-item--extra {
  flex: 1 1 auto;
}

.vedomost-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  align-items: center;
  margin: .75rem 0;
}

.vedomost-foot-row .vedomost-th {
  position: sticky;
  bottom: 0;
  z-index: 3;
  background: #1a2332;
  border-top: 2px solid rgba(110, 168, 254, 0.45);
  font-weight: 700;
  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.25);
}

.vedomost-foot-label {
  text-align: left;
}

.vedomost-dept-select {
  min-width: 10rem;
}

.vedomost-vp-add {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .4rem;
  align-items: center;
  margin: .25rem 0 .45rem;
  padding: .4rem .5rem;
  border: 1px solid rgba(110, 168, 254, 0.22);
  border-radius: .55rem;
  background: rgba(23, 27, 38, 0.65);
}

.vedomost-vp-add.hidden {
  display: none;
}

.vedomost-vp-add__fio {
  flex: 1 1 10rem;
  min-width: 8rem;
  max-width: 16rem;
  height: 2rem;
  padding: .25rem .45rem;
  font-size: .85rem;
  width: 100%;
}

.vedomost-vp-fio-ac {
  position: relative;
  flex: 1 1 10rem;
  min-width: 8rem;
  max-width: 18rem;
}

.vedomost-vp-fio-suggest {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 2px);
  z-index: 40;
  max-height: 12rem;
  overflow-y: auto;
  border: 1px solid rgba(110, 168, 254, 0.35);
  border-radius: .45rem;
  background: #151b27;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.45);
}

.vedomost-vp-fio-suggest.hidden {
  display: none;
}

.vedomost-vp-fio-suggest__item {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  color: #e8edf7;
  padding: .4rem .55rem;
  font-size: .82rem;
  cursor: pointer;
}

.vedomost-vp-fio-suggest__item:hover,
.vedomost-vp-fio-suggest__item.is-active {
  background: rgba(110, 168, 254, 0.22);
}

.vedomost-vp-add__num {
  width: 6.2rem;
  min-width: 5rem;
  height: 2rem;
  padding: .25rem .4rem;
  font-size: .85rem;
}

.vedomost-vp-add__dash {
  color: var(--muted, #8b95a8);
  font-size: .85rem;
}

.vedomost-vp-add #vp-new-add,
.vedomost-vp-add #vp-new-cancel {
  min-width: auto;
  height: 2rem;
  padding: 0 .7rem;
  font-size: .82rem;
  line-height: 1.1;
  white-space: nowrap;
}

.vedomost-vp-add__cancel {
  opacity: .85;
  background: transparent !important;
  color: var(--muted, #8b95a8) !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
}

.vedomost-vp-toolbar {
  gap: .35rem;
  margin: .45rem 0 .4rem;
}

.vedomost-vp-search {
  flex: 1 1 100%;
  min-width: 0;
}

.vedomost-vp-toolbar-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .55rem;
  width: 100%;
}

.vedomost-vp-send-btn,
.vedomost-vp-add-toggle {
  min-width: auto;
  height: 2rem;
  padding: 0 .65rem;
  font-size: .8rem;
  line-height: 1.1;
  white-space: nowrap;
  margin-left: auto;
}

.vedomost-vp-add-toggle {
  margin-left: 0;
}

.vedomost-vp-sendbar {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  align-items: center;
}

.vedomost-wrap--vp {
  max-height: calc(100vh - 9.5rem);
}

.vedomost-vp-month-label {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-size: .82rem;
  color: var(--muted, #8b95a8);
}

.vedomost-vp-month-label .journal-input {
  min-width: 9rem;
  height: 2rem;
  padding: .2rem .4rem;
  font-size: .85rem;
}

.vedomost-vp-month-row td {
  font-weight: 700;
  background: rgba(110, 168, 254, 0.12);
  padding: .45rem .5rem !important;
  border-radius: .4rem;
}

.vedomost-vp-row--skip {
  opacity: .65;
}

.vedomost-vp-del {
  border: none;
  background: transparent;
  color: #f87171;
  cursor: pointer;
  font-size: 1.1rem;
  line-height: 1;
  padding: .15rem .35rem;
  border-radius: .35rem;
}

.vedomost-vp-del:hover {
  background: rgba(248, 113, 113, 0.15);
}

.vedomost-vp-table .vedomost-cell-input {
  border-radius: .45rem;
}

/* Жёсткая сетка — заголовки совпадают с колонками */
.vedomost-vp-table {
  table-layout: fixed;
  width: 100%;
  min-width: 56rem;
}

.vedomost-vp-table col.vp-col-fio { width: 14rem; }
.vedomost-vp-table col.vp-col-date { width: 9.5rem; }
.vedomost-vp-table col.vp-col-num { width: 5.5rem; }
.vedomost-vp-table col.vp-col-money { width: 7.5rem; }
.vedomost-vp-table col.vp-col-note { width: auto; }
.vedomost-vp-table col.vp-col-del { width: 2.4rem; }

.vedomost-vp-table thead th {
  text-align: left;
  vertical-align: bottom;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: .35rem .3rem !important;
}

.vedomost-vp-table thead th.num,
.vedomost-vp-table tbody td.num {
  text-align: right;
}

.vedomost-vp-table tbody td {
  vertical-align: middle;
  overflow: hidden;
  padding: .25rem .3rem !important;
}

.vedomost-vp-table .vedomost-th--sticky,
.vedomost-vp-table .vedomost-td--sticky {
  min-width: 0;
  max-width: none;
  width: 14rem;
  z-index: 4;
}

.vedomost-vp-table thead .vedomost-th--sticky {
  z-index: 5;
}

.vedomost-vp-table .vedomost-fio-wrap .vedomost-cell-input {
  max-width: none;
  min-width: 0;
}

.vedomost-vp-table .vedomost-vp-date-wrap .vedomost-vp-date-input {
  max-width: none;
  min-width: 0;
  width: 100%;
}

.vedomost-vp-table td.num .vedomost-cell-input {
  max-width: none;
  min-width: 0;
  width: 100%;
  text-align: right;
}

.vedomost-vp-table td .vedomost-cell-input[data-vp-field="note"] {
  max-width: none;
  min-width: 0;
  width: 100%;
}

.vedomost-vp-date-wrap {
  position: relative;
  display: flex;
  align-items: center;
  gap: .2rem;
  min-width: 0;
  width: 100%;
}

.vedomost-vp-date-wrap .vedomost-vp-date-input {
  flex: 1 1 auto;
  min-width: 0;
  color-scheme: dark;
}

.vedomost-vp-date-wrap .vedomost-vp-date-input::-webkit-calendar-picker-indicator {
  opacity: 0;
  width: 0;
  padding: 0;
  margin: 0;
  pointer-events: none;
}

.vedomost-vp-cal-btn {
  flex: 0 0 auto;
  width: 1.7rem;
  height: 1.7rem;
  padding: 0;
  color: var(--j-text, #e8ecf4);
  background: #1a2230;
  border: 1px solid var(--j-border, #3a455c);
  border-radius: 6px;
}

.vedomost-vp-cal-btn:hover {
  background: var(--j-hover, #243044);
  color: #fff;
}

.vedomost-vp-date-popup {
  z-index: 120;
  background: #1a2130;
  border: 1px solid #3d4a66;
}

.vedomost-vp-send-modal {
  position: fixed;
  inset: 0;
  z-index: 500;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vedomost-vp-send-modal.hidden {
  display: none;
}

.vedomost-vp-send-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(8, 10, 16, 0.72);
}

.vedomost-vp-send-modal__card {
  position: relative;
  z-index: 1;
  width: min(22rem, calc(100vw - 1.5rem));
  padding: 1rem 1.1rem;
  border-radius: 12px;
  border: 1px solid var(--j-border, #3a455c);
  background: var(--bg-elevated, #171b26);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.55);
}

.vedomost-vp-send-modal__card h3 {
  margin: 0 0 .5rem;
  font-size: 1rem;
}

.vedomost-vp-send-modal__actions {
  display: flex;
  gap: .5rem;
  margin-top: .85rem;
}

.vedomost-vp-sort-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin: 0;
  padding: 0.15rem 0.35rem;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}

.vedomost-vp-sort-btn:hover {
  border-color: rgba(178, 142, 255, 0.45);
  background: color-mix(in srgb, #b28eff 18%, transparent);
}

.vedomost-vp-sort-btn__mark {
  font-size: 0.68rem;
  font-weight: 600;
  opacity: 0.85;
}

.co-ts-vacation-pay-host {
  margin-top: 0.35rem;
  min-width: 0;
}

/* Тёмные нативные календари по всему приложению */
input[type="date"] {
  color-scheme: dark;
  background: var(--bg, #0f1117);
  color: var(--text, #e8ecf4);
  border: 1px solid var(--border, #2e3648);
  border-radius: 8px;
}

input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(0.85) brightness(1.2);
  opacity: 0.9;
  cursor: pointer;
}

.vedomost-meta {
  font-size: .85rem;
}

.vedomost-wrap {
  max-height: calc(100vh - 12rem);
  overflow: auto;
}

.vedomost-table th,
.vedomost-table td {
  white-space: nowrap;
  font-size: .8rem;
  padding: .2rem .22rem;
  vertical-align: middle;
}

.vedomost-th--sticky,
.vedomost-td--sticky {
  position: sticky;
  left: 0;
  z-index: 3;
  background: var(--j-card, #1c2333);
  overflow: hidden;
  min-width: 11rem;
  max-width: 14rem;
}

.vedomost-cell-input,
.vedomost-cell-ro {
  display: block;
  width: 100%;
  min-width: 3.4rem;
  max-width: 9rem;
  box-sizing: border-box;
  padding: .18rem .28rem;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.03);
  color: inherit;
  font: inherit;
  font-variant-numeric: tabular-nums;
  line-height: 1.25;
}

.vedomost-td.num .vedomost-cell-input,
.vedomost-td.num .vedomost-cell-ro {
  text-align: center;
  min-width: 3.2rem;
  max-width: 6.5rem;
}

.vedomost-td--sticky .vedomost-cell-input,
.vedomost-td--sticky .vedomost-cell-ro {
  min-width: 0;
  max-width: 100%;
  text-align: left;
}

.vedomost-cell-input:focus {
  outline: none;
  border-color: var(--accent, #5b9cf5);
  box-shadow: inset 0 0 0 1px var(--accent, #5b9cf5);
  background: rgba(59, 130, 246, 0.08);
}

/* Подсветка только у «таблетки» input/span, не у всей td — иначе заливка сливается столой */
.vedomost-row--name-miss .vedomost-td--sticky .vedomost-cell-input,
.vedomost-row--name-miss .vedomost-td--sticky .vedomost-cell-ro,
.vedomost-cell--name-miss .vedomost-cell-input,
.vedomost-cell--name-miss .vedomost-cell-ro {
  box-shadow: inset 3px 0 0 #e67e22;
  background: rgba(230, 126, 34, 0.14) !important;
}

.vedomost-cell--days-match .vedomost-cell-input,
.vedomost-cell--days-match .vedomost-cell-ro {
  background: rgba(46, 160, 90, 0.2) !important;
  border-color: rgba(46, 160, 90, 0.55) !important;
}

.vedomost-cell--days-miss .vedomost-cell-input,
.vedomost-cell--days-miss .vedomost-cell-ro {
  background: rgba(220, 80, 80, 0.22) !important;
  border-color: rgba(220, 80, 80, 0.65) !important;
}

.vedomost-cell--bonus-match .vedomost-cell-input,
.vedomost-cell--bonus-match .vedomost-cell-ro {
  background: rgba(46, 160, 90, 0.26) !important;
  border-color: rgba(46, 160, 90, 0.65) !important;
}

.vedomost-cell--bonus-miss .vedomost-cell-input,
.vedomost-cell--bonus-miss .vedomost-cell-ro {
  background: rgba(220, 80, 80, 0.22) !important;
  border-color: rgba(220, 80, 80, 0.65) !important;
}

.vedomost-cell--vac-match .vedomost-cell-input,
.vedomost-cell--vac-match .vedomost-cell-ro {
  background: rgba(124, 92, 214, 0.24) !important;
  border-color: rgba(124, 92, 214, 0.6) !important;
}

.vedomost-cell--vac-miss .vedomost-cell-input,
.vedomost-cell--vac-miss .vedomost-cell-ro {
  background: rgba(230, 126, 34, 0.26) !important;
  border-color: rgba(230, 126, 34, 0.65) !important;
}

.vedomost-legend {
  display: inline-flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
}

.vedomost-legend-chip {
  display: inline-block;
  padding: .12rem .4rem;
  border-radius: .35rem;
  border: 1px solid transparent;
  font-size: .75rem;
}

.vedomost-legend-chip--days-ok {
  background: rgba(46, 160, 90, 0.18);
  border-color: rgba(46, 160, 90, 0.4);
}

.vedomost-legend-chip--days-bad {
  background: rgba(220, 80, 80, 0.18);
  border-color: rgba(220, 80, 80, 0.45);
}

.vedomost-legend-chip--bonus-ok {
  background: rgba(46, 160, 90, 0.22);
  border-color: rgba(46, 160, 90, 0.45);
}

.vedomost-legend-chip--bonus-bad {
  background: rgba(220, 80, 80, 0.18);
  border-color: rgba(220, 80, 80, 0.45);
}

.vedomost-legend-chip--vac-ok {
  background: rgba(124, 92, 214, 0.2);
  border-color: rgba(124, 92, 214, 0.45);
}

.vedomost-legend-chip--vac-bad {
  background: rgba(230, 126, 34, 0.22);
  border-color: rgba(230, 126, 34, 0.45);
}

.vedomost-note {
  margin: .25rem 0 .6rem;
  font-size: .85rem;
}

.vedomost-row-hidden {
  display: none;
}

.vedomost-missing {
  margin: .5rem 0;
  padding: .5rem .75rem;
  border-radius: .5rem;
  font-size: .85rem;
}

.vedomost-missing--from-ved {
  background: rgba(230, 126, 34, 0.15);
  border: 1px solid rgba(230, 126, 34, 0.35);
}

.vedomost-missing--from-co {
  background: rgba(59, 130, 246, 0.12);
  border: 1px solid rgba(59, 130, 246, 0.3);
}

.vedomost-missing-toggle {
  background: none;
  border: 0;
  color: inherit;
  cursor: pointer;
  font: inherit;
  padding: 0;
}

.vedomost-missing-list {
  margin: .4rem 0 0;
  padding-left: 1.1rem;
  columns: 2;
}

.vedomost-missing-list.is-collapsed {
  display: none;
}

.vedomost-charts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin: .75rem 0 1rem;
}

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

.vedomost-chart-card {
  padding: .75rem 1rem;
  border: 1px solid var(--border, #2e3648);
  border-radius: .6rem;
  background: rgba(255, 255, 255, 0.02);
}

.vedomost-chart-title {
  margin: 0 0 .5rem;
  font-size: .95rem;
}

.vedomost-chart-svg {
  width: 100%;
  height: auto;
  display: block;
}

.vedomost-chart-bar {
  fill: #3b82f6;
  opacity: .85;
}

.vedomost-chart-line {
  stroke: #3b82f6;
  stroke-width: 2.5;
}

.vedomost-chart-dot {
  fill: #60a5fa;
}

.vedomost-chart-label {
  fill: var(--muted, #8a93a6);
  font-size: 11px;
}

.vedomost-chart-val {
  fill: var(--text, #e8ecf4);
  font-size: 11px;
}

/* ── Журнал: тёмная тема, чуть светлее основной ── */
body.journal-active {
  background: #151a24;
}

#journal-view {
  --j-bg: #151a24;
  --j-card: #1c2333;
  --j-card-elevated: #222b3d;
  --j-border: #2e3648;
  --j-hover: #252e42;
  --j-text: #e8ecf4;
  --j-muted: #8b95a8;
  --j-taken-bg: rgba(255, 107, 122, 0.1);
  --j-taken-head: rgba(255, 107, 122, 0.18);
  --j-deposited-bg: rgba(95, 212, 154, 0.09);
  --j-deposited-head: rgba(95, 212, 154, 0.16);
  --j-auto-bg: rgba(110, 168, 254, 0.1);
  --j-accent: #6ea8fe;
  --j-mono: "SF Mono", "Menlo", "Consolas", monospace;
  background: var(--j-bg);
  display: flex;
  flex-direction: column;
  height: calc(100vh - 52px);
  max-height: calc(100vh - 52px);
  min-height: 0;
  overflow: hidden;
  padding-bottom: 0;
  color: var(--j-text);
}

#journal-view #journal-content {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

#journal-view > .journal-header,
#journal-view > .journal-balances,
#journal-view > .journal-pencil-panel,
#journal-view > .journal-auto-bar,
#journal-view > .journal-toolbar,
#journal-view > .journal-search-results {
  flex-shrink: 0;
}

#journal-view .muted { color: var(--j-muted); }

#journal-view button {
  width: auto;
  max-width: none;
  margin: 0;
  margin-top: 0;
  flex: 0 0 auto;
}

.journal-header {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .75rem 1rem;
  background: var(--j-card);
  border-bottom: 1px solid var(--j-border);
  position: sticky;
  top: 0;
  z-index: 20;
}

.journal-date-nav {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: .15rem;
  min-width: 0;
  flex: 1 1 auto;
}

.journal-arrow-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  padding: 0;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--j-muted);
  cursor: pointer;
  font-size: 1.15rem;
  line-height: 1;
  flex-shrink: 0;
}

/* Журнал / Табель / Розлив: стрелки навигации чуть крупнее — проще попасть */
#journal-view .journal-arrow-btn,
#timesheet-view .journal-arrow-btn,
#bottling-view .journal-arrow-btn {
  width: 2.4rem;
  height: 2.4rem;
  min-width: 2.4rem;
  min-height: 2.4rem;
  font-size: 1.55rem;
  border-radius: 8px;
}

.journal-arrow-btn:hover {
  background: var(--j-hover);
  border-color: var(--j-border);
  color: var(--j-text);
}

.journal-date-label {
  margin: 0;
  font-size: .95rem;
  font-weight: 600;
  padding: 0 .25rem;
  white-space: nowrap;
}

.journal-quick-dates {
  display: flex;
  align-items: center;
  gap: .3rem;
  margin-left: .25rem;
  flex-shrink: 0;
}

.journal-quick-date-btn {
  padding: .32rem .6rem;
  font-size: .75rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--j-muted);
  background: var(--j-bg);
  border: 1px solid var(--j-border);
  border-radius: 999px;
  cursor: pointer;
  white-space: nowrap;
  overflow: visible;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}

.journal-quick-date-btn:hover {
  background: var(--j-hover);
  color: var(--j-text);
  border-color: var(--j-muted);
}

.journal-quick-date-btn.active {
  background: rgba(110, 168, 254, 0.18);
  border-color: rgba(110, 168, 254, 0.55);
  color: #b9d4ff;
}

.journal-table--advances-month {
  table-layout: fixed;
  width: 100%;
}

.journal-table--advances-month .col-article { width: 34%; text-align: left; }
.journal-table--advances-month .col-dept-h,
.journal-table--advances-month .col-dept { width: 16%; }
.journal-table--advances-month .col-deposited-h,
.journal-table--advances-month .col-deposited { width: 14%; }
.journal-table--advances-month .col-dates-h,
.journal-table--advances-month .col-dates { width: 36%; }

.journal-table--advances-month td.col-article {
  text-align: left;
  font-weight: 600;
}

.journal-table--advances-month .col-dates {
  text-align: left;
  white-space: normal;
}

.advances-month-date {
  display: inline-flex;
  align-items: baseline;
  gap: .28rem;
  margin: .12rem .35rem .12rem 0;
  padding: .18rem .45rem;
  border-radius: 6px;
  background: color-mix(in srgb, var(--brand, #b28eff) 16%, transparent);
  border: 1px solid color-mix(in srgb, var(--brand, #b28eff) 28%, transparent);
  font-size: .84rem;
  font-weight: 600;
  white-space: nowrap;
}

.advances-month-date small {
  font-size: .75rem;
  font-weight: 500;
  color: var(--j-muted);
}

.journal-date-picker {
  position: relative;
  margin-left: .35rem;
  flex-shrink: 0;
}

.journal-calendar-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.85rem;
  height: 1.85rem;
  padding: 0;
  background: var(--j-bg);
  border: 1px solid var(--j-border);
  border-radius: 6px;
  color: var(--j-muted);
  cursor: pointer;
}

.journal-calendar-btn:hover {
  background: var(--j-hover);
  color: var(--j-text);
  border-color: var(--j-muted);
}

.journal-date-popup {
  position: absolute;
  top: calc(100% + .35rem);
  right: 0;
  z-index: 60;
  width: min(17.5rem, 92vw);
  padding: .65rem;
  background: var(--j-card-elevated);
  border: 1px solid var(--j-border);
  border-radius: 10px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .45);
}

.journal-cal-header {
  display: flex;
  align-items: center;
  gap: .35rem;
  margin-bottom: .5rem;
}

.journal-cal-title {
  flex: 1;
  text-align: center;
  font-weight: 600;
  font-size: .82rem;
  color: var(--j-text);
  text-transform: capitalize;
}

.journal-cal-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.65rem;
  height: 1.65rem;
  padding: 0;
  background: var(--j-bg);
  border: 1px solid var(--j-border);
  border-radius: 6px;
  color: var(--j-muted);
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
}

.journal-cal-nav:hover {
  background: var(--j-hover);
  color: var(--j-text);
}

.journal-cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: .25rem;
}

.journal-cal-head {
  text-align: center;
  font-size: .68rem;
  color: var(--j-muted);
  padding: .15rem 0;
}

.journal-cal-day {
  margin: 0;
  width: 100%;
  aspect-ratio: 1;
  padding: 0;
  background: var(--j-bg);
  border: 1px solid var(--j-border);
  border-radius: 6px;
  color: var(--j-text);
  font-size: .76rem;
  font-weight: 600;
  cursor: pointer;
}

.journal-cal-day:hover {
  background: var(--j-hover);
}

.journal-cal-day.other {
  opacity: .35;
}

.journal-cal-day.today {
  border-color: var(--j-accent);
}

.journal-cal-day.selected {
  background: var(--j-accent);
  border-color: var(--j-accent);
  color: #fff;
}

.journal-cal-footer {
  display: flex;
  justify-content: center;
  margin-top: .5rem;
  padding-top: .45rem;
  border-top: 1px solid var(--j-border);
}

.journal-cal-today {
  background: transparent;
  border: none;
  color: var(--j-accent);
  cursor: pointer;
  font-size: .8rem;
  font-weight: 600;
  padding: .2rem .5rem;
}

.journal-cal-today:hover {
  text-decoration: underline;
}

.journal-auto-bar {
  padding: 0 .75rem .75rem;
  background: var(--j-bg);
  border-bottom: 1px solid var(--j-border);
}

.journal-auto-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .55rem;
}

.journal-auto-card {
  background: var(--j-auto-bg);
  border: 1px solid var(--j-border);
  border-radius: 10px;
  padding: .55rem .65rem;
  display: flex;
  flex-direction: column;
  gap: .35rem;
  min-width: 0;
}

.journal-auto-card-head {
  display: flex;
  align-items: center;
  gap: .35rem;
  flex-wrap: wrap;
}

.journal-auto-name {
  font-size: .82rem;
  font-weight: 600;
  line-height: 1.25;
}

.journal-auto-values {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem .75rem;
  font-size: .75rem;
  color: var(--j-muted);
}

.journal-auto-val strong {
  font-family: var(--j-mono);
  font-size: .85rem;
}

.journal-auto-comment {
  margin: 0;
  font-size: .72rem;
  line-height: 1.3;
}

.journal-auto-link {
  align-self: flex-start;
  margin-top: .1rem;
  padding: 0;
  background: none;
  border: none;
  color: var(--j-accent);
  font-size: .72rem;
  cursor: pointer;
}

.journal-auto-link:hover {
  text-decoration: underline;
}

.journal-subtabs {
  display: flex;
  gap: .35rem;
  flex-shrink: 0;
  padding: .2rem;
  background: var(--j-bg);
  border: 1px solid var(--j-border);
  border-radius: 10px;
}

.journal-subtab {
  background: transparent;
  border: 1px solid transparent;
  color: var(--j-muted);
  padding: .42rem .9rem;
  border-radius: 8px;
  cursor: pointer;
  font-size: .86rem;
  font-weight: 600;
  line-height: 1.35;
  overflow: visible;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}

.journal-subtab:hover {
  background: var(--j-hover);
  color: var(--j-text);
}

.journal-subtab.active {
  background: var(--j-accent);
  border-color: var(--j-accent);
  color: #fff;
  box-shadow: 0 2px 8px rgba(110, 168, 254, 0.35);
}

.journal-subtab.hidden {
  display: none;
}

.journal-balances {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: .55rem;
  padding: .7rem 1rem;
  background: linear-gradient(180deg, rgba(28, 35, 51, 0.65) 0%, var(--j-bg) 100%);
  border-bottom: 1px solid var(--j-border);
}

.journal-balance-card {
  background: var(--j-card);
  border: 1px solid var(--j-border);
  border-radius: 10px;
  padding: .55rem .7rem;
  display: flex;
  flex-direction: column;
  gap: .15rem;
  min-width: 0;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03) inset;
}

.journal-balance-label {
  font-size: .72rem;
  color: var(--j-muted);
  text-transform: uppercase;
  letter-spacing: .03em;
}

.journal-lbl-short { display: none; }

.journal-balance-card--closing {
  border-color: rgba(95, 212, 154, 0.45);
  background: rgba(95, 212, 154, 0.08);
}

.journal-balance-card--pencil {
  border-color: rgba(240, 198, 116, 0.45);
  background: rgba(240, 198, 116, 0.08);
  cursor: pointer;
  text-align: left;
  font: inherit;
  width: 100%;
}

.journal-balance-card--pencil:hover {
  background: rgba(240, 198, 116, 0.14);
  border-color: rgba(240, 198, 116, 0.6);
}

.journal-num--pencil {
  color: #f0c674;
}

.journal-pencil-panel {
  display: none;
  margin: 0 1rem .65rem;
  padding: .65rem .75rem;
  background: var(--j-card);
  border: 1px solid rgba(240, 198, 116, 0.35);
  border-radius: 10px;
}

.journal-pencil-panel--open {
  display: block;
}

.journal-pencil-panel__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .5rem;
  margin-bottom: .5rem;
}

.journal-pencil-hint {
  display: block;
  font-size: .72rem;
  margin-top: .15rem;
}

.journal-pencil-close {
  background: none;
  border: none;
  color: var(--j-muted);
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  padding: 0 .25rem;
}

.journal-pencil-list {
  list-style: none;
  margin: 0 0 .5rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .4rem;
}

.journal-pencil-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  padding: .45rem .55rem;
  background: var(--j-bg);
  border: 1px solid var(--j-border);
  border-radius: 8px;
}

.journal-pencil-item-main {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .65rem;
  min-width: 0;
}

.journal-pencil-who {
  font-size: .82rem;
  color: var(--j-text);
}

.journal-pencil-date {
  font-size: .78rem;
  color: var(--j-muted);
}

.journal-pencil-del {
  flex-shrink: 0;
  padding: .3rem .5rem;
  font-size: .72rem;
  background: transparent;
  border: 1px solid rgba(255, 107, 122, 0.4);
  color: #ff8a96;
  border-radius: 6px;
  cursor: pointer;
}

.journal-pencil-add {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
}

.journal-pencil-add .journal-pencil-comment {
  grid-column: span 2;
}

.journal-pencil-add button[type="submit"] {
  grid-column: span 2;
  justify-self: start;
}

.journal-pencil-empty {
  margin: 0 0 .5rem;
  font-size: .82rem;
}

.journal-mobile-colheaders {
  display: none;
}

#journal-view .journal-table thead th {
  position: sticky;
  top: 0;
  z-index: 8;
  box-shadow: 0 2px 0 var(--j-border);
}

#journal-view.journal-subtab-main .journal-table-wrap {
  overflow: visible;
}

/* Десктоп: таблица с липкой шапкой внутри прокрутки #journal-content */
@media (min-width: 1201px) {
  #journal-view .journal-table--mobile-cards thead {
    display: table-header-group;
  }
}

.journal-balance-card--closing strong { color: #5fd49a; }

.journal-num {
  font-family: var(--j-mono);
  font-variant-numeric: tabular-nums;
  font-size: 1.05rem;
  font-weight: 700;
}

.journal-num--taken { color: #ff8a96; }
.journal-num--deposited { color: #5fd49a; }
.journal-num--closing { font-size: 1.15rem; }

#journal-view.journal-subtab-couriers .journal-toolbar,
#journal-view.journal-subtab-pickup .journal-toolbar {
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
}

.journal-toolbar {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: .6rem;
  padding: .6rem 1rem;
  background: var(--j-bg);
}

.journal-toolbar .journal-search-input {
  flex: 1 1 auto;
  min-width: 0;
  max-width: none;
  width: auto;
  margin-top: 0;
  background: var(--j-card);
  border: 1px solid var(--j-border);
  color: var(--j-text);
  border-radius: 8px;
  padding: .55rem .75rem;
  font-size: .95rem;
  -webkit-appearance: none;
  appearance: none;
}

.journal-toolbar-btn {
  flex: 0 0 auto;
  background: var(--j-card);
  border: 1px solid var(--j-border);
  color: var(--j-text);
  border-radius: 8px;
  padding: .55rem .85rem;
  font-size: .88rem;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  line-height: 1.2;
}

.journal-toolbar-btn:hover {
  background: var(--j-hover);
  border-color: var(--j-accent);
}

.formula-input {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
}

.journal-search-results {
  margin: 0 1rem .65rem;
  display: flex;
  flex-direction: column;
  gap: .4rem;
  max-height: min(50vh, 22rem);
  overflow-y: auto;
}

#journal-view .search-hit {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  width: 100%;
  background: var(--j-card);
  border: 1px solid var(--j-border);
  border-radius: 10px;
  padding: .55rem .7rem;
  cursor: pointer;
  color: var(--j-text);
  text-align: left;
  transition: border-color .15s ease, background .15s ease;
}

#journal-view .search-hit:hover {
  background: var(--j-hover);
  border-color: rgba(110, 168, 254, 0.45);
}

.search-hit-line {
  display: flex;
  align-items: flex-start;
  gap: .4rem;
  font-size: .82rem;
  line-height: 1.35;
}

.search-hit-title {
  font-weight: 600;
  font-size: .88rem;
}

.search-hit-icon {
  flex-shrink: 0;
  width: 1.1rem;
  text-align: center;
  opacity: .9;
}

.search-mark {
  background: rgba(240, 198, 116, 0.35);
  color: #fff7e6;
  border-radius: 3px;
  padding: 0 .1rem;
}

.search-empty {
  margin: 0;
  padding: .5rem .15rem;
  font-size: .85rem;
}

.journal-table-wrap {
  padding: 0 1rem 1rem;
  overflow-x: auto;
}

.journal-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: .9rem;
  table-layout: fixed;
  background: var(--j-card);
  border: 1px solid var(--j-border);
  border-radius: var(--ui-card-radius);
  overflow: hidden;
}

.journal-table .col-article { width: 36%; }
.journal-table .col-taken-h,
.journal-table .col-taken { width: 15%; }
.journal-table .col-deposited-h,
.journal-table .col-deposited { width: 15%; }
.journal-table .col-comment-h,
.journal-table .col-comment { width: 34%; }

.journal-table--couriers .col-article { width: 42%; }
.journal-table--couriers .col-deposited-h,
.journal-table--couriers .col-deposited { width: 20%; }
.journal-table--couriers .col-comment-h,
.journal-table--couriers .col-comment { width: 38%; }
.journal-table--advances .col-article { width: 32%; }
.journal-table--advances .col-dept-h,
.journal-table--advances .col-dept { width: 18%; }
.journal-table--advances .col-deposited-h,
.journal-table--advances .col-deposited { width: 16%; }
.journal-table--advances .col-comment-h,
.journal-table--advances .col-comment { width: 34%; }

.journal-table thead th {
  background: var(--j-card-elevated);
  border-bottom: 2px solid var(--j-border);
  padding: .52rem .62rem;
  text-align: left;
  font-size: .76rem;
  font-weight: 700;
  text-transform: none;
  letter-spacing: .02em;
  color: var(--j-muted);
  white-space: nowrap;
}

.journal-table thead th.num { text-align: right; }

.journal-table td {
  border-bottom: 1px solid var(--j-border);
  padding: .45rem .6rem;
  vertical-align: middle;
}

.journal-table tbody tr:hover td {
  background: color-mix(in srgb, var(--j-hover) 58%, transparent);
}

.journal-table tbody tr:last-child td { border-bottom: none; }

.journal-table .col-taken { background: var(--j-taken-bg); }
.journal-table .col-deposited { background: var(--j-deposited-bg); }
.journal-table thead .col-taken-h { background: var(--j-taken-head); color: #ff8a96; }
.journal-table thead .col-deposited-h { background: var(--j-deposited-head); color: #5fd49a; }

.journal-row-auto td { background: var(--j-auto-bg) !important; }
.journal-row-auto .col-article {
  border-left: 3px solid rgba(110, 168, 254, 0.55);
}
.journal-row-auto .col-taken { background: rgba(110, 168, 254, 0.08) !important; }
.journal-row-auto .col-deposited { background: rgba(110, 168, 254, 0.12) !important; }

.journal-auto-badge {
  display: none;
}

.journal-lock-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: .35rem;
  font-size: .82rem;
  line-height: 1;
  opacity: .75;
  cursor: help;
  vertical-align: middle;
  flex-shrink: 0;
}

.journal-auto-card-head .journal-lock-icon {
  margin-left: auto;
}

.journal-group-toggle {
  scroll-margin-top: 4.5rem;
}

.journal-group-toggle td {
  background: var(--j-card-elevated) !important;
  padding: 0 !important;
  border-bottom: 1px solid var(--j-border);
}

.journal-group-btn {
  display: flex;
  align-items: center;
  gap: .4rem;
  width: 100%;
  padding: .55rem .75rem;
  background: none;
  border: none;
  cursor: pointer;
  font-weight: 700;
  font-size: .9rem;
  color: var(--j-text);
  text-align: left;
}

.journal-group-chevron { color: var(--j-muted); font-size: .8rem; }
.journal-group-count { font-weight: 400; font-size: .78rem; margin-left: auto; }

.journal-group-pin {
  color: #5fd49a;
  font-size: .55rem;
  vertical-align: middle;
  margin-left: .25rem;
}

.journal-group-has-data .journal-group-count {
  color: #5fd49a;
}

.journal-group-add-row td {
  padding: .35rem .75rem .55rem !important;
  background: var(--j-bg) !important;
  border-bottom: 1px solid var(--j-border);
}

.journal-add-row-btn {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .35rem .65rem;
  background: var(--j-card);
  border: 1px dashed var(--j-border);
  border-radius: 8px;
  color: var(--j-text);
  cursor: pointer;
  font-size: .82rem;
  font-weight: 600;
}

.journal-add-row-btn:hover {
  background: var(--j-hover);
  border-color: var(--j-accent);
  color: var(--j-accent);
}

.journal-add-row-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.1rem;
  height: 1.1rem;
  border-radius: 4px;
  background: rgba(110, 168, 254, 0.15);
  color: var(--j-accent);
  font-size: .95rem;
  line-height: 1;
  font-weight: 700;
}

.journal-add-row-hint {
  font-size: .75rem;
  font-weight: 500;
}

.journal-row-pinned td {
  border-left: 2px solid rgba(95, 212, 154, 0.45);
}

.journal-row-pinned .col-article {
  padding-left: 1.25rem;
}

.journal-row-in-group .col-article { padding-left: 1.5rem; }

.journal-entry-row td {
  vertical-align: middle;
}

.journal-row-exchange .col-taken,
.journal-row-exchange .col-deposited,
.journal-row-exchange .col-comment {
  vertical-align: middle;
}

.journal-exchange-fields {
  display: flex;
  align-items: center;
  gap: .45rem;
  min-height: 2rem;
}

.journal-exchange-fields .exchange-rate {
  width: 4.25rem;
  flex-shrink: 0;
  text-align: center;
}

.journal-exchange-fields .exchange-amount {
  flex: 1;
  min-width: 5.5rem;
}

.journal-exchange-taken {
  display: inline-block;
  min-height: 2rem;
  line-height: 2rem;
  font-family: var(--j-mono);
  font-weight: 700;
}

.journal-input {
  width: 100%;
  min-width: 0;
  background: #0f1522;
  border: 1px solid var(--j-border);
  color: var(--j-text);
  border-radius: var(--ui-field-radius);
  min-height: 1.95rem;
  padding: .38rem .52rem;
  font-size: .9rem;
}

.journal-input.num {
  font-family: var(--j-mono);
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.journal-readonly {
  display: block;
  min-height: 1.95rem;
  padding: .35rem .52rem;
  border: 1px solid rgba(110, 168, 254, 0.24);
  border-radius: var(--ui-field-radius);
  background: #0f1522;
  font-size: .9rem;
  word-break: break-word;
}

.journal-readonly.num {
  font-family: var(--j-mono);
  text-align: right;
  color: var(--j-text);
}

.journal-empty-hint {
  margin: .5rem 1rem;
  padding: .65rem .85rem;
  background: rgba(240, 198, 116, 0.1);
  border: 1px solid rgba(240, 198, 116, 0.35);
  border-radius: 8px;
  color: #f0c674;
  font-size: .9rem;
}

.journal-empty-hint--error {
  background: rgba(220, 70, 55, 0.14);
  border: 1px solid rgba(220, 70, 55, 0.55);
  color: #c0392b;
  font-weight: 650;
}

html.theme-light .journal-empty-hint--error,
body.theme-light .journal-empty-hint--error {
  background: rgba(230, 90, 40, 0.16);
  border-color: rgba(210, 80, 30, 0.65);
  color: #b33a12;
}

.journal-couriers-toolbar {
  margin: .75rem 1rem 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .75rem;
}

.journal-filter-hint {
  font-size: .82rem;
  line-height: 1.3;
}

.journal-filter-toggle {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-size: .9rem;
  color: var(--j-muted, #94a3b8);
  cursor: pointer;
  user-select: none;
}

.journal-filter-toggle input {
  cursor: pointer;
}

.journal-couriers-total {
  margin: .75rem 1rem .5rem;
  padding: .65rem .85rem;
  background: var(--j-card);
  border: 1px solid var(--j-border);
  border-radius: 10px;
  display: flex;
  align-items: baseline;
  gap: .5rem;
  position: sticky;
  top: 60px;
  z-index: 10;
}

.journal-couriers-total strong { font-size: 1.2rem; }

.courier-amount-cell {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: .35rem;
}

.courier-verify-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  justify-content: flex-end;
}

.courier-verify-chip {
  border: 1px solid var(--j-border, #334155);
  background: var(--j-card, #1e293b);
  color: var(--j-text, #e2e8f0);
  border-radius: 999px;
  padding: .15rem .55rem;
  font-size: .78rem;
  font-weight: 600;
  cursor: pointer;
  line-height: 1.3;
}

.courier-verify-chip--checked {
  background: #14532d;
  border-color: #166534;
  color: #dcfce7;
}

.courier-verify-chip--readonly {
  cursor: default;
  opacity: .95;
}

.courier-verify-chip--readonly:not(.courier-verify-chip--checked) {
  opacity: .7;
}

.journal-table--couriers tr.courier-row--verified td {
  background: rgba(22, 101, 52, .18);
}

.journal-table--couriers tr.courier-row--partial td {
  background: rgba(161, 98, 7, .16);
}

.journal-couriers-manage {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  align-items: center;
  padding: 0 1rem .75rem;
}

.courier-new-name {
  flex: 1;
  min-width: 12rem;
  max-width: 24rem;
}

.journal-courier-add-btn {
  background: var(--j-card);
  border: 1px solid var(--j-border);
  color: var(--j-text);
  border-radius: 8px;
  padding: .55rem .85rem;
  font-size: .88rem;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}

.journal-courier-add-btn:hover {
  background: var(--j-hover);
  border-color: var(--j-accent);
}

.courier-name-input {
  width: 100%;
  font-weight: 600;
}

.pickup-report-row {
  display: flex;
  align-items: stretch;
  gap: .75rem;
  margin: 0 1rem .75rem;
}

.pickup-cash-total-card {
  flex: 0 0 min(16rem, 34vw);
  margin: 0;
  padding: .85rem 1rem;
  background: linear-gradient(145deg, rgba(95, 212, 154, 0.14), rgba(28, 35, 51, 0.95));
  border: 1px solid rgba(95, 212, 154, 0.4);
  border-radius: 12px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
  display: flex;
  flex-direction: column;
  gap: .35rem;
  justify-content: center;
}

.pickup-cash-total-label {
  margin: 0;
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--j-muted);
}

.pickup-cash-total-amount {
  font-size: 1.65rem;
  line-height: 1.1;
  color: #8ec5ff;
}

.pickup-cash-total-formula {
  margin: 0;
  font-size: .9rem;
  font-weight: 600;
  color: var(--j-text);
}

.pickup-cash-total-hint {
  margin: 0;
  font-size: .72rem;
  line-height: 1.35;
}

.pickup-cash-total-carry {
  margin: 0;
  font-size: .78rem;
  line-height: 1.35;
}

.pickup-cash-total-carry strong {
  color: #8ec5ff;
}

.pickup-handover-btn {
  margin-top: .25rem;
  align-self: flex-start;
  padding: .32rem .65rem;
  font-size: .74rem;
  font-weight: 600;
  line-height: 1.2;
  color: #ffe8b8;
  background: rgba(255, 193, 77, 0.12);
  border: 1px solid rgba(255, 193, 77, 0.45);
  border-radius: 8px;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease;
}

.pickup-handover-btn:hover {
  background: rgba(255, 193, 77, 0.22);
  border-color: rgba(255, 193, 77, 0.65);
}

.pickup-handover-done {
  margin: .15rem 0 0;
  font-size: .76rem;
  font-weight: 600;
  color: #8fd4a0;
}

.pickup-after18-pending {
  margin: .75rem 1rem 0;
  padding: .75rem 1rem;
  background: rgba(255, 193, 77, 0.08);
  border: 1px solid rgba(255, 193, 77, 0.35);
  border-radius: 10px;
}

.pickup-after18-receive {
  margin: 0 0 .75rem;
  padding: .75rem .85rem;
  background: rgba(255, 193, 77, 0.1);
  border: 1px solid rgba(255, 193, 77, 0.4);
  border-radius: 10px;
}

.pickup-after18-receive--done {
  background: rgba(95, 212, 154, 0.08);
  border-color: rgba(95, 212, 154, 0.35);
}

.pickup-after18-receive-label {
  margin: 0 0 .35rem;
  font-size: .88rem;
  font-weight: 600;
}

.pickup-after18-receive-amounts {
  margin: 0 0 .55rem;
  font-size: .92rem;
}

.pickup-handover-btn--after18 {
  margin-top: .5rem;
}

.pickup-warn--ok {
  color: #8fd4a0;
  border-color: rgba(95, 212, 154, 0.35);
  background: rgba(95, 212, 154, 0.08);
}

.pickup-report-main {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
}

.pickup-section {
  margin: 0 1rem .75rem;
  padding: .85rem 1rem;
  background: var(--j-card);
  border: 1px solid var(--j-border);
  border-radius: 10px;
}

.pickup-grid--returns {
  grid-template-columns: minmax(8rem, 12rem) 1fr;
}

.pickup-returns h3 {
  color: #f0b86c;
}

.pickup-section h3 {
  margin: 0 0 .65rem;
  font-size: .95rem;
  font-weight: 700;
}

.pickup-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  gap: .6rem;
}

.pickup-field {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  font-size: .8rem;
  color: var(--j-muted);
  font-weight: 600;
}

.pickup-field input,
.pickup-field .journal-readonly {
  margin-top: 0;
}

.pickup-preview {
  margin-top: .75rem;
  padding: .65rem .75rem;
  background: var(--j-deposited-bg);
  border: 1px solid rgba(95, 212, 154, 0.3);
  border-radius: 8px;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .4rem .6rem;
}

.pickup-preview-label { font-size: .85rem; color: var(--j-muted); }
.pickup-preview-formula { font-size: .78rem; width: 100%; }

.pickup-after18 {
  border-color: rgba(240, 198, 116, 0.5);
  background: rgba(240, 198, 116, 0.07);
}

.pickup-warn {
  color: #f0c674;
  font-size: .85rem;
  margin: 0 0 .6rem;
}

.journal-save-row {
  padding: 0 1rem 1rem;
}

.journal-save-btn {
  background: var(--j-accent);
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: .6rem 1.2rem;
  font-size: .95rem;
  font-weight: 600;
  cursor: pointer;
}

.journal-toast {
  position: fixed;
  bottom: 1.25rem;
  left: 50%;
  transform: translateX(-50%);
  padding: .65rem 1.1rem;
  border-radius: 10px;
  font-size: .92rem;
  font-weight: 600;
  z-index: 100;
  box-shadow: 0 8px 24px rgba(0,0,0,.15);
  max-width: 90vw;
}

.journal-toast--success {
  background: #15803d;
  color: #fff;
}

.journal-toast--error {
  background: #b91c1c;
  color: #fff;
}

.journal-toast--pending {
  background: #334155;
  color: #e2e8f0;
}

@media (max-width: 1200px) {
  #journal-view .journal-lbl-full { display: none; }
  #journal-view .journal-lbl-short { display: inline; }

  #journal-view .journal-table-wrap {
    padding: 0 .65rem .75rem;
    overflow-x: visible;
  }

  #journal-view .journal-toolbar {
    padding: .4rem .65rem;
    gap: .4rem;
  }

  #journal-view .journal-toolbar .journal-search-input {
    min-width: 0;
    font-size: 16px;
  }

  #journal-view .journal-toolbar .journal-toolbar-btn {
    padding: .4rem .55rem;
    font-size: .75rem;
    white-space: nowrap;
  }

  #journal-view .journal-auto-bar {
    padding: 0 .65rem .5rem;
  }

  #journal-view .journal-auto-grid {
    display: flex;
    gap: .4rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding-bottom: .1rem;
  }

  #journal-view .journal-auto-card {
    flex: 0 0 min(72vw, 16rem);
    scroll-snap-align: start;
    padding: .4rem .5rem;
    gap: .25rem;
  }

  #journal-view .journal-auto-name {
    font-size: .75rem;
  }

  #journal-view .journal-lock-icon {
    font-size: .72rem;
  }

  #journal-view .journal-auto-values {
    font-size: .68rem;
    gap: .35rem .5rem;
  }

  #journal-view .journal-auto-val strong {
    font-size: .78rem;
  }

  #journal-view .journal-auto-link {
    font-size: .66rem;
  }

  #journal-view .journal-balances {
    display: flex;
    gap: .35rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding: .4rem .65rem;
  }

  #journal-view .journal-balance-card {
    flex: 0 0 min(30vw, 8.5rem);
    scroll-snap-align: start;
    padding: .35rem .45rem;
    gap: .1rem;
  }

  #journal-view .journal-balance-label {
    font-size: .56rem;
    letter-spacing: .02em;
    line-height: 1.2;
  }

  #journal-view .journal-num {
    font-size: .82rem;
  }

  #journal-view .journal-num--closing {
    font-size: .88rem;
  }

  #journal-view .journal-balance-card--closing,
  #journal-view .journal-balance-card--diff {
    grid-column: unset;
  }

  #journal-view .journal-header {
    flex-direction: column;
    align-items: stretch;
    gap: .3rem;
    padding: .35rem .5rem;
  }

  #journal-view .journal-date-nav {
    flex: 0 0 auto;
    width: 100%;
    justify-content: center;
    flex-wrap: wrap;
    min-width: 0;
    row-gap: .25rem;
    column-gap: .3rem;
  }

  #journal-view .journal-quick-dates {
    flex: 0 0 auto;
    justify-content: center;
    margin-left: 0;
    order: unset;
  }

  #journal-view .journal-subtabs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .25rem;
    flex: 0 0 auto;
    width: 100%;
    padding: .15rem;
  }

  #journal-view .journal-subtab {
    flex: unset;
    padding: .32rem .2rem;
    font-size: .74rem;
    text-align: center;
  }

  #journal-view .journal-date-label {
    font-size: .78rem;
    white-space: nowrap;
    text-align: center;
    max-width: none;
    margin: 0;
    font-weight: 600;
  }

  #journal-view .journal-arrow-btn {
    display: none;
  }

  #journal-view .journal-date-popup {
    position: fixed;
    left: 50%;
    top: 50%;
    right: auto;
    transform: translate(-50%, -50%);
    width: min(17.5rem, calc(100vw - 1.5rem));
    max-height: calc(100vh - 2rem);
    overflow-y: auto;
    z-index: 200;
  }

  #journal-view .journal-calendar-btn {
    width: 1.65rem;
    height: 1.65rem;
  }

  /* Сброс таблицы — иначе колонки 15% режут поля */
  #journal-view .journal-table--mobile-cards {
    display: block;
    width: 100%;
    border: none;
    background: transparent;
    table-layout: auto;
    font-size: .88rem;
  }

  #journal-view .journal-table--mobile-cards thead {
    display: none;
  }

  #journal-view .journal-table--mobile-cards tbody {
    display: block;
  }

  #journal-view .journal-table--mobile-cards tbody tr.journal-entry-row,
  #journal-view .journal-table--mobile-cards tbody tr.journal-row-exchange {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      "article article"
      "taken deposited"
      "comment comment";
    width: 100%;
    margin: 0 0 .4rem;
    border: 1px solid var(--j-border);
    border-radius: 10px;
    overflow: hidden;
    background: var(--j-card);
  }

  #journal-view .journal-table--mobile-cards tbody tr.journal-group-toggle,
  #journal-view .journal-table--mobile-cards tbody tr.journal-group-add-row {
    display: block;
    width: 100%;
    margin: 0 0 .4rem;
    border: 1px solid var(--j-border);
    border-radius: 10px;
    overflow: hidden;
    background: var(--j-card);
  }

  #journal-view .journal-table--mobile-cards tbody td {
    display: block;
    width: 100% !important;
    max-width: none;
    box-sizing: border-box;
    padding: .4rem .5rem;
    border-bottom: 1px solid var(--j-border);
    min-width: 0;
  }

  #journal-view .journal-table--mobile-cards tbody tr td:last-child {
    border-bottom: none;
  }

  #journal-view .journal-table--mobile-cards tbody td::before {
    content: attr(data-label);
    display: block;
    font-size: .62rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--j-muted);
    margin-bottom: .2rem;
  }

  #journal-view .journal-table--mobile-cards tbody td[data-label=""]::before,
  #journal-view .journal-table--mobile-cards tbody td:not([data-label])::before {
    display: none;
  }

  #journal-view .journal-table--mobile-cards .col-article {
    grid-area: article;
    font-weight: 600;
    font-size: .88rem;
    line-height: 1.3;
    background: var(--j-card-elevated) !important;
    border-bottom: 1px solid var(--j-border);
    word-break: break-word;
  }

  #journal-view .journal-table--mobile-cards .col-taken {
    grid-area: taken;
    background: var(--j-taken-bg) !important;
    border-right: 1px solid var(--j-border);
  }

  #journal-view .journal-table--mobile-cards .col-deposited {
    grid-area: deposited;
    background: var(--j-deposited-bg) !important;
  }

  #journal-view .journal-table--mobile-cards .col-comment {
    grid-area: comment;
    background: var(--j-card) !important;
  }

  #journal-view .journal-table--mobile-cards .col-taken::before {
    color: #ff8a96;
  }

  #journal-view .journal-table--mobile-cards .col-deposited::before {
    color: #5fd49a;
  }

  #journal-view .journal-table--mobile-cards .journal-input,
  #journal-view .journal-table--mobile-cards .journal-readonly {
    display: block;
    width: 100%;
    min-height: 2.35rem;
    padding: .4rem .5rem;
    font-size: 16px;
    border-radius: 8px;
    box-sizing: border-box;
  }

  #journal-view .journal-table--mobile-cards .col-taken .journal-input,
  #journal-view .journal-table--mobile-cards .col-taken .journal-readonly {
    text-align: right;
    background: rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(255, 107, 122, 0.25);
  }

  #journal-view .journal-table--mobile-cards .col-deposited .journal-input,
  #journal-view .journal-table--mobile-cards .col-deposited .journal-readonly {
    text-align: right;
    background: rgba(0, 0, 0, 0.12);
    border: 1px solid rgba(95, 212, 154, 0.25);
  }

  #journal-view .journal-table--mobile-cards .col-comment .journal-input,
  #journal-view .journal-table--mobile-cards .col-comment .journal-readonly {
    text-align: left;
    min-height: 2.2rem;
    background: var(--j-bg);
    border: 1px solid var(--j-border);
  }

  #journal-view .journal-table--mobile-cards .journal-row-auto .col-article {
    background: rgba(110, 168, 254, 0.12) !important;
  }

  #journal-view .journal-table--couriers tbody tr[data-courier-id] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      "article article"
      "deposited comment";
    width: 100%;
    margin: 0 0 .4rem;
    border: 1px solid var(--j-border);
    border-radius: 10px;
    overflow: hidden;
    background: var(--j-card);
  }

  #journal-view .journal-table--couriers tbody tr[data-courier-id] .col-deposited {
    grid-area: deposited;
    border-right: 1px solid var(--j-border);
  }

  #journal-view .journal-table--couriers .col-comment {
    grid-area: comment;
  }

  #journal-view .journal-table--mobile-cards tbody tr[data-payment-id] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      "article article"
      "deposited comment";
    width: 100%;
    margin: 0 0 .4rem;
    border: 1px solid var(--j-border);
    border-radius: 10px;
    overflow: hidden;
    background: var(--j-card);
  }

  #journal-view .journal-table--mobile-cards tbody tr[data-payment-id] .col-article {
    grid-area: article;
    background: var(--j-card-elevated) !important;
  }

  #journal-view .journal-table--mobile-cards tbody tr[data-payment-id] .col-deposited {
    grid-area: deposited;
    border-right: 1px solid var(--j-border);
    background: var(--j-deposited-bg) !important;
  }

  #journal-view .journal-table--mobile-cards tbody tr[data-payment-id] .col-comment {
    grid-area: comment;
  }

  #journal-view .pickup-report-row {
    flex-direction: column;
    margin: 0 .65rem .5rem;
  }

  #journal-view .pickup-section {
    margin: 0 .65rem .5rem;
  }

  #journal-view .pickup-cash-total-card {
    width: 100%;
  }

  #journal-view .pickup-grid {
    grid-template-columns: 1fr 1fr;
  }

  #journal-view .pickup-grid--returns {
    grid-template-columns: 1fr;
  }

  #journal-view {
    padding-bottom: 0;
    min-height: 0;
  }

  /* Телефон альбомно: липкая полоска «Взято / Вложено» над карточками */
  @media (max-width: 1200px) and (orientation: landscape) {
    #journal-view.journal-subtab-main .journal-mobile-colheaders {
      display: grid;
      grid-template-columns: 1fr 1fr 1.2fr;
      gap: .25rem;
      position: sticky;
      top: 0;
      z-index: 8;
      margin: 0 0 .35rem;
      padding: .4rem .5rem;
      background: var(--j-card-elevated);
      border: 1px solid var(--j-border);
      border-radius: 8px;
      font-size: .65rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .03em;
      color: var(--j-muted);
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
    }

    #journal-view .journal-mobile-colheaders__taken {
      color: #ff8a96;
      text-align: right;
    }

    #journal-view .journal-mobile-colheaders__deposited {
      color: #5fd49a;
      text-align: right;
    }
  }

  #journal-view .journal-pencil-add {
    grid-template-columns: 1fr;
  }

  #journal-view .journal-pencil-add .journal-pencil-comment,
  #journal-view .journal-pencil-add button[type="submit"] {
    grid-column: span 1;
  }

  #journal-view .journal-table--couriers tbody tr[data-courier-id] td:first-child {
    grid-area: article;
    font-weight: 600;
    background: var(--j-card-elevated) !important;
    border-bottom: 1px solid var(--j-border);
  }
}

/* Телефон вертикально — поля на всю ширину */
@media (max-width: 1200px) and (orientation: portrait) {
  #journal-view .journal-table--mobile-cards tbody tr.journal-entry-row,
  #journal-view .journal-table--mobile-cards tbody tr.journal-row-exchange {
    grid-template-columns: 1fr;
    grid-template-areas:
      "article"
      "taken"
      "deposited"
      "comment";
  }

  #journal-view .journal-table--mobile-cards .col-taken {
    border-right: none;
  }

  #journal-view .journal-table--couriers tbody tr[data-courier-id],
  #journal-view .journal-table--mobile-cards tbody tr[data-payment-id] {
    grid-template-columns: 1fr;
    grid-template-areas:
      "article"
      "deposited"
      "comment";
  }

  #journal-view .journal-table--couriers tbody tr[data-courier-id] .col-deposited,
  #journal-view .journal-table--mobile-cards tbody tr[data-payment-id] .col-deposited {
    border-right: none;
  }

  #journal-view .pickup-grid {
    grid-template-columns: 1fr;
  }
}

/* Телефон альбомно — компактнее, карточки в 2 колонки где можно */
@media (max-width: 1200px) and (orientation: landscape) {
  #journal-view .journal-auto-card {
    flex: 0 0 min(38vw, 13rem);
  }

  #journal-view .journal-balance-card {
    flex: 0 0 min(22vw, 7.5rem);
  }

  #journal-view .journal-table--mobile-cards tbody tr.journal-entry-row,
  #journal-view .journal-table--mobile-cards tbody tr.journal-row-exchange {
    margin-bottom: .3rem;
  }

  #journal-view .journal-table--mobile-cards tbody td {
    padding: .3rem .4rem;
  }

  #journal-view .journal-table--mobile-cards .journal-input,
  #journal-view .journal-table--mobile-cards .journal-readonly {
    min-height: 2rem;
    padding: .3rem .4rem;
    font-size: .9rem;
  }

  #journal-view .journal-table--mobile-cards .col-comment .journal-input,
  #journal-view .journal-table--mobile-cards .col-comment .journal-readonly {
    min-height: 1.85rem;
  }
}

@media (max-width: 640px) {
  .users-table-wrap {
    margin: 0 .5rem;
  }
}

#warehouse-view .journal-header {
  padding: .65rem 1rem;
  border-bottom: 1px solid var(--j-border);
  background: var(--j-bg);
  flex-wrap: wrap;
  gap: .75rem 1rem;
}

.warehouse-subtabs {
  flex: 1 1 100%;
  margin-top: .15rem;
  display: flex;
  gap: .35rem;
  padding: .2rem;
  background: var(--j-bg);
  border: 1px solid var(--j-border);
  border-radius: 10px;
}

#warehouse-view .warehouse-subtabs .journal-subtab,
#warehouse-view .warehouse-subtab {
  width: auto;
  margin: 0;
  filter: none;
  background: transparent;
  border: 1px solid transparent;
  color: var(--j-muted);
  padding: .42rem .9rem;
  border-radius: 8px;
  cursor: pointer;
  font-size: .86rem;
  font-weight: 600;
  transition: background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

#warehouse-view .warehouse-subtabs .journal-subtab:hover,
#warehouse-view .warehouse-subtab:hover {
  filter: none;
  background: var(--j-hover);
  color: var(--j-text);
}

#warehouse-view .warehouse-subtabs .journal-subtab.active,
#warehouse-view .warehouse-subtab.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  filter: none;
  box-shadow: 0 2px 8px rgba(110, 168, 254, 0.35);
}

.warehouse-metrics--receiving {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.warehouse-month-grid--receiving {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.warehouse-month-grid--shifts {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.warehouse-table-wrap--receiving,
.warehouse-table-wrap--shifts {
  overflow-x: auto;
}

.warehouse-table--receiving-days .warehouse-receiving-cell-input,
.warehouse-table--receiving-days .warehouse-dept-month-input,
.warehouse-table--shift-days .warehouse-dept-month-input {
  width: 100%;
  min-width: 2.75rem;
  max-width: 5.5rem;
  padding: .2rem .35rem;
  text-align: right;
  font-size: .85rem;
}

.warehouse-table--receiving-days td,
.warehouse-table--shift-days td {
  vertical-align: middle;
}

.warehouse-table--shift-days .warehouse-th-group--day {
  background: color-mix(in srgb, #3b82f6 14%, var(--j-bg));
  border-left: 3px solid #3b82f6;
}

.warehouse-table--shift-days .warehouse-th-group--night {
  background: color-mix(in srgb, #6366f1 14%, var(--j-bg));
  border-left: 3px solid #6366f1;
}

.warehouse-table--shift-days .warehouse-th-group--total {
  background: color-mix(in srgb, var(--j-accent) 10%, var(--j-bg));
}

.warehouse-table--shift-days td.warehouse-td--day {
  background: color-mix(in srgb, #3b82f6 5%, var(--j-bg));
}

.warehouse-table--shift-days td.warehouse-td--night {
  background: color-mix(in srgb, #6366f1 5%, var(--j-bg));
}

.warehouse-table--shift-days td.warehouse-td--computed {
  font-weight: 600;
  color: var(--j-text-muted);
}

.warehouse-table--shift-days td.warehouse-td--total {
  font-weight: 700;
  background: color-mix(in srgb, var(--j-accent) 8%, var(--j-bg));
}

.warehouse-table--shift-days .warehouse-th-group {
  text-align: center;
  background: color-mix(in srgb, var(--j-accent) 8%, var(--j-bg));
  font-weight: 600;
}

.warehouse-table--shift-days thead tr:first-child th {
  border-bottom: 1px solid var(--j-border);
}

@media (max-width: 900px) {
  .warehouse-metrics--receiving,
  .warehouse-month-grid--receiving,
  .warehouse-month-grid--shifts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

#warehouse-view .journal-calendar-btn.hidden {
  display: none;
}

#warehouse-view .journal-quick-date-btn.hidden {
  display: none;
}

.warehouse-shift-block {
  border: 1px solid var(--j-border);
  border-radius: 10px;
  padding: .85rem 1rem;
  background: var(--j-bg);
}

.warehouse-shift-block h4 {
  margin: 0 0 .65rem;
  font-size: .9rem;
  font-weight: 600;
}

.warehouse-shift-block--totals {
  background: color-mix(in srgb, var(--j-bg) 92%, var(--accent, #3b82f6) 8%);
}

.warehouse-supervisor-note {
  display: block;
  margin-top: .35rem;
  font-size: .78rem;
  color: var(--j-muted, #6b7280);
}

.warehouse-supervisor-badge {
  display: inline-block;
  padding: .1rem .45rem;
  border-radius: 6px;
  font-size: .75rem;
  background: color-mix(in srgb, var(--accent, #3b82f6) 18%, transparent);
}

.warehouse-dept-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: .75rem;
  margin-bottom: 1rem;
}

.warehouse-dept-summary-card {
  border: 1px solid var(--j-border);
  border-radius: 10px;
  padding: .75rem .9rem;
  background: var(--j-bg);
}

.warehouse-dept-summary-card h4 {
  margin: 0 0 .5rem;
  font-size: .85rem;
}

body.warehouse-active {
  --page-bg: var(--j-bg);
}

.warehouse-page {
  padding: .75rem 1rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.warehouse-empty-hint {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .65rem .85rem;
  padding: .75rem 1rem;
  border-radius: 10px;
  background: rgba(255, 196, 86, 0.1);
  border: 1px solid rgba(255, 196, 86, 0.35);
  color: var(--j-text);
  font-size: .9rem;
}

.warehouse-empty-hint strong {
  color: #ffc456;
}

.warehouse-weekend-badge {
  display: inline-block;
  align-self: flex-start;
  padding: .35rem .65rem;
  border-radius: 8px;
  background: rgba(255, 196, 86, 0.12);
  border: 1px solid rgba(255, 196, 86, 0.35);
  color: #ffc456;
  font-size: .82rem;
  font-weight: 600;
}

.warehouse-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .55rem;
}

.warehouse-metric-card {
  background: var(--j-card);
  border: 1px solid var(--j-border);
  border-radius: 10px;
  padding: .55rem .7rem;
  display: flex;
  flex-direction: column;
  gap: .2rem;
  min-width: 0;
}

.warehouse-emoji {
  display: inline-block;
  margin-right: .35rem;
  font-size: 1em;
  line-height: 1;
}

.warehouse-metric-label {
  font-size: .72rem;
  color: var(--j-muted);
  text-transform: uppercase;
  letter-spacing: .03em;
}

.warehouse-metric-value {
  font-size: 1.05rem;
}

.warehouse-metric-hint {
  font-size: .72rem;
}

.warehouse-sections {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: .75rem;
}

.warehouse-sections--production {
  grid-template-columns: 1fr;
}

.warehouse-section {
  background: var(--j-card);
  border: 1px solid var(--j-border);
  border-radius: 12px;
  padding: .85rem;
}

.warehouse-section--production-day {
  width: 100%;
}

.warehouse-section h3 {
  margin: 0 0 .65rem;
  font-size: .95rem;
}

.warehouse-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .55rem;
}

.warehouse-grid--production {
  grid-template-columns: repeat(3, minmax(13rem, 1fr));
  align-items: stretch;
}

.warehouse-grid--evening {
  grid-template-columns: 1fr 1fr;
}

.warehouse-field {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  font-size: .82rem;
  color: var(--j-muted);
}

.warehouse-field--boxed {
  min-height: 4.35rem;
  justify-content: space-between;
  padding: .55rem .65rem;
  border: 1px solid rgba(110, 168, 254, 0.3);
  border-radius: var(--ui-field-radius);
  background: #131927;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.warehouse-field-label {
  display: block;
  min-height: 1.05rem;
  line-height: 1.15;
}

.warehouse-field input,
.warehouse-field .journal-readonly {
  width: 100%;
}

.warehouse-field--boxed .journal-readonly,
.warehouse-field--boxed .journal-input {
  min-height: 2.1rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: .42rem .55rem;
  border: 1px solid rgba(110, 168, 254, 0.32);
  border-radius: var(--ui-field-radius);
  background: #0f1522;
  color: var(--j-text);
  font-size: .9rem;
  font-weight: 600;
  text-align: right;
}

.warehouse-field--boxed .journal-input {
  display: block;
}

.warehouse-field-hint {
  font-size: .72rem;
  line-height: 1.2;
}

.warehouse-shifts {
  display: flex;
  flex-direction: column;
  gap: .45rem;
  margin-top: .75rem;
  padding-top: .75rem;
  border-top: 1px solid var(--j-border);
}

.warehouse-shift {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  border: 1px solid var(--j-border);
  border-radius: 12px;
  padding: .5rem .6rem;
  background: color-mix(in srgb, var(--j-bg) 94%, #11182a 6%);
}

.warehouse-shift-label {
  font-size: .85rem;
  color: var(--j-text);
  min-width: 5.5rem;
}

.warehouse-shift-inputs {
  display: flex;
  align-items: center;
  gap: .35rem;
  flex: 1;
}

.warehouse-shift-field {
  display: flex;
  flex-direction: column;
  gap: .15rem;
  min-width: 4.5rem;
}

.warehouse-shift-field-label {
  font-size: .68rem;
  line-height: 1;
  color: var(--j-muted);
  text-align: center;
}

.warehouse-shift-box {
  width: 5rem;
  min-height: 2.1rem;
  text-align: center;
  justify-content: center;
  border: 1px solid var(--j-border);
  border-radius: 10px;
  background: var(--j-bg-soft);
  padding: .25rem .45rem;
}

.warehouse-shift-plan {
  color: var(--j-text);
}

.warehouse-shift-sep {
  color: var(--j-muted);
}

.warehouse-gap {
  font-size: .78rem;
}

.warehouse-month-card {
  background: var(--j-card);
  border: 1px solid var(--j-border);
  border-radius: var(--ui-card-radius);
  padding: .85rem;
}

.warehouse-month-card h3 {
  margin: 0 0 .65rem;
  font-size: .95rem;
}

.warehouse-month-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .55rem;
}

.warehouse-page--analytics .warehouse-section + .warehouse-section {
  margin-top: .85rem;
}

.warehouse-analytics-trend {
  border: 1px solid var(--j-border);
  border-radius: var(--ui-card-radius);
  background: color-mix(in srgb, var(--j-card) 92%, #111827 8%);
  padding: .65rem .75rem;
}

.warehouse-analytics-legend {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .5rem .8rem;
  font-size: .8rem;
  color: var(--j-muted);
  margin-bottom: .45rem;
}

.warehouse-analytics-dot {
  width: .58rem;
  height: .58rem;
  border-radius: 50%;
  display: inline-block;
  margin-right: .24rem;
}

.warehouse-analytics-dot--collected { background: #6ea8fe; }
.warehouse-analytics-dot--packed { background: #4ade80; }
.warehouse-analytics-dot--rf { background: #f59e0b; }
.warehouse-analytics-dot--goods { background: #a78bfa; }

.warehouse-analytics-note {
  margin-left: auto;
  color: var(--j-text);
}

.warehouse-analytics-chart {
  width: 100%;
  height: 12rem;
  display: block;
  flex: 1;
  min-width: 0;
}

.warehouse-analytics-chart-wrap {
  display: flex;
  align-items: stretch;
  gap: 0.35rem;
}

.warehouse-analytics-yscale {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  font-size: 0.62rem;
  line-height: 1;
  padding: 0.15rem 0;
  min-width: 2.4rem;
}

.warehouse-analytics-yscale--left {
  text-align: right;
}

.warehouse-analytics-yscale--right {
  text-align: left;
}

.warehouse-analytics-axis {
  stroke: rgba(139, 149, 168, 0.4);
  stroke-width: 1;
}

.warehouse-analytics-line {
  fill: none;
  stroke-width: 2.2;
}

.warehouse-analytics-line--dashed {
  stroke-dasharray: 5 4;
  stroke-width: 2;
  opacity: 0.9;
}

.warehouse-analytics-line--collected { stroke: #6ea8fe; }
.warehouse-analytics-line--packed { stroke: #4ade80; }
.warehouse-analytics-line--rf { stroke: #f59e0b; }
.warehouse-analytics-line--goods { stroke: #a78bfa; }

.warehouse-analytics-x {
  margin-top: .2rem;
  display: grid;
  grid-template-columns: repeat(14, minmax(0, 1fr));
  gap: .2rem;
  font-size: .66rem;
  color: var(--j-muted);
  text-align: center;
}

.warehouse-analytics-kpi-card {
  margin-top: .55rem;
  border: 1px solid var(--j-border);
  border-radius: var(--ui-field-radius);
  background: var(--j-card, #1c2333);
  padding: .5rem .6rem;
  display: grid;
  gap: .25rem;
  color: var(--j-text);
}

.warehouse-analytics-kpi-card strong {
  color: var(--j-text);
  font-size: .9rem;
}

.warehouse-analytics-kpi-value {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--j-text);
}

.warehouse-analytics-kpi-card .warehouse-metric-hint {
  color: var(--j-muted);
}

.warehouse-risk-list {
  display: grid;
  gap: .5rem;
}

.warehouse-risk-card {
  border: 1px solid var(--j-border);
  border-radius: var(--ui-field-radius);
  background: #131927;
  padding: .55rem .65rem;
}

.warehouse-risk-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .6rem;
}

.warehouse-risk-card p {
  margin: .35rem 0 0;
  font-size: .82rem;
}

.warehouse-risk-score {
  font-size: .73rem;
  color: var(--j-muted);
}

.warehouse-risk-action {
  color: var(--j-text);
}

.warehouse-risk--high {
  border-color: var(--ui-state-bad-border);
  background: color-mix(in srgb, var(--ui-state-bad-bg) 70%, #131927 30%);
}

.warehouse-risk--medium {
  border-color: var(--ui-state-warn-border);
  background: color-mix(in srgb, var(--ui-state-warn-bg) 68%, #131927 32%);
}

.warehouse-risk--low {
  border-color: var(--ui-state-ok-border);
  background: color-mix(in srgb, var(--ui-state-ok-bg) 66%, #131927 34%);
}

.warehouse-table--analytics tbody tr td:nth-child(4) {
  font-weight: 600;
}

.warehouse-table-wrap {
  overflow-x: auto;
}

.warehouse-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .84rem;
}

.warehouse-table th,
.warehouse-table td {
  padding: .45rem .5rem;
  border-bottom: 1px solid var(--j-border);
  text-align: left;
}

.warehouse-table th.num,
.warehouse-table td.num {
  text-align: right;
}

.warehouse-weekend-row td {
  color: var(--j-muted);
}

@media (max-width: 1100px) {
  .warehouse-metrics,
  .warehouse-month-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .warehouse-sections {
    grid-template-columns: 1fr;
  }

  .warehouse-grid--production {
    grid-template-columns: repeat(2, minmax(12rem, 1fr));
  }
}

@media (max-width: 640px) {
  .warehouse-metrics,
  .warehouse-month-grid,
  .warehouse-grid {
    grid-template-columns: 1fr;
  }

  .warehouse-shift {
    flex-direction: column;
    align-items: flex-start;
  }
}

.warehouse-pct--ok,
.warehouse-metric-value.warehouse-pct--ok,
.warehouse-shift--ok,
.warehouse-shift-value.warehouse-shift--ok,
.warehouse-shift-actual.warehouse-shift--ok {
  color: #5fd49a;
}

.warehouse-pct--warn,
.warehouse-metric-value.warehouse-pct--warn {
  color: #ffc456;
}

.warehouse-pct--bad,
.warehouse-metric-value.warehouse-pct--bad,
.warehouse-shift--bad,
.warehouse-shift-value.warehouse-shift--bad,
.warehouse-shift-actual.warehouse-shift--bad {
  color: #ff8a96;
}

.warehouse-table-wrap--month {
  /* Раньше 26rem — на экране оставалась тёмная «дыра» под 6–7 днями */
  max-height: calc(100vh - 14rem);
  overflow: auto;
  border: 1px solid var(--j-border);
  border-radius: 10px;
}

.warehouse-table-wrap--month .warehouse-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #1a2130;
}

.warehouse-empty-row td {
  opacity: 0.55;
}

.warehouse-day-row {
  cursor: pointer;
}

.warehouse-day-row:hover td {
  background: rgba(110, 168, 254, 0.06);
}

.warehouse-row-hint {
  margin-left: 0.35rem;
  font-size: 0.75rem;
  color: #6ea8fe;
  font-weight: 600;
}

.warehouse-table-hint {
  font-size: 0.85rem;
  font-weight: 400;
}

.warehouse-current-row td {
  background: rgba(110, 168, 254, 0.08);
}

.warehouse-week-best {
  background: var(--ui-state-ok-bg) !important;
  color: var(--ui-state-ok-text);
  font-weight: 600;
}

.warehouse-plan-bad {
  background: var(--ui-state-bad-bg) !important;
  box-shadow: inset 0 0 0 1px var(--ui-state-bad-border);
}

.warehouse-delta--ok {
  color: var(--ui-state-ok-text);
  font-weight: 600;
}

.warehouse-delta--bad {
  color: var(--ui-state-bad-text);
  font-weight: 600;
}

.warehouse-month-compare-hint {
  margin: 0.75rem 0 0;
  font-size: 0.85rem;
}

.warehouse-mode-badge {
  display: inline-block;
  margin: 0 0 1rem;
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  background: rgba(110, 168, 254, 0.15);
  color: #6ea8fe;
  font-size: 0.85rem;
  font-weight: 600;
}

.journal-quick-dates-sep {
  color: var(--muted);
  margin: 0 0.15rem;
}

.journal-month-btn {
  min-width: 7rem;
}

.journal-month-arrow {
  width: 2rem;
  height: 2rem;
  padding: 0;
  line-height: 1;
}

.warehouse-table--months th,
.warehouse-table--months td {
  white-space: nowrap;
}

.warehouse-table--production-months .warehouse-th-group {
  text-align: center;
  background: color-mix(in srgb, var(--j-accent) 8%, var(--j-bg));
  font-weight: 600;
}

.warehouse-table--production-months thead tr:first-child th {
  border-bottom: 1px solid var(--j-border);
  vertical-align: middle;
}

.warehouse-table--production-months thead tr:last-child th {
  text-align: center;
}

#warehouse-view .journal-header {
  position: relative;
  z-index: 30;
}

#timesheet-view button {
  width: auto;
  max-width: none;
  margin: 0;
  margin-top: 0;
  flex: 0 0 auto;
}

#timesheet-view .journal-header,
#timesheet-view .timesheet-header {
  position: sticky;
  top: 0;
  z-index: 40;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.45rem;
  padding: 0.55rem 1rem 0.65rem;
  border-bottom: 1px solid var(--j-border);
  background: var(--j-bg);
}

.timesheet-header-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  min-width: 0;
}

.wh-ts-fio-head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .28rem;
  min-width: 0;
  padding: .1rem 0;
}

.wh-ts-fio-label {
  position: relative;
  display: inline-flex;
  align-items: center;
  font-weight: 700;
}

.timesheet-today-at-work {
  display: inline-flex;
  align-items: baseline;
  gap: .15rem;
  padding: .15rem .45rem;
  border-radius: .4rem;
  background: rgba(110, 168, 254, 0.14);
  border: 1px solid rgba(110, 168, 254, 0.28);
  color: var(--j-text, #e8edf7);
  font-size: .72rem;
  font-weight: 500;
  white-space: nowrap;
  line-height: 1.2;
  max-width: 100%;
}

.timesheet-today-at-work.hidden {
  display: none;
}

.timesheet-today-fact {
  font-weight: 700;
  color: #22c55e;
}

.timesheet-today-total {
  font-weight: 700;
  color: #3b82f6;
}

html.theme-light .timesheet-today-at-work,
body.theme-light .timesheet-today-at-work {
  background: rgba(59, 130, 246, 0.1);
  border-color: rgba(59, 130, 246, 0.22);
  color: #1e293b;
}

html.theme-light .timesheet-today-fact,
body.theme-light .timesheet-today-fact {
  color: #16a34a;
}

html.theme-light .timesheet-today-total,
body.theme-light .timesheet-today-total {
  color: #2563eb;
}

.timesheet-header-row--sub {
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
}

.timesheet-subtabs {
  flex: 0 1 auto;
  margin-top: 0;
  display: flex;
  gap: .35rem;
  padding: .2rem;
  background: var(--j-bg);
  border: 1px solid var(--j-border);
  border-radius: 10px;
}

#timesheet-view.accounting-company-mode .timesheet-subtabs,
#timesheet-view.accounting-company-mode .timesheet-header-row--sub .timesheet-subtabs {
  display: none;
}

.accounting-header {
  margin-bottom: 0.35rem;
}

#accounting-view > .accounting-header.journal-header {
  position: sticky;
  z-index: 60;
  overflow: visible;
}

#accounting-view .vedomost-header.journal-header {
  position: sticky;
  z-index: 20;
  overflow: visible;
}

#accounting-view .vedomost-sheet-picker,
#accounting-view .vedomost-sheet-picker-inner {
  position: relative;
  z-index: 70;
}

#accounting-view .vedomost-sheet-picker-menu {
  z-index: 80;
}

#accounting-view .vedomost-missing--compact {
  position: relative;
  z-index: 5;
}

#accounting-view .vedomost-missing--compact:has(.vedomost-missing-list.is-expanded) {
  z-index: 35;
}

#accounting-view .vedomost-missing--compact .vedomost-missing-list.is-expanded {
  position: absolute;
  left: 0;
  top: calc(100% + 0.2rem);
  z-index: 36;
  min-width: min(22rem, 92vw);
  max-height: 14rem;
  margin: 0;
  padding: 0.45rem 0.75rem 0.45rem 1.1rem;
  border-radius: 8px;
  background: var(--j-card, #fff);
  border: 1px solid rgba(143, 106, 224, 0.35);
  box-shadow: 0 10px 24px rgba(40, 20, 80, 0.14);
  columns: 1;
}

.accounting-header-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem 0.85rem;
  width: 100%;
}

.accounting-vedomost-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.65rem;
  min-width: 0;
  flex: 1 1 auto;
}

.vedomost-dept-filter-host:empty {
  display: none;
}

.vedomost-money-toggle-host,
.vedomost-dept-filter-host,
.vedomost-print-host {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin: 0;
}

.accounting-vedomost-tools .vedomost-dept-select {
  min-width: 10rem;
  height: 2.15rem;
  margin: 0;
  box-sizing: border-box;
}

.accounting-vedomost-tools .vedomost-sheet-picker {
  margin: 0;
}

.vedomost-money-toggle-host:empty,
.vedomost-print-host:empty {
  display: none;
}

/* Бухгалтерия: компактная шапка — больше места таблице */
#accounting-view > .accounting-header.journal-header {
  padding: 0.4rem 0.75rem;
  margin-bottom: 0.15rem;
}

#accounting-view .vedomost-header.journal-header {
  padding: 0.3rem 0.75rem;
  margin-bottom: 0;
}

#accounting-view .vedomost-header-row {
  gap: 0.35rem 0.55rem;
}

#accounting-view .vedomost-missing--compact {
  padding: 0.2rem 0.45rem;
  font-size: 0.72rem;
}

#accounting-view .vedomost-search-host {
  flex: 0 1 13rem;
  min-width: 10rem;
}

#accounting-view .vedomost-mark-strip {
  padding: 0.22rem 0.4rem;
}

#accounting-view .vedomost-wrap--has-filters .vedomost-table thead th {
  top: 2.15rem;
}

#accounting-view .vedomost-mark-chip {
  padding: 0.12rem 0.4rem;
  font-size: 0.68rem;
  gap: 0.25rem;
}

#accounting-view .vedomost-note {
  margin: 0.15rem 0 0.35rem;
  font-size: 0.78rem;
}

#accounting-view .vedomost-print-btn,
#accounting-view .vedomost-excel-btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 2.15rem;
  margin: 0;
  padding: 0 0.7rem;
  border-radius: 8px;
  white-space: nowrap;
  font-size: 0.82rem;
  font-weight: 600;
  line-height: 1;
  vertical-align: middle;
}

body.accounting-company-active #accounting-vedomost-tools {
  display: none !important;
}

.accounting-subtabs {
  display: flex;
  gap: .35rem;
  padding: .2rem;
  background: var(--j-bg);
  border: 1px solid var(--j-border);
  border-radius: 10px;
  width: fit-content;
  flex: 0 0 auto;
}

#accounting-view .accounting-subtab {
  width: auto;
  margin: 0;
  filter: none;
  background: transparent;
  border: 1px solid transparent;
  color: var(--j-muted);
  padding: .42rem .9rem;
  border-radius: 8px;
  cursor: pointer;
  font-size: .86rem;
  font-weight: 600;
}

#accounting-view .accounting-subtab:hover {
  color: var(--j-text, #e8eef7);
  background: rgba(255, 255, 255, 0.04);
}

#accounting-view .accounting-subtab.active {
  color: var(--j-text, #e8eef7);
  background: rgba(255, 255, 255, 0.08);
  border-color: var(--j-border);
}

#timesheet-view .timesheet-subtabs .journal-subtab,
#timesheet-view .timesheet-subtab {
  width: auto;
  margin: 0;
  filter: none;
  background: transparent;
  border: 1px solid transparent;
  color: var(--j-muted);
  padding: .42rem .9rem;
  border-radius: 8px;
  cursor: pointer;
  font-size: .86rem;
  font-weight: 600;
  transition: background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

#timesheet-view .timesheet-subtabs .journal-subtab:hover,
#timesheet-view .timesheet-subtab:hover {
  filter: none;
  background: var(--j-hover);
  color: var(--j-text);
}

#timesheet-view .timesheet-subtabs .journal-subtab.active,
#timesheet-view .timesheet-subtab.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  filter: none;
  box-shadow: 0 2px 8px rgba(110, 168, 254, 0.35);
}

#timesheet-view .journal-date-nav,
#timesheet-view .timesheet-month-nav {
  flex: 0 0 auto;
  margin-left: 0;
  justify-content: flex-start;
  gap: 0.5rem;
  min-width: 0;
}

.timesheet-month-controls {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 0.15rem;
}

.timesheet-month-label {
  cursor: pointer;
  border-radius: 6px;
  transition: color 0.12s ease, background 0.12s ease;
}

.timesheet-month-label:hover {
  color: var(--accent, #6ea8fe);
}

.wh-ts-header-tools {
  flex: 1 1 auto;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  min-width: 0;
}

.wh-ts-header-tools.hidden {
  display: none;
}

#timesheet-view .wh-ts-toolbar--header {
  width: auto;
  max-width: 100%;
}

#timesheet-view .wh-ts-toolbar--header .wh-ts-toolbar-group,
#timesheet-view .wh-ts-toolbar--header .wh-ts-chip-row {
  flex-wrap: nowrap;
}

#timesheet-view .timesheet-toolbar {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  padding: 0;
  margin: 0;
  background: transparent;
  border: none;
}

#timesheet-view .timesheet-toolbar.hidden {
  display: none;
}

#timesheet-view #timesheet-today-btn.active,
#timesheet-view #timesheet-today-btn:disabled {
  opacity: 0.55;
  cursor: default;
}

.wh-ts-toolbar--header {
  margin: 0;
  padding: 0.18rem 0.4rem;
  background: rgba(26, 33, 48, 0.45);
  border: 1px solid var(--j-border, #2a3142);
  border-radius: 8px;
}

#warehouse-view .journal-date-nav {
  position: relative;
  z-index: 31;
}

#warehouse-view .journal-date-picker {
  position: relative;
}

#warehouse-view .journal-date-popup {
  background: #1a2130;
  border: 1px solid #3d4a66;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.65);
  z-index: 400;
}

#warehouse-view.warehouse-cal-open::before {
  content: "";
  position: fixed;
  inset: 0;
  background: rgba(8, 10, 16, 0.72);
  z-index: 350;
  pointer-events: none;
}

@media (max-width: 900px) {
  #warehouse-view .journal-date-popup {
    position: fixed;
    left: 50%;
    top: 50%;
    right: auto;
    transform: translate(-50%, -50%);
    width: min(18rem, calc(100vw - 1.5rem));
    max-height: calc(100vh - 2rem);
    overflow-y: auto;
    z-index: 500;
  }
}

/* Логистика */
body.logistics-active {
  --page-accent: #6ea8fe;
}

#logistics-view .journal-header {
  position: relative;
  z-index: 20;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem 0.85rem;
  padding: 0.4rem 0.75rem;
  background: var(--j-bg);
  border-bottom: 1px solid var(--j-border);
}

#logistics-view .journal-date-nav {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: .15rem;
  min-width: 10rem;
  flex: 0 0 auto;
}

#logistics-view .journal-date-label {
  font-size: 1rem;
  margin: 0;
  min-width: 7.5rem;
  text-align: center;
}

#logistics-view .logistics-subtabs {
  flex: 1 1 auto;
  margin-top: 0;
  display: flex;
  gap: .25rem;
  flex-wrap: nowrap;
  padding: .12rem;
  background: var(--j-bg);
  border: 1px solid var(--j-border);
  border-radius: 8px;
  min-width: 0;
}

#logistics-view .journal-subtab,
#logistics-view .logistics-subtab {
  width: auto;
  margin: 0;
  filter: none;
  background: transparent;
  border: 1px solid transparent;
  color: var(--j-muted);
  padding: .32rem .7rem;
  border-radius: 6px;
  cursor: pointer;
  font-size: .8rem;
  font-weight: 600;
  transition: background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
  white-space: nowrap;
}

#logistics-view .journal-subtab:hover,
#logistics-view .logistics-subtab:hover {
  filter: none;
  background: var(--j-hover);
  color: var(--j-text);
}

#logistics-view .journal-subtab.active,
#logistics-view .logistics-subtab.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  filter: none;
  box-shadow: 0 2px 8px rgba(110, 168, 254, 0.35);
}

/* Выработка */
body.output-active {
  --page-accent: #6ea8fe;
}

#output-view .journal-header {
  position: sticky;
  top: 0;
  z-index: 40;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: .75rem 1rem;
  padding: .65rem 1rem;
  background: var(--j-bg);
  border-bottom: 1px solid var(--j-border);
}

#output-view .journal-date-nav {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: .15rem;
  min-width: 12rem;
  flex: 1 1 auto;
}

#output-view .output-subtabs {
  flex: 1 1 100%;
  margin-top: .15rem;
  display: flex;
  gap: .35rem;
  flex-wrap: nowrap;
  padding: .2rem;
  background: var(--j-bg);
  border: 1px solid var(--j-border);
  border-radius: 10px;
}

#output-view .journal-subtab,
#output-view .output-subtab {
  width: auto;
  margin: 0;
  filter: none;
  background: transparent;
  border: 1px solid transparent;
  color: var(--j-muted);
  padding: .42rem .9rem;
  border-radius: 8px;
  cursor: pointer;
  font-size: .86rem;
  font-weight: 600;
  transition: background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

#output-view .journal-subtab:hover,
#output-view .output-subtab:hover {
  filter: none;
  background: var(--j-hover);
  color: var(--j-text);
}

#output-view .journal-subtab.active,
#output-view .output-subtab.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  filter: none;
  box-shadow: 0 2px 8px rgba(110, 168, 254, 0.35);
}

#output-view #output-month-nav {
  min-width: 12rem;
  min-height: 2rem;
}

#output-view #output-month-nav.output-month-nav--hidden {
  visibility: hidden;
  pointer-events: none;
}

.output-page {
  padding: .75rem 1rem 1.25rem;
}

.output-empty-hint {
  padding: .75rem 1rem;
  border-radius: 10px;
  background: rgba(110, 168, 254, 0.08);
  border: 1px solid rgba(110, 168, 254, 0.25);
  font-size: .9rem;
}

#logistics-view #logistics-month-nav {
  min-width: 12rem;
  min-height: 2rem;
}

#logistics-view #logistics-month-nav.logistics-month-nav--hidden {
  visibility: hidden;
  pointer-events: none;
}

.logistics-page {
  padding: 0.25rem 0 0.75rem;
}

.logistics-page--split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(16rem, 22rem);
  gap: 1rem;
  align-items: start;
}

.logistics-meta {
  grid-column: 1 / -1;
  margin-bottom: 0.75rem;
  font-size: 0.9rem;
}

.logistics-meta-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem 2rem;
  margin-bottom: 0.85rem;
  padding: 0.65rem 0.85rem;
  border: 1px solid var(--j-border);
  border-radius: 10px;
  background: rgba(26, 33, 48, 0.45);
}

.logistics-meta-bar--couriers {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.5rem 0.65rem;
  margin-bottom: 0.3rem;
  padding: 0.35rem 0.6rem;
  border-radius: 8px;
  overflow: visible;
  min-width: 0;
  width: 100%;
}

.logistics-meta-bar--couriers .logistics-meta-item {
  display: flex;
  min-width: 0;
  flex-direction: row;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: nowrap;
  flex: 0 0 auto;
}

.logistics-meta-bar--couriers .logistics-meta-label {
  font-size: 0.75rem;
  font-weight: 600;
  white-space: nowrap;
}

.logistics-meta-bar--couriers .logistics-meta-sub {
  display: none;
}

.logistics-meta-bar--couriers .logistics-meta-value {
  font-size: 0.92rem;
  white-space: nowrap;
}

.logistics-meta-bar--couriers .logistics-base-salary-input {
  width: 4.5rem;
  font-size: 0.9rem;
  padding: 0.25rem 0.4rem;
}

.logistics-meta-actions {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  flex: 1 1 auto;
  min-width: 0;
  margin-left: auto;
  justify-content: flex-end;
  flex-wrap: nowrap;
}

.logistics-meta-search.logistics-staff-filter,
.logistics-meta-search {
  flex: 1 1 10rem;
  width: auto !important;
  min-width: 9rem;
  max-width: 16rem;
  height: 2rem;
  margin: 0;
  padding: 0.25rem 0.55rem;
  font-size: 0.82rem;
}

/* Глобальный button { width:100%; margin-top } ломает шапку — фиксируем */
.logistics-meta-bar--couriers button,
.logistics-meta-actions .journal-toolbar-btn,
.logistics-meta-actions .btn-send-tg,
.logistics-meta-actions .ghost {
  width: auto !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  flex: 0 0 auto !important;
}

.logistics-meta-btn {
  white-space: nowrap;
  height: 2rem;
  padding: 0.25rem 0.7rem !important;
  font-size: 0.78rem !important;
  min-height: 0;
  line-height: 1.2;
}

.logistics-meta-actions .btn-send-tg {
  margin-left: 0;
  padding: 0.25rem 0.7rem;
  font-size: 0.78rem;
  min-height: 0;
  height: 2rem;
}

.logistics-money-hint--compact {
  margin: 0 0 0.35rem;
  font-size: 0.74rem;
  line-height: 1.25;
}

.logistics-staff-table-wrap.output-table-wrap {
  max-height: calc(100vh - 11.5rem);
}

.logistics-meta-item {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 7rem;
}

.logistics-meta-label {
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--j-text);
}

.logistics-meta-sub {
  font-size: 0.78rem;
  color: var(--j-muted);
}

.logistics-meta-value {
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.2;
}

.logistics-meta-value--green {
  color: #4ade80;
}

.logistics-meta-salary {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.logistics-base-salary-input {
  width: 5.5rem;
  text-align: right;
  font-weight: 700;
  font-size: 1rem;
}

.logistics-meta-currency {
  color: var(--j-muted);
  font-size: 0.9rem;
}

.logistics-table--couriers .logistics-toolbar-row th,
.logistics-table--drivers .logistics-toolbar-row th,
.logistics-table--to .logistics-toolbar-row th {
  border-bottom: none;
  padding: 0.15rem 0.35rem 0.1rem;
  background: #1a2130;
  position: static;
  top: auto;
  z-index: 1;
}

.logistics-table--couriers thead tr:not(.logistics-toolbar-row) th,
.logistics-table--drivers thead tr:not(.logistics-toolbar-row) th,
.logistics-table--to thead tr:not(.logistics-toolbar-row) th {
  top: 0;
}

.logistics-table--couriers .logistics-add-cell,
.logistics-table--drivers .logistics-add-cell,
.logistics-table--to .logistics-add-cell {
  text-align: left;
  vertical-align: bottom;
  padding-bottom: 0.35rem;
}

.logistics-add-cell-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
}

.logistics-add-btn {
  white-space: nowrap;
  width: auto;
  margin: 0;
  filter: none;
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  box-shadow: 0 2px 8px rgba(110, 168, 254, 0.35);
}

.logistics-add-btn:hover {
  filter: none;
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  box-shadow: 0 2px 10px rgba(110, 168, 254, 0.45);
}

.logistics-table-wrap {
  overflow: auto;
  border: 1px solid var(--j-border);
  border-radius: var(--ui-card-radius);
  max-height: calc(100vh - 14rem);
}

.logistics-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
}

.logistics-table--couriers,
.logistics-table--drivers {
  min-width: 72rem;
}

.logistics-col-phone,
.logistics-col-tg,
.logistics-col-status {
  width: 7rem;
}

.logistics-col-phone { width: 10rem; }
.logistics-col-tg { width: 8.5rem; }
.logistics-col-status { width: 5.5rem; }

.logistics-col-select {
  width: 2.2rem;
}

.logistics-phone-cell .phone-input {
  width: 100%;
  min-width: 6.5rem;
}

.logistics-filter-bar .btn-send-tg {
  margin-left: auto;
}

.logistics-money-hint {
  margin: 0.35rem 0 0.5rem;
  font-size: 0.82rem;
  line-height: 1.35;
}

.output-table.logistics-table--couriers,
.output-table.logistics-table--drivers {
  width: 100%;
  min-width: 72rem;
}

.output-table.logistics-table--couriers thead th,
.output-table.logistics-table--drivers thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #1a2130;
  font-size: 0.72rem;
  padding: 0.45rem 0.35rem;
}

.output-table.logistics-table--couriers thead tr:not(.logistics-toolbar-row) th,
.output-table.logistics-table--drivers thead tr:not(.logistics-toolbar-row) th {
  text-align: center;
  vertical-align: middle;
  white-space: normal;
  line-height: 1.15;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: normal;
  overflow-wrap: anywhere;
}

.output-table.logistics-table--couriers tbody td,
.output-table.logistics-table--drivers tbody td {
  padding: 0.22rem 0.2rem;
  vertical-align: middle;
}

.output-table.logistics-table--couriers .logistics-input,
.output-table.logistics-table--drivers .logistics-input {
  width: 100%;
  max-width: none;
  min-width: 0;
  text-align: right;
  font-size: 0.82rem;
  padding: 0.28rem 0.35rem;
}

.output-table.logistics-table--couriers .logistics-col-name-cell,
.output-table.logistics-table--drivers .logistics-col-name-cell {
  text-align: left;
}

.output-table.logistics-table--couriers .logistics-name-input,
.output-table.logistics-table--drivers .logistics-name-input {
  width: 100%;
  text-align: left;
}

.output-table.logistics-table--couriers .logistics-total,
.output-table.logistics-table--drivers .logistics-total {
  font-weight: 600;
  white-space: nowrap;
}

.output-table.logistics-table--couriers th.logistics-col-phone-h,
.output-table.logistics-table--drivers th.logistics-col-phone-h {
  text-align: center;
}

.output-table.logistics-table--couriers th.logistics-col-tg-h,
.output-table.logistics-table--drivers th.logistics-col-tg-h,
.output-table.logistics-table--couriers th.logistics-col-status-h,
.output-table.logistics-table--drivers th.logistics-col-status-h {
  text-align: center;
}

.output-table.logistics-table--couriers td.logistics-phone-cell--staff,
.output-table.logistics-table--drivers td.logistics-phone-cell--staff {
  text-align: right;
}

.output-table.logistics-table--couriers td.logistics-tg-cell,
.output-table.logistics-table--drivers td.logistics-tg-cell,
.output-table.logistics-table--couriers td.logistics-status-cell,
.output-table.logistics-table--drivers td.logistics-status-cell {
  text-align: center;
  vertical-align: middle;
}

.output-table.logistics-table--couriers td.logistics-tg-cell .tg-cell,
.output-table.logistics-table--drivers td.logistics-tg-cell .tg-cell {
  align-items: center;
}

.output-table.logistics-table--couriers td.logistics-status-cell .status,
.output-table.logistics-table--drivers td.logistics-status-cell .status {
  margin: 0 auto;
}

.logistics-table--drivers {
  table-layout: fixed;
  min-width: 1180px;
}

.logistics-table--drivers td,
.logistics-table--drivers th {
  overflow: hidden;
}

.logistics-table--drivers .logistics-to-cell {
  overflow: hidden;
  box-sizing: border-box;
}

.logistics-table--couriers .logistics-col-name,
.logistics-table--drivers .logistics-col-name {
  width: 12rem;
}

.logistics-table--couriers .logistics-col-num,
.logistics-table--drivers .logistics-col-num {
  width: 4.5rem;
}

.logistics-table--couriers .logistics-col-money,
.logistics-table--drivers .logistics-col-money {
  width: 6rem;
}

.logistics-table--drivers .logistics-col-to {
  width: 7.25rem;
}

.logistics-table--drivers .logistics-to-cell--quarter .logistics-to-pay-control {
  gap: 0.15rem;
  justify-content: flex-end;
  flex-wrap: nowrap;
  max-width: 100%;
}

.logistics-table--drivers .logistics-driver-to-input {
  width: 3.75rem;
  min-width: 0;
  max-width: 100%;
  flex: 1 1 auto;
  font-size: 0.8rem;
  padding: 0.2rem 0.25rem;
}

.logistics-table--drivers .logistics-to-status-checkbox {
  width: 0.9rem;
  height: 0.9rem;
  flex: 0 0 auto;
}

.logistics-table--couriers .logistics-col-name-cell,
.logistics-table--drivers .logistics-col-name-cell {
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
}

.logistics-table--couriers .logistics-money-cell,
.logistics-table--drivers .logistics-money-cell {
  text-align: right;
  white-space: nowrap;
}

.logistics-table--couriers .logistics-money-cell .logistics-input,
.logistics-table--drivers .logistics-money-cell .logistics-input {
  width: 100%;
  max-width: 6rem;
  margin-left: auto;
  display: block;
}

.logistics-table--couriers .logistics-money-cell .journal-readonly,
.logistics-table--drivers .logistics-money-cell .journal-readonly {
  display: block;
  text-align: right;
}

.logistics-table th,
.logistics-table td {
  padding: 0.45rem 0.55rem;
  border-bottom: 1px solid var(--j-border);
  vertical-align: middle;
}

.logistics-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #1a2130;
  text-align: left;
  font-weight: 600;
}

.logistics-table .num {
  text-align: right;
  white-space: nowrap;
}

.logistics-table .logistics-input {
  width: 5.5rem;
  max-width: 100%;
  text-align: right;
}

.logistics-table .logistics-to-input,
.logistics-table .logistics-driver-to-input {
  width: 4.5rem;
  background: transparent;
  border-color: transparent;
}

.logistics-to-pay-control {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem;
  width: 100%;
}

.logistics-to-status-checkbox {
  width: 1rem;
  height: 1rem;
  flex: 0 0 auto;
  accent-color: #4ade80;
  cursor: pointer;
}

.logistics-filter-bar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 0.75rem;
  flex-wrap: wrap;
}

.logistics-staff-filter {
  width: min(100%, 18rem);
  max-width: 18rem;
}

.logistics-table--to {
  min-width: 52rem;
}

.logistics-to-cell--empty {
  color: var(--j-muted, #6b7280);
}

.logistics-to-cell--paid {
  background: rgba(74, 222, 128, 0.2);
}

.logistics-to-cell--paid .logistics-to-input,
.logistics-to-cell--paid .logistics-driver-to-input {
  color: #4ade80;
  font-weight: 600;
}

.logistics-to-cell--planned {
  background: rgba(250, 204, 21, 0.16);
}

.logistics-to-cell--planned .logistics-to-input,
.logistics-to-cell--planned .logistics-driver-to-input {
  color: #facc15;
  font-weight: 600;
}

.logistics-to-cell--quarter {
  cursor: pointer;
}

.logistics-table--to th.logistics-to-th--quarter {
  color: #9fd0ff;
}

.logistics-to-legend-paid {
  color: #4ade80;
}

.logistics-to-legend-planned {
  color: #facc15;
}

.logistics-to-subtabs {
  display: flex;
  gap: .35rem;
  flex-wrap: wrap;
  margin: 0 0 .65rem;
  padding: .2rem;
  background: var(--j-bg);
  border: 1px solid var(--j-border);
  border-radius: 10px;
}

.logistics-to-subtab {
  width: auto;
  margin: 0;
}

.logistics-to-symbol {
  display: inline-block;
  min-width: 1.25rem;
  text-align: center;
  font-weight: 700;
  font-size: 1.05rem;
}

.logistics-to-cell--paid .logistics-to-symbol {
  color: #4ade80;
}

.logistics-to-cell--planned .logistics-to-symbol {
  color: #facc15;
}

.logistics-total {
  font-weight: 700;
  color: #9fd0ff;
}

.logistics-kpi-panel {
  border: 1px solid var(--j-border);
  border-radius: var(--ui-card-radius);
  padding: 0.75rem;
  background: rgba(26, 33, 48, 0.6);
}

.logistics-kpi-panel--page {
  max-width: none;
  width: 100%;
}

.logistics-table-wrap--kpi {
  max-height: none;
  overflow-x: auto;
}

.logistics-table--kpi {
  table-layout: fixed;
  width: 100%;
  min-width: 48rem;
}

.logistics-table--kpi .logistics-kpi-col-name {
  width: 32%;
  min-width: 16rem;
}

.logistics-table--kpi .logistics-kpi-col-condition {
  width: 11%;
  min-width: 6.5rem;
}

.logistics-table--kpi .logistics-kpi-col-tier {
  width: 14%;
  min-width: 8.5rem;
}

.logistics-table--kpi th,
.logistics-table--kpi td {
  text-align: center;
  vertical-align: middle;
  white-space: normal;
  word-break: normal;
  overflow-wrap: normal;
  line-height: 1.4;
  min-width: 0;
  overflow: visible;
}

.logistics-table--kpi .logistics-kpi-name-h,
.logistics-table--kpi .logistics-kpi-name {
  text-align: left;
  min-width: 16rem;
  white-space: normal;
  overflow: visible;
}

.logistics-table--kpi .logistics-kpi-condition-h,
.logistics-table--kpi .logistics-kpi-condition {
  min-width: 6.5rem;
  text-align: center;
}

.logistics-kpi-tier-h {
  min-width: 8.5rem;
  text-align: center;
  vertical-align: middle;
}

.logistics-kpi-tier-range-display,
.logistics-kpi-tier-range-edit {
  color: #facc15;
  font-weight: 600;
  text-align: center;
  margin-bottom: 0.35rem;
}

.logistics-kpi-tier-bonus-display,
.logistics-kpi-tier-bonus-edit {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  text-align: center;
  white-space: nowrap;
}

.logistics-kpi-bonus-word {
  color: var(--j-muted);
  font-size: 0.78rem;
  font-weight: 500;
}

.logistics-kpi-bonus-value {
  color: #4ade80;
  font-weight: 700;
}

.logistics-kpi-tier-minmax {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  margin-top: 0.25rem;
  white-space: nowrap;
}

.logistics-kpi-tier-label,
.logistics-kpi-tier-amount {
  display: block;
}

.logistics-kpi-tier-label-input {
  display: block;
  width: 100%;
  max-width: 7.5rem;
  margin: 0 auto 0.25rem;
  text-align: center;
  color: #facc15;
  font-weight: 600;
  background: rgba(250, 204, 21, 0.08);
  border-color: rgba(250, 204, 21, 0.35);
}

.logistics-kpi-range-field {
  color: #facc15;
  font-weight: 600;
  background: rgba(250, 204, 21, 0.08);
  border-color: rgba(250, 204, 21, 0.35);
}

.logistics-kpi-tier-minmax .logistics-kpi-range-field {
  width: 3.1rem;
  max-width: 100%;
  text-align: center;
  font-size: 0.76rem;
}

.logistics-kpi-tier-amount-input,
.logistics-kpi-bonus-field {
  width: 4.5rem;
  max-width: 100%;
  text-align: center;
  color: #4ade80;
  font-weight: 700;
  background: rgba(74, 222, 128, 0.08);
  border-color: rgba(74, 222, 128, 0.35);
}

.logistics-kpi-tier-cell {
  text-align: center;
  vertical-align: middle;
}

.logistics-kpi-tier-cell .logistics-kpi-bonus-field {
  margin: 0 auto;
}

.logistics-kpi-name-input,
.logistics-kpi-name-text {
  display: block;
  width: 100%;
  max-width: none;
  text-align: left;
  font-size: 0.84rem;
  line-height: 1.4;
  margin: 0;
  white-space: normal;
  overflow: visible;
}

.logistics-table--kpi .logistics-kpi-name .logistics-kpi-input {
  max-width: none;
  text-align: left;
  margin: 0;
}

.logistics-kpi-condition-text,
.logistics-kpi-condition-edit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
  white-space: nowrap;
}

.logistics-kpi-tier-range {
  vertical-align: middle;
  min-width: 8.5rem;
}

.logistics-kpi-range-inputs {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  flex-wrap: nowrap;
  white-space: nowrap;
}

.logistics-kpi-range-inputs .logistics-kpi-input {
  width: 3.35rem;
  max-width: 100%;
}

.logistics-kpi-range-sep {
  display: inline;
  color: var(--j-muted);
  font-size: 0.82rem;
}

.logistics-kpi-panel h3 {
  margin: 0 0 0.75rem;
  font-size: 0.95rem;
}

.logistics-kpi-hint {
  margin: 0.5rem 0 0;
  font-size: 0.82rem;
}

/* KPI отдела логистики */
.logistics-dept-kpi-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  margin-bottom: 1rem;
}

.logistics-dept-kpi-toolbar .logistics-dept-kpi-subtabs {
  margin: 0;
  flex: 0 1 auto;
}

.logistics-dept-kpi-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  margin-left: auto;
}

.logistics-dept-kpi-toolbar .logistics-meta-btn,
.logistics-dept-kpi-actions .journal-toolbar-btn {
  width: auto !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  flex: 0 0 auto !important;
  height: 2rem;
  align-self: center;
}

.logistics-dept-kpi-page {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.logistics-dept-kpi-group-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  margin-bottom: 0.5rem;
}

.logistics-dept-kpi-group-head h3 {
  margin: 0;
}

.logistics-dept-kpi-add-btn {
  width: auto !important;
  margin: 0 !important;
  height: 2rem;
}

.logistics-dept-kpi-cell--shared-bag {
  vertical-align: middle;
  text-align: center;
  background: color-mix(in srgb, var(--surface, #1a1a1a) 92%, #888 8%);
  min-width: 5.5rem;
}

.logistics-dept-kpi-bag-mode {
  display: block;
  margin: 0 auto;
  text-align: center;
  font-weight: 600;
  text-transform: lowercase;
}

.logistics-dept-kpi-bag-share {
  margin-top: 0.25rem;
  font-size: 0.85em;
  text-align: center;
}

html.theme-light .logistics-dept-kpi-cell--shared-bag,
body.theme-light .logistics-dept-kpi-cell--shared-bag {
  background: color-mix(in srgb, #fff 88%, #c8c8c8 12%);
}

.logistics-dept-kpi-note {
  margin: 0 0 0.75rem;
  font-size: 0.85rem;
}

.logistics-table--dept-kpi {
  table-layout: auto;
  width: 100%;
  border-collapse: collapse;
}

.logistics-table--dept-kpi th,
.logistics-table--dept-kpi td {
  vertical-align: middle !important;
  text-align: center;
  padding: 0.55rem 0.4rem;
}

.logistics-table--dept-kpi thead th.logistics-dept-kpi-th {
  vertical-align: middle !important;
  text-align: center;
  line-height: 1.3;
  font-weight: 600;
  max-width: 9.5rem;
  white-space: normal;
}

.logistics-table--dept-kpi th.logistics-dept-kpi-th-name,
.logistics-table--dept-kpi th:first-child,
.logistics-table--dept-kpi td.logistics-dept-kpi-name {
  text-align: left;
  vertical-align: middle !important;
  max-width: none;
}

.logistics-dept-kpi-name {
  font-weight: 500;
  white-space: nowrap;
  vertical-align: middle !important;
}

.logistics-dept-kpi-name-input {
  width: 100%;
  min-width: 11rem;
  max-width: 16rem !important;
  text-align: left !important;
  font-weight: 500;
  margin: 0;
  vertical-align: middle;
}

.logistics-dept-kpi-bonus-row td {
  font-size: 0.85rem;
  vertical-align: middle !important;
}

.logistics-dept-kpi-cell {
  min-width: 5.5rem;
  max-width: 9.5rem;
  vertical-align: middle !important;
  text-align: center;
}

.logistics-dept-kpi-value {
  display: block;
  width: 100%;
  font-variant-numeric: tabular-nums;
  text-align: center;
  vertical-align: middle;
  box-sizing: border-box;
}

.logistics-dept-kpi-value-btn {
  display: block;
  width: 100% !important;
  margin: 0;
  padding: 0.35rem 0.4rem;
  min-width: 0;
  border: none;
  background: transparent;
  color: inherit;
  font: inherit;
  font-variant-numeric: tabular-nums;
  text-align: center;
  cursor: pointer;
  border-radius: 6px;
  text-decoration: underline dotted rgba(90, 110, 130, 0.55);
  text-underline-offset: 0.18em;
  box-sizing: border-box;
}

.logistics-dept-kpi-value-btn:hover {
  background: color-mix(in srgb, var(--j-accent, #6ea8fe) 14%, transparent);
}

.logistics-dept-kpi-input {
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  text-align: center !important;
  font-variant-numeric: tabular-nums;
  box-sizing: border-box;
  vertical-align: middle;
}

.logistics-dept-kpi-cell--edit {
  vertical-align: middle !important;
  text-align: center;
}

.logistics-dept-kpi-cell--shared-bag .logistics-dept-kpi-bag-mode,
.logistics-dept-kpi-cell--shared-bag .logistics-dept-kpi-input {
  width: 100%;
  max-width: none;
  margin: 0 auto;
  text-align: center !important;
}

.logistics-dept-kpi-input--explain {
  cursor: pointer;
  text-decoration: underline dotted rgba(90, 110, 130, 0.45);
  text-underline-offset: 0.15em;
}

/* Ниже плана KPI (факт есть, премия 0) — красная подсветка как расхождение */
.logistics-dept-kpi-input.logistics-flag--bad,
.logistics-dept-kpi-value-btn.logistics-flag--bad,
.logistics-dept-kpi-value.logistics-flag--bad,
.logistics-dept-kpi-cell.logistics-flag--bad .logistics-dept-kpi-input {
  background: rgba(248, 113, 113, 0.28) !important;
  border-color: rgba(248, 113, 113, 0.7) !important;
  color: #fecaca !important;
  box-shadow: inset 0 0 0 1px rgba(248, 113, 113, 0.35);
}

html.theme-light .logistics-dept-kpi-input.logistics-flag--bad,
html.theme-light .logistics-dept-kpi-value-btn.logistics-flag--bad,
html.theme-light .logistics-dept-kpi-value.logistics-flag--bad,
html.theme-light #logistics-view .logistics-dept-kpi-input.logistics-flag--bad,
html.theme-light #logistics-view .logistics-dept-kpi-cell.logistics-flag--bad .logistics-dept-kpi-input,
html.theme-light #logistics-view .journal-input.logistics-flag--bad,
body.theme-light .logistics-dept-kpi-input.logistics-flag--bad,
body.theme-light .logistics-dept-kpi-value-btn.logistics-flag--bad,
body.theme-light .logistics-dept-kpi-value.logistics-flag--bad,
body.theme-light #logistics-view .logistics-dept-kpi-input.logistics-flag--bad,
body.theme-light #logistics-view .logistics-dept-kpi-cell.logistics-flag--bad .logistics-dept-kpi-input,
body.theme-light #logistics-view .journal-input.logistics-flag--bad {
  background: rgba(248, 113, 113, 0.32) !important;
  border-color: rgba(185, 28, 28, 0.7) !important;
  color: #991b1b !important;
  box-shadow: none;
}

.logistics-dept-kpi-popover {
  position: absolute;
  z-index: 1200;
  min-width: 12rem;
  max-width: 18rem;
  padding: 0.55rem 0.7rem;
  border-radius: 8px;
  border: 1px solid var(--j-border, #d0d7e2);
  background: var(--j-card, #fff);
  box-shadow: 0 8px 24px rgba(20, 30, 50, 0.18);
  color: var(--j-text, #1f2a37);
  line-height: 1.35;
}

.logistics-dept-kpi-popover-title {
  font-size: 0.72rem;
  font-weight: 600;
  color: #6b7c8d;
  margin-bottom: 0.3rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.logistics-dept-kpi-popover-formula {
  font-size: 0.9rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-weight: 600;
}

.logistics-dept-kpi-popover-detail,
.logistics-dept-kpi-popover-excel {
  margin-top: 0.25rem;
  font-size: 0.78rem;
  color: #5b6b7c;
}

.logistics-dept-kpi-popover-excel {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.72rem;
}

html.theme-light .logistics-dept-kpi-popover,
body.theme-light .logistics-dept-kpi-popover {
  background: #fff;
  border-color: #d5dbe6;
  color: #1f2a37;
}

.logistics-dept-kpi-people {
  margin: 0 0 0.65rem;
  padding-left: 1.1rem;
  font-size: 0.9rem;
}

.logistics-dept-kpi-people--edit {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  padding-left: 0;
  list-style: none;
}

.logistics-dept-kpi-rule-person {
  width: auto !important;
  min-width: 10rem;
  max-width: 16rem;
  margin: 0 !important;
}

.logistics-dept-kpi-rules-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}

.logistics-dept-kpi-rules-title {
  margin: 0;
  font-size: 1.1rem;
}

.logistics-dept-kpi-rule-title-input {
  width: 100%;
  max-width: 28rem;
  font-size: 1rem;
  font-weight: 600;
  margin: 0 0 0.5rem !important;
}

.logistics-dept-kpi-rule-input,
.logistics-dept-kpi-rule-textarea {
  width: 100%;
  margin: 0 !important;
  box-sizing: border-box;
}

.logistics-dept-kpi-rule-textarea {
  min-height: 2.6rem;
  resize: vertical;
  line-height: 1.35;
}

.logistics-table--dept-kpi-rules th.num,
.logistics-table--dept-kpi-rules td.num {
  width: 6.5rem;
}

.logistics-dept-kpi-rules-group {
  margin-bottom: 1.25rem;
}

.logistics-dept-kpi-rule-label {
  width: 42%;
  font-weight: 500;
}

.logistics-dept-kpi-rule-text {
  white-space: pre-line;
}

.logistics-dept-kpi-cell.logistics-field-diff {
  cursor: help;
}

/* График курьеров — как табель склада */
.lg-cs-page {
  --wh-ts-name-width: 220px;
}

.lg-cs-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem 0.85rem;
  margin-bottom: 0.85rem;
}

.lg-cs-toolbar .logistics-add-btn {
  width: auto !important;
}

.lg-cs-toolbar .logistics-staff-filter {
  flex: 0 1 16rem;
  min-width: 10rem;
}

/* Чипы фильтра — как табель склада, над датами */
.lg-cs-page .lg-cs-legend-strip.wh-ts-days-legend-strip {
  justify-content: flex-start;
  background: #252b3a;
  border-bottom-color: #3a4258;
}

.lg-cs-page .lg-cs-legend-strip .wh-ts-mark-bar {
  justify-content: flex-start;
}

/* Чипы читаемые в тёмной теме: тёмный текст + цветной код на светлой плашке */
.lg-cs-page .wh-ts-mark-chip,
.lg-cs-page button.wh-ts-mark-chip {
  background: #e8dff8 !important;
  border-color: rgba(178, 142, 255, 0.55) !important;
  color: #1c1630 !important;
}

.lg-cs-page .wh-ts-mark-chip__label,
.lg-cs-page button.wh-ts-mark-chip .wh-ts-mark-chip__label {
  color: #1c1630 !important;
  font-weight: 600;
}

.lg-cs-page .wh-ts-mark-chip__code,
.lg-cs-page button.wh-ts-mark-chip .wh-ts-mark-chip__code {
  color: var(--mark-color, #0144DF) !important;
  font-weight: 800;
  text-shadow: 0 0 0 transparent;
}

.lg-cs-page button.wh-ts-mark-chip.active {
  box-shadow: 0 0 0 2px #b28eff, 0 0 0 4px rgba(178, 142, 255, 0.35) !important;
  background: #d4c2f5 !important;
}

.lg-cs-page .wh-ts-mark-bar__hint {
  color: #c5c9d6 !important;
  opacity: 1;
}

.lg-cs-table {
  --wh-ts-name-width: 220px;
}

.lg-cs-table .wh-ts-sticky--name {
  z-index: 8;
}

.lg-cs-table thead th.wh-ts-sticky--name {
  z-index: 10;
}

/* ФИО — фирменный тон, читаемый в тёмной теме */
.lg-cs-table .wh-ts-sticky--name,
.lg-cs-table td.lg-cs-name,
.lg-cs-table th.wh-ts-sticky--name {
  background: #3a2f55 !important;
  color: #f3eefc !important;
  box-shadow: 2px 0 0 rgba(178, 142, 255, 0.35);
}

.lg-cs-table thead th.wh-ts-sticky--name {
  background: #463868 !important;
  color: #f8f4ff !important;
}

.lg-cs-name .wh-ts-name-row,
.lg-cs-name-row {
  display: flex;
  align-items: baseline;
  gap: 0.4rem;
  min-width: 0;
}

.lg-cs-name .wh-ts-name-text {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
  font-size: 0.86rem;
  line-height: 1.25;
  color: #f8f4ff !important;
}

.lg-cs-kind {
  flex: 0 0 auto;
  font-size: 0.72rem;
  white-space: nowrap;
  color: #d7c8f5 !important;
}

.lg-cs-linked,
.lg-cs-unlinked {
  display: block;
  font-size: 0.72rem;
  margin-top: 0.12rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #cbbce8 !important;
  opacity: 1;
}

.lg-cs-table .lg-cs-cell-input,
.lg-cs-table .lg-cs-cell-ro {
  display: block;
  width: 100%;
  box-sizing: border-box;
  min-height: 1.55rem;
  height: 1.55rem;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.2;
  padding: 0.05rem 0.1rem;
  border-radius: 6px;
  border: 1px solid var(--j-border, #2a3142);
  background: #12161f;
  color: #f0f3fa;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lg-cs-table .lg-cs-cell-ro {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Рабочий день = синий как в легенде */
.lg-cs-table .lg-cs-day--work .lg-cs-cell-input,
.lg-cs-table .lg-cs-day--work .lg-cs-cell-ro,
.lg-cs-table .co-ts-day--regular .lg-cs-cell-input,
.lg-cs-table .co-ts-day--regular .lg-cs-cell-ro {
  background: #0144DF !important;
  border-color: #0144DF !important;
  color: #fff !important;
}

.lg-cs-table .lg-cs-day--off_day .lg-cs-cell-input,
.lg-cs-table .lg-cs-day--off_day .lg-cs-cell-ro,
.lg-cs-table .co-ts-day--sick .lg-cs-cell-input,
.lg-cs-table .co-ts-day--sick .lg-cs-cell-ro {
  background: #FFE566 !important;
  color: #1a1a1a !important;
  border-color: transparent !important;
}

.lg-cs-table .lg-cs-day--vacation .lg-cs-cell-input,
.lg-cs-table .lg-cs-day--vacation .lg-cs-cell-ro,
.lg-cs-table .co-ts-day--vacation .lg-cs-cell-input,
.lg-cs-table .co-ts-day--vacation .lg-cs-cell-ro {
  background: #C77DFF !important;
  color: #1a1a1a !important;
  border-color: transparent !important;
}

.lg-cs-table .lg-cs-day--not_work .lg-cs-cell-input,
.lg-cs-table .lg-cs-day--not_work .lg-cs-cell-ro {
  background: #999999 !important;
  color: #fff !important;
  border-color: transparent !important;
}

.lg-cs-table .lg-cs-day--office .lg-cs-cell-input,
.lg-cs-table .lg-cs-day--office .lg-cs-cell-ro,
.lg-cs-table .co-ts-day--market .lg-cs-cell-input,
.lg-cs-table .co-ts-day--market .lg-cs-cell-ro {
  background: #6FA8DC !important;
  color: #1a1a1a !important;
  border-color: transparent !important;
}

.lg-cs-table .co-ts-day--weekend:not(.co-ts-day--has-value) .lg-cs-cell-input,
.lg-cs-table .co-ts-day--weekend:not(.co-ts-day--has-value) .lg-cs-cell-ro {
  background: rgba(255, 153, 0, 0.28) !important;
  border-color: rgba(255, 153, 0, 0.5) !important;
}

.lg-cs-table .lg-cs-total {
  font-weight: 700;
}

/* Итого слева от комментария — фиксированные ширины, не наезжают */
.lg-cs-table .wh-ts-sticky-end.lg-cs-total {
  right: 10rem;
  width: 4.75rem;
  min-width: 4.75rem;
  max-width: 4.75rem;
  z-index: 8;
  text-align: center;
  box-shadow: -1px 0 0 color-mix(in srgb, var(--brand-line, rgba(143, 106, 224, 0.35)) 55%, transparent),
    -4px 0 8px rgba(0, 0, 0, 0.08);
}

.lg-cs-table thead th.wh-ts-sticky-end.lg-cs-total {
  z-index: 10;
}

.lg-cs-table .wh-ts-sticky-end--comment,
.lg-cs-table th.wh-ts-sticky-end--comment,
.lg-cs-table td.lg-cs-comment {
  right: 0;
  width: 10rem;
  min-width: 10rem;
  max-width: 10rem;
  z-index: 7;
  background: #342a4d !important;
  color: #f3eefc !important;
  box-shadow: -3px 0 8px rgba(0, 0, 0, 0.25);
}

.lg-cs-table thead th.wh-ts-sticky-end--comment {
  z-index: 9;
  background: #40345c !important;
  color: #f8f4ff !important;
}

.lg-cs-comment-input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  font-size: 0.78rem;
  padding: 0.2rem 0.35rem;
  border-radius: 6px;
  border: 1px solid rgba(178, 142, 255, 0.45) !important;
  background: #4a3d68 !important;
  color: #f8f4ff !important;
  caret-color: #f8f4ff;
}

.lg-cs-comment-input::placeholder {
  color: #cbbce8 !important;
  opacity: 1;
}

.lg-cs-comment-ro {
  display: block;
  font-size: 0.78rem;
  color: #f3eefc !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html.theme-light .lg-cs-table .wh-ts-sticky--name,
html.theme-light .lg-cs-table td.lg-cs-name,
html.theme-light .lg-cs-table th.wh-ts-sticky--name,
body.theme-light .lg-cs-table .wh-ts-sticky--name,
body.theme-light .lg-cs-table td.lg-cs-name,
body.theme-light .lg-cs-table th.wh-ts-sticky--name {
  background: var(--brand-cell, #e8dff8) !important;
  color: var(--brand-ink, #1c1630) !important;
}

html.theme-light .lg-cs-table thead th.wh-ts-sticky--name,
body.theme-light .lg-cs-table thead th.wh-ts-sticky--name {
  background: var(--brand-cell-strong, #d4c2f5) !important;
}

html.theme-light .lg-cs-name .wh-ts-name-text,
body.theme-light .lg-cs-name .wh-ts-name-text {
  color: var(--brand-ink, #1c1630) !important;
}

html.theme-light .lg-cs-kind,
html.theme-light .lg-cs-linked,
html.theme-light .lg-cs-unlinked,
body.theme-light .lg-cs-kind,
body.theme-light .lg-cs-linked,
body.theme-light .lg-cs-unlinked {
  color: var(--brand-muted, #6d6680) !important;
}

html.theme-light .lg-cs-page .lg-cs-legend-strip.wh-ts-days-legend-strip,
body.theme-light .lg-cs-page .lg-cs-legend-strip.wh-ts-days-legend-strip {
  background: color-mix(in srgb, #b28eff 18%, #fff);
  border-bottom-color: rgba(143, 106, 224, 0.28);
}

html.theme-light .lg-cs-page .wh-ts-mark-chip,
html.theme-light .lg-cs-page button.wh-ts-mark-chip,
body.theme-light .lg-cs-page .wh-ts-mark-chip,
body.theme-light .lg-cs-page button.wh-ts-mark-chip {
  background: #b28eff !important;
  border-color: rgba(90, 50, 160, 0.35) !important;
  color: #1a1a1a !important;
}

html.theme-light .lg-cs-page .wh-ts-mark-bar__hint,
body.theme-light .lg-cs-page .wh-ts-mark-bar__hint {
  color: #6d6680 !important;
}

html.theme-light .lg-cs-table .lg-cs-cell-input,
html.theme-light .lg-cs-table .lg-cs-cell-ro,
body.theme-light .lg-cs-table .lg-cs-cell-input,
body.theme-light .lg-cs-table .lg-cs-cell-ro {
  background: #fff;
  color: #1a1a1a;
  border-color: rgba(0, 0, 0, 0.14);
}

html.theme-light .lg-cs-table .lg-cs-day--work .lg-cs-cell-input,
html.theme-light .lg-cs-table .lg-cs-day--work .lg-cs-cell-ro,
html.theme-light .lg-cs-table .co-ts-day--regular .lg-cs-cell-input,
html.theme-light .lg-cs-table .co-ts-day--regular .lg-cs-cell-ro,
body.theme-light .lg-cs-table .lg-cs-day--work .lg-cs-cell-input,
body.theme-light .lg-cs-table .lg-cs-day--work .lg-cs-cell-ro,
body.theme-light .lg-cs-table .co-ts-day--regular .lg-cs-cell-input,
body.theme-light .lg-cs-table .co-ts-day--regular .lg-cs-cell-ro {
  background: #0144DF !important;
  border-color: #0144DF !important;
  color: #fff !important;
}

html.theme-light .lg-cs-table .wh-ts-sticky-end--comment,
html.theme-light .lg-cs-table td.lg-cs-comment,
body.theme-light .lg-cs-table .wh-ts-sticky-end--comment,
body.theme-light .lg-cs-table td.lg-cs-comment {
  background: color-mix(in srgb, var(--brand-cell, #e8dff8) 55%, #fff) !important;
  color: var(--brand-ink, #1c1630) !important;
}

html.theme-light .lg-cs-table thead th.wh-ts-sticky-end--comment,
body.theme-light .lg-cs-table thead th.wh-ts-sticky-end--comment {
  background: var(--brand-cell-strong, #d4c2f5) !important;
  color: var(--brand-ink, #1c1630) !important;
}

html.theme-light .lg-cs-comment-input,
body.theme-light .lg-cs-comment-input {
  background: color-mix(in srgb, #fff 70%, var(--brand-cell, #e8dff8)) !important;
  color: var(--brand-ink, #1c1630) !important;
  border-color: var(--brand-line, rgba(143, 106, 224, 0.4)) !important;
}

html.theme-light .lg-cs-comment-input::placeholder,
body.theme-light .lg-cs-comment-input::placeholder {
  color: var(--brand-muted, #6d6680) !important;
}

html.theme-light .lg-cs-comment-ro,
body.theme-light .lg-cs-comment-ro {
  color: var(--brand-ink, #1c1630) !important;
}

.logistics-name-actions {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.logistics-name-actions .logistics-name-input {
  flex: 1 1 auto;
  min-width: 0;
}

.logistics-staff-delete {
  width: auto;
  margin: 0;
  padding: 0.1rem 0.45rem;
  min-width: 1.75rem;
  font-size: 1rem;
  line-height: 1;
  color: #f87171;
  border: 1px solid transparent;
  background: transparent;
  filter: none;
}

.logistics-staff-delete:hover {
  background: rgba(248, 113, 113, 0.15);
  border-color: rgba(248, 113, 113, 0.35);
  color: #fca5a5;
  filter: none;
}

.logistics-table--kpi th,
.logistics-table--kpi td {
  font-size: 0.84rem;
  padding: 0.55rem 0.65rem;
}

@media (max-width: 900px) {
  #logistics-view .journal-header {
    flex-direction: column;
    align-items: stretch;
    gap: .35rem;
    padding: .35rem .5rem;
  }

  #logistics-view .journal-date-nav {
    justify-content: center;
    min-width: 0;
  }

  #logistics-view .logistics-subtabs {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .25rem;
    width: 100%;
    padding: .15rem;
  }

  #logistics-view .logistics-subtab {
    padding: .38rem .25rem;
    font-size: .72rem;
    text-align: center;
  }
}

@media (max-width: 1100px) {
  .logistics-page--split {
    grid-template-columns: 1fr;
  }

  .logistics-kpi-panel {
    order: -1;
  }
}

@media (max-width: 900px) {
  #logistics-view .journal-header {
    flex-wrap: wrap;
  }

  #logistics-view .logistics-subtabs {
    flex: 1 1 100%;
  }

  .logistics-meta-bar--couriers {
    flex-wrap: wrap;
  }

  .logistics-meta-bar--couriers .logistics-meta-actions {
    margin-left: 0;
    width: 100%;
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .logistics-meta-search {
    max-width: none;
    flex: 1 1 100%;
  }
}

@media (max-width: 640px) {
  .logistics-table {
    font-size: 0.8rem;
  }

  .logistics-table .logistics-input {
    width: 4.25rem;
  }

  .logistics-meta-actions .logistics-meta-btn,
  .logistics-meta-actions .btn-send-tg {
    flex: 1 1 auto;
  }
}

.logistics-input.logistics-flag--ok,
.journal-readonly.logistics-flag--ok {
  background: var(--ui-state-ok-bg);
  border-color: var(--ui-state-ok-border);
}

.logistics-input.logistics-flag--bad,
.journal-readonly.logistics-flag--bad {
  background: var(--ui-state-bad-bg);
  border-color: var(--ui-state-bad-border);
}

/* Светлая тема: подсветки KPI курьеров поверх фирменного фона полей */
html.theme-light .logistics-input.logistics-flag--ok,
html.theme-light .journal-readonly.logistics-flag--ok,
html.theme-light #logistics-view .logistics-input.logistics-flag--ok,
body.theme-light .logistics-input.logistics-flag--ok,
body.theme-light .journal-readonly.logistics-flag--ok,
body.theme-light #logistics-view .logistics-input.logistics-flag--ok {
  background: rgba(74, 222, 128, 0.32) !important;
  border-color: rgba(22, 101, 52, 0.55) !important;
  color: #166534 !important;
  box-shadow: none;
}

html.theme-light .logistics-input.logistics-flag--bad,
html.theme-light .journal-readonly.logistics-flag--bad,
html.theme-light #logistics-view .logistics-input.logistics-flag--bad,
body.theme-light .logistics-input.logistics-flag--bad,
body.theme-light .journal-readonly.logistics-flag--bad,
body.theme-light #logistics-view .logistics-input.logistics-flag--bad {
  background: rgba(248, 113, 113, 0.32) !important;
  border-color: rgba(185, 28, 28, 0.65) !important;
  color: #991b1b !important;
  box-shadow: none;
}

/* Оранжевый — не совпало с эталоном SB (как в Розлив → Мотивация) */
#logistics-view .logistics-field-diff,
#logistics-view .logistics-input.logistics-field-diff,
#logistics-view .journal-readonly.logistics-field-diff {
  background: rgba(251, 146, 60, 0.32) !important;
  border-color: rgba(180, 83, 9, 0.65) !important;
  color: #9a3412 !important;
  box-shadow: none;
  cursor: pointer;
}

html.theme-light #logistics-view .logistics-field-diff,
html.theme-light #logistics-view .logistics-input.logistics-field-diff,
html.theme-light #logistics-view .journal-readonly.logistics-field-diff,
body.theme-light #logistics-view .logistics-field-diff,
body.theme-light #logistics-view .logistics-input.logistics-field-diff,
body.theme-light #logistics-view .journal-readonly.logistics-field-diff {
  background: rgba(251, 146, 60, 0.32) !important;
  border-color: rgba(180, 83, 9, 0.65) !important;
  color: #9a3412 !important;
}

.logistics-diff-hint {
  color: #c2410c;
  font-weight: 600;
}

.logistics-money--ok {
  color: #4ade80;
  font-weight: 600;
}

.logistics-toolbar {
  margin-bottom: 0.5rem;
}

.logistics-name-input {
  min-width: 7rem;
  width: 100%;
}

.logistics-kpi-input {
  width: 100%;
  max-width: 6.5rem;
  font-size: 0.78rem;
  margin: 0 auto;
  text-align: center;
}

.logistics-kpi-name-input,
.logistics-kpi-name-text,
.logistics-table--kpi .logistics-kpi-name .logistics-kpi-input,
.logistics-kpi-range-field,
.logistics-kpi-bonus-field,
.logistics-kpi-tier-label-input,
.logistics-kpi-tier-amount-input {
  max-width: none;
}

.logistics-kpi-threshold {
  display: none;
}

/* Табель сотрудников */
.wh-ts-wrap {
  overflow: auto;
  max-height: calc(100vh - 12rem);
}

.wh-ts-table {
  font-size: 0.92rem;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
}

.wh-ts-table.warehouse-table th,
.wh-ts-table.warehouse-table td {
  overflow: visible;
}

.wh-ts-table th,
.wh-ts-table td {
  padding: 0.25rem 0.15rem;
  vertical-align: middle;
  border: 1px solid var(--border, #2a3142);
}

.wh-ts-table td.wh-ts-day-col,
.wh-ts-table th.wh-ts-day-col {
  text-align: center;
}

.wh-ts-sticky {
  position: sticky;
  left: 0;
  z-index: 6;
  background: #171b26 !important;
  box-shadow: 2px 0 6px rgba(0, 0, 0, 0.45);
}

.wh-ts-table {
  --wh-ts-name-width: 220px;
  --wh-ts-dept-width: 7rem;
  --wh-ts-shift-width: 3.5rem;
  --wh-ts-hire-width: 5.5rem;
  --wh-ts-staff-width: 4rem;
  --wh-ts-phone-width: 6.5rem;
}

.wh-ts-sticky--name {
  width: var(--wh-ts-name-width);
  min-width: var(--wh-ts-name-width);
  max-width: var(--wh-ts-name-width);
  left: 0;
  overflow: visible;
}

.wh-ts-sticky--dept {
  width: var(--wh-ts-dept-width);
  min-width: var(--wh-ts-dept-width);
  max-width: var(--wh-ts-dept-width);
  left: var(--wh-ts-name-width);
  z-index: 7;
}

.wh-ts-sticky--hire {
  width: var(--wh-ts-hire-width);
  min-width: var(--wh-ts-hire-width);
  left: calc(var(--wh-ts-name-width) + var(--wh-ts-dept-width) + var(--wh-ts-shift-width));
  z-index: 7;
}

.wh-ts-sticky--staff {
  width: var(--wh-ts-staff-width);
  min-width: var(--wh-ts-staff-width);
  left: calc(var(--wh-ts-name-width) + var(--wh-ts-dept-width) + var(--wh-ts-shift-width) + var(--wh-ts-hire-width));
  z-index: 7;
}

.wh-ts-sticky--phone {
  width: var(--wh-ts-phone-width);
  min-width: var(--wh-ts-phone-width);
  left: calc(var(--wh-ts-name-width) + var(--wh-ts-dept-width) + var(--wh-ts-shift-width) + var(--wh-ts-hire-width) + var(--wh-ts-staff-width));
  z-index: 7;
}

.wh-ts-name-resize-handle {
  position: absolute;
  top: 0;
  right: 0;
  width: 6px;
  height: 100%;
  cursor: col-resize;
  z-index: 12;
  touch-action: none;
}

.wh-ts-name-resize-handle::after {
  content: "";
  position: absolute;
  top: 15%;
  bottom: 15%;
  right: 2px;
  width: 2px;
  border-radius: 1px;
  background: rgba(110, 168, 254, 0.35);
  opacity: 0;
  transition: opacity 0.15s ease;
}

.wh-ts-sticky--name:hover .wh-ts-name-resize-handle::after,
body.wh-ts-col-resizing .wh-ts-name-resize-handle::after {
  opacity: 1;
}

body.wh-ts-col-resizing {
  cursor: col-resize;
  user-select: none;
}

.wh-ts-table thead th.wh-ts-sticky--name {
  position: sticky;
  z-index: 11;
  overflow: visible;
}

.wh-ts-table.wh-ts-hide-dept .wh-ts-col--dept,
.wh-ts-table.wh-ts-hide-dept .wh-ts-sticky--dept { display: none; }
.wh-ts-table.wh-ts-hide-hire .wh-ts-col--hire,
.wh-ts-table.wh-ts-hide-hire .wh-ts-sticky--hire { display: none; }
.wh-ts-table.wh-ts-hide-staff .wh-ts-col--staff,
.wh-ts-table.wh-ts-hide-staff .wh-ts-sticky--staff { display: none; }
.wh-ts-table.wh-ts-hide-phone .wh-ts-col--phone,
.wh-ts-table.wh-ts-hide-phone .wh-ts-sticky--phone { display: none; }

.wh-ts-table.wh-ts-hide-dept .wh-ts-sticky--hire { left: calc(var(--wh-ts-name-width) + var(--wh-ts-shift-width)); }
.wh-ts-table.wh-ts-hide-dept .wh-ts-sticky--staff { left: calc(var(--wh-ts-name-width) + var(--wh-ts-shift-width) + var(--wh-ts-hire-width)); }
.wh-ts-table.wh-ts-hide-dept .wh-ts-sticky--phone { left: calc(var(--wh-ts-name-width) + var(--wh-ts-shift-width) + var(--wh-ts-hire-width) + var(--wh-ts-staff-width)); }
.wh-ts-table.wh-ts-hide-dept.wh-ts-hide-hire .wh-ts-sticky--staff { left: calc(var(--wh-ts-name-width) + var(--wh-ts-shift-width)); }
.wh-ts-table.wh-ts-hide-dept.wh-ts-hide-hire .wh-ts-sticky--phone { left: calc(var(--wh-ts-name-width) + var(--wh-ts-shift-width) + var(--wh-ts-staff-width)); }
.wh-ts-table.wh-ts-hide-dept.wh-ts-hide-hire.wh-ts-hide-staff .wh-ts-sticky--phone { left: calc(var(--wh-ts-name-width) + var(--wh-ts-shift-width)); }

.wh-ts-table.wh-ts-hide-hire:not(.wh-ts-hide-dept) .wh-ts-sticky--staff { left: calc(var(--wh-ts-name-width) + var(--wh-ts-dept-width) + var(--wh-ts-shift-width)); }
.wh-ts-table.wh-ts-hide-hire:not(.wh-ts-hide-dept) .wh-ts-sticky--phone { left: calc(var(--wh-ts-name-width) + var(--wh-ts-dept-width) + var(--wh-ts-shift-width) + var(--wh-ts-staff-width)); }
.wh-ts-table.wh-ts-hide-hire.wh-ts-hide-staff:not(.wh-ts-hide-dept) .wh-ts-sticky--phone { left: calc(var(--wh-ts-name-width) + var(--wh-ts-dept-width) + var(--wh-ts-shift-width)); }

.wh-ts-table.wh-ts-hide-staff:not(.wh-ts-hide-dept):not(.wh-ts-hide-hire) .wh-ts-sticky--phone {
  left: calc(var(--wh-ts-name-width) + var(--wh-ts-dept-width) + var(--wh-ts-shift-width) + var(--wh-ts-hire-width));
}
.wh-ts-table.wh-ts-hide-staff.wh-ts-hide-hire:not(.wh-ts-hide-dept) .wh-ts-sticky--phone {
  left: calc(var(--wh-ts-name-width) + var(--wh-ts-dept-width) + var(--wh-ts-shift-width));
}

.wh-ts-dept-select {
  width: 100%;
  max-width: 6.5rem;
  min-width: 0;
  font-size: 0.78rem;
  padding: 0.2rem 0.35rem;
  background: #12161f;
  border: 1px solid var(--j-border, #2a3142);
  color: var(--j-text, #e8ecf4);
  border-radius: 6px;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%239aa3b5' d='M1 1l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.35rem center;
  padding-right: 1.1rem;
}

.wh-ts-dept-select:focus {
  border-color: var(--accent, #5b9cf5);
  outline: none;
  box-shadow: inset 0 0 0 1px var(--accent, #5b9cf5);
}

.wh-ts-dept-select option {
  background: #171b26;
  color: #e8ecf4;
}

.wh-ts-name-row {
  display: flex;
  align-items: center;
  gap: 0.2rem;
}

.wh-ts-name-row .wh-ts-name-input {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
}

.wh-ts-del-staff,
.wh-ts-dismiss-staff {
  padding: 0.1rem 0.35rem;
  line-height: 1;
  flex-shrink: 0;
  font-size: 0.72rem;
  color: #b33;
  border-color: rgba(180, 50, 50, 0.35);
}

.wh-ts-dismiss-staff:hover {
  background: rgba(220, 80, 80, 0.12);
  color: #a22;
}

/* Уволенный: лёгкий красный тон, текст читаемый на тёмной теме; ячейки дней не гасим */
.ts-row--dismissed > td:not(.wh-ts-day-col) {
  background: rgba(220, 70, 70, 0.18) !important;
  color: var(--j-text, #e8ecf4) !important;
}

.ts-row--dismissed .wh-ts-sticky,
.ts-row--dismissed .wh-ts-sticky-end,
.ts-row--dismissed .co-ts-col--shift,
.ts-row--dismissed .co-ts-col--job,
.ts-row--dismissed .wh-ts-col--dept {
  background: rgba(90, 28, 32, 0.92) !important;
  color: #ffe8e8 !important;
  box-shadow: inset 3px 0 0 #e05555;
}

.ts-row--dismissed .wh-ts-name-text,
.ts-row--dismissed .wh-ts-name-input,
.ts-row--dismissed .co-ts-job-input,
.ts-row--dismissed select {
  color: #ffe8e8 !important;
}

.ts-row--dismissed .wh-ts-day-col {
  opacity: 0.85;
}

.ts-row--dismissed .num {
  color: #ffe8e8 !important;
  font-weight: 600;
}

.ts-dismissed-badge {
  display: inline-block;
  margin-left: 0.25rem;
  padding: 0.05rem 0.35rem;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: lowercase;
  color: #fff;
  background: rgba(220, 70, 70, 0.55);
  border: 1px solid rgba(255, 140, 140, 0.55);
  border-radius: 3px;
  white-space: nowrap;
  flex-shrink: 0;
}

.ts-shift-ro {
  display: inline-block;
  min-width: 2.2rem;
  padding: 0.1rem 0.25rem;
  font-weight: 700;
  color: inherit;
}

.wh-ts-name-text {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: inherit;
  font-weight: 600;
}

.wh-ts-row-hidden {
  display: none;
}

.wh-ts-day-col {
  width: 3.55rem;
  min-width: 3.55rem;
  max-width: 3.55rem;
  padding: 0.2rem 0.1rem;
  text-align: center;
  overflow: visible;
}

.wh-ts-day-num {
  display: block;
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1.15;
}

.wh-ts-day-wd {
  display: block;
  font-size: 0.72rem;
  opacity: 0.9;
  line-height: 1.25;
  letter-spacing: 0.02em;
}

.wh-ts-days-legend-strip {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-width: max-content;
  box-sizing: border-box;
  padding: 0.4rem 0.5rem;
  background: #1c2333;
  border-bottom: 1px solid var(--j-border, #2e3648);
  position: sticky;
  top: 0;
  z-index: 6;
}

.wh-ts-wrap--has-legend {
  border: 1px solid var(--j-border, #2e3648);
  border-radius: 10px;
}

.wh-ts-wrap--has-legend .wh-ts-days-legend-strip {
  border-radius: 10px 10px 0 0;
}

.wh-ts-wrap--has-legend .wh-ts-table thead th {
  top: var(--wh-ts-legend-h, 2.6rem);
}

.wh-ts-mark-bar {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0.4rem 0.55rem;
  overflow-x: auto;
  max-width: 100%;
}

.wh-ts-mark-bar__hint {
  font-size: 0.62rem;
  margin-left: 0.15rem;
}

/* Плашка фильтра: фирменный фон + чёрный текст; код (8/СС/Отп) — цвет метки */
.wh-ts-mark-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.18rem 0.5rem;
  border: 1px solid rgba(90, 50, 160, 0.35);
  border-radius: 6px;
  background: #b28eff;
  font-size: 0.72rem;
  line-height: 1.2;
  color: #1a1a1a;
  white-space: nowrap;
}

button.wh-ts-mark-chip {
  cursor: pointer;
  font: inherit;
  transition: color 0.12s ease, border-color 0.12s ease, background 0.12s ease, box-shadow 0.12s ease;
}

button.wh-ts-mark-chip:hover {
  filter: brightness(1.04);
  box-shadow: 0 0 0 1px rgba(90, 50, 160, 0.35);
}

button.wh-ts-mark-chip.active {
  box-shadow: 0 0 0 2px #5b3fa0, 0 0 0 4px rgba(91, 63, 160, 0.35);
  filter: brightness(1.02);
}

.wh-ts-mark-chip--info {
  cursor: default;
}

.wh-ts-mark-chip__code {
  font-weight: 800;
  min-width: 1.35rem;
  text-align: center;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: var(--mark-color, #1a1a1a);
  box-shadow: none;
}

.wh-ts-mark-chip__label {
  color: #1a1a1a;
  font-weight: 600;
}

.wh-ts-mark-chip[data-filter="sick"] {
  border-color: rgba(120, 120, 130, 0.65);
}

.wh-ts-mark-chip[data-filter="unpaid"] {
  border-color: rgba(211, 47, 47, 0.55);
}

/* Цвета чипов легенды Общего табеля задаются inline из эталона (--mark-color) */

.wh-ts-mark-chip[data-filter="workoff"] {
  border-color: rgba(255, 152, 60, 0.55);
}

.wh-ts-mark-chip[data-filter="workoff"] .wh-ts-mark-chip__code {
  color: #fdba74;
}

.wh-ts-mark-chip[data-filter="dayoff"] {
  border-color: rgba(147, 197, 253, 0.5);
}

.wh-ts-mark-chip[data-filter="dayoff"] .wh-ts-mark-chip__code {
  color: #93c5fd;
}

.wh-ts-mark-chip[data-filter="market"] {
  border-color: rgba(167, 139, 250, 0.5);
}

.wh-ts-mark-chip[data-filter="market"] .wh-ts-mark-chip__code {
  color: #c4b5fd;
}

.wh-ts-table thead th {
  position: sticky;
  top: 0;
  z-index: 8;
  background: #171b26 !important;
  color: var(--text);
}

.wh-ts-table thead th.wh-ts-sticky {
  z-index: 10;
}

.wh-ts-th--weekend,
.wh-ts-day--weekend {
  background: rgba(55, 62, 78, 0.72) !important;
}

.wh-ts-th--holiday,
.wh-ts-day--holiday {
  background: rgba(220, 80, 70, 0.35) !important;
}

.wh-ts-th--short,
.wh-ts-day--short {
  background: rgba(240, 170, 50, 0.28) !important;
}

/* Логистика / общий вид — цвета как в Общем табеле */
.wh-ts-day--vacation {
  background: transparent !important;
}
.wh-ts-day--vacation .wh-ts-cell-input {
  background: #C77DFF !important;
  color: #1a1a1a !important;
  font-weight: 700;
}

.wh-ts-day--sick {
  background: transparent !important;
}
.wh-ts-day--sick .wh-ts-cell-input {
  background: #FFE566 !important;
  color: #1a1a1a !important;
  font-weight: 700;
}

.wh-ts-day--sick-official {
  background: transparent !important;
}
.wh-ts-day--sick-official .wh-ts-cell-input {
  background: #999999 !important;
  color: #ffffff !important;
  font-weight: 700;
}

.wh-ts-day--market {
  background: transparent !important;
}
.wh-ts-day--market .wh-ts-cell-input {
  background: #6FA8DC !important;
  color: #1a1a1a !important;
  font-weight: 700;
}

/* Отгул логистики ≈ больничный/отгул в Общем */
.wh-ts-day--dayoff {
  background: transparent !important;
}
.wh-ts-day--dayoff .wh-ts-cell-input {
  background: #FFE566 !important;
  color: #1a1a1a !important;
  font-weight: 700;
}

.wh-ts-day--code {
  background: transparent !important;
}

.wh-ts-day--hours-full {
  background: transparent !important;
}
.wh-ts-day--hours-full .wh-ts-cell-input {
  background: #0144DF !important;
  color: #ffffff !important;
  font-weight: 700;
}

.wh-ts-day--regular,
.wh-ts-day--wh-regular {
  background: transparent !important;
}
.wh-ts-day--regular .wh-ts-cell-input,
.wh-ts-day--wh-regular .wh-ts-cell-input {
  background: #0144DF !important;
  color: #ffffff !important;
  font-weight: 700;
}

.wh-ts-day--hours .wh-ts-cell-input {
  color: #f0f3fa;
  font-weight: 700;
}

/* Табель склада — цвета как в Общем */
/* СС = жёлтый неофиц. sick */
.wh-ts-day--wh-sick,
.wh-ts-day--wh-sick .wh-ts-cell-input {
  background: #FFE566 !important;
  color: #1a1a1a !important;
}

/* Б = серый офиц. sick_official */
.wh-ts-day--wh-sick-official,
.wh-ts-day--wh-sick-official .wh-ts-cell-input {
  background: #999999 !important;
  color: #ffffff !important;
}

.wh-ts-day--wh-unpaid,
.wh-ts-day--wh-unpaid .wh-ts-cell-input {
  background: #A8D4F0 !important;
  color: #1a1a1a !important;
}

.wh-ts-day--wh-vacation,
.wh-ts-day--wh-vacation .wh-ts-cell-input {
  background: #C77DFF !important;
  color: #1a1a1a !important;
}

.wh-ts-day--wh-workoff,
.wh-ts-day--wh-workoff .wh-ts-cell-input {
  background: #FFB347 !important;
  color: #1a1a1a !important;
}

/* Переработка (доп. смена) — как в Общем */
.wh-ts-day--wh-overtime,
.wh-ts-day--wh-overtime .wh-ts-cell-input {
  background: #FF9900 !important;
  color: #1a1a1a !important;
}

/* Обычная смена 8/11 — синий как в Общем */
.wh-ts-day--wh-regular,
.wh-ts-day--wh-regular .wh-ts-cell-input {
  background: #0144DF !important;
  color: #ffffff !important;
}

.wh-ts-day--wh-sick .wh-ts-cell-input,
.wh-ts-day--wh-sick-official .wh-ts-cell-input,
.wh-ts-day--wh-unpaid .wh-ts-cell-input,
.wh-ts-day--wh-vacation .wh-ts-cell-input,
.wh-ts-day--wh-workoff .wh-ts-cell-input,
.wh-ts-day--wh-overtime .wh-ts-cell-input {
  font-weight: 700;
}

.wh-ts-sticky-end {
  position: sticky;
  z-index: 6;
  background: #1c2538 !important;
  box-shadow: -3px 0 8px rgba(0, 0, 0, 0.5);
  isolation: isolate;
}

.wh-ts-sticky-end--shifts {
  right: 0;
  width: 5.25rem;
  min-width: 5.25rem;
  max-width: 5.25rem;
}

.wh-ts-sticky-end--hours {
  right: 5.25rem;
  width: 5.5rem;
  min-width: 5.5rem;
  max-width: 5.5rem;
  box-shadow: -1px 0 0 var(--border, #2a3142), -5px 0 8px rgba(0, 0, 0, 0.15);
}

/* Общий табель: Смен всегда справа, Итого часов уезжает при скролле */
.co-ts-table .wh-ts-sticky-end--hours {
  position: static;
  right: auto;
  box-shadow: none;
  background: inherit !important;
}

.co-ts-table thead th.wh-ts-sticky-end--hours {
  position: sticky;
  top: 0;
  right: auto;
  z-index: 5;
  box-shadow: none;
}

.co-ts-table .wh-ts-sticky-end--shifts {
  right: 0;
  z-index: 7;
}

.wh-ts-table thead th.wh-ts-sticky-end {
  z-index: 11;
  top: 0;
  font-size: 0.72rem;
  line-height: 1.15;
  padding: 0.35rem 0.25rem;
  white-space: normal;
  text-align: center;
  background: #1c2538 !important;
}

.wh-ts-day-col .wh-ts-cell-input {
  font-size: 0.82rem;
  letter-spacing: -0.03em;
}

.wh-ts-total {
  width: 5.25rem;
  min-width: 5.25rem;
  max-width: 5.25rem;
  font-weight: 600;
  text-align: right;
  padding-right: 0.45rem;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  background: #1c2538 !important;
  color: #e8edf7;
}

.wh-ts-total.wh-ts-sticky-end--hours {
  width: 5.5rem;
  min-width: 5.5rem;
  max-width: 5.5rem;
}

.wh-ts-section {
  margin-bottom: 1.5rem;
}

.wh-ts-section-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1rem;
  margin-bottom: 0.5rem;
}

.wh-ts-section-title {
  margin: 0;
  font-size: 1rem;
}

.wh-ts-section-hints {
  font-size: 0.78rem;
}

.wh-ts-name-input {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid transparent;
  border-radius: 4px;
  padding: 0.2rem 0.35rem;
  font: inherit;
  color: var(--text);
  background: transparent;
}

.wh-ts-drag-handle {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1rem;
  margin-right: 0.15rem;
  color: color-mix(in srgb, var(--text) 45%, transparent);
  cursor: grab;
  user-select: none;
  font-size: 0.72rem;
  letter-spacing: -0.08em;
  line-height: 1;
}

.wh-ts-drag-handle:active {
  cursor: grabbing;
}

tr.wh-ts-row--dragging {
  opacity: 0.45;
}

tr.wh-ts-row--drag-over > td {
  box-shadow: inset 0 2px 0 #e67e22;
}

.wh-ts-day--has-comment {
  position: relative;
}

.wh-ts-comment-tip {
  background: #e67e22 !important;
}

.wh-ts-comment-tip:hover {
  background: #f39c12 !important;
}

.wh-ts-comment-pop {
  border-color: rgba(230, 126, 34, 0.65) !important;
}

.wh-ts-comment-pop .co-ts-mismatch-pop__title {
  color: #ffb74d !important;
}

.wh-ts-comment-pop__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.45rem;
}

.wh-ts-name-input:focus {
  border-color: var(--accent, #5b9cf5);
  background: transparent;
  outline: none;
  box-shadow: inset 0 0 0 1px var(--accent, #5b9cf5);
}

.wh-ts-table--logistics {
  width: auto;
}

.wh-ts-name--supervisor {
  color: #5b9cf5;
  font-weight: 600;
}

.wh-ts-cell-input {
  width: 100%;
  box-sizing: border-box;
  padding: 0.15rem 0.02rem;
  text-align: center;
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  color: #f0f3fa;
  border: 1px solid transparent;
  border-radius: 3px;
  background: transparent;
}

.wh-ts-cell-input:focus {
  border-color: var(--accent, #5b9cf5);
  outline: none;
  box-shadow: inset 0 0 0 1px var(--accent, #5b9cf5);
}

/* Не сбрасывать цветной фон при фокусе: иначе тёмный текст на прозрачном фоне
   (ячейка в co-ts-table всегда transparent) — цифру не видно при выборе цвета. */

.wh-ts-cell-input:not(:focus) {
  background: transparent;
}

.wh-ts-legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.65rem;
  margin: 0 0 0.35rem;
  padding: 0.3rem 0.5rem;
  font-size: 0.75rem;
  line-height: 1.3;
  color: var(--j-muted, #8b95a8);
  background: rgba(26, 33, 48, 0.55);
  border: 1px solid var(--j-border, #2a3142);
  border-radius: 8px;
}

.wh-ts-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem 0.75rem;
  margin: 0 0 0.35rem;
  padding: 0.28rem 0.5rem;
  font-size: 0.72rem;
  line-height: 1.25;
  color: var(--j-muted, #8b95a8);
  background: rgba(26, 33, 48, 0.55);
  border: 1px solid var(--j-border, #2a3142);
  border-radius: 8px;
}

.wh-ts-toolbar-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.3rem 0.45rem;
}

.wh-ts-toolbar-label {
  flex-shrink: 0;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(139, 149, 168, 0.85);
}

.wh-ts-toolbar-divider {
  flex-shrink: 0;
  width: 1px;
  height: 1.1rem;
  background: var(--j-border, #3a4258);
}

.wh-ts-chip-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem;
}

.wh-ts-chip,
button.wh-ts-legend-filter.wh-ts-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--j-border, #2a3142);
  background: rgba(18, 22, 31, 0.9);
  color: var(--j-muted, #8b95a8);
  border-radius: 5px;
  padding: 0.14rem 0.42rem;
  font-size: 0.72rem;
  line-height: 1.2;
  white-space: nowrap;
  transition: color 0.12s ease, border-color 0.12s ease, background 0.12s ease, box-shadow 0.12s ease;
}

button.wh-ts-legend-filter.wh-ts-chip {
  cursor: pointer;
  font: inherit;
}

button.wh-ts-legend-filter.wh-ts-chip:hover,
.wh-ts-col-toggle.wh-ts-chip:hover,
.wh-ts-dept-filter.wh-ts-chip:hover {
  color: var(--j-text, #e8ecf4);
  border-color: rgba(110, 168, 254, 0.35);
}

button.wh-ts-legend-filter.wh-ts-chip.active,
.wh-ts-col-toggle.wh-ts-chip.active,
.wh-ts-dept-filter.wh-ts-chip.active {
  background: rgba(110, 168, 254, 0.18);
  border-color: rgba(110, 168, 254, 0.55);
  color: #fff;
  box-shadow: 0 0 0 1px rgba(110, 168, 254, 0.18) inset, 0 2px 8px rgba(110, 168, 254, 0.2);
}

button.wh-ts-legend-filter.wh-ts-chip.active strong {
  color: #fff;
}

.wh-ts-dept-filter.wh-ts-chip.active::before {
  content: "●";
  color: #cfe2ff;
  font-size: 0.56rem;
  margin-right: 0.3rem;
}

span.wh-ts-legend-chip.wh-ts-chip {
  cursor: default;
}

.wh-ts-legend--row {
  flex-direction: row;
}

.wh-ts-legend-chip {
  display: inline;
  white-space: nowrap;
  color: inherit;
}

.wh-ts-legend-chip strong {
  font-weight: 700;
  color: var(--j-text, #e8ecf4);
}

.wh-ts-legend-sep {
  color: var(--j-border, #3a4258);
  user-select: none;
}

button.wh-ts-legend-filter:not(.wh-ts-chip) {
  display: inline;
  border: none;
  background: transparent;
  color: inherit;
  cursor: pointer;
  padding: 0;
  margin: 0;
  font: inherit;
  line-height: inherit;
  white-space: nowrap;
  border-radius: 4px;
  transition: color 0.12s ease;
}

button.wh-ts-legend-filter:not(.wh-ts-chip):hover {
  color: var(--j-text, #e8ecf4);
}

button.wh-ts-legend-filter:not(.wh-ts-chip).active {
  color: var(--accent, #6ea8fe);
}

button.wh-ts-legend-filter:not(.wh-ts-chip).active strong {
  color: var(--accent, #6ea8fe);
}

.wh-ts-table-area {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.wh-ts-col-toggles {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem;
}

.wh-ts-col-toggle {
  cursor: pointer;
  white-space: nowrap;
}

.timesheet-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem 1rem;
  padding: 0.5rem 1rem;
  background: var(--j-bg);
  border-bottom: 1px solid var(--j-border);
}

.timesheet-toolbar.hidden {
  display: none;
}

.wh-ts-search {
  max-width: 18rem;
  width: 100%;
}

.output-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem 1rem;
  padding: 0.5rem 1rem;
  background: var(--j-bg);
  border-bottom: 1px solid var(--j-border);
  position: sticky;
  top: 4.4rem;
  z-index: 35;
}

.output-toolbar.hidden {
  display: none;
}

.output-search {
  max-width: 18rem;
  width: 100%;
}

.output-hide-empty-label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.82rem;
  color: var(--j-muted);
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}

.output-sort-bar {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  flex-wrap: wrap;
  margin: 0 0 .85rem;
}

#output-staff-metrics-btn {
  font-weight: 700;
}

#output-staff-metrics-btn.is-active {
  border-color: var(--accent, #6ea8fe);
  box-shadow: 0 0 0 1px rgba(110, 168, 254, 0.25);
}

.output-sort-btn {
  cursor: pointer;
  pointer-events: auto;
}

.output-sort-btn.is-active {
  border-color: rgba(110, 168, 254, 0.55);
  color: #6ea8fe;
  background: rgba(110, 168, 254, 0.12);
}

.output-sort-select {
  min-width: 10.5rem;
  height: 2rem;
  padding: 0.15rem 0.4rem;
  font-size: 0.82rem;
  cursor: pointer;
  pointer-events: auto;
}

.output-staff-metrics-qty {
  min-width: 5rem;
}

.output-staff-metrics-hint {
  margin: 0 0 .75rem;
  font-size: .85rem;
}

.output-staff-metrics-kpis {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin: 0 0 .85rem;
}

.output-staff-kpi {
  min-width: 7rem;
  padding: .45rem .7rem;
  border-radius: .55rem;
  border: 1px solid var(--j-border);
  background: var(--j-card, rgba(28, 35, 51, 0.65));
  display: flex;
  flex-direction: column;
  gap: .15rem;
}

.output-staff-kpi strong {
  font-size: 1.15rem;
}

.output-staff-kpi--up {
  border-color: rgba(52, 211, 153, 0.45);
}

.output-staff-kpi--down {
  border-color: rgba(248, 113, 113, 0.45);
}

.output-tempo-badge {
  display: inline-block;
  padding: .15rem .45rem;
  border-radius: .4rem;
  font-size: .78rem;
  font-weight: 600;
  white-space: nowrap;
}

.output-tempo--up {
  background: var(--ui-state-ok-bg, rgba(52, 211, 153, 0.18));
  color: var(--ui-state-ok-text, #34d399);
}

.output-tempo--down {
  background: var(--ui-state-bad-bg, rgba(248, 113, 113, 0.18));
  color: var(--ui-state-bad-text, #f87171);
}

.output-tempo--stable {
  background: rgba(110, 168, 254, 0.14);
  color: #6ea8fe;
}

.output-tempo--na {
  background: rgba(148, 163, 184, 0.16);
  color: var(--j-muted);
}

.output-staff-metrics-row--down td {
  background: rgba(248, 113, 113, 0.06);
}

.output-staff-metrics-row--up td {
  background: rgba(52, 211, 153, 0.06);
}

.output-hide-empty-label input {
  margin: 0;
  cursor: pointer;
}

.output-mode-badge {
  margin: 0 0 0.65rem;
  font-size: 0.88rem;
  color: var(--j-muted);
}

.output-table-wrap {
  overflow: auto;
  max-height: calc(100vh - 14rem);
  border: 1px solid var(--j-border);
  border-radius: var(--ui-card-radius);
}

.output-table {
  table-layout: fixed;
  width: max-content;
  min-width: 100%;
  font-size: 0.82rem;
  border-collapse: separate;
  border-spacing: 0;
}

.output-table thead th {
  white-space: nowrap;
  line-height: 1.2;
  font-size: 0.68rem;
  font-weight: 600;
  text-align: center;
  vertical-align: bottom;
  padding: 0.4rem 0.2rem;
  letter-spacing: 0;
  text-transform: none;
  hyphens: none;
  word-break: keep-all;
  overflow: hidden;
  text-overflow: ellipsis;
}

.output-table tbody td.output-col,
.output-table tfoot td.output-col {
  padding: 0.22rem 0.15rem;
  vertical-align: middle;
  overflow: visible;
}

.output-table .output-col.num {
  text-align: right;
  white-space: nowrap;
}

.output-table .output-col-total {
  font-weight: 600;
}

.output-col-sticky-right {
  position: sticky;
  right: 0;
  z-index: 5;
  background: #171b26 !important;
  box-shadow: -3px 0 6px rgba(0, 0, 0, 0.35);
}

.output-table thead .output-col-sticky-right {
  z-index: 7;
  background: #1a2130 !important;
}

.output-sticky-name {
  position: sticky;
  left: 0;
  z-index: 6;
  min-width: 9.5rem;
  max-width: 9.5rem;
  width: 9.5rem;
  background: #171b26 !important;
  box-shadow: 2px 0 6px rgba(0, 0, 0, 0.45);
}

.output-table thead .output-sticky-name {
  z-index: 8;
  background: #1a2130 !important;
}

.output-name-row {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.output-name-input,
.output-cell-input {
  width: 100%;
  min-width: 0;
}

.output-table input.output-cell-input,
.output-table input.output-name-input,
.output-table .output-readonly {
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 1.55rem;
  margin-top: 0;
  padding: 0.28rem 0.35rem;
  font-size: 0.78rem;
  line-height: 1.25;
  background: #12161f;
  border: 1px solid var(--j-border, var(--border));
  border-radius: 6px;
  color: var(--j-text, var(--text));
  overflow: visible;
}

.output-table .output-col-shift_count input.output-cell-input {
  padding-left: 0.2rem;
  padding-right: 0.2rem;
  font-size: 0.76rem;
  letter-spacing: -0.02em;
}

.output-table .output-col-note .output-cell-input,
.output-table .output-col-note .output-readonly {
  text-align: left;
}

.output-table .num .output-cell-input,
.output-table .num .output-readonly {
  text-align: right;
  font-family: var(--j-mono, ui-monospace, monospace);
  font-variant-numeric: tabular-nums;
}

.output-table .output-col-total .output-readonly {
  font-weight: 600;
}

.warehouse-table-wrap--month.output-table-wrap {
  max-height: calc(100vh - 14rem);
}

.warehouse-table--production-days {
  width: 100%;
  min-width: 100%;
  table-layout: fixed;
}

.warehouse-table--production-days .output-col {
  text-align: center;
}

.warehouse-table--production-days thead th {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.warehouse-table--production-days .output-col.num .warehouse-day-badge {
  text-align: right;
}

.warehouse-table--production-days .warehouse-date-cell {
  display: flex;
  align-items: center;
  min-height: 1.55rem;
  white-space: nowrap;
}

.warehouse-table--production-days .warehouse-day-badge {
  font-weight: 600;
}

.warehouse-table--production-days .warehouse-day-badge.warehouse-week-best {
  background: var(--ui-state-ok-bg);
  border-color: var(--ui-state-ok-border);
  color: var(--ui-state-ok-text);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ui-state-ok-border) 45%, transparent);
}

.warehouse-table--production-days .warehouse-day-badge.warehouse-plan-bad {
  background: var(--ui-state-bad-bg) !important;
  border-color: var(--ui-state-bad-border);
  color: var(--ui-state-bad-text);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ui-state-bad-border) 45%, transparent);
}

.output-table tfoot .output-totals-row td {
  background: #1a2130 !important;
  border-top: 2px solid var(--j-border, rgba(255, 255, 255, 0.12));
  font-weight: 600;
  color: var(--j-text, #e8ecf4);
}

.output-table tfoot .output-totals-row .output-sticky-name,
.output-table tfoot .output-totals-row .output-col-sticky-right {
  background: #1a2130 !important;
}

.output-table tbody tr.output-row-senior td {
  background: color-mix(in srgb, #3b82f6 14%, #171b26) !important;
}

.output-table tbody tr.output-row-senior .output-sticky-name {
  background: color-mix(in srgb, #3b82f6 22%, #171b26) !important;
}

.output-table tbody tr.output-row-senior .output-col-sticky-right {
  background: color-mix(in srgb, #3b82f6 14%, #171b26) !important;
}

.output-row-hidden {
  display: none;
}

.output-shift-missing,
.output-shift-missing-cell .output-shift-missing {
  background: var(--ui-state-bad-bg) !important;
  border-color: var(--ui-state-bad-border) !important;
}

.output-shift-found,
.output-shift-found-cell .output-shift-found {
  background: var(--ui-state-ok-bg) !important;
  border-color: var(--ui-state-ok-border) !important;
}

.output-shift-empty,
.output-shift-empty-cell .output-shift-empty {
  background: color-mix(in srgb, #e67e22 28%, transparent) !important;
  border-color: rgba(194, 95, 12, 0.65) !important;
}

.output-shift-legend {
  margin: 0 0 0.5rem;
  font-size: 0.78rem;
}

.output-shift-legend-found {
  color: var(--ui-state-ok-text);
}

.output-shift-legend-missing {
  color: var(--ui-state-bad-text, #e57373);
}

.output-shift-legend-empty {
  color: #e67e22;
}

.output-field-diff,
.output-field-diff-cell .output-cell-input,
.output-field-diff-cell .output-readonly {
  background: var(--ui-state-warn-bg) !important;
  border-color: var(--ui-state-warn-border) !important;
}

.output-diff-hint {
  color: var(--ui-state-warn-text);
}

.output-formula-bar {
  margin: 0.35rem 0 0;
  padding: 0.45rem 0.65rem;
  font-size: 0.78rem;
  line-height: 1.35;
  color: #fde68a;
  background: #1e293b;
  border: 1px solid rgba(251, 191, 36, 0.45);
  border-radius: 8px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.output-formula-bar[hidden] {
  display: none !important;
}

.output-formula-bar-label {
  color: #94a3b8;
  margin-right: 0.35rem;
}

.output-formula-cell {
  cursor: help;
  outline: none;
}

.output-formula-cell:focus {
  outline: 1px solid rgba(251, 191, 36, 0.55);
  border-radius: 4px;
}

.output-readonly {
  display: block;
  text-align: right;
}

.output-bonus-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
  align-items: start;
  margin: 0.5rem 0 1rem;
}

.output-bonus-columns__item {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 0;
}

@media (max-width: 720px) {
  .output-bonus-columns {
    grid-template-columns: 1fr;
  }
}

.output-page--bonuses {
  max-width: 52rem;
}

.output-bonus-jump {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  align-items: center;
  margin: 0.5rem 0 1.25rem;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--j-border);
  border-radius: 10px;
  background: rgba(110, 168, 254, 0.06);
}

.output-bonus-jump-link {
  color: var(--j-accent, #4a7fd4);
  text-decoration: none;
  font-weight: 600;
  font-size: 0.9rem;
}

.output-bonus-jump-link:hover {
  text-decoration: underline;
}

.output-bonus-jump-soon {
  font-size: 0.85rem;
}

.output-bonus-section {
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--j-border);
  scroll-margin-top: 1rem;
}

.output-bonus-section:last-child {
  border-bottom: none;
  margin-bottom: 0;
}

.output-bonus-section-title {
  margin: 0 0 0.75rem;
  font-size: 1.15rem;
  font-weight: 700;
}

.output-bonus-block {
  border: 1px solid var(--j-border);
  border-radius: 10px;
  padding: 0.75rem;
  background: rgba(110, 168, 254, 0.04);
  height: 100%;
}

.output-bonus-title {
  margin: 0 0 0.5rem;
  font-size: 0.95rem;
}

.output-bonus-plan-row {
  margin: 0;
  min-height: 2.35rem;
  display: flex;
  align-items: center;
  font-size: 0.9rem;
}

.output-bonus-plan-input,
.output-bonus-input {
  width: 6rem;
  margin-left: 0.35rem;
  font-size: 0.85rem;
}

.output-bonus-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}

.output-bonus-table th,
.output-bonus-table td {
  width: 8.5rem;
  text-align: center;
}

.output-bonus-table td.num {
  text-align: center;
}

.output-empty-cell {
  text-align: center;
  padding: 2rem 1rem;
  color: var(--j-muted);
}

.output-unmatched-card {
  max-width: 860px;
  width: min(860px, 96vw);
}

.output-unmatched-table-wrap {
  max-height: 52vh;
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 10px;
  margin-bottom: .85rem;
  background: var(--bg);
}

.output-unmatched-table {
  width: 100%;
  border-collapse: collapse;
}

.output-unmatched-table th,
.output-unmatched-table td {
  border-bottom: 1px solid var(--border);
  padding: .55rem .65rem;
  font-size: .9rem;
}

.output-unmatched-table th {
  position: sticky;
  top: 0;
  background: var(--bg-soft);
  z-index: 1;
  text-align: left;
}

.output-unmatched-table td.num,
.output-unmatched-table th.num {
  text-align: right;
}

.output-unmatched-table tbody tr:last-child td {
  border-bottom: none;
}

.output-unmatched-select {
  width: 100%;
  min-width: 220px;
  padding: .5rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg-elevated);
  color: var(--text);
}

.output-snapshot-date-card {
  width: min(420px, 100%);
}

.output-snapshot-date-field {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin: 0.75rem 0 1rem;
  font-size: 0.9rem;
  color: var(--muted);
}

.output-snapshot-date-field input[type="date"] {
  width: 100%;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg);
  color: var(--text);
  font-size: 1.05rem;
  color-scheme: dark;
}

.output-snapshot-date-field input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(0.85) brightness(1.2);
  opacity: 0.9;
  cursor: pointer;
}

.output-packing-pending-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin: 0 0 .75rem;
  padding: .55rem .7rem;
  border-radius: var(--ui-field-radius);
  border: 1px solid var(--ui-state-warn-border);
  background: color-mix(in srgb, var(--ui-state-warn-bg) 72%, #131927 28%);
  color: var(--j-text);
  font-size: .88rem;
}

.output-packing-pending-btn:not(.hidden) {
  border-color: var(--ui-state-warn-border);
  color: var(--ui-state-warn-text);
}

.output-packing-undo-btn:not(.hidden) {
  border-color: var(--ui-state-bad-border);
  color: var(--ui-state-bad-text);
}

.wh-ts-section.wh-ts-section-hidden {
  display: none;
}

.wh-ts-empty {
  text-align: center;
  padding: 2rem 1rem;
  color: var(--muted);
}

#timesheet-content tr.wh-ts-row-hidden {
  display: none;
}

body.wh-ts-fill-dragging {
  user-select: none;
  cursor: crosshair;
}

body.wh-ts-fill-dragging .wh-ts-cell-input {
  cursor: crosshair;
}

/* Красный «!» не мешает протягивать отпуск/табель */
body.wh-ts-fill-dragging .co-ts-mismatch-tip,
body.wh-ts-fill-dragging .bt-out-mismatch-tip {
  pointer-events: none !important;
}

.wh-ts-day-col.wh-ts-fill-preview,
.wh-ts-day-col.wh-ts-fill-preview .wh-ts-cell-input,
.wh-ts-day-col.wh-ts-cell-selected,
.wh-ts-day-col.wh-ts-cell-selected .wh-ts-cell-input {
  outline: 2px solid var(--accent, #5b9cf5);
  outline-offset: -2px;
}

/* ——— Общий Табель ——— */
.co-ts-page {
  position: relative;
}

.co-ts-page-head {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.75rem;
  margin-bottom: 0.55rem;
  flex-wrap: wrap;
}

.co-ts-page-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  flex-wrap: wrap;
}

.co-ts-sheet-picker {
  position: relative;
  z-index: 20;
}

button.co-ts-sheet-picker-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0 !important;
  width: auto !important;
  padding: 0.35rem 0.7rem;
  border-radius: 8px;
  border: 1px solid rgba(110, 168, 254, 0.45);
  background: rgba(110, 168, 254, 0.16);
  color: var(--j-text, #e8ecf4);
  font: inherit;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
}

.co-ts-sheet-picker-btn__prefix {
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--j-muted, #8b95a8);
  font-weight: 600;
}

.co-ts-sheet-picker-btn__value {
  font-weight: 700;
}

button.co-ts-sheet-picker-btn:hover {
  filter: none;
  background: rgba(110, 168, 254, 0.28);
}

.co-ts-sheet-picker-btn__chev {
  color: var(--j-muted, #8b95a8);
  font-size: 0.7rem;
  font-weight: 500;
}

.co-ts-sheet-picker-menu {
  position: absolute;
  top: calc(100% + 0.3rem);
  left: 0;
  min-width: 14rem;
  max-width: min(92vw, 22rem);
  padding: 0.45rem;
  border-radius: 10px;
  border: 1px solid var(--j-border, #2a3142);
  background: #151a26;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45);
  z-index: 30;
}

.co-ts-sheet-picker-menu[hidden] {
  display: none !important;
}

.co-ts-sheet-picker-years {
  display: flex;
  gap: 0.3rem;
  margin-bottom: 0.45rem;
  padding-bottom: 0.4rem;
  border-bottom: 1px solid var(--j-border, #2a3142);
}

button.co-ts-year-btn {
  margin: 0 !important;
  width: auto !important;
  padding: 0.22rem 0.55rem;
  border-radius: 6px;
  border: 1px solid var(--j-border, #2e3648);
  background: #12161f;
  color: var(--j-muted, #8b95a8);
  font-size: 0.75rem;
  cursor: pointer;
}

button.co-ts-year-btn.active {
  background: var(--accent, #5b9cf5);
  border-color: var(--accent, #5b9cf5);
  color: #0b1020;
  font-weight: 700;
}

.co-ts-sheet-picker-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.3rem;
  margin-bottom: 0.4rem;
}

.co-ts-sheet-picker-extra {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

button.co-ts-picker-item {
  margin: 0 !important;
  width: 100% !important;
  padding: 0.32rem 0.4rem;
  border-radius: 6px;
  border: 1px solid var(--j-border, #2e3648);
  background: #12161f;
  color: var(--j-muted, #8b95a8);
  font-size: 0.74rem;
  cursor: pointer;
  text-align: center;
}

button.co-ts-picker-item:hover {
  filter: none;
  color: var(--j-text, #e8ecf4);
  border-color: rgba(110, 168, 254, 0.45);
}

button.co-ts-picker-item.active {
  background: var(--accent, #5b9cf5);
  border-color: var(--accent, #5b9cf5);
  color: #0b1020;
  font-weight: 700;
}

button.co-ts-picker-item--wide {
  text-align: left;
  padding-left: 0.55rem;
}

.co-ts-workdays {
  padding: 0.25rem 0.55rem;
  border-radius: 6px;
  background: color-mix(in srgb, var(--accent, #5b9cf5) 18%, transparent);
  border: 1px solid var(--j-border, #2a3142);
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--j-text, #e8ecf4);
  white-space: nowrap;
}

.co-ts-missing-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: 0.55rem;
  margin: 0.5rem 0 0.75rem;
}

.co-ts-missing {
  margin: 0;
  border-radius: 8px;
  background: rgba(255, 153, 0, 0.12);
  border: 1px solid rgba(255, 153, 0, 0.35);
  font-size: 0.8rem;
  line-height: 1.4;
  overflow: hidden;
  min-width: 0;
}

.co-ts-missing--from-company {
  background: rgba(91, 156, 245, 0.12);
  border-color: rgba(91, 156, 245, 0.4);
}

.co-ts-missing--from-company .co-ts-missing-list {
  border-top-color: rgba(91, 156, 245, 0.28);
}

.co-ts-missing--from-company button.co-ts-missing-toggle:hover {
  background: rgba(91, 156, 245, 0.12);
}

button.co-ts-missing-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  width: 100%;
  margin: 0;
  padding: 0.45rem 0.75rem;
  border: none;
  border-radius: 0;
  background: transparent;
  color: var(--j-text, #e8ecf4);
  font: inherit;
  font-size: 0.8rem;
  text-align: left;
  cursor: pointer;
}

button.co-ts-missing-toggle:hover {
  filter: none;
  background: rgba(255, 153, 0, 0.1);
}

.co-ts-missing-toggle__hint {
  flex-shrink: 0;
  color: var(--j-muted, #8b95a8);
  font-size: 0.72rem;
}

.co-ts-missing-list {
  margin: 0;
  padding: 0.35rem 0.75rem 0.65rem 1.4rem;
  max-height: 9rem;
  overflow: auto;
  border-top: 1px solid rgba(255, 153, 0, 0.25);
}

.co-ts-missing-list li {
  margin: 0.15rem 0;
}

.co-ts-missing-name {
  color: var(--j-text, #e8ecf4);
}

.co-ts-missing em {
  color: var(--j-muted, #8b95a8);
  font-style: normal;
}


.co-ts-table .co-ts-col--shift,
.wh-ts-table .co-ts-col--shift {
  width: 3.5rem;
  min-width: 3.5rem;
  max-width: 3.5rem;
  text-align: center;
  font-size: 0.78rem;
}

.co-ts-table .co-ts-col--job {
  width: 8rem;
  min-width: 7rem;
  max-width: 10rem;
  font-size: 0.75rem;
  color: var(--j-muted, #8b95a8);
}

.co-ts-table.co-ts-hide-job .co-ts-col--job {
  display: none;
}

.co-ts-row--intern .wh-ts-name,
.co-ts-name--intern {
  background: rgba(255, 153, 0, 0.14) !important;
}

/* Сб/вс в Общем табеле: оранжевый только внутри окошка ввода, вокруг — без заливки */
.co-ts-table .wh-ts-th--weekend,
.co-ts-table .wh-ts-day--weekend,
.co-ts-table .co-ts-day--weekend {
  background: transparent !important;
}

.co-ts-table th.wh-ts-day-col.wh-ts-th--weekend {
  background: #171b26 !important;
  color: #ffcc80;
}

/* Единый компактный вид: заливка внутри «окошка» input */
.co-ts-table .wh-ts-day-col,
.co-ts-table--compact .wh-ts-day-col {
  width: 2.55rem;
  min-width: 2.55rem;
  max-width: 2.55rem;
  padding: 0.12rem 0.08rem !important;
  background: transparent !important;
  vertical-align: middle;
}

.co-ts-table th.wh-ts-day-col {
  background: #171b26 !important;
}

.co-ts-table--compact .wh-ts-day-num {
  font-size: 0.72rem;
}

.co-ts-table--compact .wh-ts-day-wd {
  font-size: 0.6rem;
}

.co-ts-table .co-ts-cell-input,
.co-ts-table .co-ts-vac-input,
.co-ts-table--compact .co-ts-cell-input,
.co-ts-table--compact .co-ts-vac-input,
.co-ts-table--compact .wh-ts-cell-input {
  display: block;
  width: 100%;
  box-sizing: border-box;
  min-height: 1.55rem;
  height: 1.55rem;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.2;
  padding: 0.05rem 0.1rem;
  border-radius: 6px;
  border: 1px solid var(--j-border, #2a3142);
  background: #12161f;
  color: #f0f3fa;
}

/* выходной без данных — оранжевое только окошко ввода */
.co-ts-table .co-ts-day--weekend:not(.co-ts-day--has-value) .co-ts-cell-input,
.co-ts-table .co-ts-day--weekend:not(.co-ts-day--has-value) .co-ts-vac-input {
  background: rgba(255, 153, 0, 0.28) !important;
  border-color: rgba(255, 153, 0, 0.5) !important;
}

/* цвета меток задаёт applyCompanyLegendCss из справки (БД) — сразу на все ячейки с этим mark */

/* Отпуск: всегда жёлтая заливка порядкового дня */
.co-ts-vac-table .co-ts-day--vacation_day .co-ts-vac-input,
.co-ts-table .co-ts-day--vacation_day .co-ts-cell-input,
.co-ts-table .co-ts-day--vacation_day .co-ts-vac-input {
  background: #FFE566 !important;
  color: #1a1a1a !important;
  border-color: transparent !important;
}

.co-ts-vac-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem 0.85rem;
  margin: 0 0 0.55rem;
}

/* Отпуска: таблица по содержимому, «Итого дней» не растягивается на широком экране */
.co-ts-vac-table.warehouse-table,
.co-ts-vac-table {
  width: max-content;
  max-width: none;
}

.co-ts-vac-ytd,
.co-ts-vac-ytd-th {
  right: 0;
  width: 4.75rem;
  min-width: 4.75rem;
  max-width: 4.75rem;
  box-sizing: border-box;
  font-weight: 700;
  text-align: center;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.co-ts-vac-table .co-ts-vac-ytd.wh-ts-total {
  width: 4.75rem;
  min-width: 4.75rem;
  max-width: 4.75rem;
  text-align: center;
  padding-right: 0.25rem;
}

.co-ts-table .co-ts-shift-select,
.co-ts-table .wh-ts-shift-select,
.co-ts-table .pf-ts-shift-select,
.co-ts-table .lg-ts-shift-select,
.wh-ts-table .lg-ts-shift-select,
.wh-ts-table .wh-ts-shift-select,
.wh-ts-table .pf-ts-shift-select {
  width: 100%;
  max-width: 4.2rem;
  margin: 0;
  padding: 0.15rem 0.2rem;
  border-radius: 5px;
  border: 1px solid var(--j-border, #2e3648);
  background: #12161f;
  color: var(--j-text, #e8ecf4);
  font-size: 0.75rem;
}

.co-ts-th-totals {
  vertical-align: bottom;
  line-height: 1.15;
}

.co-ts-workdays-corner {
  display: block;
  margin: 0 0 0.2rem;
  padding: 0.12rem 0.3rem;
  border-radius: 4px;
  background: rgba(255, 153, 0, 0.22);
  border: 1px solid rgba(255, 153, 0, 0.45);
  font-size: 0.65rem;
  font-weight: 700;
  color: #ffcc80;
  white-space: nowrap;
}

.co-ts-hours--mismatch {
  background: rgba(220, 70, 70, 0.35) !important;
  color: #ffb4b4 !important;
  font-weight: 700;
  box-shadow: inset 0 0 0 1px rgba(255, 100, 100, 0.55);
}

.co-ts-row--hours-mismatch td.wh-ts-sticky--name {
  box-shadow: inset 3px 0 0 rgba(220, 70, 70, 0.85);
}

.co-ts-reconcile-hint {
  margin: 0 0 0.55rem;
  font-size: 0.78rem;
  color: #ffb4b4;
}

/* Расхождение по дню: полупрозрачная цифра + красная рамка + «!» */
.co-ts-table .co-ts-day--hours-mismatch {
  position: relative;
}

.co-ts-table .co-ts-day--hours-mismatch .co-ts-cell-input,
.co-ts-table .co-ts-day--hours-mismatch .wh-ts-cell-input {
  opacity: 0.42;
  box-shadow: inset 0 0 0 1.5px rgba(255, 90, 90, 0.95) !important;
}

.co-ts-mismatch-tip {
  position: absolute;
  top: -0.15rem;
  right: -0.1rem;
  z-index: 3;
  width: 0.95rem;
  height: 0.95rem;
  padding: 0;
  margin: 0;
  border: none;
  border-radius: 50%;
  background: #e53935;
  color: #fff;
  font-size: 0.62rem;
  font-weight: 800;
  line-height: 0.95rem;
  cursor: pointer;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35);
}

.co-ts-mismatch-tip:hover {
  background: #ff5252;
  transform: scale(1.08);
}

.co-ts-hours--mismatch,
.co-ts-hours--overtime-net {
  position: relative;
}

.co-ts-hours--overtime-net {
  color: #ffcc80;
  font-variant-numeric: tabular-nums;
}

.co-ts-mismatch-tip--hours {
  top: 0.15rem;
  right: 0.15rem;
}

.co-ts-mismatch-pop {
  position: absolute;
  z-index: 40;
  top: calc(100% + 0.25rem);
  right: 0;
  min-width: 14rem;
  max-width: 18rem;
  padding: 0.55rem 0.7rem;
  border-radius: 8px;
  background: #1a2233;
  border: 1px solid rgba(255, 100, 100, 0.55);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
  color: #f0f3f8;
  font-size: 0.78rem;
  line-height: 1.35;
  white-space: normal;
  text-align: left;
  pointer-events: auto;
}

.co-ts-mismatch-pop__title {
  font-weight: 700;
  color: #ff8a80;
  margin-bottom: 0.25rem;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.co-ts-mismatch-pop__body {
  color: #e8ecf4;
  white-space: pre-line;
}

.wh-ts-filter-empty {
  margin: 0.45rem 0.6rem 0.65rem;
  font-size: 0.8rem;
}

button.co-ts-help-btn {
  margin: 0 !important;
  width: auto !important;
  padding: 0.35rem 0.7rem;
  border-radius: 8px;
  border: 1px solid var(--j-border, #2e3648);
  background: #12161f;
  color: var(--j-text, #e8ecf4);
  font-size: 0.8rem;
  cursor: pointer;
}

button.co-ts-help-btn:hover,
button.co-ts-help-btn.active {
  border-color: rgba(199, 125, 255, 0.55);
  background: rgba(199, 125, 255, 0.12);
}

.co-ts-help-panel {
  position: absolute;
  top: calc(100% + 0.35rem);
  left: 0;
  z-index: 40;
  width: min(36rem, calc(100vw - 2rem));
  max-height: 22rem;
  overflow: auto;
  padding: 0.75rem 0.85rem;
  border-radius: 10px;
  border: 1px solid var(--j-border, #2e3648);
  background: #151a24;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45);
}

.co-ts-help-panel[hidden] {
  display: none !important;
}

.co-ts-help-panel__head {
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
  margin-bottom: 0.55rem;
}

.co-ts-help-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.35rem 0.75rem;
}

.co-ts-help-row {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.75rem;
}

.co-ts-help-row--edit {
  gap: 0.35rem;
}

.co-ts-help-swatch-wrap {
  position: relative;
  display: inline-flex;
  cursor: pointer;
  flex: 0 0 auto;
}

.co-ts-help-swatch-wrap .co-ts-help-color {
  position: absolute;
  inset: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  border: 0;
  padding: 0;
}

.co-ts-help-label-input {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  padding: 0.2rem 0.35rem;
  border-radius: 5px;
  border: 1px solid var(--j-border, #2e3648);
  background: #12161f;
  color: var(--j-text, #e8ecf4);
  font-size: 0.72rem;
}

.co-ts-help-swatch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.7rem;
  height: 1.35rem;
  padding: 0 0.25rem;
  border-radius: 4px;
  font-weight: 700;
  color: #1a1a1a;
  font-size: 0.72rem;
}

.co-ts-help-note {
  margin: 0.65rem 0 0;
  font-size: 0.72rem;
}

.co-ts-color-pop {
  position: absolute;
  z-index: 50;
  top: calc(100% + 2px);
  left: 50%;
  transform: translateX(-50%);
  min-width: 10rem;
  padding: 0.35rem;
  border-radius: 8px;
  border: 1px solid var(--j-border, #2e3648);
  background: #151a24;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.5);
}

.co-ts-color-pop__title {
  font-size: 0.65rem;
  color: var(--j-muted, #8b95a8);
  margin: 0 0 0.25rem 0.2rem;
}

button.co-ts-color-opt {
  display: flex !important;
  align-items: center;
  gap: 0.4rem;
  width: 100% !important;
  margin: 0 0 0.15rem !important;
  padding: 0.28rem 0.4rem;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--j-text, #e8ecf4);
  font-size: 0.72rem;
  cursor: pointer;
  text-align: left;
}

button.co-ts-color-opt:hover {
  background: rgba(255, 255, 255, 0.06);
}

.co-ts-color-opt__swatch {
  width: 0.9rem;
  height: 0.9rem;
  border-radius: 3px;
  flex: 0 0 auto;
}

.wh-ts-day-col {
  position: relative;
}

.co-ts-staff-table input[type="date"].co-ts-profile-input {
  color-scheme: dark;
  background: #12161f;
  color: var(--j-text, #e8ecf4);
  border: 1px solid var(--j-border, #2e3648);
  border-radius: 6px;
  min-height: 2rem;
  padding: 0.25rem 0.4rem;
}

.co-ts-staff-table input[type="date"].co-ts-profile-input::-webkit-calendar-picker-indicator {
  filter: invert(0.85) brightness(1.2);
  opacity: 0.9;
  cursor: pointer;
}

/* старое правило «прозрачный input на цветной td» больше не нужно — цвет на input */

#timesheet-view button.co-ts-sheet,
#timesheet-view button.co-ts-sheets-toggle,
#timesheet-view button.co-ts-missing-toggle {
  width: auto;
  max-width: none;
  margin: 0;
  margin-top: 0;
  flex: 0 0 auto;
}

.co-ts-vac-hint {
  margin: 0 0 0.45rem;
  font-size: 0.8rem;
}

.co-ts-vac-months {
  display: flex;
  flex-wrap: wrap;
  gap: 0.28rem;
  margin: 0 0 0.65rem;
}

button.co-ts-vac-month-btn {
  margin: 0 !important;
  width: auto !important;
  padding: 0.22rem 0.5rem;
  border-radius: 6px;
  border: 1px solid var(--j-border, #2e3648);
  background: #12161f;
  color: var(--j-muted, #8b95a8);
  font-size: 0.72rem;
  text-transform: capitalize;
  cursor: pointer;
}

button.co-ts-vac-month-btn:hover {
  filter: none;
  color: var(--j-text, #e8ecf4);
}

button.co-ts-vac-month-btn.active {
  background: var(--accent, #5b9cf5);
  border-color: var(--accent, #5b9cf5);
  color: #0b1020;
  font-weight: 700;
}

.co-ts-staff-table th,
.co-ts-staff-table td {
  font-size: 0.82rem;
}

.co-ts-staff-table .co-ts-profile-input,
.co-ts-table .co-ts-job-input,
.co-ts-table .co-ts-dept-select {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  margin: 0;
  padding: 0.28rem 0.35rem;
  border-radius: 6px;
  border: 1px solid var(--j-border, #2a3142);
  background: #12161f;
  color: var(--j-text, #e8ecf4);
  font: inherit;
  font-size: 0.78rem;
}

.co-ts-staff-actions {
  margin: 0.55rem 0;
}

button.co-ts-add-profile {
  margin: 0 !important;
  width: auto !important;
}


/* ——— Сводный отчёт ——— */
body.summary-active .topbar {
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

.summary-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.75rem;
  align-items: center;
  margin: 0.5rem 0 0.75rem;
}

.summary-hint {
  margin: 0 0 0.5rem;
  font-size: 0.82rem;
  line-height: 1.4;
}

.summary-intersections {
  margin: 0 0 0.75rem;
  padding-left: 1.1rem;
  font-size: 0.78rem;
  line-height: 1.45;
}

.summary-table-wrap {
  overflow: auto;
  max-height: calc(100vh - 14rem);
  border: 1px solid var(--j-border, var(--border));
  border-radius: var(--ui-card-radius, 10px);
}

.summary-table {
  width: max-content;
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.8rem;
}

.summary-table thead th,
.summary-table tfoot td {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--surface, #1a1f2b);
}

.summary-table tfoot td {
  top: auto;
  bottom: 0;
  font-weight: 600;
  border-top: 1px solid var(--j-border, var(--border));
}

.summary-th {
  white-space: nowrap;
  font-size: 0.68rem;
  font-weight: 600;
  text-align: center;
  padding: 0.4rem 0.35rem;
  vertical-align: middle;
}

.summary-th-date,
.summary-date,
.summary-table .sticky-col {
  position: sticky;
  left: 0;
  z-index: 3;
  background: var(--surface, #1a1f2b);
  text-align: left;
  min-width: 3.2rem;
}

.summary-brand-logo {
  display: block;
  height: 1.35rem;
  width: auto;
  max-width: 5.5rem;
  margin: 0 auto;
}

.summary-cell {
  text-align: right;
  padding: 0.28rem 0.4rem;
  white-space: nowrap;
}

.summary-cell-1c {
  max-width: 14rem;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 0.72rem;
  text-align: left;
}

.summary-cell-total,
.summary-th-total {
  font-weight: 700;
  background: rgba(255, 255, 255, 0.04);
}

.summary-th-ret,
.summary-cell-ret {
  opacity: 0.95;
}

.summary-totals-row td {
  background: rgba(255, 255, 255, 0.03);
}

/* Бренд-цвета цифр */
.summary-brand-ozon,
.summary-cell.summary-brand-ozon { color: #4d8dff; }
.summary-brand-yandex,
.summary-cell.summary-brand-yandex { color: #f5d000; }
.summary-brand-sber,
.summary-cell.summary-brand-sber { color: #3dcf5a; }
.summary-brand-wb,
.summary-cell.summary-brand-wb { color: #e84ec8; }
.summary-brand-cdek,
.summary-cell.summary-brand-cdek { color: #2fd47a; }
.summary-brand-fivepost,
.summary-cell.summary-brand-fivepost { color: #ff5a5a; }
.summary-brand-dalli,
.summary-cell.summary-brand-dalli { color: #6a9de8; }
.summary-brand-post,
.summary-cell.summary-brand-post { color: #5a9de0; }
.summary-brand-courierist,
.summary-cell.summary-brand-courierist { color: #ff9350; }
.summary-brand-logsis,
.summary-cell.summary-brand-logsis { color: #6b9bff; }
.summary-brand-total,
.summary-cell.summary-brand-total { color: #8A8AD3; }

/* Сводный: скруглённые ячейки как в выработке */
.summary-table td.summary-cell,
.summary-table td.summary-date,
.summary-table td.summary-channel-cell {
  padding: 0.22rem 0.28rem;
  vertical-align: middle;
}

.summary-pill {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.25rem;
  min-height: 1.7rem;
  min-width: 2.4rem;
  padding: 0.22rem 0.45rem;
  border-radius: 6px;
  border: 1px solid var(--j-border, #2e3648);
  background: #12161f;
  font-family: var(--j-mono, ui-monospace, monospace);
  font-size: 0.76rem;
  line-height: 1.15;
  white-space: nowrap;
}

.summary-pill-date {
  justify-content: center;
  font-family: inherit;
  font-weight: 600;
}

.summary-pill-1c {
  max-width: 12rem;
  overflow: hidden;
  text-overflow: ellipsis;
  justify-content: flex-start;
  font-family: inherit;
  font-size: 0.7rem;
}

.summary-pill-total {
  font-weight: 700;
  background: rgba(255, 255, 255, 0.05);
}

.summary-pill-stack {
  flex-direction: column;
  align-items: flex-end;
  gap: 0.05rem;
  min-width: 3.4rem;
}

.summary-pill-delta {
  font-size: 0.62rem;
  opacity: 0.9;
}

.summary-pill-up {
  background: rgba(34, 197, 94, 0.14);
  border-color: rgba(34, 197, 94, 0.35);
  color: #4ade80;
}

.summary-pill-down {
  background: rgba(239, 68, 68, 0.14);
  border-color: rgba(239, 68, 68, 0.35);
  color: #f87171;
}

.summary-pill-flat {
  background: rgba(148, 163, 184, 0.1);
  border-color: rgba(148, 163, 184, 0.25);
}

.summary-pill.summary-brand-ozon { color: #4d8dff; }
.summary-pill.summary-brand-yandex { color: #f5d000; }
.summary-pill.summary-brand-sber { color: #3dcf5a; }
.summary-pill.summary-brand-wb { color: #e84ec8; }
.summary-pill.summary-brand-cdek { color: #2fd47a; }
.summary-pill.summary-brand-fivepost { color: #ff5a5a; }
.summary-pill.summary-brand-dalli { color: #6a9de8; }
.summary-pill.summary-brand-post { color: #5a9de0; }
.summary-pill.summary-brand-courierist { color: #ff9350; }
.summary-pill.summary-brand-logsis { color: #6b9bff; }

/* Анализ */
.summary-kpi-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
  margin: 0 0 1rem;
}

.summary-kpi-card {
  border: 1px solid var(--j-border, #2a3142);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.02);
  padding: 0.75rem 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.summary-kpi-value {
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.summary-kpi-sub {
  font-size: 0.75rem;
}

.summary-rank-list {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.summary-rank-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.summary-brand-logo--sm {
  height: 1.1rem;
  max-width: 4.5rem;
}

.summary-section-title {
  margin: 1rem 0 0.35rem;
  font-size: 0.95rem;
}

.summary-analytics-chart-block {
  border: 1px solid var(--j-border, #2a3142);
  border-radius: 10px;
  padding: 0.75rem;
  margin-bottom: 1rem;
  background: rgba(255, 255, 255, 0.02);
}

.summary-chart-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-bottom: 0.65rem;
}

.summary-chart-chip {
  border: 1px solid color-mix(in srgb, var(--chip, #8b95a8) 45%, #2a3142);
  background: color-mix(in srgb, var(--chip, #8b95a8) 12%, transparent);
  color: var(--j-text, #e8ecf4);
  border-radius: 999px;
  padding: 0.25rem 0.65rem;
  font-size: 0.72rem;
  cursor: pointer;
}

.summary-chart-chip.is-active {
  outline: 1px solid var(--chip, #8b95a8);
  background: color-mix(in srgb, var(--chip, #8b95a8) 22%, transparent);
}

.summary-analytics-chart-wrap {
  width: 100%;
}

.summary-analytics-chart {
  width: 100%;
  height: auto;
  display: block;
}

.summary-analytics-axis {
  stroke: rgba(255, 255, 255, 0.12);
  stroke-width: 1;
}

.summary-analytics-x {
  display: grid;
  gap: 0.15rem;
  margin-top: 0.35rem;
  font-size: 0.68rem;
  color: var(--j-muted, #8b95a8);
  text-align: center;
}

.summary-chart-note {
  margin: 0.45rem 0 0;
  font-size: 0.74rem;
}

.summary-channel-cell {
  min-width: 5.5rem;
}

.summary-table--analytics .summary-pill-stack .summary-pill-val {
  font-weight: 600;
}

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

.summary-chart-channels {
  margin-bottom: 0.55rem;
}

.summary-chart-channels-summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.45rem 0.65rem;
  border: 1px solid var(--j-border, #2a3142);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
  font-size: 0.82rem;
}

.summary-chart-channels-summary::-webkit-details-marker {
  display: none;
}

.summary-chart-channels[open] .summary-chart-channels-summary {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.summary-chart-channels .summary-chart-chips {
  border: 1px solid var(--j-border, #2a3142);
  border-top: 0;
  border-radius: 0 0 8px 8px;
  padding: 0.55rem 0.65rem 0.65rem;
  background: rgba(255, 255, 255, 0.02);
}

.summary-chart-channels-toggle {
  font-size: 0.72rem;
  white-space: nowrap;
}

.summary-bar-value {
  fill: #e8ecf4;
  font-size: 11px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight: 600;
}

.summary-rank-heading {
  display: block;
  margin: 0.35rem 0 0.25rem;
  font-size: 0.72rem;
}

.summary-kpi-card--ranks .summary-rank-heading:first-child {
  margin-top: 0;
}

.summary-rank-list {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  width: 100%;
}

.summary-rank-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
}

.summary-rank-left {
  min-width: 0;
  display: flex;
  align-items: center;
}

.summary-rank-name {
  font-size: 0.8rem;
  font-weight: 600;
}

.summary-rank-right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.3rem;
  flex-wrap: nowrap;
}

#summary-month-nav .summary-channel-picker {
  margin-left: 0.65rem;
}

.summary-channel-picker {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.78rem;
}

.summary-channel-select {
  min-width: 12rem;
  max-width: 18rem;
  padding: 0.35rem 0.55rem;
  border-radius: 8px;
  border: 1px solid var(--j-border, #2a3142);
  background: #12161f;
  color: var(--j-text, #e8ecf4);
  font: inherit;
  font-size: 0.8rem;
}

.summary-kpi-grid--two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 0.75rem;
}

.summary-kpi-card--compact {
  padding: 0.55rem 0.75rem;
  gap: 0.25rem;
}

.summary-kpi-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.summary-kpi-card--compact .summary-kpi-value {
  font-size: 1.15rem;
}

.summary-analytics-chart-block--compact {
  padding: 0.55rem 0.65rem;
  margin-bottom: 0.75rem;
}

.summary-mbar-plot {
  position: relative;
  margin-top: 0.35rem;
  width: 100%;
}

.summary-mbar-stage {
  position: relative;
  height: 150px;
}

.summary-mbar-grid {
  display: grid;
  gap: 0.15rem;
  align-items: end;
  width: 100%;
  min-height: 140px;
}

.summary-mbar-grid--stage {
  position: relative;
  z-index: 1;
  height: 100%;
  min-height: 0;
}

.summary-mbar-grid--stage .summary-mbar-col {
  height: 100%;
}

.summary-mbar-lines {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}

.summary-mbar-line-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.summary-mbar-dot {
  position: absolute;
  width: 7px;
  height: 7px;
  margin-left: -3.5px;
  margin-top: -3.5px;
  border-radius: 50%;
  border: 1.5px solid #12161f;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.12);
}

.summary-mbar-xrow {
  display: grid;
  gap: 0.15rem;
  margin-top: 0.35rem;
  text-align: center;
}

.summary-topch-row {
  display: grid;
  grid-template-columns: 0.55rem 4.2rem minmax(0, 1fr) auto;
  gap: 0.3rem;
  align-items: center;
  margin-bottom: 0.28rem;
  font-size: 0.68rem;
}

.summary-topch-swatch {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 2px;
  flex-shrink: 0;
}

.summary-mbar-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
  height: 140px;
}

.summary-mbar-track {
  position: relative;
  flex: 1;
  width: 72%;
  max-width: 2.4rem;
  min-height: 0;
  display: flex;
  align-items: flex-end;
  border-radius: 5px 5px 0 0;
}

.summary-mbar-fill {
  width: 100%;
  border-radius: 5px 5px 2px 2px;
  min-height: 3px;
}

.summary-mbar-val {
  position: absolute;
  left: 50%;
  bottom: 100%;
  transform: translateX(-50%);
  margin-bottom: 0.15rem;
  font-size: 0.58rem;
  line-height: 1;
  color: var(--j-text, #e8ecf4);
  white-space: nowrap;
  pointer-events: none;
}

.summary-mbar-x {
  margin-top: 0.35rem;
  font-size: 0.68rem;
  color: var(--j-muted, #8b95a8);
  text-align: center;
}

.summary-mbar-col.is-empty .summary-mbar-track {
  opacity: 0.2;
  background: rgba(255, 255, 255, 0.03);
}

.summary-volume-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(11rem, 15rem);
  gap: 0.85rem;
  align-items: end;
}

.summary-topch {
  border-left: 1px solid var(--j-border, #2a3142);
  padding-left: 0.75rem;
}

.summary-topch-title {
  font-size: 0.72rem;
  margin-bottom: 0.4rem;
}

.summary-topch-name {
  color: var(--j-muted, #8b95a8);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.summary-topch-track {
  height: 0.45rem;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.05);
  overflow: hidden;
}

.summary-topch-fill {
  height: 100%;
  border-radius: 3px;
}

.summary-topch-note {
  margin: 0.45rem 0 0;
  font-size: 0.65rem;
  line-height: 1.3;
}

.summary-topch-val {
  font-variant-numeric: tabular-nums;
  color: var(--j-text, #e8ecf4);
  white-space: nowrap;
  font-size: 0.62rem;
}

.summary-combo-svg {
  width: 100%;
  height: 120px;
  display: block;
}

.summary-combo-stage {
  position: relative;
  height: 130px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.summary-combo-bars {
  display: grid;
  gap: 0.15rem;
  height: 100%;
  align-items: end;
}

.summary-combo-bar-col {
  height: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  min-width: 0;
}

.summary-combo-bar-track {
  width: 55%;
  max-width: 1.8rem;
  height: 100%;
  display: flex;
  align-items: flex-end;
}

.summary-combo-bar-fill {
  width: 100%;
  border-radius: 4px 4px 2px 2px;
  opacity: 0.42;
  min-height: 2px;
}

.summary-combo-bar-col.is-empty {
  opacity: 0.35;
}

.summary-combo-line-layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.summary-combo-line-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.summary-combo-zero-html {
  position: absolute;
  left: 0;
  right: 0;
  border-top: 1px dashed rgba(245, 158, 11, 0.4);
}

.summary-combo-dot {
  position: absolute;
  width: 8px;
  height: 8px;
  margin-left: -4px;
  margin-top: -4px;
  border-radius: 50%;
  background: #f59e0b;
  border: 2px solid #12161f;
  box-shadow: 0 0 0 1px rgba(245, 158, 11, 0.35);
}

.summary-combo-meta {
  display: grid;
  gap: 0.15rem;
  margin-top: 0.35rem;
}

.summary-combo-meta-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.2rem;
  min-width: 0;
}

.summary-combo-meta-val {
  font-size: 0.58rem;
  color: var(--j-text, #e8ecf4);
  white-space: nowrap;
  overflow: hidden;
  max-width: 100%;
  text-overflow: ellipsis;
}

.summary-combo-meta-pct {
  font-size: 0.58rem !important;
  padding: 0.1rem 0.28rem !important;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.summary-combo-meta-col.is-empty {
  opacity: 0.45;
}

@media (max-width: 960px) {
  .summary-volume-layout {
    grid-template-columns: 1fr;
  }
  .summary-topch {
    border-left: none;
    border-top: 1px solid var(--j-border, #2a3142);
    padding-left: 0;
    padding-top: 0.55rem;
  }
}

.summary-growth-grid--stack {
  grid-template-columns: 1fr;
}

.summary-combo-body {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 0.35rem;
  align-items: stretch;
}

.summary-combo-plot {
  min-width: 0;
}

.summary-combo-svg {
  width: 100%;
  height: 160px;
  display: block;
}

.summary-analytics-x--flush {
  margin-top: 0.25rem;
}

.summary-movers-card--chart {
  padding: 0.75rem 0.85rem;
}

.summary-hbar-list {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-top: 0.5rem;
}

.summary-hbar-row {
  display: grid;
  grid-template-columns: 6.5rem minmax(0, 1fr) 9.5rem;
  gap: 0.45rem;
  align-items: center;
}

.summary-hbar-name {
  min-width: 0;
  overflow: hidden;
}

.summary-hbar-track {
  position: relative;
  height: 0.7rem;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.04);
  overflow: hidden;
}

.summary-hbar-zero {
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 1px;
  background: rgba(255, 255, 255, 0.2);
}

.summary-hbar-fill {
  position: absolute;
  top: 0;
  bottom: 0;
}

.summary-hbar-fill--pos {
  left: 50%;
  background: rgba(52, 211, 153, 0.75);
  border-radius: 0 4px 4px 0;
}

.summary-hbar-fill--neg {
  right: 50%;
  background: rgba(248, 113, 113, 0.75);
  border-radius: 4px 0 0 4px;
}

.summary-hbar-meta {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.summary-hbar-abs {
  font-size: 0.65rem;
  white-space: nowrap;
}

@media (max-width: 960px) {
  .summary-hbar-row {
    grid-template-columns: 5rem minmax(0, 1fr);
  }
  .summary-hbar-meta {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }
  .summary-mbar-val {
    font-size: 0.55rem;
    height: auto;
  }
}

.summary-chart-legend {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  flex-wrap: wrap;
  font-size: 0.75rem;
  color: var(--j-muted, #8b95a8);
  margin-bottom: 0.35rem;
}

.summary-chart-legend-swatch {
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 3px;
  display: inline-block;
}

.summary-chart-legend-line {
  width: 1.1rem;
  height: 0;
  border-top: 2.5px solid #f59e0b;
  display: inline-block;
}

.summary-growth-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(14rem, 0.9fr);
  gap: 0.75rem;
  margin-bottom: 0.85rem;
  align-items: start;
}

.summary-movers-card {
  border: 1px solid var(--j-border, #2a3142);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.02);
  padding: 0.65rem 0.75rem;
}

.summary-analytics-chart-block--combo {
  padding: 0.55rem 0.65rem;
}

.summary-analytics-chart-block--combo .summary-analytics-chart {
  max-height: 180px;
  width: 100%;
}

.summary-combo-wrap {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 0.35rem;
  align-items: stretch;
}

.summary-combo-yscale {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  font-size: 0.62rem;
  padding: 0.15rem 0;
  min-width: 2.4rem;
  text-align: right;
}

.summary-combo-yscale--right {
  text-align: left;
}

.summary-combo-grid {
  stroke: rgba(255, 255, 255, 0.06);
  stroke-width: 1;
}

.summary-combo-zero {
  stroke: rgba(245, 158, 11, 0.45);
  stroke-width: 1.2;
  stroke-dasharray: 4 3;
}

.summary-line-value {
  fill: #fbbf24;
  font-size: 9px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight: 600;
}

.summary-movers-card .summary-rank-heading {
  display: block;
  margin: 0.45rem 0 0.3rem;
}

.summary-movers-card .summary-rank-heading:first-child {
  margin-top: 0;
}

.summary-bar-value {
  font-size: 9.5px;
}

@media (max-width: 960px) {
  .summary-growth-grid,
  .summary-kpi-grid--two {
    grid-template-columns: 1fr;
  }
}

/* ===== Главная (фирменный экран) ===== */
:root {
  --home-brand: #b28eff;
  --home-brand-deep: #8f6ae0;
  --home-mint: #9fc9c0;
  --home-peach: #f0b89a;
  --home-ink: #1c1630;
  --home-muted: #6d6680;
  --home-paper: #e8e0f5;
  --home-card: linear-gradient(145deg, rgba(178, 142, 255, 0.16), rgba(255, 255, 255, 0.55) 58%);
  --home-card-soft: linear-gradient(160deg, rgba(178, 142, 255, 0.12), rgba(255, 255, 255, 0.48) 62%);
  --home-line: rgba(178, 142, 255, 0.32);
  --home-font-display: "Fraunces", Georgia, serif;
  --home-font: "Manrope", system-ui, sans-serif;
}

#home-view {
  min-height: calc(100vh - 3.5rem);
  padding: 1rem 1.1rem 2rem;
  background:
    radial-gradient(1100px 520px at 8% -10%, rgba(178, 142, 255, 0.42), transparent 58%),
    radial-gradient(900px 480px at 94% 8%, rgba(159, 201, 192, 0.18), transparent 52%),
    linear-gradient(165deg, #ebe3f8 0%, #e4daf4 45%, #ddd2f0 100%);
  color: var(--home-ink);
  font-family: var(--home-font);
}

.home-shell {
  max-width: 1100px;
  margin: 0 auto;
}

.home-top {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem 1.5rem;
  margin-bottom: 1.35rem;
  animation: home-fade-up .45s ease both;
}

.home-brand {
  display: flex;
  align-items: center;
  gap: 1rem;
  min-width: 0;
}

.home-flower {
  width: min(240px, 42vw);
  height: auto;
  display: block;
  filter: drop-shadow(0 8px 18px rgba(178, 142, 255, 0.25));
  animation: home-float 5.5s ease-in-out infinite;
}

.home-kicker {
  margin: 0;
  font-size: .72rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--home-brand-deep);
  font-weight: 700;
}

.home-title {
  margin: .1rem 0 0;
  font-family: var(--home-font-display);
  font-weight: 650;
  font-size: clamp(1.8rem, 3vw, 2.45rem);
  letter-spacing: -0.02em;
  color: var(--home-ink);
  line-height: 1.05;
}

.home-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .65rem .85rem;
}

.home-day-toggles {
  display: inline-flex;
  padding: .2rem;
  border-radius: 999px;
  background: linear-gradient(145deg, rgba(178, 142, 255, 0.18), rgba(255, 255, 255, 0.5) 60%);
  border: 1px solid var(--home-line);
  box-shadow: 0 8px 24px rgba(80, 50, 140, 0.06);
}

.home-day-toggle {
  border: 0;
  background: transparent;
  color: var(--home-muted);
  font: inherit;
  font-weight: 600;
  font-size: .86rem;
  padding: .42rem .95rem;
  border-radius: 999px;
  cursor: pointer;
  transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}

.home-day-toggle.active {
  background: var(--home-brand);
  color: #fff;
  box-shadow: 0 6px 16px rgba(178, 142, 255, 0.35);
}

.home-date,
.home-year {
  font-size: .88rem;
  color: var(--home-muted);
}

.home-year strong {
  color: var(--home-ink);
  font-weight: 700;
}

.home-hero-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .9rem;
  margin-bottom: 1rem;
}

.home-metric {
  background: var(--home-card);
  border: 1px solid var(--home-line);
  border-radius: 18px;
  padding: 1.05rem 1.15rem 1.1rem;
  backdrop-filter: blur(10px);
  box-shadow: 0 12px 30px rgba(70, 40, 130, 0.06);
  animation: home-fade-up .55s ease both;
}

.home-metric:nth-child(2) { animation-delay: .06s; }
.home-metric:nth-child(3) { animation-delay: .12s; }

.home-metric--hero {
  background:
    linear-gradient(145deg, rgba(178, 142, 255, 0.28), rgba(255, 255, 255, 0.52) 55%);
  border-color: rgba(178, 142, 255, 0.42);
}

.home-metric--cash {
  background: var(--home-card-soft);
}

.home-metric__label {
  margin: 0;
  font-size: .78rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--home-muted);
  font-weight: 700;
}

.home-metric__value {
  margin: .45rem 0 .2rem;
  font-family: var(--home-font-display);
  font-size: clamp(1.85rem, 3.2vw, 2.6rem);
  font-weight: 650;
  letter-spacing: -0.03em;
  color: var(--home-ink);
  line-height: 1;
}

.home-metric--hero .home-metric__value {
  color: var(--home-brand-deep);
}

.home-metric__hint {
  margin: 0;
  font-size: .82rem;
  color: var(--home-muted);
}

.home-pace {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  margin-bottom: 1.1rem;
}

.home-pace-item {
  display: flex;
  align-items: baseline;
  gap: .55rem;
  flex-wrap: wrap;
  padding: .75rem 1rem;
  border-radius: 14px;
  background: var(--home-card-soft);
  border: 1px solid var(--home-line);
  animation: home-fade-up .6s ease both;
  animation-delay: .14s;
}

.home-pace__label {
  color: var(--home-muted);
  font-size: .84rem;
  font-weight: 600;
}

.home-pace-item strong {
  font-size: 1.15rem;
  font-weight: 700;
}

.home-delta {
  font-size: .82rem;
  font-weight: 700;
  color: var(--home-muted);
}

.home-delta.is-up { color: #2f9e74; }
.home-delta.is-down { color: #d4556a; }

.home-section {
  margin-top: 1.15rem;
  padding: 1rem 1.1rem 1.15rem;
  border-radius: 18px;
  background: var(--home-card-soft);
  border: 1px solid var(--home-line);
  backdrop-filter: blur(8px);
  box-shadow: 0 10px 26px rgba(70, 40, 130, 0.05);
  animation: home-fade-up .65s ease both;
  animation-delay: .18s;
}

.home-section__title {
  margin: 0 0 .85rem;
  font-family: var(--home-font-display);
  font-size: 1.15rem;
  font-weight: 650;
  color: var(--home-ink);
}

.home-chart {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: .35rem;
  align-items: end;
  min-height: 140px;
}

.home-chart-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .35rem;
  min-width: 0;
}

.home-chart-bar-wrap {
  width: 100%;
  height: 110px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

.home-chart-bar {
  width: 70%;
  max-width: 28px;
  border-radius: 8px 8px 4px 4px;
  background: linear-gradient(180deg, var(--home-brand), var(--home-brand-deep));
  box-shadow: 0 8px 16px rgba(178, 142, 255, 0.28);
  transition: height .35s ease;
}

.home-chart-label {
  font-size: .68rem;
  color: var(--home-muted);
  font-weight: 600;
}

.home-cash-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}

.home-metric--cash .home-metric__value {
  font-size: clamp(1.35rem, 2.4vw, 1.85rem);
}

.home-channels {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .45rem;
}

.home-empty {
  padding: 2rem 0;
  text-align: center;
}

@keyframes home-fade-up {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes home-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
}

@media (max-width: 860px) {
  .home-hero-metrics,
  .home-cash-grid,
  .home-pace {
    grid-template-columns: 1fr;
  }
  .home-flower {
    width: min(180px, 55vw);
  }
}

.home-metric__value--slash {
  font-size: clamp(1.35rem, 2.6vw, 1.9rem);
}

.home-incomplete {
  font-size: .75rem;
  font-weight: 600;
}

.home-chart-meta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .18rem;
  min-width: 0;
}

.home-chart-val {
  font-size: .68rem;
  font-weight: 700;
  color: var(--home-ink);
  white-space: nowrap;
}

.home-chart-pct {
  font-size: .62rem;
  font-weight: 700;
  padding: .12rem .35rem;
  border-radius: 999px;
  background: rgba(120, 120, 140, 0.14);
  color: var(--home-muted);
  white-space: nowrap;
}

.home-chart-pct.is-up {
  background: rgba(47, 158, 116, 0.18);
  color: #1f7a58;
}

.home-chart-pct.is-down {
  background: rgba(212, 85, 106, 0.16);
  color: #b03d52;
}

.home-chart-bar-wrap {
  height: 96px;
}

.home-section__hint {
  margin: -.35rem 0 .7rem;
  font-size: .8rem;
}

.home-channel {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) auto auto;
  align-items: center;
  gap: .55rem;
  padding: .55rem .7rem;
  border-radius: 10px;
  background: linear-gradient(120deg, rgba(178, 142, 255, 0.14), rgba(255, 255, 255, 0.35) 70%);
  font-weight: 600;
}

.home-channel__pair {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  font-size: .88rem;
}

.home-two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .9rem;
  margin-top: 1.15rem;
}

.home-two-col .home-section {
  margin-top: 0;
}

.home-cash-grid--one {
  grid-template-columns: minmax(0, 320px);
}

.home-section-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: .75rem;
}

.home-section-head .home-section__title {
  margin: 0;
}

.home-accrued-controls {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem .75rem;
}

.home-accrued-controls label {
  display: flex;
  flex-direction: column;
  gap: .2rem;
  font-size: .75rem;
  color: var(--home-muted);
  font-weight: 600;
}

.home-accrued-controls select {
  min-width: 8.5rem;
  border: 1px solid var(--home-line);
  border-radius: 10px;
  background: linear-gradient(145deg, rgba(178, 142, 255, 0.18), rgba(255, 255, 255, 0.42) 65%);
  color: var(--home-ink);
  padding: .35rem .55rem;
  font: inherit;
  font-weight: 600;
  backdrop-filter: blur(6px);
  box-shadow: 0 4px 12px rgba(70, 40, 130, 0.04);
}

.home-accrued-controls select:focus {
  outline: none;
  border-color: rgba(178, 142, 255, 0.55);
  box-shadow: 0 0 0 3px rgba(178, 142, 255, 0.18);
}

.home-accrued-chart {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-end;
  gap: .45rem;
  overflow-x: auto;
  min-height: 200px;
  padding-bottom: .15rem;
  width: 100%;
}

.home-accrued-chart--months {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: .4rem;
  justify-content: stretch;
  overflow-x: visible;
}

.home-accrued-chart--months .home-accrued-col {
  flex: unset;
  width: auto;
  min-width: 0;
}

.home-accrued-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 0;
  min-width: 0;
  flex: 0 0 4.2rem;
  width: 4.2rem;
}

.home-accrued-col.is-empty .home-accrued-val,
.home-accrued-col.is-empty .home-accrued-label {
  opacity: .45;
}

.home-accrued-bar-wrap {
  width: 100%;
  height: 120px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  flex: 0 0 120px;
}

.home-accrued-chart--months .home-accrued-bar {
  width: 55%;
  max-width: 28px;
}

.home-accrued-bar {
  width: 62%;
  max-width: 26px;
  border-radius: 8px 8px 4px 4px;
  background: linear-gradient(180deg, var(--home-brand), var(--home-brand-deep));
  box-shadow: 0 8px 16px rgba(178, 142, 255, 0.28);
}

.home-accrued-chart--months .home-accrued-val {
  font-size: .58rem;
  letter-spacing: -0.02em;
  white-space: normal;
  text-align: center;
  line-height: 1.1;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.home-accrued-foot {
  flex: 0 0 3.4rem;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: .2rem;
  margin-top: .35rem;
  min-height: 3.4rem;
}

.home-accrued-val {
  font-size: .66rem;
  font-weight: 700;
  color: var(--home-ink);
  line-height: 1.1;
  white-space: nowrap;
}

.home-accrued-label {
  font-size: .62rem;
  font-weight: 600;
  color: var(--home-muted);
  text-align: center;
  line-height: 1.15;
  max-width: 100%;
  height: 1.55rem;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

/* Транспортные — горизонтальные шкалы топ-5 */
.home-hbars {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}

.home-hbar-row {
  display: grid;
  grid-template-columns: 0.7rem minmax(5.5rem, 7.5rem) minmax(0, 1fr) auto;
  align-items: center;
  gap: .55rem .65rem;
  min-width: 0;
}

.home-hbar-swatch {
  width: .7rem;
  height: .7rem;
  border-radius: 4px;
  background: var(--home-brand);
  flex-shrink: 0;
}

.home-hbar-name {
  font-size: .86rem;
  font-weight: 700;
  color: var(--home-ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

.home-hbar-track {
  height: .72rem;
  border-radius: 999px;
  background: rgba(178, 142, 255, 0.2);
  overflow: hidden;
  min-width: 0;
}

.home-hbar-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--home-brand), var(--home-brand-deep));
}

.home-hbar-meta {
  display: flex;
  align-items: center;
  gap: .4rem;
  justify-content: flex-end;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.home-hbar-pair {
  font-size: .84rem;
  font-weight: 700;
  color: var(--home-ink);
}

@media (max-width: 860px) {
  .home-hbar-row {
    grid-template-columns: 0.7rem minmax(0, 1fr);
    grid-template-areas:
      "swatch name"
      "track track"
      "meta meta";
  }
  .home-hbar-swatch { grid-area: swatch; }
  .home-hbar-name { grid-area: name; }
  .home-hbar-track { grid-area: track; }
  .home-hbar-meta { grid-area: meta; justify-content: flex-start; }
}

@media (max-width: 860px) {
  .home-two-col {
    grid-template-columns: 1fr;
  }
  .home-channel {
    grid-template-columns: 1fr;
    gap: .2rem;
  }
}

/* ===== Светлая тема: фирменный стиль на всех пространствах ===== */
html.theme-light,
html.theme-light body,
body.theme-light {
  --bg: #d8c8f4;
  --bg-elevated: rgba(255, 255, 255, 0.72);
  --bg-hover: rgba(178, 142, 255, 0.14);
  --border: rgba(178, 142, 255, 0.32);
  --text: #1c1630;
  --muted: #6d6680;
  --accent: #b28eff;
  --accent-dim: rgba(178, 142, 255, 0.35);
  --j-bg: #d8c8f4;
  --j-card: color-mix(in srgb, #b28eff 36%, #fff);
  --j-card-elevated: color-mix(in srgb, #b28eff 42%, #fff);
  --j-border: rgba(143, 106, 224, 0.42);
  --j-hover: rgba(178, 142, 255, 0.16);
  --j-text: #1c1630;
  --j-muted: #6d6680;
  --j-accent: #b28eff;
  --page-bg: transparent;
  --brand-cell: color-mix(in srgb, #b28eff 36%, #fff);
  --brand-cell-strong: color-mix(in srgb, #b28eff 48%, #fff);
  --brand-cell-active: color-mix(in srgb, #b28eff 72%, #8f6ae0);
  --brand-line: rgba(143, 106, 224, 0.48);
  --brand-ink: #1c1630;
  --brand-muted: #6d6680;
}

html.theme-light body,
body.theme-light {
  background-color: #d4c0f2;
  background-image:
    radial-gradient(920px 640px at -4% -8%, rgba(178, 142, 255, 0.78), transparent 62%),
    radial-gradient(880px 620px at 104% -6%, rgba(143, 106, 224, 0.72), rgba(178, 142, 255, 0.28) 42%, transparent 68%),
    radial-gradient(820px 580px at 108% 108%, rgba(178, 142, 255, 0.7), rgba(214, 196, 245, 0.35) 45%, transparent 70%),
    radial-gradient(760px 520px at -8% 110%, rgba(143, 106, 224, 0.55), transparent 64%),
    radial-gradient(900px 700px at 50% 42%, rgba(255, 255, 255, 0.38), transparent 58%),
    linear-gradient(155deg, #c9b0f0 0%, #d8c8f4 38%, #e6daf8 72%, #d2bef0 100%);
  background-attachment: fixed;
  color: var(--text);
}

/* --- Шапка --- */
html.theme-light .topbar,
body.theme-light .topbar {
  background: linear-gradient(145deg, rgba(178, 142, 255, 0.18), rgba(255, 255, 255, 0.72) 60%);
  border-bottom-color: rgba(178, 142, 255, 0.28);
  backdrop-filter: blur(12px);
  box-shadow: 0 8px 24px rgba(80, 50, 140, 0.05);
}

html.theme-light .topbar-title,
body.theme-light .topbar-title { color: var(--brand-ink); }

html.theme-light .topbar-nav-btn,
body.theme-light .topbar-nav-btn {
  border-color: rgba(178, 142, 255, 0.28);
  color: var(--brand-ink);
  background: rgba(255, 255, 255, 0.35);
}

html.theme-light .topbar-nav-btn:hover,
body.theme-light .topbar-nav-btn:hover {
  background: rgba(178, 142, 255, 0.16);
}

html.theme-light .topbar-nav-btn.active,
body.theme-light .topbar-nav-btn.active {
  background: #b28eff;
  border-color: #b28eff;
  color: #fff;
  box-shadow: 0 6px 16px rgba(178, 142, 255, 0.35);
}

html.theme-light .topbar .ghost,
body.theme-light .topbar .ghost {
  border: 1px solid rgba(178, 142, 255, 0.35);
  background: var(--brand-cell);
  color: var(--brand-ink);
}

html.theme-light .topbar .ghost:hover,
body.theme-light .topbar .ghost:hover {
  background: color-mix(in srgb, #b28eff 46%, #fff);
}

html.theme-light #theme-toggle-btn,
body.theme-light #theme-toggle-btn {
  border-color: rgba(178, 142, 255, 0.45);
  background: linear-gradient(145deg, rgba(178, 142, 255, 0.22), rgba(255, 255, 255, 0.7));
  color: #8f6ae0;
  font-weight: 700;
}

#theme-toggle-btn { white-space: nowrap; }

/* --- Общие экраны --- */
html.theme-light #main-screen > [id$="-view"]:not(#home-view),
body.theme-light #main-screen > [id$="-view"]:not(#home-view) {
  min-height: calc(100vh - 3.5rem);
  background:
    radial-gradient(720px 480px at 0% 0%, rgba(178, 142, 255, 0.35), transparent 60%),
    radial-gradient(680px 460px at 100% 0%, rgba(143, 106, 224, 0.4), transparent 62%),
    radial-gradient(640px 440px at 100% 100%, rgba(178, 142, 255, 0.32), transparent 64%),
    transparent;
  color: var(--brand-ink);
  font-family: "Manrope", system-ui, sans-serif;
}

/* --- Шапка модуля / дата --- */
html.theme-light .journal-header,
html.theme-light .timesheet-month-nav,
html.theme-light .bottling-month-nav,
html.theme-light .calendar-header,
body.theme-light .journal-header,
body.theme-light .timesheet-month-nav,
body.theme-light .bottling-month-nav,
body.theme-light .calendar-header {
  background: linear-gradient(145deg, rgba(178, 142, 255, 0.18), rgba(255, 255, 255, 0.55) 60%);
  border: 1px solid rgba(178, 142, 255, 0.28);
  border-radius: 16px;
  backdrop-filter: blur(10px);
  box-shadow: 0 10px 28px rgba(70, 40, 130, 0.05);
}

html.theme-light .journal-date-label,
html.theme-light .calendar-title,
body.theme-light .journal-date-label,
body.theme-light .calendar-title {
  color: var(--brand-ink);
  font-family: "Fraunces", Georgia, serif;
  font-weight: 650;
}

/* Кнопки навигации по датам */
html.theme-light .journal-arrow-btn,
html.theme-light .journal-calendar-btn,
html.theme-light .journal-quick-date-btn,
html.theme-light .journal-month-btn,
html.theme-light .journal-month-arrow,
html.theme-light .cal-nav,
html.theme-light .advances-month-toggle,
body.theme-light .journal-arrow-btn,
body.theme-light .journal-calendar-btn,
body.theme-light .journal-quick-date-btn,
body.theme-light .journal-month-btn,
body.theme-light .journal-month-arrow,
body.theme-light .cal-nav,
body.theme-light .advances-month-toggle {
  background: var(--brand-cell) !important;
  border: 1px solid var(--brand-line) !important;
  color: var(--brand-ink) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

html.theme-light .journal-quick-date-btn.active,
html.theme-light .journal-month-btn.active,
html.theme-light .journal-arrow-btn.active,
html.theme-light .journal-subtab.active,
html.theme-light .warehouse-subtab.active,
html.theme-light .timesheet-subtab.active,
html.theme-light .logistics-subtab.active,
html.theme-light .output-subtab.active,
html.theme-light .summary-subtab.active,
html.theme-light .bottling-subtab.active,
html.theme-light .accounting-subtab.active,
body.theme-light .journal-quick-date-btn.active,
body.theme-light .journal-month-btn.active,
body.theme-light .journal-arrow-btn.active,
body.theme-light .journal-subtab.active,
body.theme-light .warehouse-subtab.active,
body.theme-light .timesheet-subtab.active,
body.theme-light .logistics-subtab.active,
body.theme-light .output-subtab.active,
body.theme-light .summary-subtab.active,
body.theme-light .bottling-subtab.active,
body.theme-light .accounting-subtab.active {
  background: var(--brand-cell-active) !important;
  border-color: #8f6ae0 !important;
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(178, 142, 255, 0.35);
}

/* Вкладки внутри модулей */
html.theme-light .journal-subtab,
html.theme-light .warehouse-subtab,
html.theme-light .timesheet-subtab,
html.theme-light .logistics-subtab,
html.theme-light .output-subtab,
html.theme-light .summary-subtab,
html.theme-light .bottling-subtab,
html.theme-light .accounting-subtab,
html.theme-light .journal-subtabs .journal-subtab,
body.theme-light .journal-subtab,
body.theme-light .warehouse-subtab,
body.theme-light .timesheet-subtab,
body.theme-light .logistics-subtab,
body.theme-light .output-subtab,
body.theme-light .summary-subtab,
body.theme-light .bottling-subtab,
body.theme-light .accounting-subtab,
body.theme-light .journal-subtabs .journal-subtab {
  background: var(--brand-cell) !important;
  border: 1px solid var(--brand-line) !important;
  color: #4a3f66 !important;
  border-radius: 999px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

/* subtabs bar background: см. блок ниже (фирменный) */


/* Карточки итогов / KPI / секции */
html.theme-light .warehouse-metric-card,
html.theme-light .journal-balance-card,
html.theme-light .journal-auto-card,
html.theme-light .summary-card,
html.theme-light .summary-kpi-card,
html.theme-light .summary-movers-card,
html.theme-light .warehouse-section,
html.theme-light .warehouse-month-card,
html.theme-light .warehouse-dept-summary-card,
html.theme-light .warehouse-gap,
html.theme-light .warehouse-analytics-trend,
html.theme-light .warehouse-analytics-kpi-card,
html.theme-light .warehouse-shift-block,
html.theme-light .vedomost-chart-card,
html.theme-light .logistics-meta-item,
html.theme-light .output-bonus-section,
html.theme-light .session-panel,
html.theme-light .module-stub,
html.theme-light .users-create-form,
html.theme-light .wh-ts-mark-bar,
html.theme-light .wh-ts-chip,
html.theme-light .vedomost-sheet-picker,
body.theme-light .warehouse-metric-card,
body.theme-light .journal-balance-card,
body.theme-light .journal-auto-card,
body.theme-light .summary-card,
body.theme-light .summary-kpi-card,
body.theme-light .summary-movers-card,
body.theme-light .warehouse-section,
body.theme-light .warehouse-month-card,
body.theme-light .warehouse-dept-summary-card,
body.theme-light .warehouse-gap,
body.theme-light .warehouse-analytics-trend,
body.theme-light .warehouse-analytics-kpi-card,
body.theme-light .warehouse-shift-block,
body.theme-light .vedomost-chart-card,
body.theme-light .logistics-meta-item,
body.theme-light .output-bonus-section,
body.theme-light .session-panel,
body.theme-light .module-stub,
body.theme-light .users-create-form,
body.theme-light .wh-ts-mark-bar,
body.theme-light .wh-ts-chip,
body.theme-light .vedomost-sheet-picker {
  background: var(--brand-cell) !important;
  border: 1px solid rgba(143, 106, 224, 0.42) !important;
  color: var(--brand-ink);
  box-shadow: 0 10px 24px rgba(70, 40, 130, 0.06);
}

html.theme-light .warehouse-metric-value,
html.theme-light .summary-card .value,
html.theme-light .summary-kpi-card .value,
html.theme-light .journal-balance-card .value,
body.theme-light .warehouse-metric-value,
body.theme-light .summary-card .value,
body.theme-light .summary-kpi-card .value,
body.theme-light .journal-balance-card .value {
  color: var(--brand-ink);
  font-family: "Fraunces", Georgia, serif;
  font-weight: 650;
}

html.theme-light .warehouse-metric-label,
html.theme-light .summary-card .label,
html.theme-light .journal-balance-card .label,
body.theme-light .warehouse-metric-label,
body.theme-light .summary-card .label,
body.theme-light .journal-balance-card .label {
  color: var(--brand-muted);
}

html.theme-light .warehouse-analytics-kpi-card strong,
html.theme-light .warehouse-analytics-kpi-value,
body.theme-light .warehouse-analytics-kpi-card strong,
body.theme-light .warehouse-analytics-kpi-value {
  color: var(--brand-ink) !important;
}

html.theme-light .warehouse-analytics-kpi-value,
body.theme-light .warehouse-analytics-kpi-value {
  font-family: "Fraunces", Georgia, serif;
  font-weight: 650;
}

html.theme-light .warehouse-analytics-kpi-card .warehouse-metric-hint,
html.theme-light .warehouse-analytics-kpi-card .muted,
body.theme-light .warehouse-analytics-kpi-card .warehouse-metric-hint,
body.theme-light .warehouse-analytics-kpi-card .muted {
  color: var(--brand-muted) !important;
}

html.theme-light .warehouse-section h3,
html.theme-light .warehouse-month-card h3,
html.theme-light .warehouse-dept-summary-card h4,
html.theme-light .warehouse-shift-block h4,
html.theme-light .summary-section-title,
body.theme-light .warehouse-section h3,
body.theme-light .warehouse-month-card h3,
body.theme-light .warehouse-dept-summary-card h4,
body.theme-light .warehouse-shift-block h4,
body.theme-light .summary-section-title {
  color: var(--brand-ink);
  font-family: "Fraunces", Georgia, serif;
  font-weight: 650;
}

/* Таблицы и обёртки */
html.theme-light .table-wrap,
html.theme-light .journal-table-wrap,
html.theme-light .warehouse-table-wrap,
html.theme-light .logistics-table-wrap,
html.theme-light .output-table-wrap,
html.theme-light .summary-table-wrap,
html.theme-light .users-table-wrap,
html.theme-light .wh-ts-wrap,
html.theme-light .vedomost-wrap,
html.theme-light .bt-fines-page,
body.theme-light .table-wrap,
body.theme-light .journal-table-wrap,
body.theme-light .warehouse-table-wrap,
body.theme-light .logistics-table-wrap,
body.theme-light .output-table-wrap,
body.theme-light .summary-table-wrap,
body.theme-light .users-table-wrap,
body.theme-light .wh-ts-wrap,
body.theme-light .vedomost-wrap,
body.theme-light .bt-fines-page {
  background: var(--brand-cell) !important;
  border: 1px solid rgba(143, 106, 224, 0.42);
  border-radius: 14px;
}

html.theme-light table,
html.theme-light .journal-table,
html.theme-light .warehouse-table,
html.theme-light .logistics-table,
html.theme-light .output-table,
html.theme-light .summary-table,
html.theme-light .vedomost-table,
html.theme-light .vedomost-vp-table,
html.theme-light .wh-ts-table,
html.theme-light .co-ts-table,
html.theme-light .bt-fines-table,
html.theme-light #contractors-table,
body.theme-light table,
body.theme-light .journal-table,
body.theme-light .warehouse-table,
body.theme-light .logistics-table,
body.theme-light .output-table,
body.theme-light .summary-table,
body.theme-light .vedomost-table,
body.theme-light .vedomost-vp-table,
body.theme-light .wh-ts-table,
body.theme-light .co-ts-table,
body.theme-light .bt-fines-table,
body.theme-light #contractors-table {
  color: var(--brand-ink);
  background: var(--brand-cell);
}

html.theme-light th,
body.theme-light th {
  background: var(--brand-cell-strong) !important;
  color: var(--brand-ink) !important;
  border-color: rgba(143, 106, 224, 0.32) !important;
}

html.theme-light td,
body.theme-light td {
  background: var(--brand-cell) !important;
  border-color: rgba(143, 106, 224, 0.22) !important;
  color: var(--brand-ink);
}

html.theme-light tr:hover td,
body.theme-light tr:hover td {
  background: color-mix(in srgb, #b28eff 46%, #fff) !important;
}

html.theme-light .warehouse-table--shift-days .warehouse-th-group--day,
body.theme-light .warehouse-table--shift-days .warehouse-th-group--day {
  background: color-mix(in srgb, #b28eff 42%, #dbeafe) !important;
}

html.theme-light .warehouse-table--shift-days .warehouse-th-group--night,
body.theme-light .warehouse-table--shift-days .warehouse-th-group--night {
  background: color-mix(in srgb, #b28eff 42%, #e0e7ff) !important;
}

html.theme-light .warehouse-table--shift-days .warehouse-th-group--total,
body.theme-light .warehouse-table--shift-days .warehouse-th-group--total {
  background: color-mix(in srgb, #b28eff 55%, #fff) !important;
}

/* Поля ввода в таблицах и формах.
   Дни табеля и ячейки ведомости исключены —
   иначе !important убивает цвета больничных/смен и подсветки нестыковок. */
html.theme-light input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not(.wh-ts-cell-input):not(.co-ts-cell-input):not(.co-ts-vac-input):not(.vedomost-cell-input):not(.logistics-flag--bad):not(.logistics-field-diff),
html.theme-light select,
html.theme-light textarea,
html.theme-light .journal-input:not(.logistics-flag--bad):not(.logistics-field-diff),
html.theme-light .journal-readonly:not(.logistics-flag--bad):not(.logistics-field-diff),
html.theme-light .warehouse-input,
html.theme-light .warehouse-dept-input,
html.theme-light .warehouse-dept-month-input,
html.theme-light .warehouse-receiving-cell-input,
html.theme-light .logistics-input:not(.logistics-flag--bad):not(.logistics-field-diff),
html.theme-light .logistics-kpi-input,
html.theme-light .logistics-name-input,
html.theme-light .output-cell-input,
html.theme-light .output-name-input,
html.theme-light .output-bonus-input,
html.theme-light .wh-ts-name-input,
html.theme-light .bt-fines-input,
html.theme-light .summary-input,
html.theme-light .formula-input,
body.theme-light input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not(.wh-ts-cell-input):not(.co-ts-cell-input):not(.co-ts-vac-input):not(.vedomost-cell-input):not(.logistics-flag--bad):not(.logistics-field-diff),
body.theme-light select,
body.theme-light textarea,
body.theme-light .journal-input:not(.logistics-flag--bad):not(.logistics-field-diff),
body.theme-light .journal-readonly:not(.logistics-flag--bad):not(.logistics-field-diff),
body.theme-light .warehouse-input,
body.theme-light .warehouse-dept-input,
body.theme-light .warehouse-dept-month-input,
body.theme-light .warehouse-receiving-cell-input,
body.theme-light .logistics-input:not(.logistics-flag--bad):not(.logistics-field-diff),
body.theme-light .logistics-kpi-input,
body.theme-light .logistics-name-input,
body.theme-light .output-cell-input,
body.theme-light .output-name-input,
body.theme-light .output-bonus-input,
body.theme-light .wh-ts-name-input,
body.theme-light .bt-fines-input,
body.theme-light .summary-input,
body.theme-light .formula-input {
  background: var(--brand-cell) !important;
  border: 1px solid var(--brand-line) !important;
  color: var(--brand-ink) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

/* Пустые дни табеля — фирменный фон БЕЗ !important (метки смен перекрывают) */
html.theme-light .wh-ts-cell-input,
html.theme-light .co-ts-cell-input,
html.theme-light .co-ts-vac-input,
body.theme-light .wh-ts-cell-input,
body.theme-light .co-ts-cell-input,
body.theme-light .co-ts-vac-input {
  background: color-mix(in srgb, #b28eff 36%, #fff);
  border: 1px solid rgba(143, 106, 224, 0.45);
  color: #1c1630;
}

html.theme-light input:not(.wh-ts-cell-input):not(.co-ts-cell-input):not(.co-ts-vac-input):not(.logistics-flag--bad):focus,
html.theme-light select:focus,
html.theme-light textarea:focus,
html.theme-light .journal-input:not(.logistics-flag--bad):focus,
body.theme-light input:not(.wh-ts-cell-input):not(.co-ts-cell-input):not(.co-ts-vac-input):not(.logistics-flag--bad):focus,
body.theme-light select:focus,
body.theme-light textarea:focus,
body.theme-light .journal-input:not(.logistics-flag--bad):focus {
  background: color-mix(in srgb, #b28eff 46%, #fff) !important;
  border-color: #b28eff !important;
  outline: 2px solid rgba(178, 142, 255, 0.35);
}

/* KPI ниже плана — поверх фирменного фона ячеек (светлая тема) */
html.theme-light #logistics-view .logistics-dept-kpi-input.logistics-flag--bad,
html.theme-light #logistics-view .journal-input.logistics-dept-kpi-input.logistics-flag--bad,
html.theme-light #logistics-view .logistics-dept-kpi-value-btn.logistics-flag--bad,
html.theme-light #logistics-view .logistics-dept-kpi-value.logistics-flag--bad,
body.theme-light #logistics-view .logistics-dept-kpi-input.logistics-flag--bad,
body.theme-light #logistics-view .journal-input.logistics-dept-kpi-input.logistics-flag--bad,
body.theme-light #logistics-view .logistics-dept-kpi-value-btn.logistics-flag--bad,
body.theme-light #logistics-view .logistics-dept-kpi-value.logistics-flag--bad {
  background: rgba(248, 113, 113, 0.38) !important;
  border: 1px solid rgba(185, 28, 28, 0.75) !important;
  color: #991b1b !important;
  box-shadow: none !important;
}

html.theme-light #logistics-view .logistics-dept-kpi-input.logistics-flag--bad:focus,
body.theme-light #logistics-view .logistics-dept-kpi-input.logistics-flag--bad:focus {
  background: rgba(248, 113, 113, 0.48) !important;
  border-color: rgba(153, 27, 27, 0.9) !important;
  outline: 2px solid rgba(248, 113, 113, 0.35);
}

html.theme-light .warehouse-field--boxed,
body.theme-light .warehouse-field--boxed {
  background: color-mix(in srgb, #b28eff 28%, #fff);
  border-color: var(--brand-line);
  box-shadow: none;
}

html.theme-light .warehouse-shift,
html.theme-light .warehouse-shift-box,
body.theme-light .warehouse-shift,
body.theme-light .warehouse-shift-box {
  background: var(--brand-cell);
  border-color: var(--brand-line);
  color: var(--brand-ink);
}

/* --- Календари / попапы дат (все варианты) --- */
html.theme-light .journal-date-popup,
html.theme-light .vedomost-vp-date-popup,
html.theme-light .bt-fines-date-popup,
html.theme-light .calendar-panel,
html.theme-light .co-ts-color-pop,
html.theme-light .modal-card,
html.theme-light .vedomost-modal,
html.theme-light .vedomost-modal-card,
body.theme-light .journal-date-popup,
body.theme-light .vedomost-vp-date-popup,
body.theme-light .bt-fines-date-popup,
body.theme-light .calendar-panel,
body.theme-light .co-ts-color-pop,
body.theme-light .modal-card,
body.theme-light .vedomost-modal,
body.theme-light .vedomost-modal-card {
  background: color-mix(in srgb, #b28eff 28%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.45) !important;
  color: var(--brand-ink) !important;
  box-shadow: 0 16px 40px rgba(70, 40, 130, 0.16) !important;
  backdrop-filter: blur(12px);
}

html.theme-light .journal-cal-title,
html.theme-light .journal-cal-header,
html.theme-light .journal-cal-head,
html.theme-light .month-head,
body.theme-light .journal-cal-title,
body.theme-light .journal-cal-header,
body.theme-light .journal-cal-head,
body.theme-light .month-head {
  color: var(--brand-ink) !important;
}

html.theme-light .journal-cal-day,
html.theme-light .journal-cal-nav,
html.theme-light .journal-cal-today,
html.theme-light .day-btn,
html.theme-light .month-day,
html.theme-light .vedomost-vp-cal-btn,
html.theme-light .bt-fines-cal-btn,
html.theme-light .bt-ts-bday-cal-btn,
html.theme-light #bottling-view .bt-ts-bday-cal-btn,
body.theme-light .journal-cal-day,
body.theme-light .journal-cal-nav,
body.theme-light .journal-cal-today,
body.theme-light .day-btn,
body.theme-light .month-day,
body.theme-light .vedomost-vp-cal-btn,
body.theme-light .bt-fines-cal-btn,
body.theme-light .bt-ts-bday-cal-btn,
body.theme-light #bottling-view .bt-ts-bday-cal-btn {
  background: var(--brand-cell) !important;
  border: 1px solid var(--brand-line) !important;
  color: #111827 !important;
}

html.theme-light #bottling-view .bt-ts-bday-popup,
html.theme-light #bottling-view .bt-fines-date-popup,
body.theme-light #bottling-view .bt-ts-bday-popup,
body.theme-light #bottling-view .bt-fines-date-popup {
  background: color-mix(in srgb, #b28eff 22%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.55) !important;
  box-shadow: 0 12px 28px rgba(70, 40, 130, 0.22) !important;
  color: #1c1630 !important;
}

html.theme-light #bottling-view .bt-ts-bday-popup .journal-cal-title,
body.theme-light #bottling-view .bt-ts-bday-popup .journal-cal-title {
  color: #1c1630 !important;
}

html.theme-light #bottling-view .bt-ts-bday-popup .journal-cal-day,
body.theme-light #bottling-view .bt-ts-bday-popup .journal-cal-day {
  background: var(--brand-cell, color-mix(in srgb, #b28eff 36%, #fff)) !important;
  border: 1px solid var(--brand-line, rgba(28, 22, 48, 0.35)) !important;
  color: #111827 !important;
}

html.theme-light #bottling-view .bt-ts-bday-popup .journal-cal-day.selected,
body.theme-light #bottling-view .bt-ts-bday-popup .journal-cal-day.selected {
  background: color-mix(in srgb, #b28eff 72%, #8f6ae0) !important;
  border-color: #8f6ae0 !important;
  color: #fff !important;
}

html.theme-light #bottling-view .bt-ts-bday-popup .journal-cal-nav,
body.theme-light #bottling-view .bt-ts-bday-popup .journal-cal-nav {
  background: var(--brand-cell, color-mix(in srgb, #b28eff 36%, #fff)) !important;
  border: 1px solid var(--brand-line, rgba(28, 22, 48, 0.35)) !important;
  color: #111827 !important;
}

html.theme-light .journal-cal-day:hover,
html.theme-light .day-btn:hover,
html.theme-light .month-day:hover,
body.theme-light .journal-cal-day:hover,
body.theme-light .day-btn:hover,
body.theme-light .month-day:hover {
  background: color-mix(in srgb, #b28eff 50%, #fff) !important;
}

html.theme-light .journal-cal-day.today,
html.theme-light .day-btn.today,
html.theme-light .month-day.today,
body.theme-light .journal-cal-day.today,
body.theme-light .day-btn.today,
body.theme-light .month-day.today {
  border-color: #b28eff !important;
  box-shadow: 0 0 0 1px rgba(178, 142, 255, 0.45);
}

html.theme-light .journal-cal-day.selected,
html.theme-light .day-btn.selected,
html.theme-light .month-day.selected,
body.theme-light .journal-cal-day.selected,
body.theme-light .day-btn.selected,
body.theme-light .month-day.selected {
  background: var(--brand-cell-active) !important;
  border-color: #8f6ae0 !important;
  color: #fff !important;
}

html.theme-light .journal-cal-day.other,
html.theme-light .month-day.other,
body.theme-light .journal-cal-day.other,
body.theme-light .month-day.other {
  opacity: 0.45;
}

html.theme-light .journal-cal-day.weekend,
body.theme-light .journal-cal-day.weekend {
  color: #8f6ae0 !important;
}

html.theme-light .journal-cal-footer,
body.theme-light .journal-cal-footer {
  border-top-color: rgba(143, 106, 224, 0.28);
}

/* Тулбары / панели */
html.theme-light .table-toolbar,
html.theme-light .wh-ts-toolbar,
html.theme-light .bt-ts-toolbar,
html.theme-light .output-toolbar,
html.theme-light .logistics-meta-bar,
html.theme-light .journal-balances,
html.theme-light .vedomost-sheet-picker-row,
body.theme-light .table-toolbar,
body.theme-light .wh-ts-toolbar,
body.theme-light .bt-ts-toolbar,
body.theme-light .output-toolbar,
body.theme-light .logistics-meta-bar,
body.theme-light .journal-balances,
body.theme-light .vedomost-sheet-picker-row {
  color: var(--brand-ink);
}

html.theme-light .btn:not(.ghost):not(.topbar-nav-btn),
html.theme-light .upload-btn,
html.theme-light .btn-admin,
body.theme-light .btn:not(.ghost):not(.topbar-nav-btn),
body.theme-light .upload-btn,
body.theme-light .btn-admin {
  background: #b28eff;
  border-color: #b28eff;
  color: #fff;
}

html.theme-light .btn.ghost,
html.theme-light button.ghost,
body.theme-light .btn.ghost,
body.theme-light button.ghost {
  background: var(--brand-cell);
  border: 1px solid var(--brand-line);
  color: var(--brand-ink);
}

html.theme-light .muted,
body.theme-light .muted {
  color: var(--brand-muted);
}

html.theme-light .warehouse-empty-hint,
html.theme-light .warehouse-weekend-badge,
body.theme-light .warehouse-empty-hint,
body.theme-light .warehouse-weekend-badge {
  background: rgba(240, 184, 154, 0.28);
  border-color: rgba(240, 184, 154, 0.55);
  color: var(--brand-ink);
}

html.theme-light .warehouse-empty-hint strong,
html.theme-light .warehouse-weekend-badge,
body.theme-light .warehouse-empty-hint strong,
body.theme-light .warehouse-weekend-badge {
  color: #b45309;
}

html.theme-light .warehouse-analytics-dot--collected,
body.theme-light .warehouse-analytics-dot--collected { background: #b28eff; }

html.theme-light .warehouse-analytics-note,
html.theme-light .summary-chart-legend,
body.theme-light .warehouse-analytics-note,
body.theme-light .summary-chart-legend {
  color: var(--brand-ink);
}

/* Логин остаётся читаемым в светлой теме */
html.theme-light .login-card,
body.theme-light .login-card {
  background: color-mix(in srgb, #b28eff 22%, #fff);
  border: 1px solid var(--brand-line);
  color: var(--brand-ink);
  box-shadow: 0 20px 60px rgba(70, 40, 130, 0.18);
}

html.theme-light .login-hint,
body.theme-light .login-hint {
  background: var(--brand-cell);
  border-color: var(--brand-line);
  color: var(--brand-muted);
}

/* Тосты: обычные — фирменные; ошибки — ярко-рыжие, чтобы было видно */
html.theme-light .journal-toast:not(.journal-toast--error):not(.journal-toast--success):not(.journal-toast--pending),
body.theme-light .journal-toast:not(.journal-toast--error):not(.journal-toast--success):not(.journal-toast--pending) {
  background: color-mix(in srgb, #b28eff 40%, #fff);
  border: 1px solid var(--brand-line);
  color: var(--brand-ink);
}

html.theme-light .journal-toast--error,
body.theme-light .journal-toast--error {
  background: #e85d2a !important;
  border: 1px solid #c44718 !important;
  color: #fff !important;
  box-shadow: 0 8px 24px rgba(200, 70, 20, 0.35);
}

html.theme-light .journal-toast--success,
body.theme-light .journal-toast--success {
  background: #1f9d55 !important;
  border: 1px solid #178a48 !important;
  color: #fff !important;
}

/* --- Светлая тема: перебиваем тёмные календари с #id --- */
html.theme-light #warehouse-view .journal-date-popup,
html.theme-light #journal-view .journal-date-popup,
html.theme-light #bottling-view .bt-fines-date-popup,
html.theme-light .vedomost-vp-date-popup,
html.theme-light #accounting-view .vedomost-vp-date-popup,
body.theme-light #warehouse-view .journal-date-popup,
body.theme-light #journal-view .journal-date-popup,
body.theme-light #bottling-view .bt-fines-date-popup,
body.theme-light .vedomost-vp-date-popup,
body.theme-light #accounting-view .vedomost-vp-date-popup {
  background: color-mix(in srgb, #b28eff 28%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.45) !important;
  color: #1c1630 !important;
  box-shadow: 0 16px 40px rgba(70, 40, 130, 0.16) !important;
}

html.theme-light #warehouse-view.warehouse-cal-open::before,
body.theme-light #warehouse-view.warehouse-cal-open::before {
  background: rgba(80, 50, 140, 0.28);
}

html.theme-light #warehouse-view .journal-cal-day,
html.theme-light #journal-view .journal-cal-day,
html.theme-light #bottling-view .journal-cal-day,
html.theme-light #accounting-view .journal-cal-day,
html.theme-light .vedomost-vp-date-popup .journal-cal-day,
html.theme-light .bt-fines-date-popup .journal-cal-day,
body.theme-light #warehouse-view .journal-cal-day,
body.theme-light #journal-view .journal-cal-day,
body.theme-light #bottling-view .journal-cal-day,
body.theme-light #accounting-view .journal-cal-day,
body.theme-light .vedomost-vp-date-popup .journal-cal-day,
body.theme-light .bt-fines-date-popup .journal-cal-day {
  background: color-mix(in srgb, #b28eff 36%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.48) !important;
  color: #1c1630 !important;
}

html.theme-light #warehouse-view .journal-cal-day.selected,
html.theme-light #journal-view .journal-cal-day.selected,
html.theme-light #bottling-view .journal-cal-day.selected,
html.theme-light #accounting-view .journal-cal-day.selected,
html.theme-light .vedomost-vp-date-popup .journal-cal-day.selected,
html.theme-light .bt-fines-date-popup .journal-cal-day.selected,
body.theme-light #warehouse-view .journal-cal-day.selected,
body.theme-light #journal-view .journal-cal-day.selected,
body.theme-light #bottling-view .journal-cal-day.selected,
body.theme-light #accounting-view .journal-cal-day.selected,
body.theme-light .vedomost-vp-date-popup .journal-cal-day.selected,
body.theme-light .bt-fines-date-popup .journal-cal-day.selected {
  background: color-mix(in srgb, #b28eff 72%, #8f6ae0) !important;
  border-color: #8f6ae0 !important;
  color: #fff !important;
}

html.theme-light #warehouse-view .journal-cal-title,
html.theme-light #journal-view .journal-cal-title,
html.theme-light #bottling-view .journal-cal-title,
html.theme-light #accounting-view .journal-cal-title,
body.theme-light #warehouse-view .journal-cal-title,
body.theme-light #journal-view .journal-cal-title,
body.theme-light #bottling-view .journal-cal-title,
body.theme-light #accounting-view .journal-cal-title {
  color: #1c1630 !important;
}

html.theme-light .vedomost-vp-cal-btn,
html.theme-light .bt-fines-cal-btn,
html.theme-light #bottling-view .bt-fines-cal-btn,
html.theme-light #accounting-view .vedomost-vp-cal-btn,
body.theme-light .vedomost-vp-cal-btn,
body.theme-light .bt-fines-cal-btn,
body.theme-light #bottling-view .bt-fines-cal-btn,
body.theme-light #accounting-view .vedomost-vp-cal-btn {
  background: color-mix(in srgb, #b28eff 36%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.48) !important;
  color: #1c1630 !important;
}

/* Жёсткие тёмные фоны в ведомости / табелях */
html.theme-light #accounting-view,
html.theme-light #timesheet-view,
html.theme-light #logistics-view,
html.theme-light #output-view,
html.theme-light #summary-view,
html.theme-light #journal-view,
html.theme-light #settlements-view,
html.theme-light #bottling-view,
html.theme-light #users-view,
html.theme-light #vko-view,
body.theme-light #accounting-view,
body.theme-light #timesheet-view,
body.theme-light #logistics-view,
body.theme-light #output-view,
body.theme-light #summary-view,
body.theme-light #journal-view,
body.theme-light #settlements-view,
body.theme-light #bottling-view,
body.theme-light #users-view,
body.theme-light #vko-view {
  color: #1c1630;
}


/* --- Светлая тема: sticky-колонки и тёмные панели с !important --- */
html.theme-light .output-table thead .output-col-sticky-right,
html.theme-light .output-table thead .output-sticky-name,
html.theme-light .output-sticky-name,
html.theme-light .output-col-sticky-right,
html.theme-light .logistics-table--couriers .logistics-toolbar-row th,
html.theme-light .logistics-table--drivers .logistics-toolbar-row th,
html.theme-light .logistics-table--to .logistics-toolbar-row th,
html.theme-light .warehouse-table-wrap--month .warehouse-table thead th,
body.theme-light .output-table thead .output-col-sticky-right,
body.theme-light .output-table thead .output-sticky-name,
body.theme-light .output-sticky-name,
body.theme-light .output-col-sticky-right,
body.theme-light .logistics-table--couriers .logistics-toolbar-row th,
body.theme-light .logistics-table--drivers .logistics-toolbar-row th,
body.theme-light .logistics-table--to .logistics-toolbar-row th,
body.theme-light .warehouse-table-wrap--month .warehouse-table thead th {
  background: color-mix(in srgb, #b28eff 48%, #fff) !important;
  color: #1c1630 !important;
  box-shadow: none;
}

html.theme-light .co-ts-help-panel,
html.theme-light .co-ts-color-pop,
body.theme-light .co-ts-help-panel,
body.theme-light .co-ts-color-pop {
  background: color-mix(in srgb, #b28eff 28%, #fff) !important;
  border-color: rgba(143, 106, 224, 0.45) !important;
  color: #1c1630 !important;
}

/* --- Светлая тема: статусы / Привязано (расчёты + логистика) — зелёный = привязано/ок --- */
html.theme-light .status-none,
body.theme-light .status-none {
  background: color-mix(in srgb, #9ca3af 22%, #fff) !important;
  color: #6b7280 !important;
  border: 1px solid rgba(107, 114, 128, 0.35) !important;
}

html.theme-light .status-pending,
body.theme-light .status-pending {
  background: color-mix(in srgb, #f0c674 42%, #fff) !important;
  color: #92400e !important;
  border: 1px solid rgba(180, 120, 40, 0.35) !important;
}

html.theme-light .status-confirmed,
body.theme-light .status-confirmed {
  background: rgba(74, 222, 128, 0.36) !important;
  color: #166534 !important;
  border: 1px solid rgba(22, 101, 52, 0.5) !important;
}

html.theme-light .status-rejected,
body.theme-light .status-rejected {
  background: rgba(248, 113, 113, 0.32) !important;
  color: #991b1b !important;
  border: 1px solid rgba(185, 28, 28, 0.5) !important;
}

html.theme-light .tg-badge.linked,
body.theme-light .tg-badge.linked {
  background: rgba(74, 222, 128, 0.36) !important;
  color: #166534 !important;
  border: 1px solid rgba(22, 101, 52, 0.5) !important;
}

/* Телефон при привязанном Telegram — зелёная подсветка (расчёты + логистика) */
html.theme-light .phone-input.phone-linked,
html.theme-light .cell-input.phone-linked,
html.theme-light .logistics-phone-input.phone-linked,
html.theme-light .phone-linked-ro,
body.theme-light .phone-input.phone-linked,
body.theme-light .cell-input.phone-linked,
body.theme-light .logistics-phone-input.phone-linked,
body.theme-light .phone-linked-ro {
  background: rgba(74, 222, 128, 0.32) !important;
  border: 1px solid rgba(22, 101, 52, 0.5) !important;
  color: #166534 !important;
  box-shadow: none;
}

html.theme-light .btn-send,
html.theme-light .btn-send-tg,
body.theme-light .btn-send,
body.theme-light .btn-send-tg {
  background: #b28eff !important;
  border: 1px solid #8f6ae0 !important;
  color: #fff !important;
}

html.theme-light .btn-send:disabled,
html.theme-light .btn-send-tg:disabled,
body.theme-light .btn-send:disabled,
body.theme-light .btn-send-tg:disabled {
  background: color-mix(in srgb, #b28eff 28%, #fff) !important;
  color: #6d6680 !important;
  border-color: rgba(143, 106, 224, 0.35) !important;
}

/* --- Светлая тема: сводный отчёт — ячейки как на складе --- */
/* Обычные pill фирменные; бренд ТК / up / down — отдельными правилами ниже */
html.theme-light #summary-view .summary-pill:not([class*="summary-brand-"]):not(.summary-pill-up):not(.summary-pill-down),
html.theme-light .summary-pill:not([class*="summary-brand-"]):not(.summary-pill-up):not(.summary-pill-down),
body.theme-light #summary-view .summary-pill:not([class*="summary-brand-"]):not(.summary-pill-up):not(.summary-pill-down),
body.theme-light .summary-pill:not([class*="summary-brand-"]):not(.summary-pill-up):not(.summary-pill-down) {
  background: color-mix(in srgb, #b28eff 36%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.48) !important;
  color: #1c1630 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

html.theme-light #summary-view .summary-pill[class*="summary-brand-"],
html.theme-light .summary-pill[class*="summary-brand-"],
body.theme-light #summary-view .summary-pill[class*="summary-brand-"],
body.theme-light .summary-pill[class*="summary-brand-"] {
  background: color-mix(in srgb, #b28eff 22%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.4) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
  font-weight: 700;
}

html.theme-light #summary-view .summary-table thead th:not([class*="summary-brand-"]),
html.theme-light #summary-view .summary-table tfoot td,
html.theme-light #summary-view .summary-table .sticky-col,
html.theme-light #summary-view .summary-date,
html.theme-light #summary-view .summary-th-date,
html.theme-light #summary-view .summary-cell-total,
html.theme-light #summary-view .summary-th-total,
html.theme-light #summary-view .summary-totals-row td,
body.theme-light #summary-view .summary-table thead th:not([class*="summary-brand-"]),
body.theme-light #summary-view .summary-table tfoot td,
body.theme-light #summary-view .summary-table .sticky-col,
body.theme-light #summary-view .summary-date,
body.theme-light #summary-view .summary-th-date,
body.theme-light #summary-view .summary-cell-total,
body.theme-light #summary-view .summary-th-total,
body.theme-light #summary-view .summary-totals-row td {
  background: color-mix(in srgb, #b28eff 48%, #fff) !important;
  color: #1c1630 !important;
}

html.theme-light #summary-view .summary-table thead th[class*="summary-brand-"],
body.theme-light #summary-view .summary-table thead th[class*="summary-brand-"] {
  background: color-mix(in srgb, #b28eff 48%, #fff) !important;
}

html.theme-light #summary-view .summary-table td:not([class*="summary-brand-"]),
body.theme-light #summary-view .summary-table td:not([class*="summary-brand-"]) {
  background: color-mix(in srgb, #b28eff 36%, #fff) !important;
  color: #1c1630;
}

html.theme-light #summary-view .summary-table td[class*="summary-brand-"],
body.theme-light #summary-view .summary-table td[class*="summary-brand-"] {
  background: color-mix(in srgb, #b28eff 28%, #fff) !important;
}

html.theme-light #summary-view .summary-table-wrap,
html.theme-light #summary-view .summary-analytics-chart-block,
html.theme-light #summary-view .summary-kpi-card,
html.theme-light #summary-view .summary-movers-card,
body.theme-light #summary-view .summary-table-wrap,
body.theme-light #summary-view .summary-analytics-chart-block,
body.theme-light #summary-view .summary-kpi-card,
body.theme-light #summary-view .summary-movers-card {
  background: color-mix(in srgb, #b28eff 36%, #fff) !important;
  border-color: rgba(143, 106, 224, 0.42) !important;
  color: #1c1630;
}

/* Бренд ТК в отгрузках (как в тёмной теме, читаемо на светлом) */
html.theme-light .summary-brand-ozon,
html.theme-light .summary-cell.summary-brand-ozon,
html.theme-light .summary-pill.summary-brand-ozon,
html.theme-light .summary-th.summary-brand-ozon,
body.theme-light .summary-brand-ozon,
body.theme-light .summary-cell.summary-brand-ozon,
body.theme-light .summary-pill.summary-brand-ozon,
body.theme-light .summary-th.summary-brand-ozon { color: #2563eb !important; }

html.theme-light .summary-brand-yandex,
html.theme-light .summary-cell.summary-brand-yandex,
html.theme-light .summary-pill.summary-brand-yandex,
html.theme-light .summary-th.summary-brand-yandex,
body.theme-light .summary-brand-yandex,
body.theme-light .summary-cell.summary-brand-yandex,
body.theme-light .summary-pill.summary-brand-yandex,
body.theme-light .summary-th.summary-brand-yandex { color: #ca8a04 !important; }

html.theme-light .summary-brand-sber,
html.theme-light .summary-cell.summary-brand-sber,
html.theme-light .summary-pill.summary-brand-sber,
html.theme-light .summary-th.summary-brand-sber,
body.theme-light .summary-brand-sber,
body.theme-light .summary-cell.summary-brand-sber,
body.theme-light .summary-pill.summary-brand-sber,
body.theme-light .summary-th.summary-brand-sber { color: #16a34a !important; }

html.theme-light .summary-brand-wb,
html.theme-light .summary-cell.summary-brand-wb,
html.theme-light .summary-pill.summary-brand-wb,
html.theme-light .summary-th.summary-brand-wb,
body.theme-light .summary-brand-wb,
body.theme-light .summary-cell.summary-brand-wb,
body.theme-light .summary-pill.summary-brand-wb,
body.theme-light .summary-th.summary-brand-wb { color: #db2777 !important; }

html.theme-light .summary-brand-cdek,
html.theme-light .summary-cell.summary-brand-cdek,
html.theme-light .summary-pill.summary-brand-cdek,
html.theme-light .summary-th.summary-brand-cdek,
body.theme-light .summary-brand-cdek,
body.theme-light .summary-cell.summary-brand-cdek,
body.theme-light .summary-pill.summary-brand-cdek,
body.theme-light .summary-th.summary-brand-cdek { color: #059669 !important; }

html.theme-light .summary-brand-fivepost,
html.theme-light .summary-cell.summary-brand-fivepost,
html.theme-light .summary-pill.summary-brand-fivepost,
html.theme-light .summary-th.summary-brand-fivepost,
body.theme-light .summary-brand-fivepost,
body.theme-light .summary-cell.summary-brand-fivepost,
body.theme-light .summary-pill.summary-brand-fivepost,
body.theme-light .summary-th.summary-brand-fivepost { color: #dc2626 !important; }

html.theme-light .summary-brand-dalli,
html.theme-light .summary-cell.summary-brand-dalli,
html.theme-light .summary-pill.summary-brand-dalli,
html.theme-light .summary-th.summary-brand-dalli,
body.theme-light .summary-brand-dalli,
body.theme-light .summary-cell.summary-brand-dalli,
body.theme-light .summary-pill.summary-brand-dalli,
body.theme-light .summary-th.summary-brand-dalli { color: #3b82f6 !important; }

html.theme-light .summary-brand-post,
html.theme-light .summary-cell.summary-brand-post,
html.theme-light .summary-pill.summary-brand-post,
html.theme-light .summary-th.summary-brand-post,
body.theme-light .summary-brand-post,
body.theme-light .summary-cell.summary-brand-post,
body.theme-light .summary-pill.summary-brand-post,
body.theme-light .summary-th.summary-brand-post { color: #0284c7 !important; }

html.theme-light .summary-brand-courierist,
html.theme-light .summary-cell.summary-brand-courierist,
html.theme-light .summary-pill.summary-brand-courierist,
html.theme-light .summary-th.summary-brand-courierist,
body.theme-light .summary-brand-courierist,
body.theme-light .summary-cell.summary-brand-courierist,
body.theme-light .summary-pill.summary-brand-courierist,
body.theme-light .summary-th.summary-brand-courierist { color: #ea580c !important; }

html.theme-light .summary-brand-logsis,
html.theme-light .summary-cell.summary-brand-logsis,
html.theme-light .summary-pill.summary-brand-logsis,
html.theme-light .summary-th.summary-brand-logsis,
body.theme-light .summary-brand-logsis,
body.theme-light .summary-cell.summary-brand-logsis,
body.theme-light .summary-pill.summary-brand-logsis,
body.theme-light .summary-th.summary-brand-logsis { color: #4f46e5 !important; }

html.theme-light .summary-brand-total,
html.theme-light .summary-cell.summary-brand-total,
html.theme-light .summary-pill.summary-brand-total,
html.theme-light .summary-th.summary-brand-total,
body.theme-light .summary-brand-total,
body.theme-light .summary-cell.summary-brand-total,
body.theme-light .summary-pill.summary-brand-total,
body.theme-light .summary-th.summary-brand-total { color: #5b3fa0 !important; }

/* % плюс/минус рядом с KPI (Среднее заказов за день и т.п.) */
html.theme-light #summary-view .summary-pill-up,
html.theme-light .summary-pill-up,
html.theme-light #summary-view .summary-combo-meta-pct.summary-pill-up,
body.theme-light #summary-view .summary-pill-up,
body.theme-light .summary-pill-up,
body.theme-light #summary-view .summary-combo-meta-pct.summary-pill-up {
  background: rgba(47, 158, 116, 0.2) !important;
  border-color: rgba(31, 122, 88, 0.45) !important;
  color: #1f7a58 !important;
  font-weight: 700;
}

html.theme-light #summary-view .summary-pill-down,
html.theme-light .summary-pill-down,
html.theme-light #summary-view .summary-combo-meta-pct.summary-pill-down,
body.theme-light #summary-view .summary-pill-down,
body.theme-light .summary-pill-down,
body.theme-light #summary-view .summary-combo-meta-pct.summary-pill-down {
  background: rgba(212, 85, 106, 0.18) !important;
  border-color: rgba(176, 61, 82, 0.45) !important;
  color: #b03d52 !important;
  font-weight: 700;
}

html.theme-light #summary-view .summary-pill-flat,
html.theme-light .summary-pill-flat,
body.theme-light #summary-view .summary-pill-flat,
body.theme-light .summary-pill-flat {
  background: color-mix(in srgb, #b28eff 28%, #fff) !important;
  border-color: rgba(143, 106, 224, 0.4) !important;
  color: #6d6680 !important;
}

/* Анализ: столбцы-шкалы яркие фирменные, как на главной */
html.theme-light #summary-view .summary-combo-yscale,
html.theme-light #summary-view .summary-mbar-x,
html.theme-light #summary-view .summary-combo-meta-val,
html.theme-light #summary-view .summary-mbar-val,
body.theme-light #summary-view .summary-combo-yscale,
body.theme-light #summary-view .summary-mbar-x,
body.theme-light #summary-view .summary-combo-meta-val,
body.theme-light #summary-view .summary-mbar-val {
  color: #8f6ae0 !important;
  font-weight: 700;
}

html.theme-light #summary-view .summary-combo-yscale.muted,
html.theme-light #summary-view .summary-mbar-x.muted,
body.theme-light #summary-view .summary-combo-yscale.muted,
body.theme-light #summary-view .summary-mbar-x.muted {
  color: #6d6680 !important;
}

/* Шкалы анализа = цвет кнопки «Анализ» (#b28eff) */
html.theme-light #summary-view .summary-mbar-fill,
html.theme-light #summary-view .summary-combo-bar-fill,
html.theme-light #summary-view .summary-topch-fill,
body.theme-light #summary-view .summary-mbar-fill,
body.theme-light #summary-view .summary-combo-bar-fill,
body.theme-light #summary-view .summary-topch-fill {
  background: #b28eff !important;
  border-radius: 8px 8px 4px 4px !important;
  box-shadow: 0 6px 14px rgba(178, 142, 255, 0.35) !important;
  min-height: 5px;
  filter: none;
}

html.theme-light #summary-view .summary-topch-fill,
body.theme-light #summary-view .summary-topch-fill {
  border-radius: 3px !important;
  box-shadow: none !important;
  min-height: 0;
}

html.theme-light #summary-view .summary-topch-swatch,
body.theme-light #summary-view .summary-topch-swatch {
  background: #b28eff !important;
}

html.theme-light #summary-view .summary-combo-dot,
body.theme-light #summary-view .summary-combo-dot {
  background: #8f6ae0 !important;
  border-color: #fff !important;
  box-shadow: 0 0 0 2px rgba(143, 106, 224, 0.35);
}

html.theme-light #summary-view .summary-combo-zero-html,
body.theme-light #summary-view .summary-combo-zero-html {
  border-top-color: rgba(143, 106, 224, 0.45) !important;
}

html.theme-light #summary-view .summary-combo-line-svg path,
body.theme-light #summary-view .summary-combo-line-svg path {
  stroke: #8f6ae0 !important;
}

html.theme-light #summary-view .summary-topch-track,
body.theme-light #summary-view .summary-topch-track {
  background: color-mix(in srgb, #b28eff 22%, #fff) !important;
}

/* Пользователи: белые окна → нежный фирменный */
html.theme-light #users-view .users-create-details,
html.theme-light #users-view .users-toolbar,
html.theme-light #users-view .users-invite-result,
body.theme-light #users-view .users-create-details,
body.theme-light #users-view .users-toolbar,
body.theme-light #users-view .users-invite-result {
  background: color-mix(in srgb, #b28eff 28%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.42) !important;
  color: #1c1630 !important;
  box-shadow: 0 10px 24px rgba(70, 40, 130, 0.06);
}

html.theme-light #users-view .users-create-summary,
body.theme-light #users-view .users-create-summary {
  color: #1c1630 !important;
}

/* Главная: двойные значения в финансах */
.home-metric__label--sub {
  margin-top: 0.65rem;
}

.home-metric__value--sub {
  font-size: clamp(1.15rem, 2vw, 1.55rem) !important;
  margin: 0.2rem 0 0 !important;
}

.home-metric--cash .home-metric__value,
.home-metric--cash .home-metric__value--sub,
.home-metric--debt .home-metric__value {
  color: var(--home-brand-deep);
}

.home-cash-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Сводный: цвет цифр бренда на pill в светлой теме */
html.theme-light .summary-pill.summary-brand-ozon,
body.theme-light .summary-pill.summary-brand-ozon { color: #2563eb !important; }
html.theme-light .summary-pill.summary-brand-yandex,
body.theme-light .summary-pill.summary-brand-yandex { color: #a16207 !important; }
html.theme-light .summary-pill.summary-brand-sber,
body.theme-light .summary-pill.summary-brand-sber { color: #15803d !important; }
html.theme-light .summary-pill.summary-brand-wb,
body.theme-light .summary-pill.summary-brand-wb { color: #be185d !important; }
html.theme-light .summary-pill.summary-brand-cdek,
body.theme-light .summary-pill.summary-brand-cdek { color: #047857 !important; }
html.theme-light .summary-pill.summary-brand-fivepost,
body.theme-light .summary-pill.summary-brand-fivepost { color: #dc2626 !important; }
html.theme-light .summary-pill.summary-brand-dalli,
body.theme-light .summary-pill.summary-brand-dalli { color: #1d4ed8 !important; }
html.theme-light .summary-pill.summary-brand-post,
body.theme-light .summary-pill.summary-brand-post { color: #1d4ed8 !important; }
html.theme-light .summary-pill.summary-brand-courierist,
body.theme-light .summary-pill.summary-brand-courierist { color: #c2410c !important; }
html.theme-light .summary-pill.summary-brand-logsis,
body.theme-light .summary-pill.summary-brand-logsis { color: #2563eb !important; }
html.theme-light .summary-pill.summary-brand-total,
body.theme-light .summary-pill.summary-brand-total { color: #5b3fa0 !important; }

html.theme-light #summary-view .summary-channel-select,
body.theme-light #summary-view .summary-channel-select {
  background: color-mix(in srgb, #b28eff 36%, #fff) !important;
  border-color: rgba(143, 106, 224, 0.48) !important;
  color: #1c1630 !important;
}

/* ===== Светлая тема: журнал — сброс тёмных локальных переменных ===== */
html.theme-light body.journal-active,
body.theme-light.journal-active {
  background: transparent !important;
}

html.theme-light #journal-view,
body.theme-light #journal-view {
  --j-bg: color-mix(in srgb, #b28eff 28%, #e8e0f5);
  --j-card: color-mix(in srgb, #b28eff 36%, #fff);
  --j-card-elevated: color-mix(in srgb, #b28eff 42%, #fff);
  --j-border: rgba(143, 106, 224, 0.42);
  --j-hover: rgba(178, 142, 255, 0.16);
  --j-text: #1c1630;
  --j-muted: #6d6680;
  --j-taken-bg: rgba(255, 107, 122, 0.12);
  --j-taken-head: rgba(255, 107, 122, 0.2);
  --j-deposited-bg: rgba(95, 212, 154, 0.12);
  --j-deposited-head: rgba(95, 212, 154, 0.2);
  --j-auto-bg: color-mix(in srgb, #b28eff 28%, #fff);
  --j-accent: #b28eff;
  background: color-mix(in srgb, #b28eff 28%, #e8e0f5) !important;
  color: #1c1630;
}

html.theme-light #journal-view .journal-balances,
html.theme-light #journal-view .journal-auto-bar,
html.theme-light #journal-view .journal-toolbar,
html.theme-light #journal-view #journal-content,
html.theme-light #journal-view .journal-header,
body.theme-light #journal-view .journal-balances,
body.theme-light #journal-view .journal-auto-bar,
body.theme-light #journal-view .journal-toolbar,
body.theme-light #journal-view #journal-content,
body.theme-light #journal-view .journal-header {
  background: color-mix(in srgb, #b28eff 28%, #e8e0f5) !important;
  border-bottom-color: rgba(143, 106, 224, 0.28);
}

html.theme-light #journal-view .journal-balance-card,
html.theme-light #journal-view .journal-auto-card,
body.theme-light #journal-view .journal-balance-card,
body.theme-light #journal-view .journal-auto-card {
  background: color-mix(in srgb, #b28eff 36%, #fff) !important;
  border-color: rgba(143, 106, 224, 0.42) !important;
  color: #1c1630;
  box-shadow: 0 8px 20px rgba(70, 40, 130, 0.06);
}

html.theme-light #journal-view .journal-toolbar-btn,
html.theme-light #journal-view .journal-export-btn,
html.theme-light #export-excel-btn,
html.theme-light .upload-btn,
body.theme-light #journal-view .journal-toolbar-btn,
body.theme-light #journal-view .journal-export-btn,
body.theme-light #export-excel-btn,
body.theme-light .upload-btn {
  background: #b28eff !important;
  border: 1px solid #8f6ae0 !important;
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(178, 142, 255, 0.32);
}

html.theme-light #journal-view .journal-toolbar-btn:hover,
html.theme-light #journal-view .journal-export-btn:hover,
html.theme-light #export-excel-btn:hover,
html.theme-light .upload-btn:hover,
body.theme-light #journal-view .journal-toolbar-btn:hover,
body.theme-light #journal-view .journal-export-btn:hover,
body.theme-light #export-excel-btn:hover,
body.theme-light .upload-btn:hover {
  background: #9a72ef !important;
  filter: none;
}

html.theme-light #journal-view .journal-search-input,
body.theme-light #journal-view .journal-search-input {
  background: color-mix(in srgb, #b28eff 30%, #fff) !important;
  border-color: rgba(143, 106, 224, 0.42) !important;
  color: #1c1630 !important;
}

/* ===== Подвкладки: активная как кнопка «Журнал/Склад» в шапке ===== */
html.theme-light .journal-subtabs,
html.theme-light .warehouse-subtabs,
html.theme-light .timesheet-subtabs,
html.theme-light .logistics-subtabs,
html.theme-light .output-subtabs,
html.theme-light .summary-subtabs,
html.theme-light .bottling-subtabs,
html.theme-light .accounting-subtabs,
html.theme-light #journal-view .journal-subtabs,
html.theme-light #warehouse-view .warehouse-subtabs,
body.theme-light .journal-subtabs,
body.theme-light .warehouse-subtabs,
body.theme-light .timesheet-subtabs,
body.theme-light .logistics-subtabs,
body.theme-light .output-subtabs,
body.theme-light .summary-subtabs,
body.theme-light .bottling-subtabs,
body.theme-light .accounting-subtabs,
body.theme-light #journal-view .journal-subtabs,
body.theme-light #warehouse-view .warehouse-subtabs {
  background: color-mix(in srgb, #b28eff 46%, #d8c8f4) !important;
  border: 1px solid rgba(143, 106, 224, 0.55) !important;
  border-radius: 12px;
  padding: 0.25rem;
  gap: 0.3rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

html.theme-light .journal-subtab,
html.theme-light .warehouse-subtab,
html.theme-light .timesheet-subtab,
html.theme-light .logistics-subtab,
html.theme-light .output-subtab,
html.theme-light .summary-subtab,
html.theme-light .bottling-subtab,
html.theme-light .accounting-subtab,
html.theme-light .journal-subtabs .journal-subtab,
html.theme-light #journal-view .journal-subtab,
html.theme-light #warehouse-view .warehouse-subtab,
html.theme-light #bottling-view .journal-subtab,
body.theme-light .journal-subtab,
body.theme-light .warehouse-subtab,
body.theme-light .timesheet-subtab,
body.theme-light .logistics-subtab,
body.theme-light .output-subtab,
body.theme-light .summary-subtab,
body.theme-light .bottling-subtab,
body.theme-light .accounting-subtab,
body.theme-light .journal-subtabs .journal-subtab,
body.theme-light #journal-view .journal-subtab,
body.theme-light #warehouse-view .warehouse-subtab,
body.theme-light #bottling-view .journal-subtab {
  background: transparent !important;
  border: 1px solid transparent !important;
  color: #5a5270 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  font-weight: 600;
}

html.theme-light .journal-subtab:hover,
html.theme-light .warehouse-subtab:hover,
html.theme-light .timesheet-subtab:hover,
html.theme-light .logistics-subtab:hover,
html.theme-light .output-subtab:hover,
html.theme-light .summary-subtab:hover,
html.theme-light .bottling-subtab:hover,
html.theme-light .accounting-subtab:hover,
html.theme-light #journal-view .journal-subtab:hover,
body.theme-light .journal-subtab:hover,
body.theme-light .warehouse-subtab:hover,
body.theme-light .timesheet-subtab:hover,
body.theme-light .logistics-subtab:hover,
body.theme-light .output-subtab:hover,
body.theme-light .summary-subtab:hover,
body.theme-light .bottling-subtab:hover,
body.theme-light .accounting-subtab:hover,
body.theme-light #journal-view .journal-subtab:hover {
  background: rgba(178, 142, 255, 0.18) !important;
  color: #1c1630 !important;
}

html.theme-light .journal-subtab.active,
html.theme-light .warehouse-subtab.active,
html.theme-light .timesheet-subtab.active,
html.theme-light .logistics-subtab.active,
html.theme-light .output-subtab.active,
html.theme-light .summary-subtab.active,
html.theme-light .bottling-subtab.active,
html.theme-light .accounting-subtab.active,
html.theme-light .journal-subtabs .journal-subtab.active,
html.theme-light #journal-view .journal-subtab.active,
html.theme-light #warehouse-view .warehouse-subtab.active,
html.theme-light #warehouse-view .warehouse-subtabs .journal-subtab.active,
html.theme-light #bottling-view .journal-subtab.active,
html.theme-light #bottling-view .bottling-subtab.active,
body.theme-light .journal-subtab.active,
body.theme-light .warehouse-subtab.active,
body.theme-light .timesheet-subtab.active,
body.theme-light .logistics-subtab.active,
body.theme-light .output-subtab.active,
body.theme-light .summary-subtab.active,
body.theme-light .bottling-subtab.active,
body.theme-light .accounting-subtab.active,
body.theme-light .journal-subtabs .journal-subtab.active,
body.theme-light #journal-view .journal-subtab.active,
body.theme-light #warehouse-view .warehouse-subtab.active,
body.theme-light #warehouse-view .warehouse-subtabs .journal-subtab.active,
body.theme-light #bottling-view .journal-subtab.active,
body.theme-light #bottling-view .bottling-subtab.active {
  background: #b28eff !important;
  border-color: #b28eff !important;
  color: #fff !important;
  box-shadow: 0 6px 16px rgba(178, 142, 255, 0.35) !important;
}

/* ===== Главная: все крупные цифры фирменные ===== */
.home-metric__value,
.home-metric__value--slash,
.home-metric__value--sub,
.home-pace-item strong {
  color: var(--home-brand-deep) !important;
}

/* ===== Светлая: предупреждения «не сходится» — читаемый красный ===== */
html.theme-light .co-ts-reconcile-hint,
body.theme-light .co-ts-reconcile-hint {
  color: #b91c1c !important;
  background: rgba(220, 38, 38, 0.1);
  border: 1px solid rgba(185, 28, 28, 0.35);
  border-radius: 10px;
  padding: 0.45rem 0.7rem;
  font-weight: 600;
}

html.theme-light .co-ts-reconcile-hint strong,
body.theme-light .co-ts-reconcile-hint strong {
  color: #991b1b !important;
  font-weight: 800;
}

html.theme-light .co-ts-hours--mismatch,
body.theme-light .co-ts-hours--mismatch {
  background: rgba(220, 38, 38, 0.18) !important;
  color: #b91c1c !important;
  box-shadow: inset 0 0 0 1px rgba(185, 28, 28, 0.45);
}

html.theme-light .co-ts-mismatch-tip,
html.theme-light .bt-fines-name-warn,
body.theme-light .co-ts-mismatch-tip,
body.theme-light .bt-fines-name-warn {
  background: #dc2626 !important;
  color: #fff !important;
  border-color: #b91c1c !important;
  box-shadow: 0 0 0 1px rgba(127, 29, 29, 0.35);
}

html.theme-light .co-ts-mismatch-tip.wh-ts-comment-tip,
body.theme-light .co-ts-mismatch-tip.wh-ts-comment-tip {
  background: #e67e22 !important;
  color: #fff !important;
  border-color: #c96a12 !important;
  box-shadow: 0 0 0 1px rgba(146, 64, 14, 0.3);
}

html.theme-light .co-ts-mismatch-pop,
body.theme-light .co-ts-mismatch-pop {
  background: color-mix(in srgb, #fecaca 55%, #fff) !important;
  border: 1px solid rgba(185, 28, 28, 0.45) !important;
  color: #7f1d1d !important;
  box-shadow: 0 10px 28px rgba(127, 29, 29, 0.15) !important;
}

html.theme-light .co-ts-mismatch-pop.wh-ts-comment-pop,
body.theme-light .co-ts-mismatch-pop.wh-ts-comment-pop {
  background: color-mix(in srgb, #ffedd5 60%, #fff) !important;
  border: 1px solid rgba(194, 95, 12, 0.45) !important;
  color: #7c2d12 !important;
  box-shadow: 0 10px 28px rgba(154, 52, 18, 0.12) !important;
}

html.theme-light .wh-ts-comment-pop .co-ts-mismatch-pop__title,
body.theme-light .wh-ts-comment-pop .co-ts-mismatch-pop__title {
  color: #c2410c !important;
}

html.theme-light .wh-ts-comment-pop .co-ts-mismatch-pop__body,
body.theme-light .wh-ts-comment-pop .co-ts-mismatch-pop__body {
  color: #7c2d12 !important;
}

html.theme-light .co-ts-mismatch-pop__title,
body.theme-light .co-ts-mismatch-pop__title {
  color: #b91c1c !important;
}

html.theme-light .co-ts-mismatch-pop__body,
body.theme-light .co-ts-mismatch-pop__body {
  color: #7f1d1d !important;
}

/* ===== Логистика: убрать серую плашку meta ===== */
html.theme-light .logistics-meta-bar,
body.theme-light .logistics-meta-bar {
  background: color-mix(in srgb, #b28eff 36%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.42) !important;
  box-shadow: 0 8px 20px rgba(70, 40, 130, 0.06);
}

html.theme-light .logistics-meta-item,
body.theme-light .logistics-meta-item {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

html.theme-light .logistics-meta-label,
html.theme-light .logistics-meta-sub,
html.theme-light .logistics-meta-currency,
body.theme-light .logistics-meta-label,
body.theme-light .logistics-meta-sub,
body.theme-light .logistics-meta-currency {
  color: #5a5270 !important;
}

html.theme-light .logistics-meta-value,
body.theme-light .logistics-meta-value {
  color: #5b3fa0 !important;
}

html.theme-light .logistics-meta-value--green,
body.theme-light .logistics-meta-value--green {
  color: #15803d !important;
}

html.theme-light .logistics-base-salary-input,
body.theme-light .logistics-base-salary-input {
  background: color-mix(in srgb, #b28eff 28%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.45) !important;
  color: #1c1630 !important;
}

html.theme-light #logistics-view .logistics-filter-bar,
html.theme-light #logistics-view .output-toolbar,
body.theme-light #logistics-view .logistics-filter-bar,
body.theme-light #logistics-view .output-toolbar {
  background: transparent !important;
  border-color: rgba(143, 106, 224, 0.28);
  color: #1c1630;
}

/* ===== Розлив / табели: убрать тёмные панели ===== */
html.theme-light #bottling-view,
html.theme-light #timesheet-view,
html.theme-light #accounting-view,
body.theme-light #bottling-view,
body.theme-light #timesheet-view,
body.theme-light #accounting-view {
  --j-bg: transparent;
  --j-card: color-mix(in srgb, #b28eff 36%, #fff);
  --j-border: rgba(143, 106, 224, 0.42);
  --j-text: #1c1630;
  --j-muted: #6d6680;
  --j-accent: #b28eff;
}

html.theme-light .wh-ts-toolbar,
html.theme-light .bt-ts-toolbar,
html.theme-light .wh-ts-legend,
html.theme-light .wh-ts-mark-bar,
html.theme-light #bottling-view .bt-ts-toolbar,
html.theme-light #bottling-view #bottling-header-tools,
html.theme-light #timesheet-view .wh-ts-toolbar,
body.theme-light .wh-ts-toolbar,
body.theme-light .bt-ts-toolbar,
body.theme-light .wh-ts-legend,
body.theme-light .wh-ts-mark-bar,
body.theme-light #bottling-view .bt-ts-toolbar,
body.theme-light #bottling-view #bottling-header-tools,
body.theme-light #timesheet-view .wh-ts-toolbar {
  background: color-mix(in srgb, #b28eff 40%, #d8c8f4) !important;
  border: 1px solid rgba(143, 106, 224, 0.48) !important;
  color: #1c1630 !important;
}

html.theme-light .wh-ts-toolbar-label,
body.theme-light .wh-ts-toolbar-label {
  color: #5b3fa0 !important;
}

html.theme-light .wh-ts-toolbar-divider,
body.theme-light .wh-ts-toolbar-divider {
  background: rgba(143, 106, 224, 0.4) !important;
}

html.theme-light .wh-ts-chip,
html.theme-light button.wh-ts-legend-filter.wh-ts-chip,
html.theme-light .wh-ts-col-toggle.wh-ts-chip,
html.theme-light .wh-ts-dept-filter.wh-ts-chip,
html.theme-light .wh-ts-shift-filter.wh-ts-chip,
html.theme-light span.wh-ts-legend-chip.wh-ts-chip,
body.theme-light .wh-ts-chip,
body.theme-light button.wh-ts-legend-filter.wh-ts-chip,
body.theme-light .wh-ts-col-toggle.wh-ts-chip,
body.theme-light .wh-ts-dept-filter.wh-ts-chip,
body.theme-light .wh-ts-shift-filter.wh-ts-chip,
body.theme-light span.wh-ts-legend-chip.wh-ts-chip {
  background: color-mix(in srgb, #b28eff 28%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.45) !important;
  color: #1c1630 !important;
}

html.theme-light button.wh-ts-legend-filter.wh-ts-chip.active,
html.theme-light .wh-ts-col-toggle.wh-ts-chip.active,
html.theme-light .wh-ts-dept-filter.wh-ts-chip.active,
html.theme-light .wh-ts-shift-filter.wh-ts-chip.active,
body.theme-light button.wh-ts-legend-filter.wh-ts-chip.active,
body.theme-light .wh-ts-col-toggle.wh-ts-chip.active,
body.theme-light .wh-ts-dept-filter.wh-ts-chip.active,
body.theme-light .wh-ts-shift-filter.wh-ts-chip.active {
  background: #b28eff !important;
  border-color: #b28eff !important;
  color: #fff !important;
}

/* Розлив: смены 1/2/3/3/5/2 и колонки — всегда фирменный фиолетовый, чёрный текст */
html.theme-light #bottling-view .wh-ts-shift-filter.wh-ts-chip,
html.theme-light #bottling-view .wh-ts-shift-filter.wh-ts-chip.active,
html.theme-light #bottling-view .wh-ts-col-toggle.wh-ts-chip,
html.theme-light #bottling-view .wh-ts-col-toggle.wh-ts-chip.active,
html.theme-light #bottling-view #bottling-header-tools .wh-ts-shift-filter,
html.theme-light #bottling-view #bottling-header-tools .wh-ts-col-toggle,
body.theme-light #bottling-view .wh-ts-shift-filter.wh-ts-chip,
body.theme-light #bottling-view .wh-ts-shift-filter.wh-ts-chip.active,
body.theme-light #bottling-view .wh-ts-col-toggle.wh-ts-chip,
body.theme-light #bottling-view .wh-ts-col-toggle.wh-ts-chip.active,
body.theme-light #bottling-view #bottling-header-tools .wh-ts-shift-filter,
body.theme-light #bottling-view #bottling-header-tools .wh-ts-col-toggle {
  background: #b28eff !important;
  border: 1px solid #8f6ae0 !important;
  color: #1c1630 !important;
  box-shadow: none !important;
}

/* Выбранная смена / включённая колонка — чуть ярче обводка */
html.theme-light #bottling-view .wh-ts-shift-filter.wh-ts-chip.active,
html.theme-light #bottling-view .wh-ts-col-toggle.wh-ts-chip.active,
body.theme-light #bottling-view .wh-ts-shift-filter.wh-ts-chip.active,
body.theme-light #bottling-view .wh-ts-col-toggle.wh-ts-chip.active {
  box-shadow: 0 0 0 2px rgba(88, 50, 160, 0.35) !important;
  font-weight: 700 !important;
}

html.theme-light .wh-ts-search,
html.theme-light #bottling-view .bt-ts-birthday,
html.theme-light #bottling-view .bt-ts-work-hours,
html.theme-light #bottling-view .bt-fines-comment-input,
html.theme-light button.co-ts-help-btn,
html.theme-light .co-ts-help-panel,
html.theme-light .co-ts-help-label-input,
body.theme-light .wh-ts-search,
body.theme-light #bottling-view .bt-ts-birthday,
body.theme-light #bottling-view .bt-ts-work-hours,
body.theme-light #bottling-view .bt-fines-comment-input,
body.theme-light button.co-ts-help-btn,
body.theme-light .co-ts-help-panel,
body.theme-light .co-ts-help-label-input {
  background: color-mix(in srgb, #b28eff 32%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.45) !important;
  color: #1c1630 !important;
  color-scheme: light;
}

html.theme-light .wh-ts-sticky,
html.theme-light .co-ts-table th.wh-ts-day-col,
html.theme-light .co-ts-table th.wh-ts-day-col.wh-ts-th--weekend,
html.theme-light .wh-ts-table thead th,
html.theme-light .co-ts-table thead th,
html.theme-light #bottling-view .wh-ts-sticky,
html.theme-light #bottling-view .output-sticky-name,
html.theme-light #bottling-view .bt-fines-table tr.bt-fines-row--has-fine .output-sticky-name,
html.theme-light #bottling-view .bt-fines-table tr.bt-fines-row--not-in-ts .output-sticky-name,
body.theme-light .wh-ts-sticky,
body.theme-light .co-ts-table th.wh-ts-day-col,
body.theme-light .co-ts-table th.wh-ts-day-col.wh-ts-th--weekend,
body.theme-light .wh-ts-table thead th,
body.theme-light .co-ts-table thead th,
body.theme-light #bottling-view .wh-ts-sticky,
body.theme-light #bottling-view .output-sticky-name,
body.theme-light #bottling-view .bt-fines-table tr.bt-fines-row--has-fine .output-sticky-name,
body.theme-light #bottling-view .bt-fines-table tr.bt-fines-row--not-in-ts .output-sticky-name {
  background: color-mix(in srgb, #b28eff 48%, #fff) !important;
  color: #1c1630 !important;
  box-shadow: 2px 0 6px rgba(70, 40, 130, 0.08);
}

html.theme-light .co-ts-table th.wh-ts-day-col.wh-ts-th--weekend,
body.theme-light .co-ts-table th.wh-ts-day-col.wh-ts-th--weekend {
  color: #c2410c !important;
}

html.theme-light #bottling-view .bt-fines-table textarea.bt-fines-comment-input,
body.theme-light #bottling-view .bt-fines-table textarea.bt-fines-comment-input {
  background: color-mix(in srgb, #b28eff 32%, #fff) !important;
  color: #1c1630 !important;
  color-scheme: light;
}

/* (подсветки дней табеля — см. выше: без !important на cell-input) */

/* ===== Табель: фильтры в шапке (общий + пространство Табель) ===== */
/* Плашка фирменная, текст чёрный, цифра/код — цвет метки (рыжий 8 и т.д.) */
html.theme-light .wh-ts-mark-chip,
html.theme-light button.wh-ts-mark-chip,
body.theme-light .wh-ts-mark-chip,
body.theme-light button.wh-ts-mark-chip {
  background: #b28eff !important;
  border-color: rgba(90, 50, 160, 0.35) !important;
  color: #1a1a1a !important;
}

html.theme-light .wh-ts-mark-chip__code,
html.theme-light button.wh-ts-mark-chip .wh-ts-mark-chip__code,
body.theme-light .wh-ts-mark-chip__code,
body.theme-light button.wh-ts-mark-chip .wh-ts-mark-chip__code {
  background: transparent !important;
  color: var(--mark-color, #1a1a1a) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html.theme-light .wh-ts-mark-chip__label,
html.theme-light button.wh-ts-mark-chip .wh-ts-mark-chip__label,
body.theme-light .wh-ts-mark-chip__label,
body.theme-light button.wh-ts-mark-chip .wh-ts-mark-chip__label {
  background: transparent !important;
  color: #1a1a1a !important;
}

html.theme-light .wh-ts-mark-bar__hint,
body.theme-light .wh-ts-mark-bar__hint {
  background: transparent !important;
  border: none !important;
  color: #3d2a6d !important;
  box-shadow: none !important;
}

html.theme-light button.wh-ts-mark-chip.active,
body.theme-light button.wh-ts-mark-chip.active {
  background: #9b74e8 !important;
  box-shadow: 0 0 0 2px #5b3fa0, 0 0 0 4px rgba(91, 63, 160, 0.35) !important;
}

html.theme-light button.wh-ts-mark-chip.active .wh-ts-mark-chip__code,
body.theme-light button.wh-ts-mark-chip.active .wh-ts-mark-chip__code {
  background: transparent !important;
  color: var(--mark-color, #1a1a1a) !important;
}

html.theme-light .wh-ts-days-legend-strip,
html.theme-light #timesheet-view .wh-ts-days-legend-strip,
html.theme-light #bottling-view .wh-ts-days-legend-strip,
html.theme-light #accounting-view .wh-ts-days-legend-strip,
body.theme-light .wh-ts-days-legend-strip,
body.theme-light #timesheet-view .wh-ts-days-legend-strip,
body.theme-light #bottling-view .wh-ts-days-legend-strip,
body.theme-light #accounting-view .wh-ts-days-legend-strip {
  background: color-mix(in srgb, #b28eff 55%, #fff) !important;
  border-bottom: 1px solid rgba(90, 50, 160, 0.28) !important;
}

html.theme-light .wh-ts-days-legend-strip .wh-ts-mark-bar,
body.theme-light .wh-ts-days-legend-strip .wh-ts-mark-bar {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Общий табель: не раздувать пустой #accounting-view на весь экран */
body.accounting-company-active #accounting-view {
  min-height: 0 !important;
  height: auto !important;
  padding-bottom: 0 !important;
  background: transparent !important;
}

body.accounting-company-active #accounting-view .accounting-header {
  margin-bottom: 0.35rem;
}

body.accounting-company-active #accounting-company-host {
  display: none !important;
}

html.theme-light .wh-ts-wrap--has-legend,
html.theme-light #timesheet-view .warehouse-table-wrap,
body.theme-light .wh-ts-wrap--has-legend,
body.theme-light #timesheet-view .warehouse-table-wrap {
  border-color: rgba(143, 106, 224, 0.42) !important;
  background: color-mix(in srgb, #b28eff 22%, #fff);
}

/* ===== Выработка: ячейки отбор/приёмка/упаковка ===== */
html.theme-light #output-view .output-table input.output-cell-input:not(.output-field-diff):not(.output-shift-missing):not(.output-shift-found):not(.output-shift-empty),
html.theme-light #output-view .output-table input.output-name-input,
html.theme-light #output-view .output-table .output-readonly:not(.output-field-diff),
html.theme-light #output-view .output-bonus-input,
html.theme-light #output-view .output-bonus-plan-input,
body.theme-light #output-view .output-table input.output-cell-input:not(.output-field-diff):not(.output-shift-missing):not(.output-shift-found):not(.output-shift-empty),
body.theme-light #output-view .output-table input.output-name-input,
body.theme-light #output-view .output-table .output-readonly:not(.output-field-diff),
body.theme-light #output-view .output-bonus-input,
body.theme-light #output-view .output-bonus-plan-input {
  background: color-mix(in srgb, #b28eff 36%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.48) !important;
  color: #1c1630 !important;
  border-radius: 8px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

/* Ячейки внутри diff/shift-ячеек тоже не красить фирменным */
html.theme-light #output-view .output-table .output-field-diff-cell input.output-cell-input,
html.theme-light #output-view .output-table .output-field-diff-cell .output-readonly,
html.theme-light #output-view .output-table .output-shift-missing-cell input.output-cell-input,
html.theme-light #output-view .output-table .output-shift-found-cell input.output-cell-input,
html.theme-light #output-view .output-table .output-shift-empty-cell input.output-cell-input,
body.theme-light #output-view .output-table .output-field-diff-cell input.output-cell-input,
body.theme-light #output-view .output-table .output-field-diff-cell .output-readonly,
body.theme-light #output-view .output-table .output-shift-missing-cell input.output-cell-input,
body.theme-light #output-view .output-table .output-shift-found-cell input.output-cell-input,
body.theme-light #output-view .output-table .output-shift-empty-cell input.output-cell-input {
  /* цвета задаются блоком «Рассинхрон» ниже */
  border-radius: 8px !important;
}

html.theme-light #output-view .output-table thead th,
html.theme-light #output-view .output-sticky-name,
html.theme-light #output-view .output-col-sticky-right,
html.theme-light #output-view .output-table thead .output-sticky-name,
html.theme-light #output-view .output-table thead .output-col-sticky-right,
body.theme-light #output-view .output-table thead th,
body.theme-light #output-view .output-sticky-name,
body.theme-light #output-view .output-col-sticky-right,
body.theme-light #output-view .output-table thead .output-sticky-name,
body.theme-light #output-view .output-table thead .output-col-sticky-right {
  background: color-mix(in srgb, #b28eff 48%, #fff) !important;
  color: #1c1630 !important;
}

html.theme-light #output-view .output-table-wrap,
html.theme-light #output-view .output-bonus-block,
html.theme-light #output-view .output-bonus-section,
html.theme-light .output-page--bonuses .output-bonus-block,
body.theme-light #output-view .output-table-wrap,
body.theme-light #output-view .output-bonus-block,
body.theme-light #output-view .output-bonus-section,
body.theme-light .output-page--bonuses .output-bonus-block {
  background: color-mix(in srgb, #b28eff 28%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.42) !important;
  color: #1c1630;
}

/* ===== Бухгалтерия / ведомость: тёмная шапка ===== */
html.theme-light .vedomost-mark-strip,
html.theme-light #accounting-view .vedomost-mark-strip,
body.theme-light .vedomost-mark-strip,
body.theme-light #accounting-view .vedomost-mark-strip {
  background: color-mix(in srgb, #b28eff 46%, #d8c8f4) !important;
  border-bottom-color: rgba(143, 106, 224, 0.45) !important;
  color: #1c1630 !important;
}

html.theme-light .vedomost-table thead th,
html.theme-light .vedomost-th--sticky,
html.theme-light .vedomost-td--sticky,
html.theme-light .vedomost-vp-table thead th,
html.theme-light .vedomost-vp-table .vedomost-th--sticky,
html.theme-light #accounting-view th,
body.theme-light .vedomost-table thead th,
body.theme-light .vedomost-th--sticky,
body.theme-light .vedomost-td--sticky,
body.theme-light .vedomost-vp-table thead th,
body.theme-light .vedomost-vp-table .vedomost-th--sticky,
body.theme-light #accounting-view th {
  background: color-mix(in srgb, #b28eff 48%, #fff) !important;
  color: #1c1630 !important;
  border-color: rgba(143, 106, 224, 0.32) !important;
}

html.theme-light .vedomost-cell-input,
html.theme-light .vedomost-cell-ro,
body.theme-light .vedomost-cell-input,
body.theme-light .vedomost-cell-ro {
  background: color-mix(in srgb, #b28eff 48%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.55) !important;
  color: #1c1630 !important;
  border-radius: 8px;
}

html.theme-light .vedomost-wrap--has-filters,
html.theme-light .vedomost-wrap,
body.theme-light .vedomost-wrap--has-filters,
body.theme-light .vedomost-wrap {
  border-color: rgba(143, 106, 224, 0.42) !important;
  background: color-mix(in srgb, #b28eff 18%, #fff);
}

/* ===== Логистика: справка по бонусам + ТО ячейки ===== */
html.theme-light .logistics-kpi-panel,
html.theme-light #logistics-view .logistics-kpi-panel,
body.theme-light .logistics-kpi-panel,
body.theme-light #logistics-view .logistics-kpi-panel {
  background: color-mix(in srgb, #b28eff 32%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.45) !important;
  color: #1c1630 !important;
  box-shadow: 0 8px 22px rgba(70, 40, 130, 0.06);
}

html.theme-light .logistics-kpi-panel h3,
html.theme-light .logistics-kpi-hint,
body.theme-light .logistics-kpi-panel h3,
body.theme-light .logistics-kpi-hint {
  color: #1c1630 !important;
}

html.theme-light .logistics-table--kpi th,
html.theme-light .logistics-table--kpi td,
body.theme-light .logistics-table--kpi th,
body.theme-light .logistics-table--kpi td {
  background: color-mix(in srgb, #b28eff 28%, #fff) !important;
  color: #1c1630 !important;
  border-color: rgba(143, 106, 224, 0.28) !important;
}

html.theme-light .logistics-kpi-tier-range-display,
html.theme-light .logistics-kpi-tier-range-edit,
body.theme-light .logistics-kpi-tier-range-display,
body.theme-light .logistics-kpi-tier-range-edit {
  color: #8f6ae0 !important;
}

html.theme-light .logistics-to-pill,
html.theme-light .logistics-to-input,
html.theme-light .logistics-driver-to-input,
html.theme-light .logistics-to-symbol,
body.theme-light .logistics-to-pill,
body.theme-light .logistics-to-input,
body.theme-light .logistics-driver-to-input,
body.theme-light .logistics-to-symbol {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.7rem;
  min-width: 2.6rem;
  padding: 0.22rem 0.45rem;
  border-radius: 8px;
  background: color-mix(in srgb, #b28eff 36%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.48) !important;
  color: #1c1630 !important;
  box-sizing: border-box;
}

html.theme-light .logistics-to-input,
html.theme-light .logistics-driver-to-input,
body.theme-light .logistics-to-input,
body.theme-light .logistics-driver-to-input {
  width: 100%;
  max-width: 5.5rem;
  text-align: right;
}

/* ТО: без отдельной полосы — как соседние ячейки; цвет только у paid/planned */
html.theme-light .logistics-to-cell,
html.theme-light .logistics-to-cell--empty,
html.theme-light .logistics-table--drivers td.logistics-to-cell,
body.theme-light .logistics-to-cell,
body.theme-light .logistics-to-cell--empty,
body.theme-light .logistics-table--drivers td.logistics-to-cell {
  background: transparent !important;
  color: #1c1630 !important;
}

html.theme-light .logistics-to-cell--paid,
body.theme-light .logistics-to-cell--paid {
  background: color-mix(in srgb, #5fd49a 28%, #fff) !important;
}

html.theme-light .logistics-to-cell--planned,
body.theme-light .logistics-to-cell--planned {
  background: color-mix(in srgb, #f0c674 30%, #fff) !important;
}

html.theme-light .logistics-to-cell--paid .logistics-to-input,
html.theme-light .logistics-to-cell--paid .logistics-driver-to-input,
html.theme-light .logistics-to-cell--paid .logistics-to-pill,
body.theme-light .logistics-to-cell--paid .logistics-to-input,
body.theme-light .logistics-to-cell--paid .logistics-driver-to-input,
body.theme-light .logistics-to-cell--paid .logistics-to-pill {
  color: #166534 !important;
  font-weight: 700;
}

html.theme-light .logistics-to-cell--planned .logistics-to-input,
html.theme-light .logistics-to-cell--planned .logistics-driver-to-input,
html.theme-light .logistics-to-cell--planned .logistics-to-pill,
body.theme-light .logistics-to-cell--planned .logistics-to-input,
body.theme-light .logistics-to-cell--planned .logistics-driver-to-input,
body.theme-light .logistics-to-cell--planned .logistics-to-pill {
  color: #92400e !important;
  font-weight: 700;
}

html.theme-light .logistics-table--to th,
body.theme-light .logistics-table--to th {
  background: color-mix(in srgb, #b28eff 48%, #fff) !important;
  color: #1c1630 !important;
}

html.theme-light .logistics-table--to th.logistics-to-th--quarter,
body.theme-light .logistics-table--to th.logistics-to-th--quarter {
  color: #5b3fa0 !important;
}

html.theme-light .logistics-to-subtabs,
body.theme-light .logistics-to-subtabs {
  background: color-mix(in srgb, #b28eff 40%, #d8c8f4) !important;
  border-color: rgba(143, 106, 224, 0.45) !important;
}

/* ===== Выработка: убрать тёмные строки/sticky + вернуть рассинхрон ===== */
html.theme-light #output-view .output-table tbody td.output-col,
html.theme-light #output-view .output-table tbody td,
html.theme-light #output-view .output-col-sticky-right,
html.theme-light #output-view .output-sticky-name,
html.theme-light #output-view .output-table tfoot .output-totals-row td,
html.theme-light #output-view .output-table tfoot .output-totals-row .output-sticky-name,
html.theme-light #output-view .output-table tfoot .output-totals-row .output-col-sticky-right,
html.theme-light #output-view .output-table tbody tr.output-row-senior td,
html.theme-light #output-view .output-table tbody tr.output-row-senior .output-sticky-name,
html.theme-light #output-view .output-table tbody tr.output-row-senior .output-col-sticky-right,
body.theme-light #output-view .output-table tbody td.output-col,
body.theme-light #output-view .output-table tbody td,
body.theme-light #output-view .output-col-sticky-right,
body.theme-light #output-view .output-sticky-name,
body.theme-light #output-view .output-table tfoot .output-totals-row td,
body.theme-light #output-view .output-table tfoot .output-totals-row .output-sticky-name,
body.theme-light #output-view .output-table tfoot .output-totals-row .output-col-sticky-right,
body.theme-light #output-view .output-table tbody tr.output-row-senior td,
body.theme-light #output-view .output-table tbody tr.output-row-senior .output-sticky-name,
body.theme-light #output-view .output-table tbody tr.output-row-senior .output-col-sticky-right {
  background: color-mix(in srgb, #b28eff 28%, #fff) !important;
  color: #1c1630 !important;
  box-shadow: none;
}

html.theme-light #output-view .output-table tbody tr.output-row-senior td,
body.theme-light #output-view .output-table tbody tr.output-row-senior td {
  background: color-mix(in srgb, #b28eff 42%, #dbeafe) !important;
}

html.theme-light #output-view .output-table tfoot .output-totals-row td,
body.theme-light #output-view .output-table tfoot .output-totals-row td {
  background: color-mix(in srgb, #b28eff 52%, #fff) !important;
  border-top-color: rgba(143, 106, 224, 0.45) !important;
}

/* Рассинхрон / смены — поверх фирменной заливки инпутов */
html.theme-light .output-shift-missing,
html.theme-light .output-shift-missing-cell .output-shift-missing,
html.theme-light #output-view .output-table input.output-cell-input.output-shift-missing,
html.theme-light #output-view .output-table .output-shift-missing-cell input.output-cell-input,
body.theme-light .output-shift-missing,
body.theme-light .output-shift-missing-cell .output-shift-missing,
body.theme-light #output-view .output-table input.output-cell-input.output-shift-missing,
body.theme-light #output-view .output-table .output-shift-missing-cell input.output-cell-input {
  background: rgba(248, 113, 113, 0.28) !important;
  border-color: rgba(185, 28, 28, 0.65) !important;
  color: #991b1b !important;
}

html.theme-light .output-shift-found,
html.theme-light .output-shift-found-cell .output-shift-found,
html.theme-light #output-view .output-table input.output-cell-input.output-shift-found,
html.theme-light #output-view .output-table .output-shift-found-cell input.output-cell-input,
body.theme-light .output-shift-found,
body.theme-light .output-shift-found-cell .output-shift-found,
body.theme-light #output-view .output-table input.output-cell-input.output-shift-found,
body.theme-light #output-view .output-table .output-shift-found-cell input.output-cell-input {
  background: rgba(74, 222, 128, 0.28) !important;
  border-color: rgba(22, 101, 52, 0.55) !important;
  color: #166534 !important;
}

html.theme-light .output-shift-empty,
html.theme-light .output-shift-empty-cell .output-shift-empty,
html.theme-light #output-view .output-table input.output-cell-input.output-shift-empty,
html.theme-light #output-view .output-table .output-shift-empty-cell input.output-cell-input,
body.theme-light .output-shift-empty,
body.theme-light .output-shift-empty-cell .output-shift-empty,
body.theme-light #output-view .output-table input.output-cell-input.output-shift-empty,
body.theme-light #output-view .output-table .output-shift-empty-cell input.output-cell-input {
  background: rgba(230, 126, 34, 0.28) !important;
  border-color: rgba(194, 95, 12, 0.65) !important;
  color: #9a3412 !important;
}

html.theme-light .output-field-diff,
html.theme-light .output-field-diff-cell .output-cell-input,
html.theme-light .output-field-diff-cell .output-readonly,
html.theme-light #output-view .output-table input.output-cell-input.output-field-diff,
html.theme-light #output-view .output-table .output-field-diff-cell input.output-cell-input,
html.theme-light #output-view .output-table .output-field-diff-cell .output-readonly,
body.theme-light .output-field-diff,
body.theme-light .output-field-diff-cell .output-cell-input,
body.theme-light .output-field-diff-cell .output-readonly,
body.theme-light #output-view .output-table input.output-cell-input.output-field-diff,
body.theme-light #output-view .output-table .output-field-diff-cell input.output-cell-input,
body.theme-light #output-view .output-table .output-field-diff-cell .output-readonly {
  background: rgba(251, 146, 60, 0.32) !important;
  border-color: rgba(180, 83, 9, 0.65) !important;
  color: #9a3412 !important;
}

/* Табель: рассинхрон часов по дню — красная рамка поверх метки */
html.theme-light .co-ts-table .co-ts-day--hours-mismatch .co-ts-cell-input,
html.theme-light .co-ts-table .co-ts-day--hours-mismatch .wh-ts-cell-input,
body.theme-light .co-ts-table .co-ts-day--hours-mismatch .co-ts-cell-input,
body.theme-light .co-ts-table .co-ts-day--hours-mismatch .wh-ts-cell-input {
  opacity: 0.55;
  box-shadow: inset 0 0 0 1.5px rgba(220, 38, 38, 0.95) !important;
}

html.theme-light .output-diff-hint,
html.theme-light .output-shift-legend-missing,
body.theme-light .output-diff-hint,
body.theme-light .output-shift-legend-missing {
  color: #b91c1c !important;
}

html.theme-light .output-shift-legend-found,
body.theme-light .output-shift-legend-found {
  color: #15803d !important;
}

/* Ведомость: подсветки match/miss поверх фирменного фона ячеек */
html.theme-light .vedomost-cell--days-match .vedomost-cell-input,
html.theme-light .vedomost-cell--days-match .vedomost-cell-ro,
html.theme-light .vedomost-cell--bonus-match .vedomost-cell-input,
html.theme-light .vedomost-cell--bonus-match .vedomost-cell-ro,
html.theme-light .vedomost-cell--vac-match .vedomost-cell-input,
html.theme-light .vedomost-cell--vac-match .vedomost-cell-ro,
html.theme-light #accounting-view .vedomost-cell--days-match .vedomost-cell-input,
html.theme-light #accounting-view .vedomost-cell--days-match .vedomost-cell-ro,
html.theme-light #accounting-view .vedomost-cell--bonus-match .vedomost-cell-input,
html.theme-light #accounting-view .vedomost-cell--bonus-match .vedomost-cell-ro,
html.theme-light #accounting-view .vedomost-cell--vac-match .vedomost-cell-input,
html.theme-light #accounting-view .vedomost-cell--vac-match .vedomost-cell-ro,
body.theme-light .vedomost-cell--days-match .vedomost-cell-input,
body.theme-light .vedomost-cell--days-match .vedomost-cell-ro,
body.theme-light .vedomost-cell--bonus-match .vedomost-cell-input,
body.theme-light .vedomost-cell--bonus-match .vedomost-cell-ro,
body.theme-light .vedomost-cell--vac-match .vedomost-cell-input,
body.theme-light .vedomost-cell--vac-match .vedomost-cell-ro,
body.theme-light #accounting-view .vedomost-cell--days-match .vedomost-cell-input,
body.theme-light #accounting-view .vedomost-cell--days-match .vedomost-cell-ro,
body.theme-light #accounting-view .vedomost-cell--bonus-match .vedomost-cell-input,
body.theme-light #accounting-view .vedomost-cell--bonus-match .vedomost-cell-ro,
body.theme-light #accounting-view .vedomost-cell--vac-match .vedomost-cell-input,
body.theme-light #accounting-view .vedomost-cell--vac-match .vedomost-cell-ro {
  background: rgba(74, 222, 128, 0.32) !important;
  border-color: rgba(22, 101, 52, 0.55) !important;
  color: #166534 !important;
  box-shadow: none;
}

html.theme-light .vedomost-cell--days-miss .vedomost-cell-input,
html.theme-light .vedomost-cell--days-miss .vedomost-cell-ro,
html.theme-light .vedomost-cell--bonus-miss .vedomost-cell-input,
html.theme-light .vedomost-cell--bonus-miss .vedomost-cell-ro,
html.theme-light .vedomost-cell--vac-miss .vedomost-cell-input,
html.theme-light .vedomost-cell--vac-miss .vedomost-cell-ro,
html.theme-light .vedomost-cell--name-miss .vedomost-cell-input,
html.theme-light .vedomost-cell--name-miss .vedomost-cell-ro,
html.theme-light .vedomost-row--name-miss .vedomost-td--sticky .vedomost-cell-input,
html.theme-light .vedomost-row--name-miss .vedomost-td--sticky .vedomost-cell-ro,
html.theme-light #accounting-view .vedomost-cell--days-miss .vedomost-cell-input,
html.theme-light #accounting-view .vedomost-cell--days-miss .vedomost-cell-ro,
html.theme-light #accounting-view .vedomost-cell--bonus-miss .vedomost-cell-input,
html.theme-light #accounting-view .vedomost-cell--bonus-miss .vedomost-cell-ro,
html.theme-light #accounting-view .vedomost-cell--vac-miss .vedomost-cell-input,
html.theme-light #accounting-view .vedomost-cell--vac-miss .vedomost-cell-ro,
html.theme-light #accounting-view .vedomost-cell--name-miss .vedomost-cell-input,
html.theme-light #accounting-view .vedomost-cell--name-miss .vedomost-cell-ro,
html.theme-light #accounting-view .vedomost-row--name-miss .vedomost-td--sticky .vedomost-cell-input,
html.theme-light #accounting-view .vedomost-row--name-miss .vedomost-td--sticky .vedomost-cell-ro,
body.theme-light .vedomost-cell--days-miss .vedomost-cell-input,
body.theme-light .vedomost-cell--days-miss .vedomost-cell-ro,
body.theme-light .vedomost-cell--bonus-miss .vedomost-cell-input,
body.theme-light .vedomost-cell--bonus-miss .vedomost-cell-ro,
body.theme-light .vedomost-cell--vac-miss .vedomost-cell-input,
body.theme-light .vedomost-cell--vac-miss .vedomost-cell-ro,
body.theme-light .vedomost-cell--name-miss .vedomost-cell-input,
body.theme-light .vedomost-cell--name-miss .vedomost-cell-ro,
body.theme-light .vedomost-row--name-miss .vedomost-td--sticky .vedomost-cell-input,
body.theme-light .vedomost-row--name-miss .vedomost-td--sticky .vedomost-cell-ro,
body.theme-light #accounting-view .vedomost-cell--days-miss .vedomost-cell-input,
body.theme-light #accounting-view .vedomost-cell--days-miss .vedomost-cell-ro,
body.theme-light #accounting-view .vedomost-cell--bonus-miss .vedomost-cell-input,
body.theme-light #accounting-view .vedomost-cell--bonus-miss .vedomost-cell-ro,
body.theme-light #accounting-view .vedomost-cell--vac-miss .vedomost-cell-input,
body.theme-light #accounting-view .vedomost-cell--vac-miss .vedomost-cell-ro,
body.theme-light #accounting-view .vedomost-cell--name-miss .vedomost-cell-input,
body.theme-light #accounting-view .vedomost-cell--name-miss .vedomost-cell-ro,
body.theme-light #accounting-view .vedomost-row--name-miss .vedomost-td--sticky .vedomost-cell-input,
body.theme-light #accounting-view .vedomost-row--name-miss .vedomost-td--sticky .vedomost-cell-ro {
  background: rgba(248, 113, 113, 0.32) !important;
  border-color: rgba(185, 28, 28, 0.65) !important;
  color: #991b1b !important;
  box-shadow: inset 3px 0 0 #e67e22;
}

html.theme-light .vedomost-cell--days-miss .vedomost-cell-input,
html.theme-light .vedomost-cell--days-miss .vedomost-cell-ro,
html.theme-light .vedomost-cell--bonus-miss .vedomost-cell-input,
html.theme-light .vedomost-cell--bonus-miss .vedomost-cell-ro,
html.theme-light .vedomost-cell--vac-miss .vedomost-cell-input,
html.theme-light .vedomost-cell--vac-miss .vedomost-cell-ro,
html.theme-light #accounting-view .vedomost-cell--days-miss .vedomost-cell-input,
html.theme-light #accounting-view .vedomost-cell--days-miss .vedomost-cell-ro,
html.theme-light #accounting-view .vedomost-cell--bonus-miss .vedomost-cell-input,
html.theme-light #accounting-view .vedomost-cell--bonus-miss .vedomost-cell-ro,
html.theme-light #accounting-view .vedomost-cell--vac-miss .vedomost-cell-input,
html.theme-light #accounting-view .vedomost-cell--vac-miss .vedomost-cell-ro,
body.theme-light .vedomost-cell--days-miss .vedomost-cell-input,
body.theme-light .vedomost-cell--days-miss .vedomost-cell-ro,
body.theme-light .vedomost-cell--bonus-miss .vedomost-cell-input,
body.theme-light .vedomost-cell--bonus-miss .vedomost-cell-ro,
body.theme-light .vedomost-cell--vac-miss .vedomost-cell-input,
body.theme-light .vedomost-cell--vac-miss .vedomost-cell-ro,
body.theme-light #accounting-view .vedomost-cell--days-miss .vedomost-cell-input,
body.theme-light #accounting-view .vedomost-cell--days-miss .vedomost-cell-ro,
body.theme-light #accounting-view .vedomost-cell--bonus-miss .vedomost-cell-input,
body.theme-light #accounting-view .vedomost-cell--bonus-miss .vedomost-cell-ro,
body.theme-light #accounting-view .vedomost-cell--vac-miss .vedomost-cell-input,
body.theme-light #accounting-view .vedomost-cell--vac-miss .vedomost-cell-ro {
  box-shadow: none;
}

/* Табель: sticky-end справа тоже не чёрный */
html.theme-light .wh-ts-sticky-end,
body.theme-light .wh-ts-sticky-end {
  background: color-mix(in srgb, #b28eff 48%, #fff) !important;
  color: #1c1630 !important;
  box-shadow: -3px 0 8px rgba(70, 40, 130, 0.1);
}

/* ===== Журнал / Розлив: фон страницы как на складе ===== */
html.theme-light body.journal-active,
body.theme-light.journal-active {
  background: color-mix(in srgb, #b28eff 28%, #e8e0f5) !important;
}

html.theme-light #bottling-view,
body.theme-light #bottling-view {
  background: color-mix(in srgb, #b28eff 28%, #e8e0f5) !important;
  --j-bg: color-mix(in srgb, #b28eff 28%, #e8e0f5);
}

html.theme-light #bottling-view .journal-header,
html.theme-light #bottling-view #bottling-content,
html.theme-light #bottling-view .warehouse-page,
html.theme-light #bottling-view .bt-fines-page,
body.theme-light #bottling-view .journal-header,
body.theme-light #bottling-view #bottling-content,
body.theme-light #bottling-view .warehouse-page,
body.theme-light #bottling-view .bt-fines-page {
  background: color-mix(in srgb, #b28eff 28%, #e8e0f5) !important;
}

html.theme-light #bottling-view .warehouse-table-wrap,
html.theme-light #bottling-view .wh-ts-wrap,
html.theme-light #bottling-view .output-table-wrap,
body.theme-light #bottling-view .warehouse-table-wrap,
body.theme-light #bottling-view .wh-ts-wrap,
body.theme-light #bottling-view .output-table-wrap {
  background: color-mix(in srgb, #b28eff 36%, #fff) !important;
  border-color: rgba(143, 106, 224, 0.42) !important;
}

/* Табель — Розлив: заголовок тёмно-синий */
html.theme-light #bottling-view .warehouse-mode-badge,
html.theme-light #bottling-view .output-mode-badge,
body.theme-light #bottling-view .warehouse-mode-badge,
body.theme-light #bottling-view .output-mode-badge {
  color: #1e3a8a !important;
  background: color-mix(in srgb, #1e3a8a 12%, #fff) !important;
  border: 1px solid rgba(30, 58, 138, 0.28);
  font-weight: 700;
}

/* Водители: ячейка ТО не выделяет колонку полосой */
html.theme-light .logistics-table--drivers .logistics-to-cell--quarter:not(.logistics-to-cell--paid):not(.logistics-to-cell--planned),
body.theme-light .logistics-table--drivers .logistics-to-cell--quarter:not(.logistics-to-cell--paid):not(.logistics-to-cell--planned) {
  background: transparent !important;
}

/* ===== Отпуск: месяцы — нежно фирменные, выбранный ярко ===== */
html.theme-light button.co-ts-vac-month-btn,
html.theme-light #bottling-view button.co-ts-vac-month-btn,
body.theme-light button.co-ts-vac-month-btn,
body.theme-light #bottling-view button.co-ts-vac-month-btn {
  background: color-mix(in srgb, #b28eff 32%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.4) !important;
  color: #1c1630 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

html.theme-light button.co-ts-vac-month-btn:hover,
html.theme-light #bottling-view button.co-ts-vac-month-btn:hover,
body.theme-light button.co-ts-vac-month-btn:hover,
body.theme-light #bottling-view button.co-ts-vac-month-btn:hover {
  background: color-mix(in srgb, #b28eff 46%, #fff) !important;
  color: #1c1630 !important;
  filter: none;
}

html.theme-light button.co-ts-vac-month-btn.active,
html.theme-light #bottling-view button.co-ts-vac-month-btn.active,
body.theme-light button.co-ts-vac-month-btn.active,
body.theme-light #bottling-view button.co-ts-vac-month-btn.active {
  background: #b28eff !important;
  border-color: #8f6ae0 !important;
  color: #1c1630 !important;
  font-weight: 700;
  box-shadow: 0 4px 12px rgba(178, 142, 255, 0.35);
}

/* Кнопка «Анализ»: текст чёрный на фирменном фоне */
html.theme-light #summary-view .summary-subtab.active,
body.theme-light #summary-view .summary-subtab.active {
  background: #b28eff !important;
  border-color: #b28eff !important;
  color: #1a1a1a !important;
}

/* ===== Сводный → Отгрузки: один тон таблицы, цвет ТК только у цифр ===== */
html.theme-light #summary-view .summary-table--shipments thead th,
html.theme-light #summary-view .summary-table--shipments tbody td,
html.theme-light #summary-view .summary-table--shipments tfoot td,
html.theme-light #summary-view .summary-table--shipments .sticky-col,
html.theme-light #summary-view .summary-table--shipments .summary-date,
html.theme-light #summary-view .summary-table--shipments .summary-cell-total,
html.theme-light #summary-view .summary-table--shipments .summary-th-total,
html.theme-light #summary-view .summary-table--shipments .summary-totals-row td,
body.theme-light #summary-view .summary-table--shipments thead th,
body.theme-light #summary-view .summary-table--shipments tbody td,
body.theme-light #summary-view .summary-table--shipments tfoot td,
body.theme-light #summary-view .summary-table--shipments .sticky-col,
body.theme-light #summary-view .summary-table--shipments .summary-date,
body.theme-light #summary-view .summary-table--shipments .summary-cell-total,
body.theme-light #summary-view .summary-table--shipments .summary-th-total,
body.theme-light #summary-view .summary-table--shipments .summary-totals-row td {
  background: color-mix(in srgb, #b28eff 36%, #fff) !important;
}

html.theme-light #summary-view .summary-table--shipments .summary-pill,
body.theme-light #summary-view .summary-table--shipments .summary-pill {
  background: color-mix(in srgb, #b28eff 28%, #fff) !important;
  border-color: rgba(143, 106, 224, 0.4) !important;
}

/* Бухгалтерия: фильтры в шапке рядом с вкладками */
html.theme-light #accounting-view .accounting-header-row,
body.theme-light #accounting-view .accounting-header-row {
  width: 100%;
  align-items: center;
}

/* Убираем «карточечный» фон с обёртки — рамка только у кнопки «Лист» */
html.theme-light #accounting-view .accounting-vedomost-tools .vedomost-sheet-picker,
body.theme-light #accounting-view .accounting-vedomost-tools .vedomost-sheet-picker {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

html.theme-light #accounting-view .vedomost-sheet-picker-btn,
body.theme-light #accounting-view .vedomost-sheet-picker-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  box-sizing: border-box;
  height: 2.15rem;
  margin: 0;
  padding: 0 0.75rem;
  border-radius: 8px;
  background: color-mix(in srgb, #b28eff 36%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.45) !important;
  color: #1c1630 !important;
  font-size: 0.82rem;
  font-weight: 600;
  box-shadow: none;
}

html.theme-light #accounting-view .vedomost-sheet-picker-btn__prefix,
html.theme-light #accounting-view .vedomost-sheet-picker-btn__chev,
body.theme-light #accounting-view .vedomost-sheet-picker-btn__prefix,
body.theme-light #accounting-view .vedomost-sheet-picker-btn__chev {
  color: #4a3d66 !important;
}

html.theme-light #accounting-view .vedomost-sheet-picker-btn__value,
body.theme-light #accounting-view .vedomost-sheet-picker-btn__value {
  color: #1c1630 !important;
  font-weight: 700;
}

html.theme-light #accounting-view .vedomost-sheet-picker-menu,
body.theme-light #accounting-view .vedomost-sheet-picker-menu {
  background: color-mix(in srgb, #b28eff 42%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.5) !important;
  box-shadow: 0 12px 28px rgba(70, 40, 130, 0.18) !important;
  color: #1c1630 !important;
  z-index: 80;
}

html.theme-light #accounting-view .vedomost-sheet-picker-extra,
body.theme-light #accounting-view .vedomost-sheet-picker-extra {
  border-top-color: rgba(143, 106, 224, 0.35) !important;
}

html.theme-light #accounting-view .vedomost-picker-item,
body.theme-light #accounting-view .vedomost-picker-item {
  background: color-mix(in srgb, #b28eff 22%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.4) !important;
  color: #1c1630 !important;
}

html.theme-light #accounting-view .vedomost-picker-item:hover,
body.theme-light #accounting-view .vedomost-picker-item:hover {
  background: color-mix(in srgb, #b28eff 55%, #fff) !important;
  border-color: #b28eff !important;
}

html.theme-light #accounting-view .vedomost-picker-item.is-active,
body.theme-light #accounting-view .vedomost-picker-item.is-active {
  background: #b28eff !important;
  border-color: #9a6ef0 !important;
  color: #1c1630 !important;
  font-weight: 700;
}

html.theme-light #accounting-view .vedomost-toggle,
body.theme-light #accounting-view .vedomost-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  box-sizing: border-box;
  height: 2.15rem;
  margin: 0;
  padding: 0 0.7rem;
  border-radius: 8px;
  background: color-mix(in srgb, #b28eff 36%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.45) !important;
  color: #1c1630 !important;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  line-height: 1;
}

html.theme-light #accounting-view .vedomost-dept-select,
body.theme-light #accounting-view .vedomost-dept-select {
  box-sizing: border-box;
  height: 2.15rem;
  min-height: 2.15rem;
  margin: 0;
  padding: 0 0.65rem;
  border-radius: 8px;
  background: color-mix(in srgb, #b28eff 36%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.45) !important;
  color: #1c1630 !important;
  font-size: 0.82rem;
  font-weight: 600;
  line-height: 1.2;
}

html.theme-light #accounting-view .vedomost-print-btn,
html.theme-light #accounting-view .vedomost-excel-btn,
body.theme-light #accounting-view .vedomost-print-btn,
body.theme-light #accounting-view .vedomost-excel-btn {
  background: color-mix(in srgb, #b28eff 48%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.5) !important;
  color: #1c1630 !important;
  box-shadow: none;
}

html.theme-light #accounting-view .vedomost-print-btn:disabled,
body.theme-light #accounting-view .vedomost-print-btn:disabled {
  opacity: 0.45;
}

html.theme-light #accounting-view .vedomost-header,
body.theme-light #accounting-view .vedomost-header {
  padding-top: 0.2rem;
  padding-bottom: 0.2rem;
}

html.theme-light #accounting-view .vedomost-header-row:empty,
html.theme-light #accounting-view .vedomost-missing-host:empty,
html.theme-light #accounting-view .vedomost-search-host:empty,
html.theme-light #accounting-view .vedomost-dept-filter-host:empty,
html.theme-light #accounting-view .vedomost-print-host:empty,
body.theme-light #accounting-view .vedomost-header-row:empty,
body.theme-light #accounting-view .vedomost-missing-host:empty,
body.theme-light #accounting-view .vedomost-search-host:empty,
body.theme-light #accounting-view .vedomost-dept-filter-host:empty,
body.theme-light #accounting-view .vedomost-print-host:empty {
  display: none;
}

html.theme-light #accounting-view .vedomost-header .vedomost-header-row,
body.theme-light #accounting-view .vedomost-header .vedomost-header-row {
  align-items: center;
}

html.theme-light #accounting-view .vedomost-search-host .journal-search-input,
body.theme-light #accounting-view .vedomost-search-host .journal-search-input {
  height: 1.9rem;
  border-radius: 8px;
  font-size: 0.82rem;
}

/* ===== Бухгалтерия: фильтры строк — фирменный фиолетовый, не белые ===== */
html.theme-light .vedomost-mark-chip,
html.theme-light #accounting-view .vedomost-mark-chip,
body.theme-light .vedomost-mark-chip,
body.theme-light #accounting-view .vedomost-mark-chip {
  background: color-mix(in srgb, #b28eff 52%, #fff) !important;
  border: 1.5px solid rgba(143, 106, 224, 0.7) !important;
  color: #1c1630 !important;
  box-shadow: none;
}

html.theme-light .vedomost-mark-chip__code,
html.theme-light .vedomost-mark-chip__label,
html.theme-light #accounting-view .vedomost-mark-chip__code,
html.theme-light #accounting-view .vedomost-mark-chip__label,
body.theme-light .vedomost-mark-chip__code,
body.theme-light .vedomost-mark-chip__label,
body.theme-light #accounting-view .vedomost-mark-chip__code,
body.theme-light #accounting-view .vedomost-mark-chip__label {
  color: #1c1630 !important;
  background: transparent !important;
}

html.theme-light .vedomost-mark-chip:hover,
html.theme-light #accounting-view .vedomost-mark-chip:hover,
body.theme-light .vedomost-mark-chip:hover,
body.theme-light #accounting-view .vedomost-mark-chip:hover {
  background: color-mix(in srgb, #b28eff 68%, #fff) !important;
  border-color: #8f6ae0 !important;
  color: #1c1630 !important;
}

html.theme-light .vedomost-mark-chip.is-on,
html.theme-light #accounting-view .vedomost-mark-chip.is-on,
body.theme-light .vedomost-mark-chip.is-on,
body.theme-light #accounting-view .vedomost-mark-chip.is-on {
  background: linear-gradient(135deg, #8f6ae0 0%, #6b4db8 100%) !important;
  border-color: #6b4db8 !important;
  color: #f7f3ff !important;
  box-shadow: 0 1px 0 rgba(28, 22, 48, 0.12);
  font-weight: 600;
}

html.theme-light .vedomost-mark-chip.is-on .vedomost-mark-chip__code,
html.theme-light .vedomost-mark-chip.is-on .vedomost-mark-chip__label,
body.theme-light .vedomost-mark-chip.is-on .vedomost-mark-chip__code,
body.theme-light .vedomost-mark-chip.is-on .vedomost-mark-chip__label {
  color: #f7f3ff !important;
}

html.theme-light .vedomost-mark-bar__hint,
body.theme-light .vedomost-mark-bar__hint {
  color: #5b3fa0 !important;
}

/* ===== Общий табель: раздел / отпускные — фирменный light ===== */
html.theme-light button.co-ts-sheet-picker-btn,
body.theme-light button.co-ts-sheet-picker-btn {
  box-sizing: border-box;
  height: 2.15rem;
  padding: 0 0.75rem;
  border-radius: 8px;
  background: color-mix(in srgb, #b28eff 36%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.45) !important;
  color: #1c1630 !important;
  box-shadow: none;
}

html.theme-light .co-ts-sheet-picker-btn__prefix,
html.theme-light .co-ts-sheet-picker-btn__chev,
body.theme-light .co-ts-sheet-picker-btn__prefix,
body.theme-light .co-ts-sheet-picker-btn__chev {
  color: #4a3d66 !important;
}

html.theme-light .co-ts-sheet-picker-btn__value,
body.theme-light .co-ts-sheet-picker-btn__value {
  color: #1c1630 !important;
  font-weight: 700;
}

html.theme-light .co-ts-sheet-picker-menu,
body.theme-light .co-ts-sheet-picker-menu {
  background: color-mix(in srgb, #b28eff 42%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.5) !important;
  box-shadow: 0 12px 28px rgba(70, 40, 130, 0.18) !important;
  color: #1c1630 !important;
  z-index: 80;
}

html.theme-light .co-ts-sheet-picker-years,
html.theme-light .co-ts-sheet-picker-extra,
body.theme-light .co-ts-sheet-picker-years,
body.theme-light .co-ts-sheet-picker-extra {
  border-color: rgba(143, 106, 224, 0.35) !important;
}

html.theme-light button.co-ts-year-btn,
html.theme-light button.co-ts-picker-item,
body.theme-light button.co-ts-year-btn,
body.theme-light button.co-ts-picker-item {
  background: color-mix(in srgb, #b28eff 22%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.4) !important;
  color: #1c1630 !important;
}

html.theme-light button.co-ts-year-btn:hover,
html.theme-light button.co-ts-picker-item:hover,
body.theme-light button.co-ts-year-btn:hover,
body.theme-light button.co-ts-picker-item:hover {
  background: color-mix(in srgb, #b28eff 55%, #fff) !important;
  border-color: #b28eff !important;
  color: #1c1630 !important;
}

html.theme-light button.co-ts-year-btn.active,
html.theme-light button.co-ts-picker-item.active,
body.theme-light button.co-ts-year-btn.active,
body.theme-light button.co-ts-picker-item.active {
  background: #b28eff !important;
  border-color: #9a6ef0 !important;
  color: #1c1630 !important;
  font-weight: 700;
}

html.theme-light .vedomost-vp-send-modal__backdrop,
body.theme-light .vedomost-vp-send-modal__backdrop {
  background: rgba(40, 20, 80, 0.35) !important;
}

html.theme-light .vedomost-vp-send-modal__card,
body.theme-light .vedomost-vp-send-modal__card {
  background: color-mix(in srgb, #b28eff 28%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.5) !important;
  box-shadow: 0 16px 40px rgba(70, 40, 130, 0.2) !important;
  color: #1c1630 !important;
}

html.theme-light .vedomost-vp-send-modal__card h3,
html.theme-light .vedomost-vp-send-modal__card .muted,
body.theme-light .vedomost-vp-send-modal__card h3,
body.theme-light .vedomost-vp-send-modal__card .muted {
  color: #1c1630 !important;
}

html.theme-light .vedomost-vp-send-modal__card .journal-btn,
body.theme-light .vedomost-vp-send-modal__card .journal-btn {
  background: color-mix(in srgb, #b28eff 48%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.5) !important;
  color: #1c1630 !important;
}

html.theme-light .vedomost-vp-add,
body.theme-light .vedomost-vp-add {
  background: color-mix(in srgb, #b28eff 22%, #fff) !important;
  border: 1px solid rgba(143, 106, 224, 0.4) !important;
}

html.theme-light .vedomost-vp-sort-btn,
body.theme-light .vedomost-vp-sort-btn {
  color: #1c1630 !important;
}

html.theme-light #timesheet-view.accounting-company-mode .co-ts-sheet-picker,
body.theme-light #timesheet-view.accounting-company-mode .co-ts-sheet-picker {
  z-index: 70;
}


/* ── Розлив: производственный отчёт ── */
#bottling-view .bt-rep-page {
  padding: 0.75rem 1rem 2rem;
  max-width: 1200px;
}

#bottling-view .bt-rep-badge {
  margin: 0 0 1rem;
  font-size: 0.9rem;
  color: var(--j-muted, #8a8499);
}

#bottling-view .bt-rep-section {
  margin-bottom: 1.5rem;
}

#bottling-view .bt-rep-section h3 {
  margin: 0 0 0.55rem;
  font-size: 1.05rem;
  font-weight: 650;
}

#bottling-view .bt-rep-hint {
  margin: 0 0 0.65rem;
  font-size: 0.85rem;
}

#bottling-view .bt-rep-kpi {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 0.65rem;
}

#bottling-view .bt-rep-kpi-card {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.75rem 0.85rem;
  border-radius: 12px;
  background: color-mix(in srgb, #b28eff 42%, #fff);
  border: 1px solid rgba(143, 106, 224, 0.55);
  color: #1c1630;
  box-shadow: 0 1px 0 rgba(143, 106, 224, 0.18);
}

#bottling-view .bt-rep-kpi-label {
  font-size: 0.75rem;
  color: #4a3a72;
  font-weight: 600;
}

#bottling-view .bt-rep-kpi-value {
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #1c1630;
}

#bottling-view .bt-rep-table-wrap {
  overflow-x: auto;
  border-radius: 10px;
  border: 1px solid rgba(143, 106, 224, 0.22);
}

#bottling-view .bt-rep-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
}

#bottling-view .bt-rep-table th,
#bottling-view .bt-rep-table td {
  padding: 0.45rem 0.55rem;
  border-bottom: 1px solid rgba(143, 106, 224, 0.14);
  text-align: left;
  vertical-align: middle;
}

#bottling-view .bt-rep-table th.num,
#bottling-view .bt-rep-table td.num {
  text-align: right;
  white-space: nowrap;
}

#bottling-view .bt-rep-table thead th {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--j-muted, #8a8499);
  background: color-mix(in srgb, #b28eff 10%, transparent);
}

#bottling-view .bt-rep-table--months tbody tr:hover {
  background: color-mix(in srgb, #b28eff 12%, transparent);
}

#bottling-view .bt-rep-table--months th.bt-rep-labor,
#bottling-view .bt-rep-table--months td.bt-rep-labor,
#bottling-view .bt-rep-table--months th.bt-rep-slim,
#bottling-view .bt-rep-table--months td.bt-rep-slim {
  white-space: nowrap;
  padding-left: 0.35rem;
  padding-right: 0.35rem;
  width: 1%;
}

#bottling-view .bt-rep-table--months th.bt-rep-slim,
#bottling-view .bt-rep-table--months td.bt-rep-slim {
  font-variant-numeric: tabular-nums;
}

#bottling-view .bt-rep-month-current {
  background: color-mix(in srgb, #b28eff 22%, transparent);
  font-weight: 600;
}

#bottling-view .bt-rep-row--rework,
#bottling-view .bt-rep-row--defect {
  opacity: 0.92;
}

#bottling-view .bt-rep-input {
  width: 6.5rem;
  max-width: 100%;
  padding: 0.28rem 0.4rem;
  border-radius: 6px;
  border: 1px solid rgba(143, 106, 224, 0.35);
  background: color-mix(in srgb, #b28eff 8%, #fff);
  color: inherit;
  text-align: right;
  font: inherit;
}

#bottling-view .bt-rep-soft {
  display: inline-block;
  min-width: 3rem;
}

#bottling-view .bt-rep-mini {
  display: block;
  font-size: 0.72rem;
  margin-top: 0.15rem;
}

#bottling-view .bt-rep-delta--up { color: #1f9d55; font-weight: 650; }
#bottling-view .bt-rep-delta--down { color: #d64545; font-weight: 650; }
#bottling-view .bt-rep-delta--flat { color: var(--j-muted, #8a8499); }
#bottling-view .bt-rep-delta--na { color: var(--j-muted, #8a8499); }

#bottling-view .bt-rep-chart {
  padding: 0.75rem 0.65rem 0.55rem;
  border-radius: 10px;
  border: 1px solid rgba(143, 106, 224, 0.28);
  background: color-mix(in srgb, #b28eff 12%, #fff);
}

#bottling-view .bt-rep-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 1.1rem;
  font-size: 0.8rem;
  margin-bottom: 0.55rem;
  padding: 0 0.15rem;
}

#bottling-view .bt-rep-legend strong {
  font-weight: 700;
  margin-left: 0.15rem;
}

#bottling-view .bt-rep-dot {
  display: inline-block;
  width: 0.65rem;
  height: 0.65rem;
  border-radius: 50%;
  margin-right: 0.3rem;
  vertical-align: middle;
}

#bottling-view .bt-rep-dot--total { background: #6ea8fe; }
#bottling-view .bt-rep-dot--ml15 { background: #4ade80; }
#bottling-view .bt-rep-dot--ab { background: #f59e0b; }
#bottling-view .bt-rep-dot--ml8 { background: #a78bfa; }

/* шкала шт слева + поле графика; подписи месяцев строго под SVG */
#bottling-view .bt-rep-chart-body {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.4rem;
  align-items: start;
}

#bottling-view .bt-rep-yscale {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-end;
  font-size: 0.68rem;
  min-width: 3.2rem;
  height: 200px;
  box-sizing: border-box;
  padding: 0.1rem 0;
  color: var(--j-muted, #8a8499);
  text-align: right;
  line-height: 1.15;
}

#bottling-view .bt-rep-yscale-unit {
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: lowercase;
  color: #6b5a96;
  margin-bottom: 0.15rem;
}

#bottling-view .bt-rep-plot {
  min-width: 0;
  border-radius: 8px;
  overflow: hidden;
  background: color-mix(in srgb, #b28eff 10%, #fff);
  border: 1px solid rgba(143, 106, 224, 0.18);
}

#bottling-view .bt-rep-svg {
  display: block;
  width: 100%;
  height: 200px;
}

#bottling-view .bt-rep-plot-bg {
  fill: color-mix(in srgb, #b28eff 9%, #fff);
}

#bottling-view .bt-rep-axis {
  stroke: rgba(143, 106, 224, 0.28);
  stroke-width: 1;
}

#bottling-view .bt-rep-line {
  fill: none;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

#bottling-view .bt-rep-line--dashed {
  stroke-dasharray: 5 4;
  stroke-width: 1.8;
}

#bottling-view .bt-rep-line--total { stroke: #6ea8fe; stroke-width: 2.6; }
#bottling-view .bt-rep-line--ml15 { stroke: #4ade80; }
#bottling-view .bt-rep-line--ab { stroke: #f59e0b; }
#bottling-view .bt-rep-line--ml8 { stroke: #a78bfa; }

#bottling-view .bt-rep-x {
  display: grid;
  gap: 0.15rem;
  margin: 0;
  padding: 0.4rem 0 0.35rem;
  text-align: center;
  background: color-mix(in srgb, #b28eff 6%, #fff);
}

#bottling-view .bt-rep-x-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.14rem;
  min-width: 0;
}

#bottling-view .bt-rep-x-val {
  font-size: 0.62rem;
  font-weight: 700;
  color: inherit;
  white-space: nowrap;
}

#bottling-view .bt-rep-x-label {
  font-size: 0.7rem;
  color: var(--j-muted, #8a8499);
}

#bottling-view .bt-rep-pill {
  font-size: 0.58rem;
  font-weight: 700;
  padding: 0.1rem 0.3rem;
  border-radius: 999px;
  background: rgba(120, 120, 140, 0.14);
  color: var(--j-muted, #8a8499);
  white-space: nowrap;
}

#bottling-view .bt-rep-pill.is-up {
  background: rgba(47, 158, 116, 0.18);
  color: #1f7a58;
}

#bottling-view .bt-rep-pill.is-down {
  background: rgba(212, 85, 106, 0.16);
  color: #b03d52;
}

html.theme-light #bottling-view .bt-rep-kpi-card,
body.theme-light #bottling-view .bt-rep-kpi-card {
  background: color-mix(in srgb, #b28eff 48%, #fff);
  border-color: rgba(143, 106, 224, 0.55);
  color: #1c1630;
}

html.theme-light #bottling-view .bt-rep-input,
body.theme-light #bottling-view .bt-rep-input {
  background: #fff;
  color: #1c1630;
}

html.theme-light #bottling-view .bt-rep-chart,
body.theme-light #bottling-view .bt-rep-chart,
html.theme-light #bottling-view .bt-rep-plot,
body.theme-light #bottling-view .bt-rep-plot {
  background: color-mix(in srgb, #b28eff 12%, #fff);
}

html.theme-light #bottling-view .bt-rep-plot-bg,
body.theme-light #bottling-view .bt-rep-plot-bg {
  fill: color-mix(in srgb, #b28eff 10%, #fff);
}