/* =============================================================
 * Bethplanet — всплывающие окна uCoz (_uWnd), 23.08.2026.
 *
 * Окна собираются старым движком в девять вложенных div'ов
 * (.xw-tl/.xw-tr/.xw-tc и так далее) — наследие Ext JS. Раньше
 * их красил /.s/src/layer7.min.css: фиксированный тёмно-серый
 * #2c2e32 с синими кнопками, одинаковый при любой теме сайта.
 * В светлой теме это выглядело чужеродно, в тёмной — просто
 * не тем оттенком серого.
 *
 * Здесь девятиблочная обвязка обнуляется, а карточка рисуется
 * на самом окне через токены сайта. Разметку движка менять
 * нельзя, поэтому селекторы привязаны к [id^="_uwndWnd"][class] —
 * это даёт специфичность выше, чем у правил uCoz.
 * ============================================================= */

/* --- Оболочка окна -------------------------------------------
 * Селектор с [class] намеренно: таблицы стилей uCoz подключаются
 * движком после наших, поэтому при равной специфичности они
 * выигрывают. Так .xw-plain задавал окну радиус 15px поверх
 * нашего токена. */
[id^="_uwndWnd"][class] {
  background: var(--bp-bg);
  border: 1px solid var(--bp-line);
  border-radius: var(--bp-radius-lg);
  box-shadow: var(--bp-shadow-hero);
  font-family: var(--bp-font);
  color: var(--bp-text);
}

/* Девять блоков обвязки: снимаем фоны, отступы и скругления —
 * карточку рисует само окно. */
[id^="_uwndWnd"][class] .xw-tl,
[id^="_uwndWnd"][class] .xw-tr,
[id^="_uwndWnd"][class] .xw-tc,
[id^="_uwndWnd"][class] .xw-ml,
[id^="_uwndWnd"][class] .xw-mr,
[id^="_uwndWnd"][class] .xw-mc,
[id^="_uwndWnd"][class] .xw-bl,
[id^="_uwndWnd"][class] .xw-br,
[id^="_uwndWnd"][class] .xw-bc {
  background: none;
  padding: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

/* Распорки, которые держали высоту старой рамки. */
[id^="_uwndWnd"][class] .xw-sps,
[id^="_uwndWnd"][class] .xw-tsps {
  height: 0;
  font-size: 0;
}

[id^="_uwndWnd"][class] .xw-bl,
[id^="_uwndWnd"][class] .xw-br,
[id^="_uwndWnd"][class] .xw-bc {
  height: 0;
  min-height: 0;
}

/* --- Заголовок ----------------------------------------------- */
[id^="_uwndWnd"][class] .xw-hdr {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 0;
  height: auto;
  padding: 15px 16px 13px 20px;
  border-bottom: 1px solid var(--bp-line);
  cursor: move;
}

[id^="_uwndWnd"][class] .xw-hdr-text {
  order: 1;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  font-family: var(--bp-font);
  font-size: 17px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--bp-text);
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Кнопки заголовка. Иконки были картинками из панели управления
 * uCoz — рисуем крестик сами, чтобы он следовал за темой. */
[id^="_uwndWnd"][class] .xt {
  order: 2;
  position: static;
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  margin: 0;
  padding: 0;
  background-image: none;
  background-color: transparent;
  border-radius: 50%;
  cursor: pointer;
  transition: background-color var(--bp-dur) var(--bp-ease);
}

[id^="_uwndWnd"][class] .xt:hover {
  background-color: var(--bp-surface-2);
}

[id^="_uwndWnd"][class] .xt-close {
  position: relative;
}

[id^="_uwndWnd"][class] .xt-close::before,
[id^="_uwndWnd"][class] .xt-close::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 14px;
  height: 1.5px;
  border-radius: 1px;
  background: var(--bp-text-muted);
  transition: background var(--bp-dur) var(--bp-ease);
}

[id^="_uwndWnd"][class] .xt-close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

