:root {
  --bg: #2a2928;
  --panel: #3f3d3b;
  --panel-dark: #2f2e2c;
  --text: #f8f8f8;
  --muted: #c8c5c2;
  --field-width: 160px;
  --field-height: 35px;
  --accent: linear-gradient(135deg, #4b6bff, #a35bff);
  --accent-strong: linear-gradient(135deg, #4b6bff, #a35bff);
  --border: rgba(85, 80, 76, 0.9);
  --shadow: 0 8px 18px rgba(0, 0, 0, 0.45);
  --radius: 12px;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

body {
  margin: 0;
  font-family: "Bahnschrift", "Segoe UI", sans-serif;
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
}

.active-dashboard-sheet {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.active-dashboard-sheet .vehicle-card {
  min-height: 0 !important;
}

.active-dashboard-topbar {
  padding: 14px 16px;
  min-height: 0 !important;
  height: auto !important;
  align-content: start;
}

.active-dashboard-select-form {
  width: 100%;
  display: flex;
  align-items: center;
  min-height: 0 !important;
  height: auto !important;
}

.active-dashboard-select-form .vehicle-profile-search-wrap {
  width: min(520px, 100%);
  height: var(--field-height);
}

.active-dashboard-select-form .report-input {
  width: 100%;
}

.active-dashboard-select-form datalist {
  display: none;
}

.active-dashboard-grid {
  display: grid;
  grid-template-columns: 310px 360px minmax(320px, 1fr) 360px 320px;
  gap: 18px;
  align-items: start;
}

.active-dashboard-balance-card,
.active-dashboard-scheme-card {
  gap: 14px;
}

.active-dashboard-balance-card {
  padding: 14px 16px;
  min-height: 0 !important;
  height: auto !important;
  align-content: start;
}

.active-dashboard-balance-card .vehicle-card-title {
  margin-bottom: 2px;
}

.active-dashboard-balance-card .driver-balance-value {
  font-size: 24px;
}

.active-dashboard-right-column {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.active-dashboard-balance-bar {
  min-height: 92px;
}

.active-dashboard-photo-frame {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 280px;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.03);
  overflow: hidden;
}

.active-dashboard-subtitle {
  margin-top: 6px;
  font-size: 20px;
}

.active-dashboard-scroll {
  max-height: 280px;
  overflow: auto;
}

.active-dashboard-scroll::-webkit-scrollbar {
  width: 10px;
}

.active-dashboard-scroll::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.04);
  border-radius: 999px;
}

.active-dashboard-scroll::-webkit-scrollbar-thumb {
  background: rgba(245, 210, 74, 0.45);
  border-radius: 999px;
}

.active-dashboard-meta-stack {
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: var(--muted);
  font-size: 14px;
}

.active-dashboard-meta-line {
  padding: 6px 0;
}

.active-dashboard-scheme-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 460px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  padding: 18px;
}

.vehicle-scheme-stage--readonly {
  width: 100%;
}

.vehicle-scheme-stage--readonly .vehicle-scheme-svg {
  max-height: 420px;
}

.active-dashboard-damage-list .vehicle-history-period {
  line-height: 1.35;
}

.active-dashboard-mail-link {
  text-decoration: none;
}

.active-dashboard-expense-card {
  gap: 14px;
}

.active-dashboard-expense-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: stretch;
}

.active-dashboard-expense-inputs {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.active-dashboard-expense-form .report-input,
.active-dashboard-expense-inputs .report-input {
  width: 100%;
}

.active-dashboard-expense-submit {
  width: 100%;
}

.active-dashboard-column {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.active-dashboard-photo-card {
  gap: 14px;
}

.active-dashboard-column > .vehicle-card,
.active-dashboard-right-column > .vehicle-card {
  min-height: 0 !important;
}

.active-dashboard-photo-frame .driver-photo-preview {
  width: 100%;
  max-width: 240px;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.04);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24);
}

.active-dashboard-fields {
  display: grid;
  gap: 8px;
}

.active-dashboard-row {
  display: grid;
  gap: 8px;
}

.active-dashboard-row--1 {
  grid-template-columns: 1fr;
}

.active-dashboard-row--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.active-dashboard-row--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.active-dashboard-row--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.active-dashboard-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  padding: 9px 10px;
}

.active-dashboard-field--actions {
  justify-content: center;
}

.active-dashboard-field--actions .field-caption {
  display: none;
}

.active-dashboard-field .field-caption {
  padding-left: 0;
}

.active-dashboard-field-value,
.active-dashboard-field-link {
  display: block;
  color: var(--text);
  text-decoration: none;
  line-height: 1.3;
  word-break: break-word;
}

.active-dashboard-field-link:hover {
  color: var(--accent);
}

.active-service-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 14px;
}

.active-service-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(170px, 220px);
  align-items: center;
  gap: 12px;
  min-width: 0;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  padding: 11px 12px;
}

.active-service-main {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

.active-service-side {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: 8px;
  min-width: 0;
}

.active-service-card-label {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.2;
}

.active-service-card-value {
  display: block;
  color: var(--text);
  font-size: 20px;
  line-height: 1.2;
  word-break: break-word;
}

.active-service-note {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.2;
}

.active-service-input {
  width: 100%;
}

.active-service-row .primary {
  width: 100%;
}

.active-service-row--mid {
  border-color: rgba(242, 201, 76, 0.34);
  background: rgba(242, 201, 76, 0.12);
}

.active-service-row--low {
  border-color: rgba(255, 140, 0, 0.36);
  background: rgba(255, 140, 0, 0.12);
}

.active-service-row--neg {
  border-color: rgba(244, 63, 94, 0.38);
  background: rgba(244, 63, 94, 0.14);
}

.active-dashboard-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.active-dashboard-actions .icon-link-button {
  width: 44px;
  min-width: 44px;
  min-height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.06);
}

.active-dashboard-actions .telegram-link-button {
  color: #9dc4e4;
}

.active-dashboard-actions .email-link-button {
  color: #f5d24a;
}

.putevki-history-row,
.putevki-history-row:visited,
.active-dashboard-putevka-link,
.active-dashboard-putevka-link:visited {
  color: #f5d24a;
  text-decoration: none;
}

.putevki-history-row:hover,
.active-dashboard-putevka-link:hover {
  color: #9dc4e4;
}

.site-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 6px 28px;
  border-bottom: 1px solid rgba(60, 56, 52, 0.9);
  background: #242322;
  gap: 18px;
  position: sticky;
  top: 0;
  z-index: 1000;
}

.brand {
  display: flex;
  align-items: center;
  gap: 14px;
  text-decoration: none;
  color: inherit;
  flex: 0 1 auto;
  min-width: 0;
}

.brand-logo {
  width: 42px;
  height: 42px;
  border-radius: 21px;
}

.brand-title {
  font-size: 26px;
  font-weight: 700;
}

.brand-title em {
  font-style: italic;
  font-weight: 500;
}

.brand-subtitle {
  color: var(--muted);
  font-size: 12px;
}

.brand-user-name {
  margin-top: 2px;
  font-weight: 700;
  font-size: 13px;
  color: #f5d24a;
}

.header-search {
  flex: 1 1 auto;
  display: flex;
  justify-content: flex-start;
  min-width: 0;
  align-items: center;
}

.site-header-tools {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 0 0 auto;
}

.top-nav {
  display: flex;
  gap: 16px;
}

.top-nav a {
  color: var(--text);
  text-decoration: none;
  font-size: 14px;
  transition: color 0.2s ease;
}

.top-nav a:hover,
.top-nav a.active {
  color: #f5d24a;
}


.nav-toggle {
  width: 42px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.06);
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.2s ease;
}

.nav-toggle span {
  display: block;
  width: 20px;
  height: 2px;
  background: #f5d24a;
  border-radius: 2px;
}

.nav-toggle:hover {
  background: rgba(255, 255, 255, 0.12);
}

.nav-toggle:active {
  transform: translateY(1px);
}

.notification-toggle {
  width: 40px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.06);
  color: #f5d24a;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.2s ease;
}

.mail-toggle {
  text-decoration: none;
}

.notification-toggle:hover {
  background: rgba(255, 255, 255, 0.12);
}

.notification-toggle:active {
  transform: translateY(1px);
}

.notification-bell {
  font-size: 18px;
  line-height: 1;
}

.notification-badge {
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: #cf2f2f;
  color: #ffffff;
  font-size: 10px;
  font-weight: 700;
  line-height: 16px;
  text-align: center;
  position: absolute;
  top: -5px;
  right: -5px;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.nav-drawer {
  position: fixed;
  top: 0;
  right: -280px;
  height: 100vh;
  width: 260px;
  background: #2c2b29;
  border-left: 1px solid rgba(255, 255, 255, 0.1);
  padding: 18px;
  transition: right 0.25s ease;
  z-index: 1200;
  box-shadow: -12px 0 24px rgba(0, 0, 0, 0.35);
}

.nav-drawer-title {
  font-weight: 700;
  font-size: 16px;
  margin-bottom: 12px;
}

.nav-drawer .top-nav {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.nav-drawer .top-nav a {
  font-size: 15px;
}

.nav-drawer .top-nav .nav-exit-link {
  margin-top: 6px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.nav-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease;
  z-index: 1100;
}

body.nav-open .nav-drawer {
  right: 0;
}

body.nav-open .nav-backdrop {
  opacity: 1;
  visibility: visible;
}

.notification-panel {
  position: fixed;
  top: 58px;
  right: 12px;
  width: min(430px, calc(100vw - 24px));
  max-height: calc(100vh - 80px);
  background: #2e2c2a;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 14px;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.42);
  transform: translateY(-6px);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, transform 0.2s ease;
  z-index: 1250;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.notification-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  background: #262523;
}

.notification-title {
  font-size: 14px;
  font-weight: 700;
  color: #f7f7f7;
}

.notification-close {
  width: 26px;
  height: 26px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.07);
  color: #f5d24a;
  cursor: pointer;
}

.notification-list {
  overflow: auto;
  padding: 8px;
  display: grid;
  gap: 8px;
}

.notification-item {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  background: #3b3936;
  padding: 8px 10px;
}

.notification-item-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
}

.notification-item-actor {
  color: #f5d24a;
  font-weight: 700;
  font-size: 12px;
}

.notification-item-time {
  color: #b7b2ad;
  font-size: 11px;
  white-space: nowrap;
}

.notification-item-text {
  font-size: 13px;
  line-height: 1.35;
  color: #f4f4f4;
  white-space: pre-wrap;
}

.notification-empty {
  border: 1px dashed rgba(255, 255, 255, 0.16);
  border-radius: 10px;
  padding: 16px 12px;
  font-size: 13px;
  color: #c8c3bd;
  text-align: center;
}

.notification-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease;
  z-index: 1200;
}

body.notifications-open .notification-panel {
  transform: translateY(0);
  opacity: 1;
  visibility: visible;
}

body.notifications-open .notification-backdrop {
  opacity: 1;
  visibility: visible;
}

.site-main {
  padding: 12px 28px 32px;
}

.welcome-popup {
  position: fixed;
  top: 82px;
  right: 28px;
  width: min(360px, calc(100vw - 56px));
  max-width: calc(100vw - 56px);
  z-index: 1400;
  opacity: 0;
  transform: translateY(-10px) scale(0.98);
  pointer-events: none;
  transition: opacity 0.22s ease, transform 0.22s ease;
}

