/* Отчеты -> «Скидки дилерам» (dealers.js): классы dl-*. Компоненты - ui.css, общие классы отчетов ro-* - reports.css.
   Цвета линий графика проверены на поверхности страницы: светлая #ffffff, темная #151a21 (различимость при нарушениях
   цветового зрения и контраст 3:1). */
:root { --dl-s1: #2a78d6; --dl-s2: #eb6834; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --dl-s1: #3987e5; --dl-s2: #d95926; }
}
:root[data-theme="dark"] { --dl-s1: #3987e5; --dl-s2: #d95926; }

.dl-sum { margin: 0 0 var(--s-6); }
.dl-stat .ui-stat-v { font-size: var(--fs-3xl); }
.dl-h2 { margin: var(--s-10) 0 var(--s-4); font-size: var(--fs-lg); }
.dl-cities .lead b, .dl-tab .lead b { font-weight: 600; }
.dl-cities td.num, .dl-tab td.num { white-space: nowrap; font-variant-numeric: tabular-nums; }
.dl-city { cursor: pointer; }
.dl-city:hover td { background: var(--hover); }
.dl-citybtn { padding: 0; border: 0; background: none; color: inherit; font: inherit; font-weight: 600; text-align: left; cursor: pointer; }
.dl-citybtn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
.dl-city.dl-sel td { background: var(--accent-soft); }
.dl-city.dl-total td { font-weight: 600; border-top: 1px solid var(--line-2); }
.dl-note { margin-top: var(--s-8); line-height: 1.5; }

.dl-legend { display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-8); margin: 0 0 var(--s-3); font-size: var(--fs-sm); color: var(--text-2); }
.dl-legend span { display: inline-flex; align-items: center; gap: var(--s-3); }
.dl-key { display: inline-block; width: 16px; height: 3px; border-radius: 2px; }
.dl-key.dl-s1 { background: var(--dl-s1); }
.dl-key.dl-s2 { background: var(--dl-s2); }
.dl-chart-box { border: 1px solid var(--line); border-radius: var(--r-xl); background: var(--surface); padding: var(--s-4) var(--s-6); }
.dl-chart { display: block; width: 100%; height: auto; }
.dl-chart .dl-grid { stroke: var(--line); stroke-width: 1; }
.dl-chart .dl-axis { stroke: var(--line-2); stroke-width: 1; }
.dl-chart .dl-cross { stroke: var(--dim); stroke-width: 1; }
.dl-chart .dl-tick { fill: var(--text-3); font-size: 11px; }
.dl-chart .dl-endlbl { fill: var(--text-2); font-size: 11.5px; }
.dl-chart .dl-line { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.dl-chart .dl-line.dl-s1 { stroke: var(--dl-s1); }
.dl-chart .dl-line.dl-s2 { stroke: var(--dl-s2); }
.dl-chart .dl-pt.dl-s1, .dl-chart .dl-end.dl-s1 { fill: var(--dl-s1); }
.dl-chart .dl-pt.dl-s2, .dl-chart .dl-end.dl-s2 { fill: var(--dl-s2); }
.dl-chart .dl-end { stroke: var(--surface); stroke-width: 2; }
.dl-chart .dl-col { fill: transparent; outline: none; }
.dl-chart .dl-col:focus { fill: var(--hover); }
.dl-tip { position: fixed; z-index: var(--z-pop); display: none; pointer-events: none; max-width: 300px; padding: var(--s-4) var(--s-5);
  border-radius: var(--r-sm); background: var(--surface); border: 1px solid var(--line-2); box-shadow: var(--shadow);
  font-size: var(--fs-xs); line-height: 1.45; color: var(--text-2); }
.dl-tip b { display: block; margin-bottom: 2px; color: var(--text); font-weight: 600; }
@media print {
  .dl-page .ro-act, .dl-page .ro-tools, .dl-page .ro-more { display: none !important; }
}