[id^="_uwndWnd"][class] .xt-close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

[id^="_uwndWnd"][class] .xt-close:hover::before,
[id^="_uwndWnd"][class] .xt-close:hover::after {
  background: var(--bp-text);
}

/* --- Тело ---------------------------------------------------- */
/* Вертикальные отступы намеренно живут не здесь, а на .myWinCont:
 * высоту прокручиваемой области движок считает сам, и отступ
 * снаружи неё обрезал бы последнюю строку списка. */
[id^="_uwndWnd"][class] .xw-body {
  padding: 0 20px;
  font-family: var(--bp-font);
  font-size: 15px;
  line-height: 1.55;
  color: var(--bp-text);
}

[id^="_uwndWnd"][class] .myWinCont {
  box-sizing: border-box;
  padding: 16px 0 18px;
  color: var(--bp-text);
}

[id^="_uwndWnd"][class] .myWinCont a {
  color: var(--bp-brand);
}

[id^="_uwndWnd"][class] .myWinCont a:hover {
  color: var(--bp-brand-hover);
}

/* Индикатор загрузки был светлой картинкой — на белом фоне
 * светлой темы его не видно. Рисуем своим. */
[id^="_uwndWnd"][class] .wait-loader {
  width: 26px;
  height: 26px;
  margin: 18px auto;
  background-image: none;
  border: 2px solid var(--bp-line);
  border-top-color: var(--bp-brand);
  border-radius: 50%;
  animation: bp-uwnd-spin 0.8s linear infinite;
}

@keyframes bp-uwnd-spin {
  to { transform: rotate(360deg); }
}

/* --- Формы внутри окон --------------------------------------- */
[id^="_uwndWnd"][class] .myWinCont :where(input[type="text"], input[type="password"], input[type="email"], input[type="search"], select, textarea) {
  width: 100%;
  min-height: 40px;
  padding: 8px 12px;
  font-family: var(--bp-font);
  font-size: 15px;
  line-height: 1.4;
  color: var(--bp-text);
  background: var(--bp-bg);
  border: 1px solid var(--bp-line-strong);
  border-radius: var(--bp-radius-sm);
}

[id^="_uwndWnd"][class] .myWinCont :where(input, select, textarea):focus {
  border-color: var(--bp-brand);
  outline: none;
  box-shadow: var(--bp-focus-ring);
}

[id^="_uwndWnd"][class] .myWinCont :where(input[type="checkbox"], input[type="radio"]) {
  width: 16px;
  height: 16px;
  min-height: 0;
  margin: 0 8px 0 0;
  padding: 0;
  vertical-align: -3px;
  accent-color: var(--bp-chrome);
  border: 0;
  box-shadow: none;
}

[id^="_uwndWnd"][class] .myWinCont label {
  font-size: 14px;
  color: var(--bp-text-muted);
  cursor: pointer;
}

/* Кнопки движка (.ubtn-default) внутри окна: главная — заливкой,
 * остальные — обводкой. */
[id^="_uwndWnd"][class] .myWinCont .ubtn-default,
[id^="_uwndWnd"][class] .myWinCont button[type="submit"],
[id^="_uwndWnd"][class] .myWinCont input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 42px;
  padding: 0 22px;
  font-family: var(--bp-font);
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  color: #ffffff;
  background: var(--bp-chrome);
  border: 1px solid var(--bp-chrome);
  border-radius: var(--bp-radius-pill);
  cursor: pointer;
  transition: background var(--bp-dur) var(--bp-ease);
}

[id^="_uwndWnd"][class] .myWinCont .ubtn-default:hover,
[id^="_uwndWnd"][class] .myWinCont button[type="submit"]:hover,
[id^="_uwndWnd"][class] .myWinCont input[type="submit"]:hover {
  background: var(--bp-chrome-hover);
  border-color: var(--bp-chrome-hover);
  color: #ffffff;
}

