/* =========================================================================
   ВсеНаТеннис · Страницы кабинета главного судьи: Списки, Сетки, Матчи
   Общий скин для registration_players, registration_players_pair,
   man_matches и cell_player.

   Всё построено на переменных --vnt-* из brand-vnt.css, поэтому тёмная тема
   подхватывается сама. Файл отдельный, а не дополнение к brand-vnt.css:
   так кеш большого фирменного файла не сбрасывается на турнире при правках.

   КОМФОРТНЫЙ РЕЖИМ (как в кабинете игрока):
     --k        — множитель размера шрифта, переключатель А / А+ / А++;
     --hjp-wrap — ширина рабочей зоны, по умолчанию вся доступная ширина.
   Базовый шрифт 15px × 1.15 ≈ 17px: с такого судья читает список
   с расстояния вытянутой руки, не наклоняясь к экрану.

   АДАПТИВНОСТЬ:
     ≥1400px — рабочая зона во всю ширину, формы в строку;
     880–1400 — то же, но формы в две колонки;
     ≤880px  — левое меню прячется (это делает brand-vnt.css), поля в столбик;
     ≤1080px — таблицы превращаются в карточки (подписи из data-label):
               при видимом левом меню на планшете рабочей ширины уже не хватает;
     ≤560px  — кнопки шапки во всю ширину, чипы разрядов прокручиваются.
   ========================================================================= */

/* ---------- Комфортный режим и рабочая зона ---------- */
html.vnt body.hjp-page,
body.hjp-page{
  --k:1.15;
  --hjp-wrap:min(2560px, 100%);
  font-size:calc(15px * var(--k));
  line-height:1.55;
}

/* Старая тема оставляла у #page-wrapper белый фон, рамку и поля по 30px —
   из-за них рабочая зона была узкой полосой посреди экрана */
body.hjp-page #page-wrapper{
  padding:0 !important;
  margin:0 !important;
  background:transparent !important;
  border:none !important;
  min-height:0;
}

.hjp-wrap{
  box-sizing:border-box;
  width:100%;
  max-width:var(--hjp-wrap);
  margin:0;
  padding:calc(16px * var(--k)) 18px 90px;
}
@media (max-width:880px){ .hjp-wrap{padding:14px 12px 80px} }

