/* =========================================================
   ФОРМА ЗАЯВКИ — css/marathon-registration.css

   Только оформление: раскладка (сетка, отступы, выравнивание) собрана
   утилитами Bootstrap в parts/block_registration.php, базовые поля —
   компонентами Bootstrap (.form-control, .form-select, .input-group,
   .form-check). Здесь — рамки групп, акценты, состояния и кнопка.

   Кнопка .mrv-btn-primary определена в marathon-hero.css; дубль ключевых
   свойств ниже — чтобы форма не «мигала»-unstyled, пока hero-стили
   не применились (hero грузится синхронно, остальное асинхронно).
   ========================================================= */

/* ---------- Карточка формы ---------- */
.reg-card {
    max-width: 62.5rem;   /* 1000px — та же ширина, что у текстовых блоков страницы */
    margin-inline: auto;
}

/* ---------- Преимущества участия ----------
   Разделительная линия — утилитами Bootstrap в разметке
   (border-bottom border-2 border-light), здесь только типографика. */
.reg-perks {
    color: var(--camp-body);
    font-size: .95rem;
}

.reg-perks li i {
    color: var(--camp-green-dark);
    font-size: 1.1rem;
}

/* ---------- Группа полей (fieldset) ----------
   Сброс браузерных рамок/отступов fieldset и legend: рисуем свои. */
.reg-group {
    min-width: 0;               /* не даём длинному тексту распирать колонку сетки */
    border: 0;
    margin: 0;
    padding: 1.5rem;
    background: #fbfcfe;
    border-radius: var(--camp-radius-md);
    box-shadow: inset 0 0 0 1px #eef1f5;
}

.reg-group--participant {
    background: #fffdf9;
    box-shadow: inset 0 0 0 1px #f6ecdc;
}

.reg-group-title {
    float: left;                /* вынимаем legend из «особого» режима */
    width: 100%;
    padding: 0 0 .75rem;
    border-bottom: 2px solid #eef1f5;
    color: var(--camp-heading);
    font-size: 1.1rem;
    line-height: 1.3;
}

.reg-group--participant .reg-group-title {
    border-bottom-color: #f6ecdc;
}

/* Иконка группы (в legend) и номер участника */
/* Мини-иконки групп формы: те же 3D-картинки, что и в разделах,
   в белой плашке с мягкой рамкой (переиспользуем готовые файлы) */
.reg-group-icon {
    background: #fff;
    box-shadow: inset 0 0 0 1px #e3e8ef, 0 4px 10px rgba(47, 106, 158, .12);
    overflow: hidden;
}

.reg-group-icon img {
    display: block;
    width: 86%;
    height: 86%;
    object-fit: contain;
}

.reg-group-num {
    background: linear-gradient(135deg, var(--camp-orange-light) 0%, var(--camp-orange-dark) 100%);
    box-shadow: 0 6px 14px rgba(230, 115, 38, .25);
    font-weight: 800;
}

/* ---------- Поля ---------- */
.reg-field .form-label {
    font-size: .92rem;
    color: var(--camp-heading);
}

.reg-req {
    color: var(--camp-danger);
}

.reg-input {
    border-radius: var(--camp-radius-sm);
    border-color: #e3e8ef;
    background-color: #fff;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.reg-input:focus {
    border-color: var(--camp-blue);
    box-shadow: 0 0 0 .25rem rgba(64, 128, 191, .15);
}

.reg-input-group-icon {
    background: #f4f7fb;
    border-color: #e3e8ef;
    color: var(--camp-blue);
}

.reg-hint {
    font-size: .8rem;
    line-height: 1.4;
    color: var(--camp-muted);
}

/* Нативная валидация: подсветка только после попытки отправки (novalidate + JS) */
.reg-input.is-invalid,
.reg-input:invalid:not(:placeholder-shown) {
    border-color: var(--camp-danger);
}

.reg-input.is-invalid:focus {
    box-shadow: 0 0 0 .25rem rgba(220, 53, 69, .15);
}

/* ---------- Блок участников ---------- */
.reg-participants-head {
    border-bottom: 2px solid #f1f3f5;
    color: var(--camp-heading);
}

.reg-switch:checked {
    background-color: var(--camp-orange-dark);
    border-color: var(--camp-orange-dark);
}

.reg-switch:focus {
    box-shadow: 0 0 0 .25rem rgba(255, 140, 66, .20);
    border-color: var(--camp-orange-light);
}

/* Скрытый участник № 2 (переключатель «В команде два участника») */
.reg-participant-2[hidden] {
    display: none !important;   /* перебивает .d-* / display от Bootstrap-колонки */
}

/* ---------- Согласие и отправка ----------
   Линия сверху — утилитами Bootstrap (border-top border-2 border-light). */

/* Чекбокс: сбрасываем отрицательный margin Bootstrap и поднимаем бокс
   к первой строке.label стоит рядом через d-flex в разметке. */
.reg-checkbox {
    margin-left: 0;
    margin-top: .2em;
    width: 1.15em;
    height: 1.15em;
}

.reg-checkbox:checked {
    background-color: var(--camp-green-dark);
    border-color: var(--camp-green-dark);
}

.reg-checkbox:focus {
    box-shadow: 0 0 0 .25rem rgba(31, 138, 91, .18);
    border-color: var(--camp-green);
}

.reg-submit {
    border: 0;
    border-radius: 12px;
    font-size: 1.05rem;
    letter-spacing: .02em;
    padding-block: .95rem;
    background: linear-gradient(135deg, #ff9f44 0%, var(--camp-orange-dark) 100%);
    box-shadow: 0 8px 24px rgba(255, 140, 66, .35);
    transition: all var(--camp-transition);
}

.reg-submit:hover:not(:disabled) {
    background: linear-gradient(135deg, #ffb066 0%, #ff9f44 100%);
    box-shadow: 0 12px 32px rgba(255, 140, 66, .50);
    transform: translateY(-2px);
}

.reg-submit:disabled {
    background: #ced4da;
    box-shadow: none;
    transform: none;
    cursor: not-allowed;
    opacity: 1;
}

.reg-status {
    min-height: 1.25rem;        /* резерв места, чтобы страница не «прыгала» */
    text-align: center;
}

.reg-status.is-error   { color: var(--camp-danger); font-weight: 600; }
.reg-status.is-success { color: var(--camp-green-dark); font-weight: 600; }

/* =========================================================
   АДАПТИВ
   ========================================================= */
@media (max-width: 767.98px) {
    .reg-group,
    .reg-group--participant {
        padding: 1.15rem;
    }

    .reg-group-title {
        font-size: 1rem;
        gap: .5rem;
    }

    .reg-perks {
        font-size: .85rem;
        gap: .75rem;
    }

    .reg-input {
        font-size: 1rem;        /* меньше 16px на iOS вызывает авто-зум страницы */
    }

    .reg-submit {
        font-size: .98rem;
        padding-block: .85rem;
    }
}