[id^="_uwndWnd"][class] .myWinCont .ubtn-default:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* Формы движка внутри окон свёрстаны таблицами без отступов.
 * Форму входа исключаем — ниже она раскладывается в колонку. */
[id^="_uwndWnd"][class] .myWinCont form:not(.uwnd-local-auth) td {
  padding: 5px 0;
  vertical-align: middle;
}

[id^="_uwndWnd"][class] .myWinCont form:not(.uwnd-local-auth) td + td {
  padding-left: 10px;
}

/* =============================================================
 * ОКНО ВХОДА
 *
 * Движок отдаёт форму таблицей и запирает её в блок фиксированной
 * высоты (высота приходит параметром _uWnd). Содержимое выше этой
 * высоты, поэтому форма прокручивалась внутри окна. Раскладываем
 * таблицу в колонку и отпускаем высоту.
 * ============================================================= */
[id^="_uwndWnd"][class]:has(.auth-modal) .xw-body > div,
[id^="_uwndWnd"][class]:has(.auth-modal) .myWinCont {
  width: 100% !important;
  height: auto !important;
  overflow: visible !important;
}

.myWinCont .uwnd-local-auth table,
.myWinCont .uwnd-local-auth tbody,
.myWinCont .uwnd-local-auth tr,
.myWinCont .uwnd-local-auth td {
  display: block;
  width: auto !important;
  padding: 0;
  border: 0;
  text-align: left;
}

.myWinCont .uwnd-local-auth tr {
  margin: 0 0 12px;
}

.myWinCont .uwnd-local-auth tr:empty,
.myWinCont .uwnd-local-auth td:empty {
  margin: 0;
}

/* Первая ячейка строки с полем — подпись над полем. */
.myWinCont .uwnd-local-auth td[width="35%"],
.myWinCont .uwnd-local-auth tr:nth-child(2) td:first-child {
  margin: 0 0 6px;
  font-size: 13px;
  font-weight: 500;
  color: var(--bp-text-muted);
}

.myWinCont .uwnd-local-auth input[type="text"],
.myWinCont .uwnd-local-auth input[type="password"] {
  width: 100% !important;
}

/* Строка с флажками и кнопкой. */
.myWinCont .uwnd-local-auth td[nowrap] {
  margin: 0 0 14px;
  line-height: 2;
}

.myWinCont .uwnd-local-auth td[nowrap] br {
  display: none;
}

.myWinCont .uwnd-local-auth td[nowrap] label {
  margin-right: 16px;
}

.myWinCont .uwnd-local-auth .ubtn-default {
  width: 100%;
}

.myWinCont .uwnd-local-auth td[style*="text-align:center"] {
  margin: 14px 0 0;
  font-size: 14px;
  text-align: center !important;
  color: var(--bp-text-dim);
}

/* Разделитель перед входом через сервисы. */
.myWinCont .social-label {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 18px 0 14px;
  font-size: 13px;
  color: var(--bp-text-dim);
}

.myWinCont .social-label::before,
.myWinCont .social-label::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background: var(--bp-line-strong);
}

.myWinCont .auth-social-list {
  display: flex;
  justify-content: center;
  gap: 10px;
}

.myWinCont .auth-social-list .login-with {
  transition: transform var(--bp-dur) var(--bp-ease);
}

.myWinCont .auth-social-list .login-with:hover {
  transform: translateY(-1px);
}

/* --- Узкий экран --------------------------------------------- */
@media (max-width: 640px) {
  [id^="_uwndWnd"][class] {
    max-width: calc(100vw - 24px) !important;
  }

  [id^="_uwndWnd"][class] .xw-hdr {
    padding: 13px 12px 11px 16px;
  }

  [id^="_uwndWnd"][class] .xw-body {
    padding: 0 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  [id^="_uwndWnd"][class] .wait-loader {
    animation: none;
  }

  [id^="_uwndWnd"][class] .xt,
  [id^="_uwndWnd"][class] .myWinCont .ubtn-default,
  .myWinCont .auth-social-list .login-with {
    transition: none;
  }
}