.welcome-popup.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

.welcome-popup.is-hiding {
  opacity: 0;
  transform: translateY(-8px) scale(0.98);
  pointer-events: none;
}

.welcome-popup-card {
  width: 100%;
  box-sizing: border-box;
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid rgba(240, 206, 84, 0.22);
  background: linear-gradient(180deg, rgba(61, 57, 53, 0.98), rgba(45, 42, 39, 0.98));
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.34);
}

.welcome-popup-title {
  font-weight: 700;
  font-size: 14px;
  color: #f5d24a;
}

.welcome-popup-text {
  margin-top: 8px;
  font-size: 14px;
  line-height: 1.4;
  color: #f8f8f8;
}

.welcome-popup-close {
  margin-top: 12px;
  width: auto;
  min-width: 124px;
}

.sheet {
  display: grid;
  gap: 12px;
}

.row {
  background: var(--panel);
  border-radius: var(--radius);
  padding: 10px 12px;
  border: 1px solid var(--border);
  overflow: visible;
}

.doc-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.doc-button {
  flex: 0 0 var(--field-width);
  width: var(--field-width);
  min-width: var(--field-width);
  height: var(--field-height);
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #f5d24a;
  color: #1b1a17;
  font-weight: 700;
  font-size: 12px;
  cursor: pointer;
  text-transform: uppercase;
}

.row-title {
  font-weight: 700;
  margin-bottom: 8px;
}

.row-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.row-head .row-title {
  margin-bottom: 0;
}

.merged-form-divider {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 10px 0 8px;
  padding-top: 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.merged-form-divider-title {
  font-size: 13px;
  font-weight: 700;
  color: #d8d4cf;
}

.search-box {
  position: relative;
}

.search-controls {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: nowrap;
  width: 100%;
  justify-content: flex-start;
}

.search-left {
  display: flex;
  align-items: center;
  gap: 12px;
  align-self: center;
}

.search-right {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-left: 0;
  flex: 0 0 auto;
  align-self: center;
}

.home-page .site-header {
  padding-top: 0;
  padding-bottom: 0;
}

.home-page .search-right {
  padding-top: 15px;
}

.inline-form {
  display: flex;
  align-items: center;
  gap: 8px;
}

.inline-form input,
.inline-form button {
  width: var(--field-width);
}

.header-search input,
.header-search button {
  height: var(--field-height);
  border-radius: 12px;
  line-height: 1;
}

.header-search input {
  padding: 8px 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  font-size: 14px;
}

.header-search input::placeholder {
  color: #f2a3a3;
}

.active-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--text);
  white-space: nowrap;
}

.active-toggle input {
  width: 16px;
  height: 16px;
  min-width: 16px;
  max-width: 16px;
  flex: 0 0 16px;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  accent-color: #b0d5f2;
}

.search-actions {
  flex: 1 1 auto;
  height: var(--field-height);
}

.search-row .search-box input {
  width: 100%;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  font-size: 15px;
  height: var(--field-height);
}

.search-row .search-box.search-box--compact input {
  width: 30vw;
  min-width: 260px;
  max-width: 420px;
}

.header-search .search-box.search-box--compact input {
  width: var(--field-width);
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  font-size: 15px;
  height: var(--field-height);
}

.row-form {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.row-form > * {
  flex: 0 0 var(--field-width);
  max-width: var(--field-width);
  min-width: var(--field-width);
  height: var(--field-height);
}

.field-caption-wrap {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 1px;
  overflow: visible;
  height: auto;
  min-height: calc(var(--field-height) + 13px);
  max-height: none;
}

.field-caption-wrap.hidden {
  display: none !important;
}

.field-caption-wrap > input,
.field-caption-wrap > select,
.field-caption-wrap > textarea,
.field-caption-wrap > .input-wrap,
.field-caption-wrap > .search-box,
.field-caption-wrap > .report-input,
.field-caption-wrap > .file-field,
.field-caption-wrap > button,
.field-caption-wrap > a {
  width: 100%;
}

.field-caption {
  display: block;
  padding-left: 12px;
  font-size: 11px;
  line-height: 1;
  min-height: 11px;
  color: #b0d5f2;
  white-space: nowrap;
}

.row-form > .field-caption-wrap {
  flex: 0 0 var(--field-width);
  max-width: var(--field-width);
  min-width: var(--field-width);
  align-self: flex-start;
}

.field-caption-wrap--button > .primary,
.field-caption-wrap--button > .ghost,
.field-caption-wrap--button > .warning,
.field-caption-wrap--button > .link-button {
  width: 100%;
}

.icon-link-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--field-height);
  width: 100%;
  text-decoration: none;
}

.icon-link-button svg {
  width: 22px;
  height: 22px;
  display: block;
}

.row-form > .mini-action {
  flex: 0 0 74px;
  max-width: 74px;
  min-width: 74px;
}

.row-form .month-grid {
  flex: 1 1 auto;
  max-width: none;
  min-width: 0;
  width: auto;
  align-items: center;
}

.row-form--merged-actions {
  margin-top: 10px;
  align-items: flex-start;
}

.row-form--merged-actions .buyout-indicator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--field-height);
  margin-top: 13px;
}

.input-wrap {
  position: relative;
  width: var(--field-width);
  height: var(--field-height);
}

.input-wrap input {
  width: 100%;
  height: 100%;
}

.input-wrap .dropdown {
  left: 0;
  right: 0;
  top: calc(100% + 6px);
}

.row-form input:not([type="checkbox"]),
.row-form select,
.row-form textarea {
  padding: 8px 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  font-size: 15px;
  width: var(--field-width);
  min-width: var(--field-width);
  text-overflow: clip;
  overflow-x: auto;
  white-space: nowrap;
  height: var(--field-height);
}

.row-form input:not([type="checkbox"]),
.row-form select,
.row-form textarea,
.header-search input,
.report-input,
.admin-narrow input,
.admin-grid table input {
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.row-form input:not([type="checkbox"]):hover,
.row-form select:hover,
.row-form textarea:hover,
.header-search input:hover,
.report-input:hover,
.admin-narrow input:hover,
.admin-grid table input:hover {
  background: #4a4744;
  border-color: rgba(110, 105, 100, 0.9);
  transition-duration: 0.12s;
}

.row-form input::placeholder,
.row-form textarea::placeholder,
.search-row .search-box input::placeholder,
.header-search .search-box input::placeholder {
  color: #f2a3a3;
}

.pulse-alert {
  animation: pulseAlert 1.6s ease-in-out infinite;
  color: #5a1115;
}

.pulse-alert::placeholder {
  color: #5a1115;
}

@keyframes pulseAlert {
  0% {
    background-color: #45423f;
    color: #ffffff;
  }
  50% {
    background-color: #ffffff;
    color: #5a1115;
  }
  100% {
    background-color: #45423f;
    color: #ffffff;
  }
}

@media (max-width: 900px) {
  .vehicle-profile-grid {
    grid-template-columns: 1fr !important;
  }

  .vehicle-card {
    min-width: 0;
    width: 100%;
  }

  .vehicle-profile-desktop-picker {
    display: none !important;
  }

  .vehicle-profile-mobile-picker {
    display: block !important;
  }
}

.row-form select.is-placeholder {
  color: #f2a3a3;
}

.row-form button {
  padding: 8px 16px;
  border-radius: 12px;
  border: none;
  background: #b0d5f2;
  color: #1b1a17;
  font-weight: 700;
  cursor: pointer;
  width: var(--field-width);
  height: var(--field-height);
}

.row-form button,
.primary,
.ghost,
.warning,
.doc-button,
.month-btn,
.copy-btn {
  transition: filter 0.15s ease;
}

.row-form button:hover,
.primary:hover,
.ghost:hover,
.warning:hover,
.doc-button:hover,
.month-btn:hover,
.copy-btn:hover {
  filter: brightness(0.92);
}

.row-form button:active,
.primary:active,
.ghost:active,
.warning:active,
.doc-button:active,
.month-btn:active,
.copy-btn:active {
  filter: brightness(0.8);
}

.row-center {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 10px;
}

.assignment-display {
  width: var(--field-width);
  height: var(--field-height);
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  text-align: center;
  font-weight: 700;
}

.assignment-display.inactive {
  color: #9b9894;
}

.buyout-indicator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--field-width);
  height: var(--field-height);
  color: #ff6565;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0.6px;
}

.primary {
  background: #b0d5f2;
  border: none;
  color: #1b1a17;
  padding: 8px 16px;
  border-radius: 12px;
  font-weight: 700;
  width: var(--field-width);
  height: var(--field-height);
}

.link-button {
  background: #f5d24a;
  color: #1b1a17;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font: inherit;
}

.ghost {
  background: #b0d5f2;
  color: #1b1a17;
  border: 1px solid var(--border);
  padding: 6px 12px;
  border-radius: 12px;
  cursor: pointer;
  width: var(--field-width);
  height: var(--field-height);
}

.warning {
  background: #f5d24a;
  color: #1b1a17;
  border: none;
  padding: 8px 16px;
  border-radius: 12px;
  font-weight: 700;
  width: var(--field-width);
  height: var(--field-height);
}

.row-form button.warning,
.warning.mailbox-compose-link,
.mailbox-template-btn {
  background: #f5d24a;
  color: #1b1a17;
}

.driver-email-panel {
  margin-top: 10px;
  padding: 14px;
  border-radius: 14px;
  border: 1px solid rgba(245, 210, 74, 0.28);
  background: rgba(255, 222, 102, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.driver-email-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.driver-email-panel-title {
  font-size: 15px;
  font-weight: 700;
  color: #f5d24a;
}

.driver-email-panel-meta {
  font-size: 12px;
  color: #d8d4cf;
  margin-bottom: 10px;
}

.driver-email-subject {
  width: 100%;
  height: var(--field-height);
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  padding: 0 14px;
  font: inherit;
  margin-bottom: 10px;
}

.driver-email-panel-tools {
  display: flex;
  justify-content: flex-start;
  gap: 10px;
  margin-bottom: 10px;
}

.driver-email-panel-tools .warning {
  width: auto;
  min-width: 148px;
}

.driver-email-textarea {
  width: 100%;
  min-height: 110px;
  resize: vertical;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  padding: 12px 14px;
  font: inherit;
}

.driver-email-panel-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 10px;
}

.driver-email-link {
  color: #f5d24a;
  text-decoration: none;
}

.driver-email-link:hover {
  text-decoration: underline;
}

.mailbox-table-wrap {
  margin-top: 18px;
}

.mailbox-compose-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 96px;
  width: auto;
  text-decoration: none;
}

.mailbox-compose-card {
  margin-bottom: 18px;
  padding: 12px 16px;
}

.mailbox-header h1 {
  font-size: 24px;
  margin-bottom: 0;
  line-height: 1.1;
}

.mailbox-compose-card h2 {
  font-size: 14px;
  margin: 0 0 8px;
  line-height: 1.1;
}

.mailbox-compose-grid {
  display: grid;
  grid-template-columns: minmax(260px, 1.2fr) minmax(220px, 1fr) minmax(240px, 1fr) auto;
  gap: 10px;
  align-items: center;
  margin-bottom: 8px;
}

.mailbox-driver-search-wrap,
.mailbox-driver-search-wrap .report-input {
  width: 100%;
}

