/* IZDEU поверх общей оболочки TASPA (taspa/taspa-shell.css).
   Здесь только то, чего нет в общих файлах: счётчик каталога под маркой,
   размеры иконок в разметке из JS, раскладка рабочей области и входа. */

/* ── Боковое меню ── */
.iz-catalog {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 0 4px 14px;
  padding: 10px 12px;
  border: 1px solid var(--tp-line);
  border-radius: var(--tp-radius-card);
  background: var(--tp-panel-2);
}
.iz-catalog-label { color: var(--tp-text-3); font: 600 12px/1.35 var(--tp-font); }
.iz-catalog-num { color: var(--tp-text); font: 700 18px/1.25 var(--tp-font); font-variant-numeric: tabular-nums; }
.tp-user-name:empty::before { content: "—"; color: var(--tp-text-3); }
.tp-avatar:empty { visibility: hidden; }

/* ── Рабочая область ── */
.tp-main > main { width: 100%; margin-inline: auto; }
.tp-topbar-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.foot { width: 100%; margin: auto auto 0; }
.foot-tech:empty { display: none; }
.skip-link { font: 600 14px/1.4 var(--tp-font); }

/* Иконки, которые вставляет JS (icons.js). */
.iz-icon { display: inline-block; flex: 0 0 auto; width: 16px; height: 16px; vertical-align: -3px; }

/* ── Поиск ── */
#view-search .search-label-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 8px; }
#view-search .search-label-row .search-input-label { margin-bottom: 0; }
/* Подпись «Найти» — отдельный span ради перевода; старое мобильное правило
   `.qgo span` делало его 10 px вразрядку. */
#view-search .qgo > span > span { font: inherit; letter-spacing: inherit; }
#view-search .advbtn-i { width: 16px; height: 16px; transition: transform .2s ease; }
#view-search .advbtn[aria-expanded="true"] .advbtn-i { transform: rotate(180deg); }
#view-search .result-open-arrow .iz-icon { width: 13px; height: 13px; vertical-align: -2px; }
#view-search .pbtn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
#view-search .pbtn svg { width: 16px; height: 16px; }

/* Таблица результатов рядом с боковым меню: при 1366 px на неё остаётся
   ~1050 px. Номер, дата, значки и кнопки копирования могут перейти на вторую
   строку, а ФИО получает гарантированную ширину и не рассыпается по буквам. */
@media (min-width: 761px) {
  #view-search .rtable :is(th, td) { padding-inline: 10px; }
  #view-search .rtable td.c-fio { width: auto; min-width: 180px; }
  #view-search .rtable :is(th, td).c-idx { width: 36px; }
  #view-search .rtable td:is(.c-iin, .c-tel, .c-mark) { white-space: normal; }
  #view-search .rtable td.c-iin { min-width: 150px; }
  #view-search .rtable td.c-mark { min-width: 0; }
  #view-search .rtable td.c-mark .mark-ext { display: inline-block; margin: 0 3px 3px 0; }
  #view-search .rtable td.c-mark .mark-ext + .mark-ext { margin-left: 0; }
  #view-search .rtable td.c-adr { min-width: 140px; }
  #view-search .rtable td.c-nat { min-width: 70px; }
  #view-search .rtable .tel-num { white-space: nowrap; }
  #view-search .rtable .result-copy { width: 26px; height: 26px; margin-left: 2px; }
}

/* Сортировка по заголовку: контурные стрелки вместо символов. */
.rtable thead th[data-sort]::after {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-left: 6px;
  vertical-align: -1px;
  opacity: .4;
  background: currentColor;
  -webkit-mask: var(--iz-sort-icon) center / contain no-repeat;
  mask: var(--iz-sort-icon) center / contain no-repeat;
  --iz-sort-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21 16-4 4-4-4M17 20V4M3 8l4-4 4 4M7 4v16'/%3E%3C/svg%3E");
}
.rtable thead th.is-sorted[data-dir="asc"]::after {
  content: "";
  --iz-sort-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 7-7 7 7M12 19V5'/%3E%3C/svg%3E");
}
.rtable thead th.is-sorted[data-dir="desc"]::after {
  content: "";
  --iz-sort-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M19 12l-7 7-7-7'/%3E%3C/svg%3E");
}

/* Телефон: длинные казахские подписи («сәйкестігі бойынша», «мекенжай»)
   не должны обрезаться. */
@media (max-width: 760px) {
  #view-search .rtools .sortsel { flex: 1 1 auto; min-width: 0; }
  #view-search .rtools .sortsel select { width: 100%; max-width: none; }
  #view-search .rtable :is(td.c-iin, td.c-tel, td.c-adr, td.c-nat)::before { min-width: 76px; }
}

/* ── Карточка записи ── */
#drawer .dr-close { display: inline-grid; place-items: center; padding: 0; }
#drawer .dr-close svg { width: 18px; height: 18px; }
#drawer .drawer-stepper button { display: inline-flex; align-items: center; gap: 6px; }
#drawer :is(.tel-find, .ext-find, .ig-open, .dr-actions button) { display: inline-flex; align-items: center; gap: 5px; }
#drawer :is(.tel-find, .ext-find, .ig-open) .iz-icon { width: 13px; height: 13px; }
#drawer .dr-actions .iz-icon { width: 15px; height: 15px; }

/* ── Статистика ── */
.st-heading > p { margin: 0; }
.bd-top-list button > .iz-icon { color: var(--tp-text-3); }
:is(.ry-summary .ry-peak, .ry-detail button) { align-items: center; gap: 4px; }
:is(.ry-summary .ry-peak, .ry-detail button) .iz-icon { width: 13px; height: 13px; }

/* Широкий экран с боковым меню: рабочая область на 264 px уже окна. */
@media (min-width: 901px) and (max-width: 1440px) {
  #view-search { padding: 24px 24px 40px; }
  #view-stats { padding-inline: 24px; }
  #view-search .fgrid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (min-width: 901px) and (max-width: 1180px) {
  #view-search .fgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .st-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .st-grid { grid-template-columns: minmax(0, 1fr); }
  .st-panel.st-wide { grid-column: auto; }
}

/* ── Вход ── */
.login-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  max-width: 1160px;
  margin: 0 auto 24px;
}
.login-top .login-back { margin: 0; gap: 8px; }
.login-back svg { width: 18px; height: 18px; }
.login-prefs { padding: 0; }
svg.art-corner { width: 20px; height: 20px; }

@media (max-width: 640px) {
  .login-top { margin-bottom: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  #view-search .advbtn-i { transition: none; }
}