/* ── Новый клиент: заведение арендатора ─────────────────────────────────────
 *
 * Экран для одного человека — администратора платформы. Поэтому здесь нет
 * витрины: узкая колонка, плотная форма, ни одного украшения. Всё внимание
 * уводится в одно место — блок с выданным паролем, потому что показать его
 * можно ровно один раз, и промахнуться мимо него нельзя.
 *
 * Цвета и отступы взяты из общих переменных системы; своих здесь нет.
 * У каждой переменной стоит запасное значение: экран не должен разъезжаться,
 * если набор переменных когда-нибудь переименуют.
 */

.pt-page {
  max-width: 680px;
}

.pt-lead {
  margin: calc(var(--space-2, 8px) * -1) 0 var(--space-6, 24px);
  color: var(--text-muted, #7A8BA3);
  font-size: var(--text-sm, 13px);
  line-height: 1.55;
}
.pt-lead code {
  font-family: var(--font-mono, monospace);
  font-size: .92em;
}

/* ── Форма ─────────────────────────────────────────────────────────────── */

.pt-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-5, 20px);
}

/* Тариф и срок — короткие поля, им незачем занимать всю ширину. */
.pt-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4, 16px);
}
.pt-row .form-group { margin: 0; }

.pt-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-3, 12px);
  margin-top: var(--space-2, 8px);
}

/* Ход работы стоит рядом с кнопкой, а не поверх экрана: заведение занимает
 * меньше секунды, и затемнять ради этого всю страницу незачем. */
.pt-step {
  color: var(--text-muted, #7A8BA3);
  font-size: var(--text-sm, 13px);
}

.pt-error {
  padding: var(--space-3, 12px) var(--space-4, 16px);
  border: 1px solid var(--status-danger, #FF4D5E);
  border-radius: var(--radius, 8px);
  background: rgba(255, 77, 94, .08);
  color: var(--status-danger, #FF4D5E);
  font-size: var(--text-sm, 13px);
  line-height: 1.5;
}

/* ── Итог ──────────────────────────────────────────────────────────────── */

.pt-receipt {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 16px);
  padding: var(--space-6, 24px);
  border: 1px solid var(--border-subtle, rgba(255, 255, 255, .09));
  border-radius: var(--radius-lg, 12px);
  background: var(--bg-panel, rgba(255, 255, 255, .03));
}

.pt-receipt__title {
  margin: 0;
  font-size: var(--text-xl, 20px);
  font-weight: var(--font-semibold, 600);
}
.pt-receipt__sub,
.pt-receipt__hint {
  margin: 0;
  color: var(--text-muted, #7A8BA3);
  font-size: var(--text-sm, 13px);
  line-height: 1.55;
}

/* Значения, которые переписывают посимвольно, — моноширинным. В
 * пропорциональном шрифте единица, латинская «l» и римская «I» выглядят
 * одинаково, и человек на том конце вводит не то, что ему продиктовали. */
.pt-value {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-3, 12px);
  padding: var(--space-3, 12px) 0;
  border-top: 1px solid var(--border-subtle, rgba(255, 255, 255, .07));
}
.pt-value__label {
  flex: 0 0 200px;
  color: var(--text-muted, #7A8BA3);
  font-size: var(--text-sm, 13px);
}
.pt-value__text {
  /* Значение не растягивается: кнопка «Скопировать» должна стоять сразу за
     тем, что она копирует, а не улетать к правому краю — иначе в столбце из
     трёх строк глаз каждый раз ищет, какая кнопка к какому значению. */
  flex: 0 1 auto;
  min-width: 0;
  font-family: var(--font-mono, monospace);
  font-size: var(--text-sm, 13px);
  word-break: break-all;
}

/* Единственный акцент экрана. */
.pt-secret {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3, 12px);
  margin-top: var(--space-2, 8px);
  padding: var(--space-5, 20px);
  border: 1px solid var(--border-default, rgba(255, 255, 255, .12));
  border-left: 3px solid var(--accent-primary, #2BD98A);
  border-radius: var(--radius, 8px);
  background: var(--bg-card, rgba(255, 255, 255, .04));
}
.pt-secret__label {
  color: var(--text-muted, #7A8BA3);
  font-size: var(--text-xs, 11px);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.pt-secret__value {
  font-family: var(--font-mono, monospace);
  font-size: var(--text-2xl, 24px);
  letter-spacing: .06em;
  line-height: 1.3;
  word-break: break-all;
  user-select: all;          /* одним двойным щелчком выделяется целиком */
}
.pt-secret__note {
  margin: 0;
  color: var(--text-muted, #7A8BA3);
  font-size: var(--text-sm, 13px);
  line-height: 1.55;
  max-width: 52ch;
}

.pt-sent {
  color: var(--accent-primary, #2BD98A);
  font-size: var(--text-sm, 13px);
}

/* ── Телефон ───────────────────────────────────────────────────────────── */

@media (max-width: 640px) {
  .pt-row { grid-template-columns: 1fr; }
  .pt-value { align-items: flex-start; flex-direction: column; gap: var(--space-1, 4px); }
  .pt-value__label { flex: none; }
  .pt-secret__value { font-size: var(--text-lg, 17px); }
  .pt-actions .btn { flex: 1 1 auto; }
}