/* ---------- Переключатель размера шрифта ---------- */
.hjp-zoom{display:inline-flex;gap:4px;align-items:center}
.hjp-zoom button{
  border:1px solid var(--vnt-line);background:var(--vnt-surface);color:var(--vnt-dim);
  border-radius:10px;padding:0 11px;height:calc(38px * var(--k));min-width:calc(38px * var(--k));
  font-family:var(--vnt-head);font-weight:800;cursor:pointer;line-height:1;transition:.15s;
}
.hjp-zoom button:hover{background:var(--vnt-yellow);border-color:var(--vnt-yellow);color:#0C0C0F}
.hjp-zoom button.on{background:var(--vnt-ink);border-color:var(--vnt-ink);color:var(--vnt-bg)}
.hjp-zoom button:nth-child(1){font-size:11px}
.hjp-zoom button:nth-child(2){font-size:13px}
.hjp-zoom button:nth-child(3){font-size:15.5px}

/* ---------- Шапка страницы ---------- */
.hjp-head{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:16px;flex-wrap:wrap;margin:0 0 calc(16px * var(--k));
}
.hjp-head-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
html.vnt .hjp-head .vnt-page-title{font-size:calc(23px * var(--k));line-height:1.15}
html.vnt .hjp-head .vnt-kicker{font-size:calc(10px * var(--k));margin-bottom:6px}

/* ---------- Кнопки страниц ---------- */
.hjp-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:calc(40px * var(--k));padding:0 calc(16px * var(--k));border-radius:var(--vnt-r);
  border:1px solid var(--vnt-line);background:var(--vnt-surface);color:var(--vnt-ink);
  font-family:var(--vnt-body);font-weight:700;font-size:calc(13px * var(--k));line-height:1;
  white-space:nowrap;text-decoration:none;transition:.15s;cursor:pointer;
}
.hjp-btn:hover{border-color:var(--vnt-muted);color:var(--vnt-ink);text-decoration:none}
.hjp-btn:disabled,.hjp-btn[disabled]{opacity:.45;cursor:not-allowed}
.hjp-btn--yellow{background:var(--vnt-yellow);border-color:var(--vnt-yellow);color:var(--vnt-onyellow)}
.hjp-btn--yellow:hover{background:#ffd23c;border-color:#ffd23c;color:var(--vnt-onyellow)}
.hjp-btn--danger{color:var(--vnt-red);border-color:var(--vnt-line)}
.hjp-btn--danger:hover{border-color:var(--vnt-red);color:var(--vnt-red)}
.hjp-btn--sm{height:calc(34px * var(--k));padding:0 13px;font-size:calc(12.5px * var(--k));border-radius:10px}
.hjp-btn--xs{height:calc(30px * var(--k));padding:0 11px;font-size:calc(11.5px * var(--k));border-radius:9px;gap:5px}
.hjp-btn svg{width:calc(16px * var(--k));height:calc(16px * var(--k));stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.hjp-btn--xs svg{width:calc(13px * var(--k));height:calc(13px * var(--k))}

/* ---------- Поля ввода ---------- */
.hjp-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.hjp-field-lbl{
  font-family:var(--vnt-head);font-weight:800;font-size:calc(9.5px * var(--k));letter-spacing:.1em;
  text-transform:uppercase;color:var(--vnt-muted);
}
html.vnt .hjp-input,html.vnt .hjp-select,
.hjp-input,.hjp-select{
  box-sizing:border-box;width:100%;max-width:100%;
  height:calc(42px * var(--k));min-height:0;padding:0 13px;
  border:1px solid var(--vnt-line);border-radius:var(--vnt-r);
  background:var(--vnt-surface);color:var(--vnt-ink);
  font-family:var(--vnt-body);font-size:calc(13.5px * var(--k));font-weight:600;
  transition:.15s;-webkit-appearance:none;appearance:none;
}
html.vnt .hjp-select,.hjp-select{
  padding-right:34px;cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 11px center;background-size:15px;
}
.hjp-input::placeholder{color:var(--vnt-muted);font-weight:500}
html.vnt .hjp-input:focus,html.vnt .hjp-select:focus,
.hjp-input:focus,.hjp-select:focus{outline:none;border-color:var(--vnt-yellow);box-shadow:0 0 0 3px var(--vnt-yellow-soft)}
.hjp-input:disabled{background:var(--vnt-surface-2);color:var(--vnt-muted)}

/* Сетка формы: поля и кнопка в строку, на узком экране — в столбик */
.hjp-form{display:grid;gap:12px;align-items:end}
.hjp-form--add{grid-template-columns:minmax(160px,220px) minmax(280px,1fr) auto auto}
.hjp-form--replace{grid-template-columns:minmax(280px,1fr) auto}
.hjp-form--match{grid-template-columns:1fr 60px 1fr}
.hjp-form--matchopt{grid-template-columns:minmax(180px,240px) minmax(220px,1fr) auto}
.hjp-form--cell{grid-template-columns:1fr 1fr 1fr auto}
.hjp-form--cellnew{grid-template-columns:1fr 1fr minmax(180px,240px)}

@media (max-width:1200px){
  .hjp-form--add{grid-template-columns:minmax(160px,220px) 1fr auto auto}
  .hjp-form--cell{grid-template-columns:1fr 1fr}
  .hjp-form--cellnew{grid-template-columns:1fr 1fr}
}
@media (max-width:880px){
  .hjp-form--add,.hjp-form--replace,.hjp-form--match,.hjp-form--matchopt,
  .hjp-form--cell,.hjp-form--cellnew{grid-template-columns:1fr}
  .hjp-form .hjp-btn{width:100%}
  .hjp-vs{height:auto;padding:2px 0}
}

/* VS между игроками в форме матча */
.hjp-vs{
  display:flex;align-items:center;justify-content:center;height:calc(42px * var(--k));
  font-family:var(--vnt-head);font-weight:800;font-size:calc(11px * var(--k));letter-spacing:.08em;
  color:var(--vnt-muted);text-transform:uppercase;
}
.hjp-hide{display:none !important}

/* ---------- Подсказка автодополнения (jQuery UI) ---------- */
html.vnt .ui-autocomplete{
  background:var(--vnt-surface);border:1px solid var(--vnt-line);
  border-radius:var(--vnt-r);box-shadow:0 12px 32px rgba(12,12,15,.16);
  padding:6px;max-height:52vh;overflow:auto;z-index:3000;
}
html.vnt .ui-autocomplete .ui-menu-item-wrapper,
html.vnt .ui-autocomplete .ui-menu-item a{
  display:block;padding:calc(9px * var(--k)) 10px;border-radius:9px;border:none;background:transparent;
  font-family:var(--vnt-body);font-size:calc(13px * var(--k));font-weight:600;color:var(--vnt-ink);
}
html.vnt .ui-autocomplete .ui-menu-item-wrapper.ui-state-active,
html.vnt .ui-autocomplete .ui-menu-item a.ui-state-focus,
html.vnt .ui-autocomplete .ui-menu-item a:hover{
  background:var(--vnt-yellow-soft);color:var(--vnt-ink);margin:0;
}

/* ---------- Карточки ---------- */
html.vnt body.hjp-page .vnt-card{
  padding:calc(16px * var(--k)) calc(18px * var(--k));
  margin-bottom:calc(13px * var(--k));
  border-radius:16px;
}
html.vnt body.hjp-page .vnt-card-title{font-size:calc(10.5px * var(--k));margin-bottom:calc(12px * var(--k))}
html.vnt body.hjp-page .vnt-stat{padding:calc(15px * var(--k)) calc(17px * var(--k))}
html.vnt body.hjp-page .vnt-stat-num{font-size:calc(26px * var(--k))}
html.vnt body.hjp-page .vnt-stat-lbl{font-size:calc(12px * var(--k))}
html.vnt body.hjp-page .vnt-stats{gap:calc(11px * var(--k));margin-bottom:calc(14px * var(--k))}

/* Плитки: на планшете по две, на телефоне по одной */
@media (max-width:1100px){
  html.vnt body.hjp-page .vnt-stats{grid-template-columns:repeat(2,1fr) !important}
}
@media (max-width:560px){
  html.vnt body.hjp-page .vnt-stats{grid-template-columns:1fr !important}
}

/* Чипы разрядов: на телефоне лента с прокруткой вместо трёх рядов */
@media (max-width:700px){
  html.vnt .vnt-chips-strip{
    flex-wrap:nowrap !important;overflow-x:auto;overflow-y:hidden;
    -webkit-overflow-scrolling:touch;padding-bottom:6px;
    scrollbar-width:thin;
  }
  html.vnt .vnt-chips-strip>li{flex:0 0 auto}
}

/* ---------- Таблица ---------- */
.hjp-tablebox{
  border:1px solid var(--vnt-line);border-radius:var(--vnt-r-lg);
  overflow:auto;background:var(--vnt-surface);-webkit-overflow-scrolling:touch;
}
html.vnt table.hjp-table{
  width:100%;border-collapse:collapse;margin:0;background:transparent;box-shadow:none;
}
html.vnt table.hjp-table th{
  position:sticky;top:0;z-index:2;
  background:var(--vnt-surface-2);color:var(--vnt-muted);
  font-family:var(--vnt-head);font-weight:800;font-size:calc(9.5px * var(--k));letter-spacing:.1em;
  text-transform:uppercase;text-align:left;
  padding:calc(11px * var(--k)) calc(13px * var(--k));
  border:none;border-bottom:1px solid var(--vnt-line);white-space:nowrap;
}
html.vnt table.hjp-table td{
  padding:calc(11px * var(--k)) calc(13px * var(--k));
  border:none;border-bottom:1px solid var(--vnt-line);
  font-size:calc(13.5px * var(--k));color:var(--vnt-ink);vertical-align:middle;background:transparent;
}
html.vnt table.hjp-table tbody tr:last-child td{border-bottom:none}
html.vnt table.hjp-table tbody tr:hover td{background:var(--vnt-surface-2)}
html.vnt table.hjp-table tbody tr:nth-child(odd) td{background:transparent}
.hjp-table .hjp-num{font-family:var(--vnt-mono);font-weight:700;color:var(--vnt-yellow-ink);white-space:nowrap}
.hjp-table .hjp-id{font-family:var(--vnt-mono);font-size:calc(12px * var(--k));color:var(--vnt-muted);white-space:nowrap}
.hjp-table .hjp-name{font-weight:700}
.hjp-table .hjp-rate{font-family:var(--vnt-mono);font-weight:700;white-space:nowrap}
.hjp-table .hjp-date{font-size:calc(12px * var(--k));color:var(--vnt-muted);white-space:nowrap}
.hjp-table .hjp-actions{text-align:right;white-space:nowrap}
.hjp-table .hjp-actions .hjp-btn{margin-left:6px}

/* Таблица на телефоне и узком планшете — карточками.
   Подписи колонок берутся из data-label у каждой ячейки. */
@media (max-width:1080px){
  html.vnt table.hjp-table,
  html.vnt table.hjp-table tbody,
  html.vnt table.hjp-table tr,
  html.vnt table.hjp-table td{display:block;width:auto}
  html.vnt table.hjp-table thead{display:none}
  html.vnt table.hjp-table tbody tr{
    border-bottom:1px solid var(--vnt-line);
    padding:calc(10px * var(--k)) calc(12px * var(--k));
  }
  html.vnt table.hjp-table tbody tr:last-child{border-bottom:none}
  html.vnt table.hjp-table td{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    padding:calc(5px * var(--k)) 0;border:none;text-align:right;
  }
  html.vnt table.hjp-table td::before{
    content:attr(data-label);
    flex:0 0 auto;text-align:left;
    font-family:var(--vnt-head);font-weight:800;font-size:calc(9px * var(--k));
    letter-spacing:.09em;text-transform:uppercase;color:var(--vnt-muted);
  }
  html.vnt table.hjp-table td:empty{display:none}
  html.vnt table.hjp-table td.hjp-name{font-size:calc(15px * var(--k))}
  html.vnt table.hjp-table td.hjp-actions{
    justify-content:flex-end;flex-wrap:wrap;padding-top:calc(9px * var(--k));
  }
  html.vnt table.hjp-table td.hjp-actions::before{display:none}
  html.vnt table.hjp-table td.hjp-actions .hjp-btn{flex:1 1 auto;margin:0 0 0 6px}
  html.vnt table.hjp-table tbody tr:hover td{background:transparent}
  .hjp-tablebox{overflow:visible}
}

/* Пилюли-состояния */
.hjp-tag{
  display:inline-flex;align-items:center;gap:5px;
  font-family:var(--vnt-head);font-weight:800;font-size:calc(9px * var(--k));letter-spacing:.09em;
  text-transform:uppercase;border-radius:6px;padding:4px 8px;white-space:nowrap;
}
.hjp-tag--wait{background:var(--vnt-surface-2);color:var(--vnt-muted)}
.hjp-tag--live{background:var(--vnt-red);color:#fff}
.hjp-tag--done{background:var(--vnt-green-soft);color:var(--vnt-green)}
.hjp-tag--warn{background:var(--vnt-orange-soft);color:var(--vnt-orange-ink)}

/* Счёт матча */
.hjp-score{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap;font-family:var(--vnt-mono);font-weight:700;font-size:calc(13px * var(--k))}
.hjp-score i{font-style:normal;background:var(--vnt-surface-2);border-radius:7px;padding:3px 7px;color:var(--vnt-ink)}
.hjp-score .hjp-score--empty{color:var(--vnt-muted)}

/* Пара игроков в списке матчей */
.hjp-pair{display:flex;flex-direction:column;gap:3px;min-width:0;text-align:left}
.hjp-pair b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hjp-pair b{font-weight:700;font-size:calc(13.5px * var(--k))}
.hjp-pair span{font-family:var(--vnt-head);font-weight:800;font-size:calc(9px * var(--k));letter-spacing:.08em;color:var(--vnt-muted);text-transform:uppercase}

/* ---------- Пустое состояние ---------- */
.hjp-empty{
  display:flex;flex-direction:column;align-items:center;gap:10px;
  padding:calc(38px * var(--k)) 20px;text-align:center;color:var(--vnt-muted);
}
.hjp-empty svg{width:34px;height:34px;stroke:var(--vnt-line);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.hjp-empty b{display:block;font-family:var(--vnt-head);font-weight:800;font-size:calc(13px * var(--k));text-transform:uppercase;color:var(--vnt-dim)}
.hjp-empty p{margin:0;font-size:calc(13px * var(--k));max-width:52ch}

/* ---------- Уведомления ---------- */
.hjp-alert{
  display:flex;align-items:center;gap:12px;
  background:var(--vnt-surface);border:1px solid var(--vnt-line);border-left:3px solid var(--vnt-red);
  border-radius:var(--vnt-r-lg);box-shadow:var(--vnt-shadow);
  padding:calc(12px * var(--k)) calc(15px * var(--k));margin-bottom:calc(13px * var(--k));
  font-size:calc(13.5px * var(--k));color:var(--vnt-ink);
}
.hjp-alert--info{border-left-color:var(--vnt-yellow)}
.hjp-alert-x{margin-left:auto;border:none;background:none;color:var(--vnt-muted);font-size:16px;line-height:1;padding:4px 8px;border-radius:8px;cursor:pointer}
.hjp-alert-x:hover{background:var(--vnt-surface-2);color:var(--vnt-ink)}

/* ---------- Счётчик в заголовке карточки ---------- */
.hjp-count{
  font-family:var(--vnt-mono);font-weight:700;font-size:calc(11px * var(--k));
  background:var(--vnt-yellow-soft);color:var(--vnt-yellow-ink);
  border-radius:6px;padding:3px 7px;margin-left:8px;
}

/* ---------- Поиск по таблице ---------- */
.hjp-search{position:relative;min-width:min(280px,100%)}
html.vnt .hjp-search .hjp-input,.hjp-search input{padding-left:calc(34px * var(--k))}
.hjp-search svg{
  position:absolute;left:11px;top:50%;margin-top:calc(-8px * var(--k));
  width:calc(16px * var(--k));height:calc(16px * var(--k));
  stroke:var(--vnt-muted);fill:none;stroke-width:2;pointer-events:none;
}
@media (max-width:700px){
  .hjp-search{width:100%}
  html.vnt body.hjp-page .vnt-card-head{flex-direction:column;align-items:stretch;gap:10px}
}

/* ---------- Загрузка файла ---------- */
.hjp-upload{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  border:1px dashed var(--vnt-line);border-radius:var(--vnt-r-lg);
  padding:calc(13px * var(--k)) calc(15px * var(--k));background:var(--vnt-surface);
}
.hjp-upload input[type=file]{font-size:calc(12.5px * var(--k));color:var(--vnt-dim);max-width:100%}
.hjp-upload label{display:flex;align-items:center;gap:7px;font-size:calc(12.5px * var(--k));font-weight:600;color:var(--vnt-dim);margin:0}

/* Чипы разрядов под заголовком: у .navbar-nav в Bootstrap 5 стоит
   flex-direction:column, из-за чего чипы вставали столбиком */
html.vnt .vnt-chips-strip{flex-direction:row !important}
html.vnt body.hjp-page .vnt-chips-strip>li>a{font-size:calc(12.5px * var(--k)) !important;padding:calc(7px * var(--k)) calc(13px * var(--k)) !important}

/* Кнопки шапки на телефоне — во всю ширину, чтобы попадать пальцем */
@media (max-width:560px){
  .hjp-head{align-items:stretch}
  .hjp-head-actions{width:100%}
  .hjp-head-actions .hjp-btn{flex:1 1 46%}
  .hjp-zoom{width:100%;justify-content:flex-end}
}

/* =========================================================================
   Печать страниц кабинета: на листе остаются заголовок и таблица

   Раньше пряталась только часть панелей, и на бумагу уезжали чипы разрядов,
   формы добавления, поиск, кнопки в строках таблицы и виджеты поверх
   страницы. Список участников печатался на трёх листах вместо одного.
   ========================================================================= */
@media print{

  @page{margin:10mm}

  body.hjp-page{padding-left:0 !important;background:#fff !important}
  body{background:#fff !important}

  /* Всё, чем пользуются на экране, а не на бумаге */
  .vnt-side,
  .vnt-tophead,
  .vnt-chips-strip,
  .navbar,
  .hjp-head-actions,
  .hjp-form,
  .hjp-upload,
  .vnt-theme-btn,
  .hjp-search,
  .hjp-zoom,
  .hjp-actions,
  .vnt-notes-fab,
  .vnt-msgbadge,
  .hjp-empty,
  .vnt-cell-hint,
  .hjp-alert{display:none !important}

  /* Колонка «Действия» в шапке таблицы тоже не нужна */
  .hjp-table thead th:last-child{visibility:hidden}

  #page-wrapper{padding:0 !important;margin:0 !important;border:none !important;background:transparent !important}
  .hjp-wrap{padding:0 !important;margin:0 !important;max-width:none !important;width:auto !important}

  .vnt-card{border:none !important;box-shadow:none !important;padding:0 !important;margin:0 0 8px !important;background:#fff !important}
  .hjp-tablebox{border:none !important;overflow:visible !important}

  .hjp-table{font-size:11px}
  .hjp-table th,.hjp-table td{padding:3px 6px}
  .hjp-table tr{page-break-inside:avoid}
  .hjp-table thead{display:table-header-group}

  .vnt-page-title{font-size:16px;margin:0 0 4px}
  .vnt-kicker{display:none}
}

/* =========================================================================
   Чипы разрядов: три смысловых состояния
     обычный  — разряд турнира (ОЭ М, ОТ Д и т. д.);
     зелёный  — сетка с таким названием уже создана;
     жёлтый пунктир — «Создать сетку».
   Классы расставляет vnt-hj-pages.js по адресу ссылки.
   ========================================================================= */
/* Разряд, для которого сетка уже создана: класс hjp-chip-has ставит PHP
   по таблице cell — судья сразу видит, где сетка есть, а где её нет. */
html.vnt .vnt-chips-strip>li.hjp-chip-has>a{
  border-color:var(--vnt-green) !important;
  color:var(--vnt-green) !important;
  background:var(--vnt-green-soft) !important;
}
html.vnt .vnt-chips-strip>li.hjp-chip-has>a:hover{
  border-color:var(--vnt-green) !important;
  color:var(--vnt-ink) !important;
}
html.vnt .vnt-chips-strip>li.hjp-chip-has.active>a,
html.vnt .vnt-chips-strip>li.hjp-chip-has>a.vnt-active{
  background:var(--vnt-green) !important;
  border-color:var(--vnt-green) !important;
  color:#fff !important;
}

html.vnt .vnt-chips-strip>li>a.hjp-chip--cell{
  border-color:var(--vnt-green) !important;
  color:var(--vnt-green) !important;
  background:var(--vnt-green-soft) !important;
}
html.vnt .vnt-chips-strip>li>a.hjp-chip--cell:hover{
  border-color:var(--vnt-green) !important;
  color:var(--vnt-ink) !important;
}
html.vnt .vnt-chips-strip>li.active>a.hjp-chip--cell,
html.vnt .vnt-chips-strip>li>a.hjp-chip--cell.vnt-active{
  background:var(--vnt-green) !important;
  border-color:var(--vnt-green) !important;
  color:#fff !important;
}

html.vnt .vnt-chips-strip>li>a.hjp-chip--new{
  border:1px dashed var(--vnt-yellow) !important;
  color:var(--vnt-yellow-ink) !important;
  background:var(--vnt-yellow-soft) !important;
}
html.vnt .vnt-chips-strip>li>a.hjp-chip--new:hover{
  background:var(--vnt-yellow) !important;
  color:var(--vnt-onyellow) !important;
}
html.vnt .vnt-chips-strip>li.active>a.hjp-chip--new,
html.vnt .vnt-chips-strip>li>a.hjp-chip--new.vnt-active{
  background:var(--vnt-yellow) !important;
  border-style:solid !important;
  color:var(--vnt-onyellow) !important;
}

/* =========================================================================
   Файлы, Объявления, Архив, Предупреждения, Настройки, LIVESCORE
   Блоки, которых не было в первых трёх страницах. Всё на тех же переменных
   и на комфортном множителе --k.
   ========================================================================= */

/* ---------- Двухколоночная раскладка карточек ---------- */
.hjp-two{display:grid;grid-template-columns:1fr 1fr;gap:calc(13px * var(--k));align-items:start}
.hjp-two--wide{grid-template-columns:1.4fr 1fr}
@media (max-width:1100px){.hjp-two,.hjp-two--wide{grid-template-columns:1fr}}

/* ---------- Поле файла ---------- */
.hjp-file{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  border:1px dashed var(--vnt-line);border-radius:var(--vnt-r);
  padding:calc(11px * var(--k)) calc(13px * var(--k));background:var(--vnt-surface);
  font-size:calc(12.5px * var(--k));color:var(--vnt-dim);
}
.hjp-file input[type=file]{max-width:100%;color:var(--vnt-dim);font-size:calc(12.5px * var(--k))}

/* ---------- Текстовая область ---------- */
html.vnt textarea.hjp-input,textarea.hjp-input{
  height:auto;min-height:calc(84px * var(--k));padding:calc(10px * var(--k)) 13px;
  line-height:1.5;resize:vertical;
}

/* ---------- Плитка-ссылка на файл ---------- */
.hjp-filekind{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--vnt-head);font-weight:800;font-size:calc(9px * var(--k));
  letter-spacing:.09em;text-transform:uppercase;
  background:var(--vnt-yellow-soft);color:var(--vnt-yellow-ink);
  border-radius:6px;padding:4px 8px;white-space:nowrap;
}

/* ---------- Объявление в списке ---------- */
.hjp-note{font-size:calc(13.5px * var(--k));line-height:1.5;white-space:pre-wrap;max-width:70ch}

/* ---------- Чекбоксы настроек ---------- */
.hjp-checks{display:flex;flex-direction:column;gap:calc(7px * var(--k))}
.hjp-check{
  display:flex;align-items:center;gap:9px;cursor:pointer;
  font-size:calc(13.5px * var(--k));font-weight:600;color:var(--vnt-ink);margin:0;
}
html.vnt .hjp-check input[type=checkbox]{
  width:calc(18px * var(--k));height:calc(18px * var(--k));margin:0;accent-color:var(--vnt-yellow);flex:0 0 auto;
}

/* Пара «подпись — поле» в настройках */
.hjp-rows{display:grid;gap:calc(11px * var(--k))}
.hjp-row{display:grid;grid-template-columns:minmax(150px,220px) minmax(0,1fr);gap:14px;align-items:center}
.hjp-row > label,.hjp-row > .lbl{
  font-family:var(--vnt-head);font-weight:800;font-size:calc(9.5px * var(--k));letter-spacing:.1em;
  text-transform:uppercase;color:var(--vnt-muted);margin:0;
}
@media (max-width:700px){.hjp-row{grid-template-columns:1fr;gap:6px}}

/* Картинка-превью (логотип, обложки) */
.hjp-pic{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
}
.hjp-pic img{
  width:calc(84px * var(--k));height:calc(84px * var(--k));object-fit:cover;
  border-radius:12px;border:1px solid var(--vnt-line);background:var(--vnt-surface-2);
}

/* Липкая панель сохранения */
.hjp-savebar{
  position:sticky;bottom:0;z-index:5;
  display:flex;justify-content:flex-end;gap:12px;
  padding:calc(12px * var(--k)) 0;margin-top:calc(6px * var(--k));
  background:linear-gradient(to top,var(--vnt-bg) 60%,transparent);
}

/* =========================================================================
   LIVESCORE: корты карточками
   ========================================================================= */
.hjp-courts{display:grid;grid-template-columns:repeat(auto-fill,minmax(520px,1fr));gap:calc(13px * var(--k))}
@media (max-width:1200px){.hjp-courts{grid-template-columns:1fr}}

.hjp-court{
  background:var(--vnt-surface);border:1px solid var(--vnt-line);
  border-radius:var(--vnt-r-lg);box-shadow:var(--vnt-shadow);
  padding:calc(14px * var(--k)) calc(16px * var(--k));
}
.hjp-court-head{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  margin:0 0 calc(11px * var(--k));padding-bottom:calc(9px * var(--k));
  border-bottom:1px solid var(--vnt-line);
}
.hjp-court-num{
  font-family:var(--vnt-head);font-weight:900;font-size:calc(13px * var(--k));
  text-transform:uppercase;color:var(--vnt-ink);
}
.hjp-court-timer{
  margin-left:auto;font-family:var(--vnt-mono);font-weight:700;font-size:calc(12.5px * var(--k));
  background:var(--vnt-surface-2);border:1px solid var(--vnt-line);border-radius:9px;
  padding:calc(5px * var(--k)) calc(10px * var(--k));color:var(--vnt-dim);cursor:pointer;
}

/* Строка игрока */
html.vnt table.hjp-score-tbl{width:100%;border-collapse:collapse;background:transparent;margin:0;box-shadow:none}
html.vnt table.hjp-score-tbl td{
  border:none;border-bottom:1px solid var(--vnt-line);
  padding:calc(8px * var(--k)) 6px;vertical-align:middle;background:transparent;
}
html.vnt table.hjp-score-tbl tr:last-child td{border-bottom:none}

.hjp-serve{width:26px;text-align:center}
html.vnt .hjp-serve input[type=radio]{width:15px;height:15px;accent-color:var(--vnt-yellow);margin:0}

.hjp-player{min-width:150px}
html.vnt .hjp-player button{
  border:none;background:none;padding:0;margin:0;
  font-family:var(--vnt-body);font-weight:800;font-size:calc(14.5px * var(--k));
  color:var(--vnt-ink);text-align:left;cursor:pointer;line-height:1.2;
}
html.vnt .hjp-player button:hover{color:var(--vnt-yellow-ink)}
.hjp-player .hjp-mini{
  font-family:var(--vnt-mono);font-weight:700;font-size:calc(15px * var(--k));
  color:var(--vnt-yellow-ink);margin-right:8px;
}

.hjp-set{
  width:calc(34px * var(--k));text-align:center;
  font-family:var(--vnt-mono);font-weight:700;font-size:calc(15px * var(--k));color:var(--vnt-ink);
}
.hjp-set--last{background:var(--vnt-surface-2);border-radius:8px}

/* Кнопки действий судьи в строке */
.hjp-court-acts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
html.vnt .hjp-court-acts .btn,
html.vnt .hjp-court .btn-xs{
  height:calc(28px * var(--k));padding:0 calc(9px * var(--k));
  border:1px solid var(--vnt-line);background:var(--vnt-surface);color:var(--vnt-dim);
  border-radius:8px;font-size:calc(11px * var(--k));font-weight:700;line-height:calc(26px * var(--k));
}
html.vnt .hjp-court-acts .btn:hover{border-color:var(--vnt-yellow);color:var(--vnt-ink)}

/* Уведомление корта (id alert_<match>) */
.hjp-court-alert:not(:empty){
  display:block;margin:0 0 10px;padding:calc(9px * var(--k)) calc(12px * var(--k));
  border-radius:10px;background:var(--vnt-orange-soft);color:var(--vnt-orange-ink);
  font-size:calc(12.5px * var(--k));font-weight:700;
}

/* Вызов врача — общая плашка страницы */
html.vnt #doctor_alert.alert-danger{
  display:flex;align-items:center;gap:12px;
  background:var(--vnt-surface);border:1px solid var(--vnt-line);border-left:3px solid var(--vnt-red);
  border-radius:var(--vnt-r-lg);box-shadow:var(--vnt-shadow);
  padding:calc(12px * var(--k)) calc(15px * var(--k));margin:0 0 calc(13px * var(--k));
  font-family:var(--vnt-body);font-size:calc(14px * var(--k));font-weight:700;color:var(--vnt-ink);
  text-transform:none;
}
html.vnt #doctor_alert.hide{display:none !important}

/* Судья в строке предупреждения: фамилия и селект замены */
.hjp-judge{display:flex;flex-direction:column;gap:6px;min-width:190px;align-items:flex-start}
.hjp-judge b{font-weight:700;font-size:calc(13px * var(--k))}
html.vnt .hjp-select--sm{height:calc(34px * var(--k));font-size:calc(12.5px * var(--k));max-width:260px}
@media (max-width:1080px){.hjp-judge{align-items:flex-end;min-width:0}}

/* Кнопки внутри карточки корта.
   brand-vnt.css красит любые .btn-primary жёлтым через !important, а на
   LIVESCORE это делает экран пёстрым: жёлтыми становятся и фамилии, и все
   служебные кнопки. Возвращаем спокойный вид — жёлтый остаётся акцентом
   при наведении и у активной подачи. */
html.vnt .hjp-court .hjp-player button[id^="plus_game_player_"]{
  background:transparent !important;border:none !important;
  color:var(--vnt-ink) !important;
  font-family:var(--vnt-body) !important;font-weight:800 !important;
  font-size:calc(15px * var(--k)) !important;padding:0 !important;
  border-radius:0 !important;text-align:left !important;
}
html.vnt .hjp-court .hjp-player button[id^="plus_game_player_"]:hover{
  color:var(--vnt-yellow-ink) !important;background:transparent !important;
}
html.vnt .hjp-court .hjp-court-acts .btn{
  background:var(--vnt-surface) !important;
  border:1px solid var(--vnt-line) !important;
  color:var(--vnt-dim) !important;
  font-weight:700 !important;
}
html.vnt .hjp-court .hjp-court-acts .btn:hover{
  background:var(--vnt-yellow) !important;border-color:var(--vnt-yellow) !important;
  color:var(--vnt-onyellow) !important;
}
html.vnt .hjp-court .hjp-court-acts button[id^="stop_button_"]{color:var(--vnt-red) !important}
html.vnt .hjp-court .hjp-court-acts button[id^="stop_button_"]:hover{
  background:var(--vnt-red) !important;border-color:var(--vnt-red) !important;color:#fff !important;
}

/* Подсказка под формой. Раньше эти правила жили только в vnt-cell.css,
   и на страницах без него иконка растягивалась на всю карточку чёрным кругом. */
.vnt-cell-hint{
  display:flex;align-items:center;gap:9px;
  font-size:calc(12.5px * var(--k));color:var(--vnt-muted);margin-top:10px;
}
.vnt-cell-hint svg{
  width:calc(15px * var(--k));height:calc(15px * var(--k));flex:0 0 auto;
  stroke:var(--vnt-muted);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;
}

/* Страховка: любая иконка внутри карточек и кнопок этих страниц рисуется
   контуром и не растягивается, даже если правило для неё забыли */
.vnt-card svg,.hjp-empty svg,.hjp-btn svg,.hjp-search svg{fill:none}
