/* High Voltage · анкета + приём — оформление панели игрока и модалки админа.
   Своя палитра --hva-*, не завязана на hv-roles.css/тему форума —
   правится тут же, скрипты стилей не инжектят. */

.hva-panel {
  --hva-bg: #fff;
  --hva-border: #d8cdbf;
  --hva-accent: #a85e39;
  --hva-text: #2b2320;
  --hva-muted: #8a7b6c;
  background: var(--hva-bg);
  border: 1px solid var(--hva-border);
  border-radius: 10px;
  padding: 16px;
  margin: 0 0 16px;
  color: var(--hva-text);
  font-size: 13px;
}
/* Тёмная схема — не придумана на глаз, а взята из живой темы форума:
   /root/hv2026-tail.css, второй (побеждающий) блок .dark{} в
   hv2026-theme.css — --mg-bg 35,35,35 / --mg-text 222,217,205 /
   акцент (--mg-lilac, тот же ржавый, осветлённый под тёмный фон) 200,122,84. */
:root.dark .hva-panel,
body.dark .hva-panel {
  --hva-bg: #232323;
  --hva-border: #484848;
  --hva-accent: #c87a54;
  --hva-text: #ded9cd;
  --hva-muted: #b4a9a3;
}

.hva-title {
  font-weight: 700;
  font-size: 15px;
  margin-bottom: 10px;
  color: var(--hva-accent);
}

.hva-row { margin-bottom: 10px; position: relative; }
.hva-row label { display: block; margin-bottom: 3px; font-weight: 600; color: var(--hva-muted); }
.hva-row-2 { display: flex; gap: 12px; }
.hva-row-2 > div { flex: 1; }

.hva-panel input[type=text],
.hva-panel input[type=number],
.hva-panel select,
.hva-panel textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid var(--hva-border);
  border-radius: 6px;
  padding: 6px 8px;
  font: inherit;
  background: transparent;
  color: var(--hva-text);
}

.hva-racepick { display: flex; gap: 14px; flex-wrap: wrap; }
.hva-inline {
  display: inline-flex !important;
  align-items: center;
  gap: 5px;
  width: auto !important;
  margin: 0 !important;
  font-weight: 400 !important;
  color: var(--hva-text) !important;
  cursor: pointer;
}
.hva-inline input[type=radio] { width: auto; margin: 0; }

.hva-twink-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.hva-twink-row input[type=text] { flex: 1; min-width: 160px; }

.hva-suggest {
  position: absolute;
  z-index: 20;
  top: 100%;
  left: 0;
  right: 0;
  background: var(--hva-bg);
  border: 1px solid var(--hva-border);
  border-radius: 6px;
  max-height: 180px;
  overflow-y: auto;
}
.hva-suggest-item { padding: 6px 8px; cursor: pointer; }
.hva-suggest-item:hover { background: var(--hva-accent); color: #fff; }

.hva-hint { font-size: 11px; color: var(--hva-muted); margin-top: 2px; }

.hva-format-toolbar { display: flex; gap: 4px; margin: 4px 0; }
.hva-format-toolbar button {
  width: 26px;
  height: 26px;
  border: 1px solid var(--hva-border);
  border-radius: 4px;
  background: transparent;
  color: var(--hva-text);
  cursor: pointer;
  font-size: 13px;
  line-height: 1;
  padding: 0;
}
.hva-format-toolbar button:hover { border-color: var(--hva-accent); color: var(--hva-accent); }

.hva-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
.hva-actions button,
.hva-accept-btn,
.hva-modal-actions button {
  border: 1px solid var(--hva-accent);
  background: transparent;
  color: var(--hva-accent);
  border-radius: 6px;
  padding: 7px 14px;
  cursor: pointer;
  font: inherit;
}
.hva-actions button.hva-primary,
.hva-modal-actions button.hva-primary {
  background: var(--hva-accent);
  color: #fff;
}

.hva-note { margin-top: 8px; font-size: 11px; color: var(--hva-muted); }

.hva-accept-btn {
  display: block;
  margin: 0 0 10px;
  font-weight: 600;
}

.hva-restriction {
  display: block;
  margin: 0 0 10px;
  padding: 10px 12px;
  border: 1px solid #c98a3a;
  border-radius: 6px;
  background: rgba(201, 138, 58, .12);
  color: #7a4c14;
  font-size: 12px;
  line-height: 1.5;
}
:root.dark .hva-restriction, body.dark .hva-restriction {
  color: #e8bd85;
  background: rgba(201, 138, 58, .16);
}

.hva-modal-overlay {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.5);
  z-index: 9999;
  display: flex; align-items: flex-start; justify-content: center;
  padding: 40px 16px;
  overflow-y: auto;
}
.hva-modal {
  --hva-bg: #fff;
  --hva-border: #d8cdbf;
  --hva-accent: #a85e39;
  --hva-text: #2b2320;
  background: var(--hva-bg);
  color: var(--hva-text);
  border-radius: 10px;
  padding: 20px;
  width: 100%;
  max-width: 480px;
}
:root.dark .hva-modal, body.dark .hva-modal {
  --hva-bg: #232323; --hva-border: #484848; --hva-accent: #c87a54; --hva-text: #ded9cd;
}
.hva-modal h3 { margin: 0 0 12px; }
.hva-modal label { display: block; margin: 10px 0 3px; font-weight: 600; font-size: 12px; }
.hva-modal input, .hva-modal select, .hva-modal textarea {
  width: 100%; box-sizing: border-box; border: 1px solid var(--hva-border);
  border-radius: 6px; padding: 6px 8px; font: inherit; background: transparent; color: var(--hva-text);
}
.hva-modal-actions { display: flex; gap: 8px; margin-top: 16px; }
.hva-modal-status { margin-top: 10px; font-size: 12px; min-height: 16px; }