/* ==========================================================================
   forms.css — Action Digital
   Роль: Web-Designer
   Статус: принят
   Назначение: стилизация форм (lead_form, staff-формы), вывод ошибок,
   скрытие honeypot-поля (class="honeypot"), чекбоксы согласий.
   ========================================================================== */

/* 1. Контейнер формы ------------------------------------------------------------- */

.lead-form {
  margin-top: 1.5rem;
  padding: 1.5rem;
  background: var(--ad-surface);
  border: 1px solid var(--ad-border);
  border-radius: var(--bs-border-radius-lg);
}

/* 2. Поля -------------------------------------------------------------------------- */

.form-field {
  margin-bottom: 1.125rem;
}

.form-field__label {
  display: block;
  font-weight: 600;
  margin-bottom: 0.375rem;
  color: var(--ad-navy);
}

.form-field__required {
  color: var(--ad-danger);
}

.form-field__help {
  margin: 0.375rem 0 0;
  font-size: 0.875rem;
  color: var(--ad-muted);
}

.form-field__link {
  font-weight: 600;
}

/* Микротекст под кнопкой отправки (T8): «Демодоступ бесплатный…» */
.form-note {
  margin: 0.75rem 0 0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--ad-muted);
  text-align: center;
}

/* Единый вид контролов в lead- и staff-формах (виджеты Django без классов) */
.lead-form input[type="text"],
.lead-form input[type="email"],
.lead-form input[type="tel"],
.lead-form textarea,
.staff-form input[type="text"],
.staff-form input[type="email"],
.staff-form input[type="number"],
.staff-form input[type="password"],
.staff-form input[type="url"],
.staff-form input[type="file"],
.staff-form select,
.staff-form textarea {
  display: block;
  width: 100%;
  padding: 0.625rem 0.875rem;
  font-size: 1rem;
  line-height: 1.5;
  font-family: inherit;
  color: var(--ad-ink);
  background-color: #ffffff;
  border: 1px solid var(--ad-border);
  border-radius: var(--bs-border-radius);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

/* Фокус контролов: видимое кольцо --ad-focus (WCAG 2.4.7).
   T12, дефект 3: было `outline: none` + слабая тень ≈1.3:1 */
.lead-form input[type="text"]:focus,
.lead-form input[type="email"]:focus,
.lead-form input[type="tel"]:focus,
.lead-form textarea:focus,
.staff-form input:focus,
.staff-form select:focus,
.staff-form textarea:focus {
  border-color: var(--ad-blue);
  outline: 3px solid var(--ad-focus);
  outline-offset: 2px;
}

.lead-form textarea {
  resize: vertical;
  min-height: 7.5rem;
}

.staff-form input[type="file"] {
  padding: 0.5rem;
}

/* 3. Honeypot-поле: скрыто CSS, но остаётся в DOM (боты его заполняют) */
/*    (position:absolute + left:-9999px — не display:none: видят и роботы) */
.honeypot {
  position: absolute !important;
  left: -9999px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}

.form-field--honeypot {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

/* 4. Чекбоксы согласий (lead_form): два отдельных, оба сняты по умолчанию ------------ */

.form-field--checkbox {
  margin-bottom: 1rem;
}

.lead-form .form-check {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  padding-left: 0;
  min-height: 0;
}

.lead-form .form-check input[type="checkbox"] {
  flex: 0 0 auto;
  width: 1.25em;
  height: 1.25em;
  margin-top: 0.15em;
  accent-color: var(--ad-blue);
}

.lead-form .form-check-label {
  font-size: 0.9375rem;
}

/* 5. Ошибки формы (русские сообщения Django) ---------------------------------------- */

.errorlist {
  list-style: none;
  padding: 0.5rem 0.75rem;
  margin: 0.5rem 0 0;
  background: var(--ad-danger-soft);
  color: #7c2319;
  border: 1px solid rgba(179, 55, 43, 0.25);
  border-radius: var(--bs-border-radius-sm);
  font-size: 0.9rem;
}

.errorlist li + li {
  margin-top: 0.25rem;
}

/* non_field_errors — блок над формой */
.lead-form > .errorlist,
.staff-form > .errorlist {
  margin-bottom: 1rem;
}

/* Поле с ошибкой подсвечивается рамкой */
.lead-form .errorlist,
.staff-form .errorlist {
  border-left: 4px solid var(--ad-danger);
}

/* 6. Форма модала заявки (lead_modal_form.html) -------------------------------------- */

.lead-modal-form {
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

/* Сводка ошибок из сессии (lead_modal_errors), выводится inclusion-тегом */
.lead-modal-errors {
  padding: 0.75rem 1rem;
  margin-bottom: 1rem;
  background: var(--ad-danger-soft);
  border: 1px solid rgba(179, 55, 43, 0.25);
  border-left: 4px solid var(--ad-danger);
  border-radius: var(--bs-border-radius-sm);
  color: #7c2319;
  font-size: 0.9rem;
}

.lead-modal-errors__item {
  margin-bottom: 0.25rem;
}

.lead-modal-errors__item:last-child {
  margin-bottom: 0;
}

.lead-modal__intro {
  color: var(--ad-muted);
  margin-bottom: 1rem;
}