.mailbox-email-textarea {
  min-height: 38px;
  max-height: 160px;
  overflow-y: auto;
  padding-top: 9px;
  padding-bottom: 9px;
  resize: none;
  line-height: 1.25;
}

.mailbox-compose-card .driver-email-panel-actions {
  margin-top: 8px;
}

.mailbox-compose-card .report-input,
.mailbox-compose-card .driver-email-textarea {
  font-size: 14px;
}

.mailbox-compose-card .warning {
  min-height: 35px;
}


.ghost-compact {
  width: 74px;
  min-width: 74px;
  max-width: 74px;
  padding: 6px 10px;
}

.file-field {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: var(--muted);
  width: var(--field-width);
  height: var(--field-height);
}

.file-input {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  font-size: 14px;
  cursor: pointer;
  width: 100%;
  height: 100%;
}

.file-input input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.file-input .file-label {
  pointer-events: none;
}

.file-input.has-file .file-label {
  font-weight: 700;
}

.dropdown {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  background: #3f3d3b;
  border-radius: 12px;
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
  max-height: 240px;
  overflow-y: auto;
  z-index: 50;
}

.dropdown.hidden {
  display: none;
}

.dropdown-item {
  padding: 8px 10px;
  cursor: pointer;
}

.dropdown-item:hover,
.dropdown-item.active {
  background: #4a4845;
}

.month-grid {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
}

.month-btn {
  width: var(--field-width);
  height: var(--field-height);
  border-radius: 12px;
  border: 1px solid var(--border);
  font-size: 13px;
  cursor: pointer;
}

.month-btn.unpaid {
  background: #f6b3b3;
  color: #1b1a17;
}

.month-btn.paid {
  background: #bfe8c8;
  color: #1b1a17;
}

.month-btn.selected {
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.4);
}

.list {
  display: grid;
  gap: 8px;
}

.list-item {
  border-radius: 12px;
  background: #3f3d3b;
  padding: 8px 10px;
  border: 1px solid var(--border);
}

.list-title {
  font-weight: 700;
  font-size: 13px;
}

.list-sub,
.list-date,
.list-empty {
  font-size: 12px;
  color: var(--muted);
}

.due-section {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.due-card {
  display: grid;
  gap: 8px;
  background: #3f3d3b;
  border-radius: var(--radius);
  border: 1px solid #ffffff;
  padding: 10px 12px;
}

.due-title {
  font-weight: 700;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.table-actions {
  display: inline-flex;
  gap: 6px;
}

.icon-btn {
  width: 26px;
  height: 26px;
  border-radius: 7px;
  border: 1px solid rgba(255, 255, 255, 0.45);
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
  padding: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
}

.icon-btn.copy-table {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M16 1H6a2 2 0 0 0-2 2v12h2V3h10V1zm3 4H10a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h9a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2zm0 16H10V7h9v14z'/></svg>");
}

.icon-btn.print-table {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M19 8H5a3 3 0 0 0-3 3v4h4v4h12v-4h4v-4a3 3 0 0 0-3-3zm-3 9H8v-5h8v5zm3-13H5V2h14v2z'/></svg>");
}

.icon-btn:hover {
  background-color: rgba(255, 255, 255, 0.18);
  box-shadow: 0 0 0 2px rgba(176, 213, 242, 0.35);
}

.icon-btn:active {
  transform: translateY(1px) scale(0.98);
}


.due-table th,
.due-table td {
  font-size: 12px;
  border-bottom: 1px solid #ffffff;
}

.due-table thead th {
  border-bottom: 2px solid #ffffff;
}

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

.due-table tbody tr:nth-child(odd) td {
  background: #42403d;
}

.due-table tbody tr:nth-child(even) td {
  background: #2f2d2b;
}

.tg-link {
  color: var(--text);
  text-decoration: none;
}

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

.monitor-section {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.monitor-section .due-table tbody td {
  height: 26px;
  line-height: 26px;
  padding-top: 0;
  padding-bottom: 0;
}

.monitor-section .due-table tbody tr {
  height: 26px;
}

.return-widget {
  display: grid;
  gap: 10px;
}

.return-widget--compact {
  gap: 0;
  margin-top: -58px;
}

.return-card .due-title {
  min-height: 0;
  align-items: flex-start;
  padding-top: 0;
  margin-top: -2px;
  margin-bottom: -6px;
}

.return-card {
  gap: 0;
}

.return-widget-group {
  display: grid;
  gap: 2px;
}

.return-widget--compact .return-widget-group:last-child {
  gap: 0;
  margin-top: -48px;
}

.return-widget--compact .return-widget-group:last-child .return-widget-subtitle {
  margin-bottom: -18px;
}

.return-widget--compact .return-widget-group:last-child .return-table-wrap {
  margin-top: -22px;
}

.return-widget--compact .return-widget-group:first-child {
  gap: 2px;
}

.return-widget--compact .return-widget-group:first-child .return-table-wrap {
  margin-top: -30px;
}

.return-table-wrap {
  max-height: 214px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(176, 213, 242, 0.45) transparent;
}

.return-table-wrap::-webkit-scrollbar {
  width: 6px;
}

.return-table-wrap::-webkit-scrollbar-track {
  background: transparent;
}

.return-table-wrap::-webkit-scrollbar-thumb {
  background: rgba(176, 213, 242, 0.45);
  border-radius: 999px;
}

.return-widget-subtitle {
  color: var(--accent);
  font-size: 12px;
  font-weight: 700;
}

.deposit-return-trigger {
  min-width: 84px;
}

.return-actions-cell {
  white-space: nowrap;
}

.inline-icon-form {
  display: inline-flex;
  margin: 0;
}

.icon-btn.plan-return-edit-trigger {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M3 17.25V21h3.75L17.8 9.94l-3.75-3.75L3 17.25zm2.92 2.33H5v-.92l8.06-8.06.92.92L5.92 19.58zM20.71 7.04a1.003 1.003 0 0 0 0-1.42L18.37 3.29a1.003 1.003 0 0 0-1.42 0l-1.83 1.83 3.75 3.75 1.84-1.83z'/></svg>");
}

.icon-btn.plan-return-delete-btn {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M18.3 5.71 12 12l6.3 6.29-1.41 1.41L10.59 13.41 4.29 19.7 2.88 18.29 9.17 12 2.88 5.71 4.29 4.3l6.3 6.29 6.29-6.3z'/></svg>");
}

.icon-btn.deposit-hide-btn {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M2.1 3.51 3.51 2.1l18.39 18.39-1.41 1.41-3.1-3.1A12.77 12.77 0 0 1 12 20C7 20 2.73 16.89 1 12c.7-1.98 1.86-3.72 3.35-5.12L2.1 3.51zM12 6a6 6 0 0 1 6 6c0 .84-.17 1.64-.47 2.37l-1.55-1.55A3.98 3.98 0 0 0 12 8c-.28 0-.55.03-.81.08L9.9 6.79c.66-.5 1.49-.79 2.1-.79zm0-2c5 0 9.27 3.11 11 8a12.66 12.66 0 0 1-4.06 5.33l-1.43-1.43A10.65 10.65 0 0 0 20.82 12C19.17 8.27 15.84 6 12 6c-.62 0-1.23.06-1.81.18L8.52 4.51C9.64 4.18 10.8 4 12 4zm-6.07 3.34 1.5 1.5A3.98 3.98 0 0 0 8 12a4 4 0 0 0 4 4c.61 0 1.2-.14 1.72-.39l1.51 1.51c-.94.56-2.03.88-3.23.88a6 6 0 0 1-6-6c0-1.2.35-2.3.93-3.23z'/></svg>");
}

.icon-btn.deposit-unhide-btn {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M12 5c5 0 9.27 3.11 11 8-1.73 4.89-6 8-11 8S2.73 17.89 1 13c1.73-4.89 6-8 11-8zm0 2C8.16 7 4.83 9.27 3.18 13 4.83 16.73 8.16 19 12 19s7.17-2.27 8.82-6C19.17 9.27 15.84 7 12 7zm0 2.5A3.5 3.5 0 1 1 8.5 13 3.5 3.5 0 0 1 12 9.5zm0 2A1.5 1.5 0 1 0 13.5 13 1.5 1.5 0 0 0 12 11.5z'/></svg>");
}

.deposit-table-wrap {
  overflow-x: auto;
}

.deposit-table td,
.deposit-table th {
  text-align: center;
  vertical-align: middle;
}

.deposit-table td:first-child,
.deposit-table th:first-child {
  text-align: left;
}

.deposit-cell {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.deposit-edit-trigger {
  flex: 0 0 auto;
}

.monitor-bold td {
  font-weight: 700;
}

.monitor-vehicle {
  cursor: pointer;
}

.monitor-vehicle:hover td {
  background: #4a4845;
}

#monitor-recent {
  table-layout: fixed;
  width: 100%;
}

#monitor-recent th,
#monitor-recent td {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#monitor-recent th:nth-child(1),
#monitor-recent td:nth-child(1) {
  width: 20%;
}

#monitor-recent th:nth-child(2),
#monitor-recent td:nth-child(2) {
  width: 31%;
}

#monitor-recent th:nth-child(3),
#monitor-recent td:nth-child(3) {
  width: 24%;
}

#monitor-recent th:nth-child(4),
#monitor-recent td:nth-child(4) {
  width: 15%;
}

#monitor-recent th:nth-child(5),
#monitor-recent td:nth-child(5) {
  width: 10%;
}

