/* app.form.css – темы, цвета и анимации формы */

:root {
  /* Цветовая схема */
  --color-bg-gradient-from: #3b0066;
  --color-bg-gradient-to: #000533;
  --color-primary: #00bfff; /* голубой */
  --color-accent: #9b59b6; /* фиолетовый светлый */
  --color-deep: #490e75; /* фиолетовый тёмный */
  --color-panel: #1f1035; /* тёмная панель */
  --color-text: #cceeff;
  --color-text-strong: #ffffff;
  --color-border: rgba(255, 255, 255, 0.15);
  --shadow-primary: 0 0 20px rgba(0, 191, 255, 0.45);
  
  /* Цвета состояний */
  --color-success: #2ecc71;
  --color-warning: #f39c12;
  --color-error: #e74c3c;
  --color-info: #3498db;
  
  /* Анимации */
  --transition-default: all 0.3s ease;
  --transition-fast: all 0.15s ease;
  --transition-slow: all 0.5s ease;
}

/* Основные стили текста */
body {
  color: var(--color-text-strong);
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

/* Заголовки */
h1, h2, h3, h4, h5, h6 {
  color: var(--color-primary);
  text-shadow: 0 0 10px rgba(71, 0, 136, 0.7);
}

/* Элементы форм */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="date"],
input[type="file"],
select,
textarea {
  background: rgba(20, 9, 42, 0.8);
  color: var(--color-text);
  border: 1px solid var(--color-border);
  transition: var(--transition-default);
}

/* Состояния элементов форм */
input:focus,
select:focus,
textarea:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(0, 191, 255, 0.15);
  outline: none;
}

/* Кнопки */
button,
input[type="button"],
input[type="submit"],
.btn {
  background: var(--color-primary);
  color: #fff;
  border: none;
  transition: var(--transition-default);
  cursor: pointer;
}

button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
.btn:hover {
  background: var(--color-accent);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* Сообщения и подсказки */
.hint {
  color: var(--color-text);
  opacity: 0.8;
  font-style: italic;
  transition: var(--transition-default);
}

/* Кастомные элементы форм */
.custom-checkbox,
.custom-radio {
  position: relative;
  cursor: pointer;
  color: var(--color-text);
}

.custom-checkbox input,
.custom-radio input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Стили для индикаторов */
.checkmark,
.radio-mark {
  background-color: rgba(20, 9, 42, 0.8);
  border: 1px solid var(--color-border);
  transition: var(--transition-default);
}

/* Состояния наведения */
.custom-checkbox:hover .checkmark,
.custom-radio:hover .radio-mark {
  border-color: var(--color-primary);
}

/* Выбранное состояние */
.custom-checkbox input:checked ~ .checkmark {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}

.custom-radio input:checked ~ .radio-mark {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(0, 191, 255, 0.2);
}

/* Анимация загрузки */
.loading-spinner {
  border: 3px solid rgba(255, 255, 255, 0.2);
  border-top: 3px solid var(--color-primary);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

/* Эффекты */
.hover-scale {
  transition: var(--transition-default);
  border: 1px solid rgba(255,0,0,0.35);
}

/* Адаптивность мелких отступов */
@media (max-width: 480px) {
  #applicationForm { padding: 0 12px 20px; }
  .section { padding: 12px; }
  .modal .modal-content { width: min(94vw, 520px); }
}