/* «Сервис-левел» — только то, чего нет в общих стилях.
   Всё остальное (блоки, плашки, таблицы) берётся из общей дизайн-системы. */

/* Компактная шапка раздела: между выбором периода и вкладками было по
   18 px с каждой стороны — почти сорок пикселей пустоты. Раиль 14.09.2026:
   «слишком много воздуха, сделай как в списаниях». Там строка периода
   отбивается четырьмя пикселями. */
.sl-view>.field-row{margin-bottom:6px}
.sl-view>.subtabs{margin-bottom:12px}

/* Поиск прямо в шапке блока «Клиенты»: искать нужно там же, где смотришь,
   а не отдельной строкой над таблицей. */
.sl-search{
  margin-left:auto;
  min-width:220px;
  max-width:280px;
  height:28px;
  padding:0 10px;
  font:inherit;
  font-size:13px;
  color:var(--text-1);
  background:var(--surface-1,var(--bg-1));
  border:1px solid var(--edge,var(--hair));
  border-radius:var(--radius-field,6px);
}
.sl-search::placeholder{color:var(--text-3,var(--text-2))}
.sl-search:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}
.sl-search::-webkit-search-cancel-button{cursor:pointer}

/* Карточка клиента и окно причины: блоки внутри окна стоят через тот же шаг,
   что и на странице, иначе окно выглядит плотнее самого раздела. */
.sl-card .modal-body>*+*{margin-top:14px}

@media (max-width:720px){
  .sl-search{min-width:0;width:100%;margin:8px 0 0}
}