@media (max-width: 1400px) {
  .monitor-section {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .vehicle-profile-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

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

  .due-table-wrap-fixed {
    height: auto;
    max-height: none;
  }

  .vehicle-profile-grid {
    grid-template-columns: 1fr;
  }

  .vehicle-profile-select-form,
  .vehicle-profile-header {
    width: 100%;
  }

  .vehicle-profile-desktop-picker {
    display: none;
  }

  .vehicle-profile-mobile-picker {
    display: block;
  }

  .vehicle-profile-select-form .report-input,
  .vehicle-profile-select-form .primary {
    width: 100%;
  }

  .vehicle-summary-row--2,
  .vehicle-summary-row--3,
  .vehicle-summary-row--4 {
    grid-template-columns: 1fr;
  }
}

.reports-controls {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.reports-form {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.report-input {
  width: var(--field-width);
  height: var(--field-height);
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  padding: 8px 12px;
  font-size: 14px;
}

.reports-table-wrap {
  max-height: 70vh;
}

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

.reports-table thead th {
  position: sticky;
  top: 0;
  z-index: 45;
  background: #3b3937;
}

.reports-income-form {
  display: grid;
  gap: 12px;
}

.reports-income-table-wrap {
  overflow: auto;
  max-height: 70vh;
  position: relative;
}

.reports-income-split {
  --reports-income-head-row-1: 34px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  background: #3b3937;
}

.reports-income-pane {
  max-height: 70vh;
  overflow-y: auto;
}

.reports-income-pane-left,
.reports-income-pane-right {
  overflow-x: hidden;
}

.reports-income-pane-center {
  overflow-x: auto;
}

.reports-income-center-scroll {
  min-width: fit-content;
}

.reports-income-side-table,
.reports-income-table {
  border-collapse: separate;
  border-spacing: 0;
  width: max-content;
}

.reports-income-left-table {
  min-width: 610px;
}

.reports-income-right-table {
  min-width: 340px;
}

.reports-income-table {
  min-width: 100%;
}

.reports-park-quick {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-left: 8px;
}

.reports-park-quick .active-toggle {
  margin: 0;
}

.reports-income-side-table th,
.reports-income-side-table td,
.reports-income-table th,
.reports-income-table td,
.reports-expense-table th,
.reports-expense-table td {
  white-space: nowrap;
  font-size: 12px;
}

.reports-income-side-table thead th,
.reports-income-table thead th {
  position: sticky;
  background: #3b3937;
  top: 0;
  z-index: 20;
}

.reports-income-pane-center .reports-income-table thead tr:nth-child(1) th {
  height: var(--reports-income-head-row-1);
  min-height: var(--reports-income-head-row-1);
  padding-top: 0;
  padding-bottom: 0;
  vertical-align: middle;
}

.reports-income-side-table tbody tr:nth-child(odd),
.reports-income-table tbody tr:nth-child(odd) {
  --row-shade: rgba(0, 0, 0, 0.14);
}

.reports-income-side-table tbody tr:nth-child(even),
.reports-income-table tbody tr:nth-child(even) {
  --row-shade: rgba(0, 0, 0, 0.28);
}

.reports-income-side-table tbody td,
.reports-income-table tbody td:not(.month-cell) {
  background-color: var(--row-shade) !important;
}

.reports-income-table td.month-cell,
.reports-income-table th.month-cell {
  color: #1b1a17;
  background-color: var(--month-bg) !important;
  min-width: 92px;
  width: 92px;
  max-width: 92px;
}

.reports-income-table td.month-cell {
  vertical-align: middle;
}

.reports-income-table tbody tr:nth-child(odd) .month-cell {
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.14) !important;
}

.reports-income-table tbody tr:nth-child(even) .month-cell {
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.28) !important;
}

.reports-income-side-table tbody td,
.reports-income-table tbody td {
  transition: background-color 0.2s ease;
}

.reports-income-side-table tbody tr:hover td,
.reports-income-table tbody tr:hover td:not(.month-cell) {
  background-color: rgba(255, 255, 255, 0.08);
}

.reports-income-table tbody tr:hover .month-cell {
  box-shadow: inset 0 0 0 9999px rgba(255, 255, 255, 0.12) !important;
}

.month-cell.month-1 { --month-bg: #a9d7ff; }
.month-cell.month-2 { --month-bg: #7fc4ff; }
.month-cell.month-3 { --month-bg: #b6e6b3; }
.month-cell.month-4 { --month-bg: #8fd98b; }
.month-cell.month-5 { --month-bg: #6fca70; }
.month-cell.month-6 { --month-bg: #ffb3b3; }
.month-cell.month-7 { --month-bg: #ff8f8f; }
.month-cell.month-8 { --month-bg: #ff6f6f; }
.month-cell.month-9 { --month-bg: #ffd2a6; }
.month-cell.month-10 { --month-bg: #ffb978; }
.month-cell.month-11 { --month-bg: #ff9f5a; }
.month-cell.month-12 { --month-bg: #b3c9ff; }

.reports-income-select {
  text-align: center;
}

.reports-income-select input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: #b0d5f2;
}

.reports-income-table .sticky-top-row-1 {
  top: 0;
  z-index: 40;
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.2);
}

.reports-income-left-table th:nth-child(1),
.reports-income-left-table td:nth-child(1) { min-width: 34px; width: 34px; }
.reports-income-left-table th:nth-child(2),
.reports-income-left-table td:nth-child(2) { min-width: 96px; width: 96px; }
.reports-income-left-table th:nth-child(3),
.reports-income-left-table td:nth-child(3) { min-width: 98px; width: 98px; }
.reports-income-left-table th:nth-child(4),
.reports-income-left-table td:nth-child(4) { min-width: 98px; width: 98px; }
.reports-income-left-table th:nth-child(5),
.reports-income-left-table td:nth-child(5) { min-width: 230px; width: 230px; }
.reports-income-left-table th:nth-child(6),
.reports-income-left-table td:nth-child(6) { min-width: 54px; width: 54px; }

.reports-income-right-table th,
.reports-income-right-table td {
  min-width: 340px;
  width: 340px;
}

.reports-income-right-table .comment-col {
  background-color: var(--row-shade) !important;
}

.reports-income-right-table tbody tr:hover .comment-col {
  background-color: rgba(255, 255, 255, 0.08) !important;
}

.reports-income-pane-left,
.reports-income-pane-right {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.reports-income-pane-left::-webkit-scrollbar,
.reports-income-pane-right::-webkit-scrollbar {
  width: 0;
  height: 0;
}

.status-cell .cell-view,
.comment-cell .cell-view {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.status-cell .status-text,
.comment-cell .comment-text {
  overflow: hidden;
  text-overflow: ellipsis;
}

.status-cell .status-text {
  display: inline-block;
  max-width: 62px;
  white-space: nowrap;
}

.status-cell .cell-edit,
.comment-cell .cell-edit {
  display: flex;
  align-items: center;
  gap: 6px;
}

.status-cell .cell-edit.hidden,
.comment-cell .cell-edit.hidden {
  display: none;
}

.status-cell .inline-edit-input,
.comment-cell .inline-edit-input {
  width: 100%;
  min-width: 120px;
  height: 30px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  padding: 4px 8px;
  font-size: 12px;
}

.status-cell .report-inline-wrap {
  width: 100%;
}

.status-cell .report-inline-wrap .dropdown {
  max-height: 180px;
  z-index: 80;
}

.inline-ok-btn {
  height: 30px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: #b0d5f2;
  color: #101010;
  padding: 0 10px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}

.inline-ok-btn:hover {
  filter: brightness(0.92);
}

.edit-inline-btn {
  width: 22px;
  height: 22px;
  min-width: 22px;
  font-size: 12px;
  line-height: 1;
  background-image: none;
}

.expenses-sheet {
  gap: 10px;
}

.expenses-toolbar {
  display: grid;
  gap: 10px;
}

.expenses-filter-form,
.expenses-add-form {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.expenses-filter-form .report-input,
.expenses-filter-form .primary,
.expenses-add-form .primary,
.expenses-add-form input {
  height: var(--field-height);
}

.expenses-add-form input:not([type="hidden"]) {
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  padding: 8px 12px;
  font-size: 14px;
  width: var(--field-width);
}

.expenses-vehicle-wrap {
  width: 260px;
  min-width: 220px;
}

.expenses-vehicle-wrap input {
  width: 100%;
}

.expenses-print-link {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M19 8H5a3 3 0 0 0-3 3v4h4v4h12v-4h4v-4a3 3 0 0 0-3-3zm-3 9H8v-5h8v5zm3-13H5V2h14v2z'/></svg>");
}

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

.expenses-table td input {
  width: 100%;
  min-width: 140px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  font-size: 14px;
  height: 34px;
}

.expenses-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.expenses-actions .primary {
  width: 120px;
}

@media (max-width: 980px) {
  .expenses-filter-form,
  .expenses-add-form {
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .expenses-vehicle-wrap {
    width: 100%;
    min-width: 0;
  }

  .expenses-table td,
  .expenses-table th {
    font-size: 11px;
  }
}

@media print {
  .reports-controls {
    display: none;
  }

  .reports-table-wrap {
    max-height: none;
  }

  .reports-table thead th {
    position: static;
  }
}
.sms-cell {
  text-align: center;
}

.sms-cell input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: #b0d5f2;
}

@media (max-width: 1200px) {
  .due-section {
    grid-template-columns: 1fr;
  }
}

.login-wrap {
  display: grid;
  place-items: center;
  min-height: 70vh;
}

.login-card {
  background: var(--panel);
  padding: 24px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  width: min(380px, 90vw);
  display: grid;
  gap: 12px;
}

.login-card input {
  width: 100%;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  font-size: 15px;
}

.alert {
  background: #3b1f28;
  color: #ffd2dc;
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 13px;
}

.alert.success {
  background: #113221;
  color: #c6f6d5;
}

.admin-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.admin-card {
  background: var(--panel);
  border-radius: var(--radius);
  padding: 18px;
  border: 1px solid var(--border);
}

.admin-grid {
  display: grid;
  gap: 18px;
  margin-top: 16px;
}

.admin-grid--two {
  grid-template-columns: max-content max-content;
  align-items: start;
  gap: 10px;
  justify-content: start;
}

.admin-grid--two .admin-card {
  max-width: 360px;
}

.admin-grid table input {
  width: 100%;
  min-width: 120px;
}

.admin-grid table form {
  display: contents;
}

.admin-narrow {
  max-width: 320px;
}

.admin-narrow table input,
.admin-narrow input {
  padding: 8px 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  font-size: 14px;
  height: var(--field-height);
}
.table-wrap {
  overflow-x: auto;
}

.due-table-wrap-fixed {
  height: 824px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: rgba(176, 213, 242, 0.45) transparent;
}

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

.due-table-fixed th,
.due-table-fixed td {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.due-deadline-table th:nth-child(1),
.due-deadline-table td:nth-child(1) {
  width: 23%;
}

.due-deadline-table th:nth-child(2),
.due-deadline-table td:nth-child(2) {
  width: 21%;
}

.due-deadline-table th:nth-child(3),
.due-deadline-table td:nth-child(3) {
  width: 20%;
}

.due-deadline-table th:nth-child(4),
.due-deadline-table td:nth-child(4) {
  width: 28%;
}

.due-deadline-table th:nth-child(5),
.due-deadline-table td:nth-child(5) {
  width: 8%;
}

.due-table-wrap-fixed::-webkit-scrollbar {
  width: 6px;
}

.due-table-wrap-fixed::-webkit-scrollbar-track {
  background: transparent;
}

.due-table-wrap-fixed::-webkit-scrollbar-thumb {
  background: rgba(176, 213, 242, 0.45);
  border-radius: 999px;
}

.modal {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  z-index: 2000;
}

.modal.hidden {
  display: none;
}

.hidden {
  display: none !important;
}

.modal-card {
  width: min(520px, 92vw);
  background: #2f2c2a;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 20px 22px;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);
  color: #ffffff;
}

.modal-card h3 {
  margin: 0 0 14px;
  font-size: 18px;
}

.putevki-search-form {
  display: flex;
  gap: 12px;
  margin-bottom: 18px;
  align-items: center;
  flex-wrap: wrap;
}

.putevki-search-form .report-input {
  min-width: 320px;
  flex: 1 1 320px;
}

.putevki-table-wrap {
  overflow-x: auto;
}

.putevki-table {
  min-width: 1180px;
}

.putevki-text-cell {
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 320px;
}

.putevki-text-cell span {
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 260px;
}

.putevki-inline-form,
.putevki-upload-form {
  display: flex;
  align-items: center;
  gap: 8px;
}

.putevki-mileage-input {
  width: 110px;
}

.putevki-file-cell {
  display: flex;
  align-items: center;
  gap: 8px;
}

.putevki-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 16px;
}

.putevki-status--ok {
  background: rgba(76, 175, 80, 0.14);
  color: #1f8a39;
}

.putevki-status--pending {
  background: rgba(255, 193, 7, 0.16);
  color: #a26b00;
}

.putevki-status--error {
  background: rgba(220, 53, 69, 0.14);
  color: #c92b3e;
}

.putevki-text-modal-card {
  max-width: 760px;
}

.putevki-text-full {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  max-height: 60vh;
  overflow: auto;
  background: #f4f6f8;
  color: #1f2328;
  border-radius: 14px;
  padding: 14px;
}

.buyout-form {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.buyout-form input,
.buyout-form select {
  width: 100%;
  height: var(--field-height);
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #fff;
  padding: 8px 12px;
  font-size: 15px;
}

.buyout-form input::placeholder {
  color: #f2a3a3;
}

.buyout-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 2px;
}

.checklist {
  list-style: none;
  padding: 0;
  margin: 0 0 16px;
  display: grid;
  gap: 8px;
}

.checklist label {
  display: flex;
  gap: 8px;
  align-items: center;
}

.icon-delete {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  border: 1px solid #8b4a4a;
  background: #5b2c2c;
  color: #ffe3e3;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.1s ease;
}

.icon-delete:hover {
  background: #6d3535;
  border-color: #a85a5a;
}

.icon-delete:active {
  transform: translateY(1px);
}

.notice-note {
  margin: 0 0 16px;
  padding: 12px 14px;
  border-radius: 10px;
  background: #3a3532;
  border: 1px solid #6b5b52;
  color: #f5d9c9;
  font-size: 13px;
  line-height: 1.4;
}

.notice-note p {
  margin: 0 0 6px;
}

.notice-note p:last-child {
  margin-bottom: 0;
}

.admin-users .user-create {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-bottom: 14px;
}

.admin-users .user-create-fields {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.admin-users .user-create-fields input {
  width: 210px;
}

.admin-users .user-create-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.admin-users .user-create-actions .primary {
  height: var(--field-height);
}

.admin-users .admin-user-pages {
  margin: 0;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.admin-users .user-row td {
  vertical-align: middle;
}

.admin-users .user-settings-cell {
  min-width: 560px;
}

.admin-users .user-telegram-cell {
  min-width: 220px;
}

.admin-users .user-perms {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.admin-users .user-perms input[type="password"] {
  width: 160px;
}

.admin-users .user-perms input[type="text"] {
  width: 220px;
}

.admin-users .user-perms input[name="tg_login"] {
  width: 180px;
}

.admin-users .user-perms input[name="tg_password"] {
  width: 180px;
}

.muted-text {
  color: #a29d97;
}

.tg-user-meta {
  display: grid;
  gap: 4px;
}

.tg-status {
  font-size: 12px;
  color: #cbc6c0;
}

.tg-status--ok {
  color: #b8e3bf;
}

.tg-status-time {
  font-size: 11px;
  color: #b0aba6;
}

.admin-users .user-actions {
  width: 48px;
  text-align: center;
}

.notification-settings-table th,
.notification-settings-table td {
  white-space: nowrap;
}

.notification-settings-table th:first-child,
.notification-settings-table td:first-child {
  position: sticky;
  left: 0;
  background: #403d3a;
  z-index: 1;
}

.notification-settings-cell {
  text-align: center;
}

.notification-settings-cell .active-toggle {
  justify-content: center;
}

.notification-settings-cell .active-toggle span {
  display: none;
}

.admin-broadcast-card {
  margin-top: 16px;
}

.admin-broadcast-form {
  display: grid;
  gap: 10px;
  max-width: 760px;
}

.admin-broadcast-form textarea {
  min-height: 90px;
  resize: vertical;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  font-size: 14px;
  font-family: inherit;
}

.owner-toggle {
  margin-right: 10px;
}

.row-form > .smz-toggle-inline {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  flex: 0 0 96px;
  min-width: 96px;
  max-width: 96px;
  padding: 0 4px;
  border: none;
  background: transparent;
}

.field-toggle {
  justify-content: center;
  width: var(--field-width);
  min-width: var(--field-width);
  max-width: var(--field-width);
  height: var(--field-height);
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  padding: 0 12px;
}

.field-toggle-compact {
  justify-content: flex-start;
  gap: 6px;
  width: 96px;
  min-width: 96px;
  max-width: 96px;
  padding: 0 10px;
}

.owner-physical,
.owner-legal {
  display: contents;
}

.owner-legal.hidden,
.owner-physical.hidden {
  display: none;
}

.roman-controls {
  display: flex;
  align-items: center;
 }

.roman-table-wrap {
  overflow: visible;
}

.roman-options {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.roman-filter {
  display: inline-flex;
  align-items: center;
}

.roman-model-select {
  width: var(--field-width);
  height: var(--field-height);
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  padding: 8px 12px;
  font-size: 14px;
}

.roman-number {
  width: var(--field-width);
  box-sizing: border-box;
  height: var(--field-height);
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  padding: 8px 12px;
  font-size: 14px;
}

.roman-number::placeholder {
  color: #f2a3a3;
}

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

.roman-vin {
  display: flex;
  align-items: center;
  gap: 6px;
}

.roman-repair {
  text-align: center;
}

.roman-repair input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: #f6b3b3;
}

.copy-btn {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: #3a3836;
  color: var(--text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
}

.copy-btn svg {
  width: 14px;
  height: 14px;
  fill: currentColor;
}

.roman-table thead th:nth-child(odd),
.roman-table tbody td:nth-child(odd) {
  background: #3b3937;
}

.roman-table thead th:nth-child(even),
.roman-table tbody td:nth-child(even) {
  background: #353432;
}

.roman-table thead th {
  position: sticky;
  top: var(--roman-sticky-top, 72px);
  z-index: 40;
}

.roman-table th.roman-mileage-col,
.roman-table td.roman-mileage-col {
  background: #9fc3e0 !important;
  color: #1b1a17;
  font-weight: 700;
}

.roman-table td {
  font-size: 14px;
}

.roman-table th {
  font-size: 14px;
}

.roman-table tbody tr.repair-row td {
  background: #f6b3b3 !important;
  color: #1b1a17;
}

.roman-table tbody tr.repair-row td .vehicle-profile-link,
.roman-table tbody tr.repair-row td .vehicle-profile-link:hover {
  color: #1b1a17;
}

.roman-table td.roman-remain--mid {
  background: #f5d24a !important;
  color: #1b1a17;
  font-weight: 700;
}

.roman-table td.roman-remain--low {
  background: #f6b3b3 !important;
  color: #1b1a17;
  font-weight: 700;
}

.roman-table td.roman-remain--neg {
  background: #7d1f24 !important;
  color: #ffffff;
  font-weight: 700;
}

.table-empty {
  text-align: center;
  color: var(--muted);
}

.roman-print {
  display: none;
}

.armenak-page .site-main {
  padding: 8px 10px 18px;
}

.armenak-page .site-header {
  padding: 6px 10px;
}

.vehicle-profile-link {
  color: #f5d24a;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.vehicle-profile-link:hover {
  color: #ffe17d;
}

.vehicle-profile-sheet {
  display: grid;
  gap: 16px;
}

.vehicle-profile-topbar {
  display: block;
}

.vehicle-profile-select-form {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
}

.vehicle-profile-desktop-picker,
.vehicle-profile-mobile-picker {
  width: min(520px, 100%);
}

.vehicle-profile-search-wrap {
  width: min(520px, 100%);
  height: auto;
}

.vehicle-profile-select-form .report-input {
  width: min(520px, 100%);
}

.vehicle-profile-desktop-picker {
  display: block;
}

.vehicle-profile-mobile-picker {
  display: none;
}

.vehicle-profile-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.vehicle-profile-title {
  font-size: 26px;
  font-weight: 700;
}

.vehicle-profile-subtitle {
  color: var(--muted);
  font-size: 13px;
  margin-top: 4px;
}

.vehicle-profile-meta {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.vehicle-profile-badge {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.06);
  color: #f4f4f4;
  font-size: 13px;
}

.vehicle-profile-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.vehicle-card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px;
  display: grid;
  gap: 14px;
  align-content: start;
  min-height: 240px;
}

.vehicle-card-title {
  font-size: 17px;
  font-weight: 700;
}

.vehicle-card--scheme {
  min-height: 0;
}

.vehicle-scheme-controls {
  display: grid;
  gap: 8px;
}

.vehicle-damage-mode-btn {
  width: 100%;
}

.vehicle-damage-mode-btn.is-active {
  background: #d85d5d;
  color: #ffffff;
}

.vehicle-scheme-hint {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
}

.vehicle-scheme-wrap {
  min-height: 0;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
  padding: 8px;
}

.vehicle-scheme-stage {
  position: relative;
  width: min(100%, 420px);
  margin: 0 auto;
}

.vehicle-scheme-svg {
  width: 100%;
  height: auto;
  display: block;
}

.vehicle-scheme-part {
  transition: fill 0.24s ease, stroke 0.24s ease, opacity 0.24s ease, filter 0.24s ease;
  cursor: default;
}

.vehicle-scheme-part:hover,
.vehicle-scheme-part:focus {
  fill: rgba(216, 93, 93, 0.26) !important;
  stroke: rgba(216, 93, 93, 0.95) !important;
  filter: drop-shadow(0 0 6px rgba(216, 93, 93, 0.28));
}

.vehicle-scheme-stage.is-select-mode .vehicle-scheme-part {
  cursor: pointer;
}

.vehicle-scheme-part.has-damage {
  fill: rgba(216, 93, 93, 0.14) !important;
  stroke: rgba(255, 135, 135, 0.45) !important;
}

.vehicle-scheme-part.is-picking {
  fill: rgba(226, 63, 63, 0.34) !important;
  stroke: rgba(255, 168, 168, 0.94) !important;
}

.vehicle-scheme-part.is-history-hover {
  fill: rgba(245, 210, 74, 0.26) !important;
  stroke: rgba(245, 210, 74, 0.95) !important;
}

.vehicle-scheme-code-layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.vehicle-scheme-code {
  position: absolute;
  transform: translate(-50%, -50%);
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #d34c4c;
  color: #ffffff;
  font-size: 12px;
  font-weight: 700;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28);
}

.vehicle-scheme-menu {
  position: absolute;
  z-index: 5;
  width: min(220px, calc(100% - 16px));
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 14px;
  background: rgba(34, 32, 30, 0.98);
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.32);
  padding: 10px;
}

.vehicle-scheme-menu-title {
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 8px;
}

.vehicle-scheme-menu-list {
  display: grid;
  gap: 6px;
  max-height: 240px;
  overflow-y: auto;
}

.vehicle-scheme-menu-item {
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  color: #ffffff;
  padding: 8px 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  text-align: left;
  cursor: pointer;
}

.vehicle-scheme-menu-item:hover {
  border-color: rgba(245, 210, 74, 0.58);
  background: rgba(245, 210, 74, 0.08);
}

.vehicle-scheme-menu-item--delete {
  border-color: rgba(216, 93, 93, 0.4);
}

.vehicle-scheme-menu-item--delete:hover {
  border-color: rgba(216, 93, 93, 0.8);
  background: rgba(216, 93, 93, 0.12);
}

.vehicle-scheme-menu-item--delete:disabled {
  opacity: 0.45;
  cursor: default;
}

.vehicle-scheme-menu-code {
  min-width: 24px;
  height: 24px;
  border-radius: 999px;
  background: #d34c4c;
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
}

.vehicle-scheme-menu-code--delete {
  background: #6b6b6b;
}

.vehicle-scheme-custom {
  display: grid;
  gap: 8px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.vehicle-scheme-custom-input {
  width: 100%;
  min-height: 72px;
  resize: vertical;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.04);
  color: #ffffff;
  padding: 10px;
  font: inherit;
}

.vehicle-scheme-custom-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.vehicle-card-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.vehicle-card-actions--stack {
  display: grid;
  gap: 8px;
}

.vehicle-card-actions .ghost,
.vehicle-card-actions .primary {
  width: 100%;
}

.vehicle-card-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.vehicle-card-title-row .vehicle-card-title {
  margin-bottom: 0;
}

.vehicle-card-title-row--gps {
  align-items: flex-start;
}

.vehicle-gps-autoblock-toggle {
  margin-left: auto;
  white-space: nowrap;
}

.vehicle-service-form {
  display: grid;
  gap: 10px;
  align-content: start;
}

.vehicle-service-label,
.vehicle-service-field span {
  color: #b9d9f7;
  font-size: 12px;
  font-weight: 700;
}

.vehicle-service-field {
  display: grid;
  gap: 4px;
}

.vehicle-gps-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
}

.vehicle-service-field--full {
  grid-column: 1 / -1;
}

.vehicle-gps-value {
  min-height: 42px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #494542;
  color: #f5f1ea;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  font-weight: 700;
  line-height: 1.3;
  word-break: break-word;
}

.vehicle-gps-state {
  min-height: 42px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #494542;
  color: #f5f1ea;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  font-weight: 700;
  line-height: 1.3;
}

.vehicle-gps-state--ok {
  border-color: rgba(113, 201, 145, 0.45);
  background: rgba(113, 201, 145, 0.14);
  color: #dff7e6;
}

.vehicle-gps-state--warn {
  border-color: rgba(245, 210, 74, 0.45);
  background: rgba(245, 210, 74, 0.14);
  color: #fff2bf;
}

.vehicle-gps-state--danger {
  border-color: rgba(216, 93, 93, 0.45);
  background: rgba(216, 93, 93, 0.14);
  color: #ffd7d7;
}

.vehicle-gps-state-detail {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.vehicle-gps-progress {
  display: grid;
  gap: 6px;
}

.vehicle-gps-progress-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.2;
}

.vehicle-gps-progress-track {
  position: relative;
  height: 6px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.08);
}

.vehicle-gps-progress-fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: 0;
  border-radius: inherit;
}

.vehicle-gps-progress[data-state="loading"] .vehicle-gps-progress-fill {
  width: 36%;
  background: linear-gradient(90deg, #9dc4e4 0%, #f5d24a 100%);
  animation: vehicle-gps-progress-indeterminate 1.2s ease-in-out infinite;
}

.vehicle-gps-progress[data-state="done"] .vehicle-gps-progress-fill {
  width: 100%;
  background: linear-gradient(90deg, #8bcfa4 0%, #6abf88 100%);
  animation: none;
}

.vehicle-gps-progress[data-state="done-with-errors"] .vehicle-gps-progress-fill {
  width: 100%;
  background: linear-gradient(90deg, #f0b771 0%, #d85d5d 100%);
  animation: none;
}

@keyframes vehicle-gps-progress-indeterminate {
  0% {
    transform: translateX(-105%);
  }
  100% {
    transform: translateX(280%);
  }
}

.gps-toolbar {
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}

.gps-search-input {
  min-width: min(100%, 340px);
  flex: 1 1 320px;
}

.gps-park-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.gps-progress {
  display: grid;
  grid-template-columns: auto minmax(160px, 1fr) auto;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  padding: 8px 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.04);
}

.gps-progress-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #b9d9f7;
}

.gps-progress-track {
  position: relative;
  height: 8px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.08);
}

.gps-progress-fill {
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #9dc4e4 0%, #f5d24a 100%);
  transition: width 0.28s ease;
}

.gps-progress-text {
  justify-self: end;
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
}

.gps-progress[data-state="done"] .gps-progress-fill {
  background: linear-gradient(90deg, #8bcfa4 0%, #6abf88 100%);
}

.gps-progress[data-state="done-with-errors"] .gps-progress-fill {
  background: linear-gradient(90deg, #f0b771 0%, #d85d5d 100%);
}

.gps-table-wrap {
  overflow-x: auto;
}

.gps-table {
  min-width: 1180px;
}

.gps-table td,
.gps-table th {
  vertical-align: middle;
}

.gps-state-cell {
  min-width: 220px;
}

.gps-state-pill {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.05);
  color: #f5f1ea;
  font-weight: 700;
  line-height: 1.25;
}

.gps-state-pill--ok {
  border-color: rgba(113, 201, 145, 0.45);
  background: rgba(113, 201, 145, 0.14);
  color: #dff7e6;
}

.gps-state-pill--warn {
  border-color: rgba(245, 210, 74, 0.45);
  background: rgba(245, 210, 74, 0.14);
  color: #fff2bf;
}

.gps-state-pill--danger {
  border-color: rgba(216, 93, 93, 0.45);
  background: rgba(216, 93, 93, 0.14);
  color: #ffd7d7;
}

.gps-stub-btn {
  min-width: 150px;
}

.gps-stub-btn--block {
  background: rgb(246, 179, 179);
  border-color: rgba(246, 179, 179, 0.82);
  color: #4f2c2c;
}

.gps-stub-btn--block:hover {
  background: rgb(250, 194, 194);
  border-color: rgba(250, 194, 194, 0.92);
  color: #442323;
}

.gps-stub-btn--unblock {
  background: linear-gradient(90deg, #8bcfa4 0%, #6abf88 100%);
  border-color: rgba(106, 191, 136, 0.82);
  color: #173b22;
}

.gps-stub-btn--unblock:hover {
  background: linear-gradient(90deg, #98d8ae 0%, #77c695 100%);
  border-color: rgba(119, 198, 149, 0.92);
  color: #132e1b;
}

.gps-stub-btn.is-busy,
.js-gps-action.is-busy {
  opacity: 0.65;
  cursor: wait;
}

.respect-dialog {
  position: fixed;
  inset: 0;
  z-index: 2200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(11, 10, 10, 0.6);
}

.respect-dialog-card {
  width: min(520px, 100%);
  background: #353230;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 18px;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.38);
  padding: 20px 22px 18px;
}

.respect-dialog-title {
  margin: 0 0 10px;
  font-size: 22px;
  font-weight: 700;
  color: #ffffff;
}

.respect-dialog-message {
  margin: 0;
  font-size: 18px;
  line-height: 1.45;
  color: #f2efec;
  white-space: pre-line;
}

.respect-dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 18px;
}

.respect-dialog-btn {
  min-width: 120px;
  height: 42px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 12px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  transition: transform 0.18s ease, opacity 0.18s ease, background 0.18s ease;
}

.respect-dialog-btn:hover {
  transform: translateY(-1px);
}

.respect-dialog-btn:active {
  transform: translateY(0);
}

.respect-dialog-btn--cancel {
  background: rgba(255, 255, 255, 0.08);
  color: #f3efec;
}

.respect-dialog-btn--confirm {
  background: #b7dbff;
  color: #13263a;
}

.respect-dialog-btn--confirm[data-tone="danger"] {
  background: rgb(246, 179, 179);
  color: #4d1414;
}

.respect-dialog-btn--confirm[data-tone="success"] {
  background: rgba(124, 214, 124, 0.88);
  color: #102412;
}

@media (max-width: 640px) {
  .respect-dialog-card {
    padding: 18px 16px 16px;
  }

  .respect-dialog-title {
    font-size: 19px;
  }

  .respect-dialog-message {
    font-size: 16px;
  }

  .respect-dialog-actions {
    flex-direction: column-reverse;
  }

  .respect-dialog-btn {
    width: 100%;
  }
}

.vehicle-season-toggle {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.vehicle-equipment-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.vehicle-checkbox-line {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #494542;
  color: #f5f1ea;
  padding: 0 12px;
  font-weight: 700;
}

.vehicle-checkbox-line input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin: 0;
}

.vehicle-season-option {
  position: relative;
}

.vehicle-season-option input {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
}

.vehicle-season-option span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #494542;
  color: #f5f1ea;
  font-weight: 700;
  transition: all 0.2s ease;
}

.vehicle-season-option input:checked + span {
  background: #b0d5f2;
  color: #1b1a17;
  border-color: #b0d5f2;
  box-shadow: 0 0 0 1px rgba(176, 213, 242, 0.25);
}

.vehicle-stub-btn[disabled] {
  opacity: 0.7;
  cursor: default;
}

.vehicle-stat-list,
.vehicle-history-list,
.vehicle-summary {
  display: grid;
  gap: 8px;
}

.vehicle-summary-row {
  display: grid;
  gap: 8px;
}

.vehicle-summary-row--1 {
  grid-template-columns: 1fr;
}

.vehicle-summary-row--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.vehicle-summary-row--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.vehicle-summary-row--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.vehicle-stat-item,
.vehicle-history-item,
.vehicle-summary > div {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  padding: 9px 10px;
}

.vehicle-stat-item {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.vehicle-stat-item span,
.vehicle-summary span,
.vehicle-history-period,
.vehicle-history-extra {
  color: var(--muted);
}

.vehicle-history-name {
  font-weight: 700;
}

.vehicle-damage-list {
  display: grid;
  gap: 10px;
  align-content: start;
}

.vehicle-damage-item {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  padding: 10px;
  display: grid;
  gap: 8px;
}

.vehicle-damage-item.is-active {
  border-color: rgba(216, 93, 93, 0.3);
}

.vehicle-damage-item--service {
  border-color: rgba(176, 213, 242, 0.18);
  background: rgba(176, 213, 242, 0.06);
}

.vehicle-damage-item-top {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.vehicle-damage-code {
  min-width: 28px;
  height: 28px;
  border-radius: 999px;
  background: #d34c4c;
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 700;
}

.vehicle-damage-code--service {
  background: #b0d5f2;
  color: #1b1a17;
}

.vehicle-damage-main {
  flex: 1;
  min-width: 0;
  display: grid;
  gap: 2px;
}

.vehicle-damage-part {
  font-weight: 700;
}

.vehicle-damage-defect {
  color: #e5e1dc;
}

.vehicle-damage-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  color: var(--muted);
  font-size: 12px;
}

.vehicle-damage-meta-live {
  color: #f5d24a;
  font-weight: 700;
}

.vehicle-damage-done-btn {
  width: auto !important;
  min-width: 82px;
  margin-left: auto;
}

.vehicle-damage-resolved-date {
  margin-left: auto;
  font-size: 12px;
  color: #a8d79b;
  font-weight: 700;
  padding-top: 5px;
}

.vehicle-history-flag {
  display: inline-block;
  margin-top: 6px;
  color: #f5d24a;
  font-size: 12px;
  font-weight: 700;
}

.vehicle-phone-link {
  color: #f5d24a;
  font-weight: 700;
  text-decoration: none;
}

.vehicle-phone-link:hover {
  color: #ffe17d;
}

.driver-phone-actions {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.driver-telegram-link {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(156, 201, 240, 0.42);
  background: rgba(156, 201, 240, 0.08);
  color: var(--btn-bg);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

.driver-telegram-link:hover {
  transform: translateY(-1px);
  border-color: rgba(156, 201, 240, 0.7);
  background: rgba(156, 201, 240, 0.16);
}

.driver-telegram-link svg {
  width: 18px;
  height: 18px;
  display: block;
}

.driver-email-button {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(245, 210, 74, 0.56);
  background: rgba(245, 210, 74, 0.14);
  color: #f5d24a;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.driver-yandex-link {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(255, 196, 77, 0.56);
  background: rgba(255, 196, 77, 0.14);
  color: #ffc44d;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
  font-size: 16px;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.driver-yandex-link:hover {
  transform: translateY(-1px);
  border-color: rgba(255, 196, 77, 0.9);
  background: rgba(255, 196, 77, 0.22);
}

.driver-email-button:hover {
  transform: translateY(-1px);
  border-color: rgba(245, 210, 74, 0.9);
  background: rgba(245, 210, 74, 0.22);
}

.driver-profile-email-card {
  width: min(560px, calc(100vw - 32px));
  display: grid;
  gap: 12px;
}

.driver-profile-email-meta {
  color: #d7d1cb;
  font-size: 13px;
  word-break: break-word;
}

.driver-profile-email-textarea {
  min-height: 84px;
  resize: none;
}

.driver-profile-email-actions {
  justify-content: flex-end;
}

@media (max-width: 900px) {
  .gps-progress {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .gps-progress-text {
    justify-self: start;
    white-space: normal;
  }

  .vehicle-gps-progress-meta {
    flex-wrap: wrap;
  }

  .vehicle-card-title-row {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .driver-phone-actions {
    gap: 8px;
    flex-wrap: wrap;
  }

  .driver-email-button,
  .driver-telegram-link,
  .driver-yandex-link {
    width: 38px;
    height: 38px;
  }

  .driver-profile-email-card {
    width: calc(100vw - 18px);
    padding: 16px;
    gap: 10px;
  }

  .driver-profile-email-textarea {
    min-height: 72px;
  }
}

.vehicle-placeholder {
  border: 1px dashed rgba(255, 255, 255, 0.16);
  border-radius: 12px;
  padding: 14px;
  color: #cfcac5;
  min-height: 96px;
  display: flex;
  align-items: center;
}

.vehicle-placeholder--sheet {
  min-height: 180px;
}

.vehicle-profile-form {
  display: grid;
  gap: 8px;
}

.vehicle-profile-form input,
.vehicle-profile-form select,
.vehicle-profile-form textarea {
  width: 100%;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #45423f;
  color: #ffffff;
  padding: 8px 12px;
  font-size: 14px;
}

.vehicle-profile-form textarea {
  resize: vertical;
  min-height: 90px;
}

.vehicle-profile-form .primary {
  width: 100%;
}

.dropdown-item--meta {
  display: grid;
  gap: 2px;
}

.dropdown-main {
  font-weight: 700;
}

.dropdown-meta {
  font-size: 12px;
  color: #bdb7b1;
}

.driver-profile-sheet {
  display: grid;
  gap: 16px;
}

.driver-profile-topbar {
  display: block;
}

.driver-profile-select-form {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
}

.driver-profile-desktop-picker,
.driver-profile-mobile-picker {
  width: min(620px, 100%);
}

.driver-profile-search-wrap {
  width: min(620px, 100%);
  height: auto;
}

.driver-profile-select-form .report-input {
  width: min(620px, 100%);
}

.driver-profile-desktop-picker {
  display: block;
}

.driver-profile-mobile-picker {
  display: none;
}

.driver-profile-grid {
  display: grid;
  grid-template-columns: minmax(280px, 340px) minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 16px;
}

.driver-card {
  min-height: 0;
}

.driver-card--photo {
  grid-row: span 2;
}

.driver-card--putevki {
  grid-column: 2 / 4;
}

.driver-putevki-list {
  max-height: 360px;
  overflow: auto;
  display: grid;
  gap: 8px;
  padding-right: 4px;
  scrollbar-width: thin;
  scrollbar-color: rgba(176, 213, 242, 0.65) rgba(255, 255, 255, 0.06);
}

.driver-putevki-list::-webkit-scrollbar {
  width: 10px;
}

.driver-putevki-list::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.04);
  border-radius: 999px;
}

.driver-putevki-list::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(176, 213, 242, 0.9), rgba(144, 188, 221, 0.72));
  border-radius: 999px;
  border: 2px solid rgba(36, 35, 34, 0.7);
}

.driver-putevki-row {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  padding: 10px 12px;
}

.driver-putevki-row--head {
  position: sticky;
  top: 0;
  z-index: 2;
  background: linear-gradient(180deg, rgba(56, 53, 49, 0.98), rgba(46, 43, 40, 0.98));
  color: #b8d6f1;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.driver-putevki-index {
  font-weight: 700;
  color: #f5d24a;
}

.driver-putevki-main {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.driver-putevki-date {
  font-weight: 700;
}

.driver-putevki-meta {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.driver-balance-bar {
  display: grid;
  grid-template-columns: 32px 1fr 32px;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.03);
}

.driver-balance-center {
  display: grid;
  gap: 2px;
  text-align: center;
}

.driver-balance-title {
  font-size: 11px;
  color: #a9a39d;
}

.driver-balance-value {
  font-size: 28px;
  font-weight: 700;
  line-height: 1;
  color: #d4d0cb;
}

.driver-balance-value.is-negative {
  color: #ff6b61;
}

.driver-balance-value.is-positive {
  color: #7be37e;
}

.driver-balance-value.is-muted {
  color: #d4d0cb;
}

.driver-balance-action {
  width: 32px;
  height: 32px;
  border: none;
  background: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  padding: 0;
}

.driver-balance-action--minus {
  color: #ff6b61;
}

.driver-balance-action--plus {
  color: #46e06f;
}

.driver-balance-action:disabled {
  opacity: 0.35;
  cursor: default;
}

.driver-photo-frame {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 360px;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
}

.driver-photo-image {
  width: 100%;
  max-width: 280px;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.04);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24);
}

.driver-photo-fab {
  position: absolute;
  right: 20px;
  bottom: 20px;
  width: 52px;
  height: 52px;
  border: 1px solid rgba(245, 210, 74, 0.36);
  border-radius: 999px;
  background: rgba(36, 35, 34, 0.92);
  color: #f5d24a;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 10px 18px rgba(0, 0, 0, 0.34);
  transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}

.driver-photo-fab:hover {
  transform: translateY(-1px);
  background: rgba(48, 46, 44, 0.98);
  border-color: rgba(245, 210, 74, 0.62);
}

.driver-photo-fab-icon {
  width: 26px;
  height: 26px;
  display: inline-flex;
}

.driver-photo-fab-icon svg {
  width: 100%;
  height: 100%;
}

.driver-photo-message {
  font-size: 12px;
  color: #bdb7b1;
}

.driver-photo-message.is-error {
  color: #ff9a9a;
}

.driver-photo-message.is-success {
  color: #9fd891;
}

.driver-photo-form {
  display: grid;
}

.driver-photo-form .primary {
  width: 100%;
}

.driver-balance-owner-card {
  max-width: 560px;
}

.driver-balance-owner-note {
  margin: 0 0 10px;
  color: #bdb7b1;
}

.driver-balance-owner-preview {
  margin: 0 0 14px;
  padding: 14px 16px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: #f2eee8;
  white-space: pre-wrap;
  font: inherit;
  line-height: 1.45;
}

@media (max-width: 900px) {
  .vehicle-scheme-wrap {
    padding: 6px;
  }

  .vehicle-scheme-stage {
    width: 100%;
  }

  .vehicle-scheme-menu {
    width: min(204px, calc(100% - 12px));
    padding: 8px;
  }

  .vehicle-damage-item-top {
    gap: 8px;
  }

  .vehicle-damage-done-btn {
    min-width: 74px;
  }

  .driver-profile-grid {
    grid-template-columns: 1fr;
  }

  .driver-card--photo {
    grid-row: auto;
  }

  .driver-card--putevki {
    grid-column: auto;
  }

  .driver-photo-frame {
    min-height: 0;
  }

  .driver-balance-value {
    font-size: 24px;
  }

  .driver-photo-fab {
    right: 16px;
    bottom: 16px;
    width: 48px;
    height: 48px;
  }

  .driver-profile-desktop-picker {
    display: block;
  }

  .driver-profile-mobile-picker {
    display: none;
  }
}

.armenak-sheet {
  max-width: 520px;
  margin: 0 auto;
  gap: 10px;
}

.armenak-card {
  padding: 10px;
}

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

.armenak-table th,
.armenak-table td {
  font-size: 13px;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.armenak-table th:nth-child(1),
.armenak-table td:nth-child(1) {
  width: 12%;
}

.armenak-table th:nth-child(2),
.armenak-table td:nth-child(2) {
  width: 30%;
}

.armenak-table th:nth-child(3),
.armenak-table td:nth-child(3) {
  width: 38%;
}

.armenak-table th:nth-child(4),
.armenak-table td:nth-child(4) {
  width: 20%;
}

@media print {
  body {
    background: #ffffff;
    color: #000000;
  }

  .site-header,
  .roman-page {
    display: none;
  }

  .site-main {
    padding: 0;
  }

  .roman-print {
    display: block;
  }

  .roman-print-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    color: #000;
  }

  .roman-print-table th,
  .roman-print-table td {
    border: 1px solid #000;
    padding: 4px 6px;
    text-align: left;
  }

  .roman-print-table th.roman-print-blank,
  .roman-print-table td.roman-print-blank {
    width: 12ch;
    min-width: 12ch;
    max-width: 12ch;
  }
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

thead th {
  text-align: left;
  font-weight: 700;
  padding: 6px 8px;
  border-bottom: 1px solid var(--border);
}

tbody td {
  padding: 6px 8px;
  border-bottom: 1px solid rgba(90, 85, 80, 0.5);
}

.documents .doc-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 16px 0;
}

.doc-card {
  text-decoration: none;
  color: var(--text);
  padding: 16px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: #3f3d3b;
}

.print-panel {
  min-height: 70vh;
}

.print-placeholder {
  border: 2px dashed rgba(80, 75, 70, 0.8);
  padding: 40px 20px;
  border-radius: 12px;
  font-size: 22px;
  font-weight: 700;
  text-align: center;
  margin-top: 18px;
}

.float-tip {
  position: absolute;
  z-index: 20;
  max-width: 420px;
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: #3a3836;
  color: #ffffff;
  font-size: 13px;
  box-shadow: var(--shadow);
  pointer-events: none;
  white-space: pre-wrap;
}

@media (max-width: 900px) {
  .site-header {
    flex-wrap: wrap;
    align-items: flex-start;
    padding: 8px 12px;
    gap: 10px;
  }

  .brand {
    flex: 1 1 calc(100% - 108px);
    min-width: 0;
  }

  .brand-text {
    min-width: 0;
  }

  .brand-title,
  .brand-subtitle,
  .brand-user-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .site-header-tools {
    margin-left: 0;
    gap: 8px;
    flex: 0 0 auto;
  }

  .notification-toggle,
  .nav-toggle {
    flex: 0 0 auto;
  }

  .header-search {
    order: 3;
    flex: 1 0 100%;
    width: 100%;
  }

  .search-controls {
    flex-wrap: wrap;
    gap: 10px;
  }

  .search-left,
  .search-right {
    width: 100%;
    flex-wrap: wrap;
    gap: 10px;
  }

  .search-right {
    margin-left: 0;
  }

  .merged-form-divider,
  .row-head {
    flex-wrap: wrap;
  }

  .home-page .search-right {
    padding-top: 0;
  }

  .inline-form {
    flex-wrap: wrap;
  }

  .inline-form input,
  .inline-form button,
  .header-search .search-box.search-box--compact input {
    width: 100%;
    min-width: 0;
  }

  .welcome-popup {
    top: 74px;
    width: calc(100vw - 24px);
    max-width: calc(100vw - 24px);
    right: 12px;
    left: 12px;
  }

  .welcome-popup-card {
    width: 100%;
  }

  .row-form input,
  .row-form select {
    min-width: var(--field-width);
    width: var(--field-width);
  }

  .top-nav {
    flex-wrap: wrap;
    justify-content: flex-end;
  }
}
.due-table tbody td,
.roman-table tbody td,
.reports-table tbody td,
.admin-grid table tbody td {
  transition: background-color 0.22s ease;
}

.due-table tbody tr:hover td,
.roman-table tbody tr:hover td,
.reports-table tbody tr:hover td,
.admin-grid table tbody tr:hover td {
  background: #4a4845;
  transition-duration: 0.12s;
}
.pulse-alert {
  animation: pulseAlert 1.6s ease-in-out infinite;
  color: #5a1115;
}

.easter-egg-launcher {
  display: flex;
  justify-content: flex-end;
  margin-top: 18px;
}

.easter-egg-button {
  position: relative;
  min-width: 96px;
  height: 34px;
  padding: 0 14px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: rgba(217, 217, 222, 0.42);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.04em;
  cursor: pointer;
  overflow: hidden;
  box-shadow: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}

.easter-egg-button::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(180deg, #2e2e31 0%, #212124 100%);
  opacity: 0;
  transform: translateY(6px);
  transition: transform 0.45s ease;
  z-index: -1;
}

.easter-egg-button:hover {
  transform: translateY(-1px);
  color: #f1f1f4;
  border-color: #212121;
  box-shadow:
    6px 6px 12px rgba(0, 0, 0, 0.45),
    -6px -6px 12px rgba(47, 47, 47, 0.38);
  filter: brightness(1.02);
}

.easter-egg-button:hover::before {
  opacity: 1;
  transform: translateY(0);
}

.easter-egg-button:active {
  transform: translateY(1px) scale(0.99);
  color: #8d8d92;
  box-shadow:
    inset 4px 4px 12px rgba(0, 0, 0, 0.55),
    inset -4px -4px 12px rgba(31, 31, 31, 0.7);
}

.tetris-modal-card {
  width: min(860px, calc(100vw - 32px));
  max-width: 860px;
  padding: 18px;
  border-radius: 24px;
  border: 1px solid rgba(72, 255, 231, 0.24);
  background:
    radial-gradient(circle at top left, rgba(69, 31, 135, 0.34), transparent 34%),
    radial-gradient(circle at top right, rgba(25, 214, 255, 0.2), transparent 28%),
    linear-gradient(180deg, #12131c 0%, #090b12 100%);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.04) inset,
    0 22px 50px rgba(0, 0, 0, 0.52),
    0 0 28px rgba(46, 217, 255, 0.12);
}

.tetris-modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.tetris-modal-head h3 {
  margin: 4px 0 0;
  color: #e8f7ff;
  font-size: 28px;
  letter-spacing: 0.04em;
  text-shadow: 0 0 18px rgba(76, 220, 255, 0.28);
}

.tetris-kicker {
  color: #8ff6ff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.24em;
  text-transform: uppercase;
}

.tetris-new-btn {
  width: auto;
  min-width: 110px;
}

.tetris-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 18px;
  align-items: start;
}

.tetris-stage-wrap {
  position: relative;
  display: flex;
  justify-content: center;
  padding: 14px;
  border-radius: 22px;
  border: 1px solid rgba(94, 253, 255, 0.14);
  background:
    linear-gradient(180deg, rgba(14, 18, 30, 0.96), rgba(7, 10, 18, 0.98)),
    repeating-linear-gradient(
      0deg,
      rgba(255, 255, 255, 0.02) 0,
      rgba(255, 255, 255, 0.02) 1px,
      transparent 1px,
      transparent 30px
    );
  box-shadow:
    inset 0 0 30px rgba(0, 255, 240, 0.04),
    0 0 24px rgba(23, 236, 255, 0.08);
}

.tetris-canvas {
  width: min(100%, 420px);
  aspect-ratio: 1 / 2;
  border-radius: 18px;
  background: transparent;
  box-shadow:
    inset 0 0 26px rgba(92, 255, 255, 0.06),
    0 0 42px rgba(0, 247, 255, 0.1);
}

.tetris-pause-badge {
  position: absolute;
  top: 24px;
  right: 24px;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(10, 16, 26, 0.85);
  color: #9ff8ff;
  font-weight: 700;
  box-shadow: 0 0 18px rgba(0, 238, 255, 0.18);
}

.tetris-side {
  display: grid;
  gap: 12px;
}

.tetris-stat,
.tetris-next,
.tetris-controls {
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(14, 18, 30, 0.9);
  box-shadow: inset 0 0 18px rgba(255, 255, 255, 0.02);
}

.tetris-stat {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.tetris-stat span,
.tetris-next span {
  color: #9ca9be;
  font-size: 13px;
}

.tetris-stat strong {
  color: #ffffff;
  font-size: 24px;
  text-shadow: 0 0 20px rgba(83, 236, 255, 0.24);
}

.tetris-next {
  display: grid;
  gap: 10px;
}

.tetris-next-canvas {
  width: 100%;
  max-width: 120px;
  border-radius: 14px;
  background: rgba(8, 11, 18, 0.92);
  box-shadow: inset 0 0 20px rgba(64, 229, 255, 0.06);
}

.tetris-controls {
  color: #cfd7e4;
  font-size: 13px;
  line-height: 1.55;
}

@keyframes pulseAlert {
  0% {
    background-color: #45423f;
    color: #ffffff;
  }
  50% {
    background-color: #ffffff;
    color: #5a1115;
  }
  100% {
    background-color: #45423f;
    color: #ffffff;
  }
}

@media (max-width: 900px) {
  .tetris-modal-card {
    width: calc(100vw - 20px);
    padding: 14px;
  }

  .tetris-layout {
    grid-template-columns: 1fr;
  }

  .tetris-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tetris-controls {
    grid-column: 1 / -1;
  }

  .tetris-stage-wrap {
    padding: 10px;
  }

  .tetris-pause-badge {
    top: 18px;
    right: 18px;
  }

  .easter-egg-launcher {
    justify-content: center;
  }
}

.who-not-sheet {
  display: grid;
  gap: 16px;
}

.who-not-toolbar {
  display: flex;
  align-items: center;
}

.who-not-form {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
}

.who-not-select {
  min-width: 360px;
}

.who-not-card {
  display: grid;
  gap: 8px;
}

.who-not-subtitle {
  color: #b9d9f7;
  font-weight: 700;
}

.who-not-meta {
  color: #b7aea0;
  font-size: 13px;
}

.who-not-counter {
  color: #ffd84d;
  font-weight: 700;
}

.who-not-table-wrap {
  max-height: calc(100vh - 260px);
  overflow: auto;
}

.who-not-loading {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(20, 18, 17, 0.72);
  backdrop-filter: blur(4px);
}

.who-not-loading-card {
  min-width: 320px;
  max-width: 420px;
  padding: 24px 28px;
  border: 1px solid rgba(176, 213, 242, 0.25);
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(63, 60, 57, 0.96), rgba(48, 45, 42, 0.96));
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.35);
  display: grid;
  justify-items: center;
  gap: 12px;
  text-align: center;
}

.who-not-loading-icon {
  position: relative;
  width: 74px;
  height: 74px;
}

.who-not-loading-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 4px solid rgba(176, 213, 242, 0.18);
  border-top-color: #b0d5f2;
  animation: who-not-spin 1.05s linear infinite;
}

.who-not-loading-dot {
  position: absolute;
  width: 18px;
  height: 18px;
  right: 2px;
  bottom: 8px;
  border-radius: 50%;
  background: #ffd84d;
  box-shadow: 0 0 16px rgba(255, 216, 77, 0.75);
}

.who-not-loading-title {
  color: #f5f1ea;
  font-size: 20px;
  font-weight: 800;
}

.who-not-loading-text {
  color: #c7bfb3;
  font-size: 14px;
}

.who-not-empty {
  text-align: center;
  color: #b7aea0;
  padding: 18px 12px;
}

@keyframes who-not-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (max-width: 900px) {
  .who-not-select {
    min-width: 100%;
    width: 100%;
  }

  .who-not-form {
    width: 100%;
  }

  .who-not-form .primary {
    width: 100%;
  }

  .who-not-table-wrap {
    max-height: none;
  }

  .vehicle-season-toggle {
    grid-template-columns: 1fr;
  }

  .vehicle-equipment-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1800px) {
  .active-dashboard-grid {
    grid-template-columns: 300px 1fr 1fr 320px;
  }

  .active-dashboard-grid > :nth-child(3) {
    grid-column: 3;
    grid-row: span 2;
  }

  .active-dashboard-right-column {
    grid-column: 4;
    grid-row: span 2;
  }
}

@media (max-width: 1400px) {
  .active-dashboard-grid {
    grid-template-columns: repeat(2, minmax(320px, 1fr));
  }

  .active-dashboard-right-column {
    grid-column: auto;
    grid-row: auto;
  }

  .active-dashboard-row--3,
  .active-dashboard-row--4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .active-dashboard-select-form .vehicle-profile-search-wrap,
  .active-dashboard-select-form .report-input {
    width: 100%;
    max-width: 100%;
  }
}

@media (max-width: 900px) {
  .active-dashboard-sheet {
    gap: 12px;
  }

  .active-dashboard-sheet .vehicle-card {
    padding: 12px;
    gap: 10px;
  }

  .active-dashboard-topbar {
    padding: 12px;
  }

  .active-dashboard-select-form {
    display: block;
  }

  .active-dashboard-select-form .vehicle-profile-search-wrap,
  .active-dashboard-select-form .report-input {
    width: 100% !important;
    max-width: 100% !important;
  }

  .active-dashboard-grid {
    grid-template-columns: 1fr !important;
    gap: 12px;
  }

  .active-dashboard-grid > *,
  .active-dashboard-column,
  .active-dashboard-right-column {
    grid-column: auto !important;
    grid-row: auto !important;
    min-width: 0;
  }

  .active-dashboard-scroll {
    max-height: none;
  }

  .active-dashboard-column,
  .active-dashboard-right-column {
    gap: 12px;
  }

  .active-dashboard-expense-form {
    grid-template-columns: 1fr;
  }

  .active-dashboard-expense-inputs {
    grid-template-columns: 1fr;
  }

  .active-dashboard-field {
    padding: 8px 10px;
  }

  .active-dashboard-balance-card {
    padding: 12px 14px;
  }

  .active-dashboard-balance-card .driver-balance-value {
    font-size: 18px;
  }

  .active-dashboard-photo-frame {
    min-height: 180px;
  }

  .active-dashboard-scheme-wrap {
    min-height: 320px;
    padding: 10px;
  }

  .active-dashboard-actions .icon-link-button {
    width: 40px;
    min-width: 40px;
    min-height: 40px;
  }

  .active-dashboard-row--2,
  .active-dashboard-row--3,
  .active-dashboard-row--4 {
    grid-template-columns: 1fr;
  }

  .active-service-row {
    grid-template-columns: 1fr;
  }
}