/* ===== GM Service CRM — оформление (светлая и тёмная тема) ===== */

html[data-theme="light"], :root {
  --crm-bg: linear-gradient(115deg, #e6e2fb 0%, #d3ebf5 45%, #eef6df 100%);
  --crm-card: #ffffff;
  --crm-head: #a9c6e3;
  --crm-head-fg: #0f172a;
  --crm-hover: #f5f9ff;
  --crm-line: #eef2f7;
  --crm-muted: #64748b;
  --crm-side: rgba(255, 255, 255, .88);
  --crm-side-fg: #334155;
  --crm-side-active: #e0ecff;
  --crm-text: #1e293b;
  --crm-input: #ffffff;
  --crm-shadow: 0 2px 10px rgba(30, 64, 175, .07);

  --primary: #2563eb;
  --secondary: #1d4ed8;
  --accent: #22c55e;
  --primary-fg: #fff;
  --body-fg: #1e293b;
  --body-bg: #ffffff;
  --body-quiet-color: #64748b;
  --header-bg: rgba(255, 255, 255, .75);
  --header-color: #1e293b;
  --header-link-color: #1e293b;
  --header-branding-color: #1e293b;
  --breadcrumbs-bg: transparent;
  --breadcrumbs-fg: #64748b;
  --breadcrumbs-link-fg: #2563eb;
  --link-fg: #2563eb;
  --link-hover-color: #1e40af;
  --link-selected-fg: #2563eb;
  --button-bg: #2563eb;
  --button-hover-bg: #1d4ed8;
  --default-button-bg: #2563eb;
  --default-button-hover-bg: #1d4ed8;
  --selected-bg: #e0ecff;
  --selected-row: #eef4ff;
  --hairline-color: #e2e8f0;
  --border-color: #dbe3ee;
  --darkened-bg: #f1f5f9;
}

html[data-theme="dark"] {
  --crm-bg: linear-gradient(115deg, #0b1020 0%, #0f1b2d 50%, #111a17 100%);
  --crm-card: #172033;
  --crm-head: #26354f;
  --crm-head-fg: #e2e8f0;
  --crm-hover: #1e2a42;
  --crm-line: #26324a;
  --crm-muted: #94a3b8;
  --crm-side: rgba(23, 32, 51, .95);
  --crm-side-fg: #cbd5e1;
  --crm-side-active: #1e3a8a;
  --crm-text: #e2e8f0;
  --crm-input: #0f172a;
  --crm-shadow: 0 2px 12px rgba(0, 0, 0, .35);

  --primary: #3b82f6;
  --secondary: #2563eb;
  --primary-fg: #fff;
  --body-fg: #e2e8f0;
  --body-bg: #0f172a;
  --body-quiet-color: #94a3b8;
  --body-loud-color: #fff;
  --header-bg: rgba(15, 23, 42, .85);
  --header-color: #e2e8f0;
  --header-link-color: #e2e8f0;
  --header-branding-color: #e2e8f0;
  --breadcrumbs-bg: transparent;
  --breadcrumbs-fg: #94a3b8;
  --breadcrumbs-link-fg: #60a5fa;
  --link-fg: #60a5fa;
  --link-hover-color: #93c5fd;
  --link-selected-fg: #93c5fd;
  --button-bg: #2563eb;
  --button-hover-bg: #1d4ed8;
  --default-button-bg: #2563eb;
  --default-button-hover-bg: #1d4ed8;
  --selected-bg: #1e3a8a;
  --selected-row: #1e2a42;
  --hairline-color: #26324a;
  --border-color: #334155;
  --darkened-bg: #111827;
  --close-button-bg: #475569;
  --close-button-hover-bg: #64748b;
  --message-success-bg: #064e3b;
  --message-warning-bg: #713f12;
  --message-error-bg: #7f1d1d;
  --error-fg: #fca5a5;
  color-scheme: dark;
}

html, body { min-height: 100%; }
body { background: var(--crm-bg) fixed; color: var(--crm-text); font-size: 15px; }
.theme-toggle { display: none !important; }

/* ---- Шапка ---- */
#header { backdrop-filter: blur(8px); border-bottom: 1px solid var(--hairline-color); padding: 10px 24px; }
#site-name a { font-weight: 700; font-size: 18px; }
#user-tools { font-size: 13px; text-transform: none; letter-spacing: 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
#user-tools a { border: 0; }
#logout-form button { text-transform: none; font-size: 13px; }
.crm-lang { display: inline-flex; gap: 0; border: 1px solid var(--border-color); border-radius: 8px; overflow: hidden; margin: 0; }
.crm-lang button { background: transparent; border: 0; padding: 4px 10px; cursor: pointer; color: var(--header-color); font-size: 12px; font-weight: 600; }
.crm-lang button.active { background: var(--primary); color: #fff; }
.crm-theme { background: transparent; border: 1px solid var(--border-color); border-radius: 8px; padding: 3px 8px; cursor: pointer; font-size: 14px; }
html[data-theme="dark"] .crm-theme-light, html:not([data-theme="dark"]) .crm-theme-dark { display: none; }
div.breadcrumbs { padding: 10px 24px 0; border: 0; }

/* ---- Боковое меню ---- */
#nav-sidebar {
  background: var(--crm-side); border-right: 0; border-radius: 0 16px 16px 0; box-shadow: var(--crm-shadow);
  padding: 16px 0;
}
#nav-filter { display: none !important; }
.crm-menu, .crm-menu ul { list-style: none; margin: 0; padding: 0; }
.crm-menu li { list-style: none; padding: 0; margin: 0; }
.crm-menu li a, .crm-group summary {
  display: flex; align-items: center; gap: 10px; padding: 10px 14px; margin: 2px 10px; border-radius: 12px;
  font-size: 15.5px; font-weight: 500; color: var(--crm-side-fg); text-decoration: none; cursor: pointer;
}
.crm-menu li a:hover, .crm-group summary:hover { background: var(--crm-hover); color: var(--primary); }
.crm-menu li.current-model > a { background: var(--crm-side-active); color: var(--link-fg); font-weight: 700; }
.crm-menu-group { margin-top: 10px !important; border-top: 1px solid var(--crm-line); padding-top: 8px !important; }
.crm-group summary { list-style: none; }
.crm-group summary::-webkit-details-marker { display: none; }
.crm-group summary::after { content: "▸"; margin-left: auto; transition: transform .2s; font-size: 12px; opacity: .6; }
.crm-group[open] summary::after { transform: rotate(90deg); }
.crm-group ul li a { font-size: 14.5px; padding: 8px 12px 8px 22px; }
.crm-ico { width: 22px; text-align: center; }


/* кнопка «показать/скрыть меню» */
.toggle-nav-sidebar {
  position: sticky; top: 12px; z-index: 30; flex: 0 0 48px; width: 48px; height: 48px; margin: 12px 8px 0 10px;
  border-radius: 14px; border: 0; background: var(--primary); color: #fff; cursor: pointer;
  box-shadow: 0 4px 14px rgba(37, 99, 235, .35); display: flex; align-items: center; justify-content: center;
  transition: transform .15s, background .15s;
}
.toggle-nav-sidebar:hover { background: var(--secondary); transform: scale(1.06); }
.toggle-nav-sidebar::before { content: none !important; }
.crm-burger { display: flex; flex-direction: column; gap: 4px; width: 20px; }
.crm-burger i { display: block; height: 2.5px; border-radius: 2px; background: #fff; transition: transform .2s, opacity .2s; }
.main.shifted .crm-burger i:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.main.shifted .crm-burger i:nth-child(2) { opacity: 0; }
.main.shifted .crm-burger i:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* ---- Контент ---- */
#content { padding: 16px 24px; }
#content h1 { font-size: 26px; font-weight: 700; color: var(--crm-text); }
.module, .inline-group, fieldset.module { background: var(--crm-card); border-radius: 14px; box-shadow: var(--crm-shadow); border: 0; }
.module h2, .module caption, .inline-group h2, fieldset.module h2 {
  background: var(--crm-head); color: var(--crm-head-fg); font-weight: 700; font-size: 14px; padding: 10px 14px; text-transform: none;
}
fieldset.module > h2, .inline-group > h2 { border-radius: 14px 14px 0 0; }
.form-row { border-bottom-color: var(--crm-line); }
input[type=text], input[type=number], input[type=email], input[type=password], input[type=tel], textarea, select {
  background: var(--crm-input); color: var(--crm-text); border-color: var(--border-color);
}
.readonly { color: var(--crm-text); }

/* ---- Таблицы списков ---- */
#changelist .results { background: var(--crm-card); border-radius: 14px; box-shadow: var(--crm-shadow); overflow-x: auto; }
#changelist-form .results table, #result_list { width: 100%; }
#result_list thead th { background: var(--crm-head); color: var(--crm-head-fg); font-size: 14.5px; font-weight: 700; padding: 11px 10px; border: 0; text-transform: none; }
#result_list thead th a, #result_list thead th .text span { color: var(--crm-head-fg); }
#result_list tbody td, #result_list tbody th {
  padding: 11px 10px; vertical-align: middle; font-size: 14.5px; border-bottom: 1px solid var(--crm-line);
  white-space: normal; overflow-wrap: normal; height: auto;
}
#result_list tbody tr { background: var(--crm-card); }
#result_list tbody tr:hover { background: var(--crm-hover); }
#result_list tbody th a, #result_list td.field-code_col a { font-weight: 700; font-size: 15.5px; color: var(--link-fg); }
#result_list td.field-complaint_col { min-width: 140px; }
#result_list td.field-code_col, #result_list th.field-code_col, .crm-2l small { white-space: nowrap; }
/* заблокированные (уже созданные) авто — как обычный текст */
.inline-related input:disabled, .inline-related select:disabled, .inline-related textarea:disabled {
  background: transparent !important; border-color: transparent !important; color: var(--crm-text); opacity: 1; box-shadow: none;
}
.crm-money { white-space: nowrap; }
.crm-debt { color: #dc2626 !important; font-weight: 700; }
.crm-2l { display: block; text-decoration: none; }
.crm-2l b { display: block; font-weight: 600; color: var(--crm-text); }
.crm-2l small { display: block; color: var(--crm-muted); font-size: 12.5px; }
a.crm-2l:hover b { color: var(--link-fg); }

/* ---- Бейджи ---- */
.crm-badge { display: inline-block; padding: 4px 11px; border-radius: 6px; color: #fff; font-weight: 600; font-size: 13.5px; white-space: nowrap; }
.crm-badge--blue { background: #3b82f6; } .crm-badge--orange { background: #f59e0b; }
.crm-badge--yellow { background: #d9a406; } .crm-badge--violet { background: #8b5cf6; }
.crm-badge--green { background: #22c55e; } .crm-badge--gray { background: #94a3b8; }
.crm-badge--red { background: #ef4444; }

/* ---- Кнопки ---- */
.object-tools a, .crm-btn {
  border-radius: 10px !important; padding: 9px 16px !important; font-weight: 600; background: var(--primary);
  color: #fff !important; text-transform: none !important; font-size: 14px; display: inline-block; text-decoration: none;
}
.object-tools a.addlink, .crm-btn--green { background: #22c55e !important; }
.object-tools a.addlink:hover, .crm-btn--green:hover { background: #16a34a !important; }
.object-tools a:hover, .crm-btn:hover { background: var(--secondary); }
input[type=submit], .button, button.button { border-radius: 10px; text-transform: none; }
.submit-row { background: var(--crm-card); border-radius: 14px; box-shadow: var(--crm-shadow); border: 0; }

/* ---- Поиск и фильтр ---- */
#toolbar { background: transparent; border: 0; padding: 0 0 12px; }
#toolbar form input[type="text"], #searchbar { border-radius: 12px; padding: 9px 14px; min-width: 260px; font-size: 15px; }
#changelist-filter { background: var(--crm-card); border-radius: 14px; box-shadow: var(--crm-shadow); border: 0; }
#changelist-filter h2 { background: var(--crm-head); color: var(--crm-head-fg); border-radius: 14px 14px 0 0; }
#changelist.crm-filter-hidden #changelist-filter { display: none; }
.crm-filter-toggle {
  margin-left: 10px; border: 1px solid var(--border-color); background: var(--crm-card); color: var(--link-fg);
  border-radius: 10px; padding: 8px 14px; font-weight: 600; cursor: pointer; font-size: 14px;
}
.crm-filter-toggle:hover { background: var(--crm-hover); }
.paginator { background: transparent; border: 0; font-size: 15px; }

/* ---- История клиента / авто ---- */
.field-history .readonly, .field-history > div { width: 100%; }
.crm-history { width: 100%; }
.crm-history table { width: 100%; border-collapse: collapse; margin: 6px 0 14px; }
.crm-history th { background: var(--crm-head); color: var(--crm-head-fg); text-align: left; padding: 7px 8px; font-size: 13px; }
.crm-history td { padding: 8px; border-bottom: 1px solid var(--crm-line); vertical-align: top; font-size: 13.5px; }
.crm-history td.nw { white-space: nowrap; }
.crm-history .muted, .muted { color: var(--crm-muted); }
.crm-history-sum { font-size: 14px; margin: 4px 0; }
.field-history label { display: none; }
.field-history .readonly { margin-left: 0 !important; }

/* ---- Поиск авто ---- */
.crm-lookup-btn { margin-left: 6px; border: 0; background: #2563eb; color: #fff; border-radius: 8px; padding: 6px 10px; cursor: pointer; font-size: 13px; vertical-align: middle; }
.crm-lookup-btn:hover { background: #1d4ed8; }
.crm-lookup-msg { display: block; font-size: 12px; margin-top: 4px; color: var(--crm-muted); }
.crm-lookup-msg.err { color: #dc2626; }
.crm-lookup-msg.ok { color: #059669; }
input.crm-filled { background: #ecfdf5 !important; transition: background .6s; }

/* ---- Календарь ---- */
.crm-cal-top { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 6px; }
.crm-cal-top h1 { margin: 0 !important; }
.crm-cal-posts { display: flex; gap: 6px; flex-wrap: wrap; flex: 1; }
.crm-chip { border: 1px solid var(--border-color); background: var(--crm-card); color: var(--crm-text); border-radius: 20px; padding: 6px 12px; cursor: pointer; font-size: 13px; display: inline-flex; align-items: center; gap: 6px; }
.crm-chip i { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.crm-chip.active { background: #2563eb; color: #fff; border-color: #2563eb; }
.crm-hint { color: var(--crm-muted); font-size: 13px; margin: 4px 0 10px; }
#crm-cal-box { background: var(--crm-card); border-radius: 14px; box-shadow: var(--crm-shadow); padding: 14px; color: var(--crm-text); }
#crm-cal-box .fc-button-primary { background: #2563eb; border-color: #2563eb; }
#crm-cal-box .fc-button-primary.fc-button-active, #crm-cal-box .fc-button-primary:hover { background: #1d4ed8; border-color: #1d4ed8; }
#crm-cal-box .fc-event { cursor: pointer; font-size: 12px; }
html[data-theme="dark"] #crm-cal-box { --fc-border-color: #26324a; --fc-page-bg-color: #172033; --fc-neutral-bg-color: #1e2a42; --fc-list-event-hover-bg-color: #1e2a42; --fc-today-bg-color: rgba(59,130,246,.12); }
html[data-theme="dark"] #crm-cal-box a { color: var(--crm-text); }

@media (max-width: 767px) {
  #content { padding: 10px; }
  #toolbar form input[type="text"], #searchbar { min-width: 0; width: 100%; }
}

/* ---- Вкладки «Список | Календарь» ---- */
.crm-tabs { display: flex; gap: 6px; margin: 0 0 14px; flex-wrap: wrap; }
.crm-tabs a {
  padding: 10px 18px; border-radius: 12px; background: var(--crm-card); color: var(--crm-text); font-weight: 700;
  font-size: 18px; text-decoration: none; box-shadow: var(--crm-shadow);
}
.crm-tabs a.active { background: var(--primary); color: #fff; }
.crm-tabs a:hover:not(.active) { color: var(--primary); }

/* ---- Плитки сумм ---- */
.crm-tiles { display: flex; gap: 12px; flex-wrap: wrap; margin: 4px 0 18px; }
.crm-tile {
  min-width: 150px; padding: 10px 14px; border-radius: 14px; color: #fff; box-shadow: var(--crm-shadow);
  display: flex; flex-direction: column; gap: 6px;
}
.crm-tile span { font-weight: 700; font-size: 15px; }
.crm-tile b { background: #fff; color: #0f172a; border-radius: 10px; padding: 8px 12px; font-size: 20px; text-align: center; white-space: nowrap; }
.crm-tile small { font-size: 12px; opacity: .9; }
.crm-tile--paid { background: #f5b82e; }
.crm-tile--total { background: #7cc0ee; }
.crm-tile--due { background: #34c77b; }
.crm-tile--mini { background: var(--crm-card); color: var(--crm-muted); min-width: 120px; }
.crm-tile--mini b { background: var(--crm-hover); color: var(--crm-text); font-size: 16px; }
html[data-theme="dark"] .crm-tile b { background: #0f172a; color: #f1f5f9; }

/* ---- Карточка заказа: заголовок и правая колонка ---- */
.crm-order-title { display: flex; align-items: center; gap: 12px; }
.crm-order-title > span:first-child { color: var(--link-fg); text-decoration: underline; text-underline-offset: 4px; }
#content.colMS { margin-right: 330px; }
#content.colMS #content-main { margin-right: 0; width: 100%; }
#content-related.crm-side { width: 300px; margin-right: -320px; background: transparent; box-shadow: none; padding: 0; }
.inline-group .tabular { overflow-x: auto; }
.inline-group .tabular table { width: 100%; }
.crm-parts input[type=text], .crm-parts input[type=number] { max-width: 8em; }
.crm-parts td.field-name input { max-width: 13em; }
.crm-card {
  background: var(--crm-card); border-radius: 16px; box-shadow: var(--crm-shadow); padding: 14px 16px; margin-bottom: 12px;
  border-left: 5px solid #7cc0ee;
}
.crm-card h3 { margin: 0 0 8px; font-size: 16px; text-align: center; color: var(--crm-text); text-transform: none; background: none; padding: 0; }
.crm-card p { margin: 4px 0; font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
.crm-copy { border: 1px solid var(--border-color); background: transparent; border-radius: 6px; cursor: pointer; font-size: 12px; padding: 0 5px; color: var(--crm-muted); }
.crm-vin { font-family: ui-monospace, Menlo, monospace; }

/* ---- Строки работ и запчастей ---- */
.inline-group .tabular td { vertical-align: middle; }
.inline-group .tabular td.field-code_col, .inline-group .tabular td.field-sum_col { white-space: nowrap; font-weight: 600; }
.crm-mode { max-width: 9em; }
tr.crm-src-stock td.field-name input, tr.crm-src-stock td.field-cost_price input { opacity: .35; }
tr.crm-src-purchase td.field-product .related-widget-wrapper { opacity: 1; }
td.field-supply select { max-width: 9em; }

/* ---- Период в кассе ---- */
.crm-period { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 6px 0 14px; }
.crm-period label { font-weight: 600; }
.crm-period input[type=date] { border-radius: 10px; padding: 7px 10px; border: 1px solid var(--border-color); background: var(--crm-input); color: var(--crm-text); }
.crm-period .crm-btn { padding: 7px 14px !important; border: 0; cursor: pointer; }
.crm-period a.crm-chip { text-decoration: none; }

/* ---- Легенда календаря ---- */
.crm-cal-legend { display: flex; gap: 12px; font-size: 13px; color: var(--crm-muted); }
.crm-cal-legend i { width: 10px; height: 10px; border-radius: 50%; display: inline-block; margin-right: 5px; }

/* ---- Поля «Дополнительная информация» ---- */
.field-complaint textarea, .field-task textarea, .field-note textarea, .field-recommendations textarea {
  height: 2.9em; min-height: 2.9em; width: 100%; max-width: 22em; resize: vertical; font-size: 14px; padding: 5px 8px;
}

@media (max-width: 1100px) {
  #content.colMS { margin-right: 24px; }
  #content-related.crm-side { width: auto; margin-right: 0; float: none; }
}

/* ===== v5: свёрнутое меню = полоса иконок ===== */
.main > #nav-sidebar {
  visibility: visible; margin-left: 0; left: 0; flex: 0 0 64px; width: 64px; overflow: hidden auto;
  transition: flex-basis .18s, width .18s;
}
.main.shifted > #nav-sidebar { flex: 0 0 250px; width: 250px; }
.crm-ico { flex: 0 0 24px; width: 24px; text-align: center; font-size: 18px; line-height: 1; }
.crm-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.main:not(.shifted) .crm-label, .main:not(.shifted) .crm-group summary::after { display: none; }
.main:not(.shifted) .crm-menu li a, .main:not(.shifted) .crm-group summary { justify-content: center; padding: 10px 0; margin: 3px 8px; gap: 0; }
.main:not(.shifted) .crm-group ul { display: none; }
.main:not(.shifted) .crm-menu-group { border-top: 1px solid var(--crm-line); }
.crm-group ul li a { padding-left: 18px; }

/* ===== страница не «плавает» по горизонтали — прокручиваются только таблицы ===== */
html, body { overflow-x: clip; }
#container, #container > .main { min-width: 0; max-width: 100vw; }
.main > .content, #content { min-width: 0; flex: 1 1 0; }
#changelist, #changelist-form, .inline-group { max-width: 100%; }
#changelist .results, .inline-group .tabular { overflow-x: auto; }

/* ===== шапка заказа ===== */
.crm-order-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.crm-order-head h1 { margin: 0 !important; }
.crm-code { color: var(--link-fg); }
.crm-head-actions { display: flex; align-items: center; gap: 6px; }
.crm-head-label { font-weight: 600; color: var(--crm-muted); margin-right: 2px; }
.crm-head-actions .crm-btn { padding: 7px 14px !important; min-width: 44px; text-align: center; }

/* ===== оплаты по заказу ===== */
.crm-payments table { width: 100%; }
.crm-payments td { vertical-align: middle !important; }
.crm-payments td.field-pay_date_link { white-space: nowrap; min-width: 8em; }
.crm-payments select { max-width: 11em; }
.crm-payments td.field-article select { max-width: 14em; }
.crm-payments .help, .crm-payments .timezonewarning { display: none; }

/* ===== экраны до 1400 px (MacBook): меню поверх страницы, карточки заказа — над формой ===== */
@media (max-width: 1399px) {
  .main.shifted > #nav-sidebar { flex: 0 0 64px; width: 64px; overflow: visible; z-index: 60; }
  .main.shifted .crm-menu {
    width: 250px; background: var(--crm-side); border-radius: 0 16px 16px 0; padding: 8px 0;
    box-shadow: 0 12px 40px rgba(15, 23, 42, .25); position: relative;
  }
  #content.colMS { margin-right: 24px; display: flex; flex-direction: column; }
  #content.colMS > * { order: 3; }
  #content.colMS > .crm-order-head, #content.colMS > div:first-child { order: 0; }
  #content.colMS > #content-related { order: 1; }
  #content.colMS > #content-main { order: 2; }
  #content-related.crm-side {
    float: none; width: auto; margin: 0 0 12px; display: grid; gap: 10px;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  }
  #content-related.crm-side .crm-card { margin: 0; }
}

/* ===== компактные таблицы работ и запчастей ===== */
.crm-parts td, .crm-works td { padding: 6px 5px !important; }
.crm-parts th, .crm-works th { padding: 6px 5px !important; font-size: 11.5px; }
.crm-parts td.field-source select { width: 7.2em; }
.crm-parts td.field-product .select2-container { width: 12em !important; }
.crm-parts td.field-name input { width: 8.5em; }
.crm-parts td.field-sku input { width: 5em; }
.crm-parts td.field-mode select { width: 6.8em; }
.crm-parts td.field-amount input { width: 4.5em; }
.crm-parts td.field-cost_price input, .crm-parts td.field-price input { width: 5.2em; }
.crm-parts td.field-supply select { width: 7em; }
.crm-works td.field-service .select2-container { width: 24em !important; max-width: 100%; }
.crm-works td.field-qty input, .crm-works td.field-hours input, .crm-works td.field-price input { width: 5em; }
.related-widget-wrapper { flex-wrap: nowrap; }
.inline-group .tabular td.original p { display: none; }

/* список: итого/долг в одной колонке, строка действий по ширине */
#changelist .actions { box-sizing: border-box; max-width: 100%; }
.crm-sum b { display: block; white-space: nowrap; }
.crm-sum small { display: block; white-space: nowrap; font-size: 12.5px; color: var(--crm-muted); }
.crm-sum small.crm-debt { color: #dc2626; font-weight: 700; }

/* ===== точные ширины колонок (экран 1210 px) ===== */
.crm-parts th, .crm-payments th, .crm-works th { white-space: normal !important; line-height: 1.2; vertical-align: bottom; }
.crm-parts td.field-source select { width: 6.6em !important; }
.crm-parts td.field-product .select2-container { width: 10.5em !important; }
.crm-parts td.field-name input { width: 7.5em !important; }
.crm-parts td.field-sku input { width: 4.6em !important; }
.crm-parts td.field-mode select { width: 6.2em !important; }
.crm-parts td.field-amount input { width: 3.8em !important; }
.crm-parts td.field-cost_price input, .crm-parts td.field-price input { width: 4.7em !important; }
.crm-parts td.field-supply select { width: 6.4em !important; }
.crm-parts td.field-sum_col { min-width: 4.5em; }
.crm-payments td.field-pay_date_link { min-width: 8em; }
.crm-payments td.field-article select { width: 11em !important; }
.crm-payments td.field-method select, .crm-payments td.field-kind select { width: 7em !important; }
.crm-payments td.field-amount input { width: 5.5em !important; }
.crm-payments td.field-comment textarea { width: 11em !important; min-height: 1.8em; box-sizing: border-box; }
.inline-group .tabular td.delete, .inline-group .tabular th:last-child { width: 1%; }
.crm-parts td.field-product .select2-container { width: 9.8em !important; }
.crm-parts td.field-name input { width: 7em !important; }
.crm-parts thead th:last-child, .crm-works thead th:last-child { font-size: 0 !important; }
.crm-parts thead th:last-child::after, .crm-works thead th:last-child::after { content: "✕"; font-size: 12px; }
.main > #nav-sidebar + .content, .main.shifted > #nav-sidebar + .content { max-width: none; }
@media (min-width: 1400px) { .main.shifted > #nav-sidebar + .content { max-width: calc(100% - 330px); } }
@media (max-width: 1399px) { .main.shifted .crm-menu { background: #ffffff; } html[data-theme="dark"] .main.shifted .crm-menu { background: #172033; } }


/* ===== Финальная компоновка CRM ===== */
/* Бургер всегда над вертикальной колонкой иконок. */
.main { position: relative; min-height: calc(100vh - 60px); }
.main > #toggle-nav-sidebar {
  position: absolute !important;
  left: 8px; top: 10px; margin: 0 !important;
}
.main > #nav-sidebar {
  position: absolute !important;
  left: 0; top: 70px;
  width: 64px !important; min-width: 64px !important;
  height: calc(100vh - 82px);
  padding-top: 8px;
}
.main.shifted > #nav-sidebar { width: 250px !important; min-width: 250px !important; }
.main > .content { margin-left: 64px !important; width: calc(100% - 64px); }
.main.shifted > .content { margin-left: 250px !important; width: calc(100% - 250px); }

/* ===== строки формы: подпись рядом с полем, всё в одну линию ===== */
.form-multiline { flex-wrap: wrap; gap: 0 16px; align-items: flex-start; }
.form-multiline > div { padding-bottom: 6px; }
.form-multiline > div + div .fieldBox > label {
  width: auto; min-width: 0; padding: 0 8px 0 0; white-space: nowrap;
}
fieldset .fieldBox { margin-right: 0; align-items: center; }
.aligned .fieldBox label, .aligned .form-row label { padding-top: 0; }
.aligned .form-row > div > .flex-container:not(.fieldBox) { align-items: center; }
fieldset.module .form-row { min-height: 0; padding: 9px 12px; }
fieldset.module .form-row > div { min-width: 0; }
fieldset.module .description { margin-left: 0; }
.form-row input, .form-row select { max-width: 100%; }

/* дата, время, госномер, пробег — компактные поля */
input.vDateField { width: 7.4em; }
input[type="time"] { width: 6.6em; padding: 5px 7px; }
#order_form .field-mileage input { width: 7em; }
#order_form .field-master select, #order_form .field-executor select { min-width: 9.5em; }
#order_form .field-client .select2-container, #order_form .field-car .select2-container { width: 17.5em !important; }
#order_form .field-status select { min-width: 9.5em; }
.timezonewarning, .form-row .help ~ .timezonewarning { display: none !important; }

/* Работа: только услуга / количество / цена / сумма. */
.crm-works .tabular table { table-layout: auto; }
.crm-works td.field-service { min-width: 230px; }
.crm-works td.field-service .select2-container { width: 20em !important; max-width: 100%; }
.crm-works td.field-note input { width: 100%; min-width: 9em; }
.crm-works td.field-qty { width: 80px; }
.crm-works td.field-price { width: 100px; }
.crm-works td.field-sum_col { width: 120px; white-space: nowrap; font-weight: 700; }
.crm-works input[name$="-qty"] { width: 5em !important; }
.crm-works input[name$="-price"] { width: 7em !important; }
.crm-live-sum { white-space: nowrap; font-weight: 700; }

/* Период кассы: «с» и «по» компактно рядом. */
.crm-period { align-items: center; gap: 8px; }
.crm-period label { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.crm-period input[type=date] { width: 10.5em; }

@media (max-width: 899px) {
  .main > .content, .main.shifted > .content { margin-left: 64px !important; width: calc(100% - 64px); }
}

p.datetime { display: flex; align-items: center; gap: 7px; flex-wrap: nowrap; margin: 0; line-height: 1; white-space: nowrap; }
p.datetime br { display: none; }
p.datetime .datetimeshortcuts { white-space: nowrap; margin-right: 8px; }
p.datetime input { margin: 0; }

/* колонка «Товар / название»: склад — список, покупка — свободный ввод */
.crm-parts th.column-name, .crm-parts td.field-name { display: none; }
tr.crm-src-purchase td.field-product .related-widget-wrapper { display: none; }
tr.crm-src-stock td.field-product .crm-namebox { display: none; }
tr.crm-src-stock td.field-cost_price input { visibility: hidden; }
.crm-parts td.field-product { min-width: 13em; }
.crm-parts td.field-product .crm-namebox input { width: 12.5em !important; max-width: none !important; }
.crm-parts td.field-product .select2-container { width: 12.5em !important; }

.form-row.field-appt_day .datetimeshortcuts, p.datetime .datetimeshortcuts { font-size: 12px; }
.crm-works td.field-qty input { text-align: center; }

/* ===== календарь: запись видна целиком ===== */
#crm-cal-box .fc-timegrid-slot { height: 2.4em; }
#crm-cal-box .fc-timegrid-event .fc-event-main { padding: 3px 5px; font-size: 14px; font-weight: 700; line-height: 1.2; }
#crm-cal-box .fc-timegrid-event.crm-event-compact .fc-event-main { font-size: 11px; font-weight: 500; line-height: 1.25; }
#crm-cal-box .fc-timegrid-event .fc-event-time { font-weight: 600; display: block; }
#crm-cal-box .fc-timegrid-event .fc-event-title {
  white-space: normal; overflow-wrap: anywhere;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
#crm-cal-box .fc-timegrid-event:hover .fc-event-title { -webkit-line-clamp: 6; }
#crm-cal-box .fc-timegrid-event .fc-event-main { overflow: hidden; }
#crm-cal-box .fc-timegrid-event-harness { z-index: 2; }
#crm-cal-box .fc-timegrid-event:hover { z-index: 10; }
#crm-cal-box .fc-event { border-radius: 8px; box-shadow: 0 1px 4px rgba(15, 23, 42, .18); }
#crm-cal-box .fc-daygrid-event, #crm-cal-box .fc-list-event { white-space: normal; }

.crm-payments td.field-user select { max-width: 9em; }
#cashoperation_form .field-user select { min-width: 10em; }

/* касса: статья и номер заказа в одной колонке */
#result_list td.field-article_col .crm-2l a { font-size: 13px; font-weight: 600; white-space: nowrap; }

/* строка запчасти: поставщик и «не учитывать» */
.crm-parts td.field-supplier select { width: 8.2em !important; }
.crm-parts td.field-ignored { text-align: center; }
.crm-parts th.column-ignored { white-space: normal; }
tr.crm-ignored td.field-product, tr.crm-ignored td.field-price, tr.crm-ignored td.field-amount,
tr.crm-ignored td.field-sum_col { opacity: .45; text-decoration: line-through; }

/* ===== учёт 1/1 ===== */
.crm-partners { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); align-items: start; }
.crm-partners .crm-card { border-left: 5px solid var(--primary); }
.crm-partner-table { width: 100%; border-collapse: collapse; }
.crm-partner-table th { background: var(--crm-head); color: var(--crm-head-fg); text-align: left; padding: 7px 8px; font-size: 12.5px; }
.crm-partner-table td { padding: 7px 8px; border-bottom: 1px solid var(--crm-line); font-size: 13.5px; vertical-align: top; }
.crm-partner-table td.nw { white-space: nowrap; }
.crm-tile--total small, .crm-tile--paid small, .crm-tile--due small { opacity: .95; }
.crm-parts td.field-product .related-widget-wrapper { display: flex; align-items: center; gap: 4px; flex-wrap: nowrap; }
.crm-parts td.field-product { min-width: 15em; }
.crm-parts td.field-product .select2-container { width: 11.5em !important; }
.crm-parts td.field-product .crm-namebox input { width: 11.5em !important; }
.crm-parts th.column-supply, .crm-parts th.column-supplier { white-space: normal; }
.crm-parts td.field-product { min-width: 14em; }
.crm-parts td.field-product .select2-container { width: 10.5em !important; }
.crm-parts td.field-product .crm-namebox input { width: 10.5em !important; }
.crm-parts td.field-sku input { width: 4.2em !important; }
.crm-parts td.field-supplier select { width: 7.4em !important; }
.crm-parts td.field-supply select { width: 6.6em !important; }
.crm-parts td.field-cost_price input, .crm-parts td.field-price input { width: 4.4em !important; }

/* ===== Мобильные телефоны ===== */
@media (max-width: 767px) {
  /* Боковое меню (разделы админки): у Django ниже 767px встроенное
     правило прячет и бургер, и само меню целиком — расчёт на хлебные
     крошки, а у нас они намеренно скрыты (своя навигация сверху).
     В итоге на телефоне нельзя было попасть никуда, кроме Заказов и
     Календаря. Возвращаем бургер и делаем меню выезжающей панелью
     на весь экран (а не узкой полоской иконок поверх контента). */
  /* position:fixed у обоих — единая система координат «от экрана», а не
     «от .main»: иначе более старые правила для .main.shifted > #nav-sidebar
     (там выше специфичность селектора — два класса против одного) перебивают
     ширину/z-index даже через !important, и получается мешанина чисел. */
  #toggle-nav-sidebar, #nav-sidebar { display: flex !important; }
  .main > #toggle-nav-sidebar, .main.shifted > #toggle-nav-sidebar {
    position: fixed !important; left: 12px !important; top: 12px !important; z-index: 90 !important;
  }
  .main > #nav-sidebar, .main.shifted > #nav-sidebar {
    position: fixed !important; left: 0 !important; top: 0 !important; bottom: 0 !important;
    height: 100vh !important; padding-top: 72px !important;
    width: 86vw !important; min-width: 0 !important; max-width: 320px !important;
    transform: translateX(-100%); transition: transform .22s ease; z-index: 85 !important;
    background: var(--crm-card) !important; opacity: 1 !important;
  }
  .main.shifted > #nav-sidebar { transform: translateX(0) !important; }
  .main > .content, .main.shifted > .content { margin-left: 0 !important; width: 100% !important; }
  /* затемнение страницы, пока меню выехало (клик по нему уже закрывает меню — см. crm.js) */
  .main.shifted::after {
    content: ""; position: fixed; inset: 0; background: rgba(15, 23, 42, .45); z-index: 80;
    pointer-events: none; /* иначе перехватывает клики по самому меню поверх себя */
  }
  /* место под бургер, чтобы он не наезжал на первую кнопку/заголовок страницы */
  #content { padding-top: 70px !important; }

  /* Тулбар календаря (prev/next/today | заголовок | День/Неделя/Месяц/Список)
     у FullCalendar не переносится сам и выталкивал всю страницу вбок — переносим. */
  #crm-cal-box .fc-header-toolbar { flex-wrap: wrap; row-gap: 8px; justify-content: center; }
  #crm-cal-box .fc-toolbar-chunk { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; max-width: 100%; }
  #crm-cal-box .fc-toolbar-title { font-size: 17px; text-align: center; }
  #crm-cal-box .fc-button { padding: 6px 9px; font-size: 12.5px; }

  /* Списки в админке (заказы, клиенты, авто, …): вместо невидимого
     горизонтального скролла таблицы, где крайние колонки обрезаны за
     краем экрана — каждая строка становится карточкой с подписанными
     полями (подписи берутся из шапки таблицы через crm.js). */
  #changelist .results { overflow-x: visible; }
  /* первая колонка (обычно «код»/«название») Django рисует как <th>, а не <td> — стилизуем оба */
  #result_list, #result_list tbody, #result_list tr, #result_list td, #result_list th {
    display: block; width: 100% !important; box-sizing: border-box; text-align: left;
  }
  #result_list thead { display: none; }
  #result_list tbody tr {
    border: 1px solid var(--crm-line); border-radius: 12px; padding: 10px 12px; margin-bottom: 10px;
    background: var(--crm-card); box-shadow: var(--crm-shadow);
  }
  #result_list td, #result_list th {
    padding: 5px 0 !important; border: 0 !important; border-bottom: 1px dashed var(--crm-line) !important;
    white-space: normal !important; font-weight: normal;
  }
  #result_list td:last-child, #result_list th:last-child { border-bottom: 0 !important; }
  #result_list td::before, #result_list th::before {
    content: attr(data-label); display: block; font-weight: 600; color: var(--crm-muted); font-size: 11px; margin-bottom: 2px;
  }
  #result_list td.action-checkbox { border-bottom: 0 !important; padding-bottom: 8px !important; }
  #result_list td.action-checkbox::before { content: none; }

  /* Таблицы «Работы / Запчасти / Оплаты»: та же проблема и то же решение
     внутри карточки заказа — каждая строка становится карточкой с
     подписанными полями. */
  .inline-group .tabular { overflow-x: visible; }
  .crm-works table, .crm-parts table, .crm-payments table,
  .crm-works tbody, .crm-parts tbody, .crm-payments tbody,
  .crm-works tr, .crm-parts tr, .crm-payments tr,
  .crm-works td, .crm-parts td, .crm-payments td {
    display: block; width: 100% !important; max-width: 100% !important; min-width: 0 !important;
  }
  .crm-works thead, .crm-parts thead, .crm-payments thead { display: none; }
  .crm-works tr, .crm-parts tr, .crm-payments tr {
    border: 1px solid var(--crm-line); border-radius: 12px; padding: 8px 10px; margin-bottom: 10px;
    background: var(--crm-card); box-shadow: var(--crm-shadow);
  }
  /* Подпись — отдельной строкой сверху, поле — на всю ширину снизу
     (в ряд с подписью оно не умещается: select2/инпуты держат
     собственную «желаемую» ширину и вылезают за карточку). */
  .crm-works td, .crm-parts td, .crm-payments td {
    display: block !important; box-sizing: border-box;
    padding: 6px 2px !important; border: 0 !important; border-bottom: 1px dashed var(--crm-line) !important;
  }
  .crm-works td:last-child, .crm-parts td:last-child, .crm-payments td:last-child {
    border-bottom: 0 !important;
  }
  .crm-works td.original, .crm-parts td.original, .crm-payments td.original { display: none !important; }
  .crm-works td input, .crm-works td select,
  .crm-parts td input, .crm-parts td select,
  .crm-payments td input, .crm-payments td select {
    display: block; box-sizing: border-box; width: 100% !important; max-width: 100% !important;
  }
  .crm-works td .select2-container, .crm-parts td .select2-container, .crm-payments td .select2-container,
  .crm-works td .related-widget-wrapper, .crm-parts td .related-widget-wrapper, .crm-payments td .related-widget-wrapper {
    display: block !important; box-sizing: border-box; width: 100% !important; max-width: 100% !important;
  }
  .crm-works td .related-widget-wrapper .select2-container,
  .crm-parts td .related-widget-wrapper .select2-container,
  .crm-payments td .related-widget-wrapper .select2-container {
    width: calc(100% - 34px) !important; display: inline-block; vertical-align: middle;
  }
  .crm-works td .related-widget-wrapper-link, .crm-parts td .related-widget-wrapper-link, .crm-payments td .related-widget-wrapper-link {
    display: inline-block; vertical-align: middle; margin-left: 4px;
  }
  .crm-works td .crm-namebox, .crm-parts td .crm-namebox, .crm-payments td .crm-namebox { width: 100% !important; }
  .crm-works td::before, .crm-parts td::before, .crm-payments td::before {
    content: attr(data-label); display: block; font-weight: 600; color: var(--crm-muted); font-size: 12px; margin-bottom: 3px;
  }
  .crm-works td.delete, .crm-parts td.delete, .crm-payments td.delete {
    display: flex !important; align-items: center; justify-content: space-between;
  }
  .crm-works td.delete::before, .crm-parts td.delete::before, .crm-payments td.delete::before { margin-bottom: 0; }

  /* Подписи колонок (т.к. шапка таблицы скрыта) */
  .crm-works td.field-service::before { content: "Услуга"; }
  .crm-works td.field-note::before { content: "Примечание"; }
  .crm-works td.field-qty::before { content: "Кол-во"; }
  .crm-works td.field-price::before { content: "Цена"; }
  .crm-works td.field-sum_col::before { content: "Сумма"; }
  .crm-works td.delete::before { content: "Удалить"; }

  .crm-parts td.field-source::before { content: "Откуда"; }
  .crm-parts td.field-product::before { content: "Товар"; }
  .crm-parts td.field-name::before { content: "Название"; }
  .crm-parts td.field-sku::before { content: "Артикул"; }
  .crm-parts td.field-mode::before { content: "Как считать"; }
  .crm-parts td.field-amount::before { content: "Кол-во"; }
  .crm-parts td.field-cost_price::before { content: "Закупка"; }
  .crm-parts td.field-price::before { content: "Цена"; }
  .crm-parts td.field-supplier::before { content: "Поставщик"; }
  .crm-parts td.field-supply::before { content: "Поставка"; }
  .crm-parts td.field-ignored::before { content: "Не учитывать"; }
  .crm-parts td.field-sum_col::before { content: "Сумма"; }
  .crm-parts td.delete::before { content: "Удалить"; }

  .crm-payments td.field-pay_date_link::before { content: "Дата"; }
  .crm-payments td.field-kind::before { content: "Тип"; }
  .crm-payments td.field-article::before { content: "Статья"; }
  .crm-payments td.field-method::before { content: "Способ"; }
  .crm-payments td.field-amount::before { content: "Сумма"; }
  .crm-payments td.field-user::before { content: "Кто провёл"; }
  .crm-payments td.field-comment::before { content: "Комментарий"; }
  .crm-payments td.delete::before { content: "Удалить"; }
}
