/* ============================================================================
   order-form.css — тёплая тема попапа записи «Записаться» (Opus 4.8, 2026-07-06)
   Референс — вложение «Admin Panel - Standalone.html» (тот же язык, что и lk.css):
   шрифт Manrope, палитра #FBF9F6/#EEE7DE/#E2792F/#2B2A27, коралловый акцент.
   Скоуп СТРОГО под .popup-order (маркер добавляется в order_new.php только для
   сценария записи) — чтобы НЕ трогать recall («Заказать звонок») и auth-попапы,
   которые тоже используют .popup-form. Грузится глобально (header.php, Asset),
   но из-за скоупа влияет только на попап записи. История правок — order-form.css.md.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');

.popup-order{
  --surface:#ffffff; --cream:#faf5ef; --peach:#fbe9d8;
  --line:#ece4d8; --line-strong:#ddd4c6;
  --coral:#e2792f; --coral-deep:#c1601a; --coral-tint:#fbe7d6;
  --ink:#2b2a27; --text:#5b564e; --muted:#9a948b; --faint:#b7afa2;
  --danger:#d5492f; --danger-tint:#fbe6e0;
  --radius:16px; --radius-sm:11px; --radius-pill:999px;

  font-family:'Manrope',system-ui,-apple-system,sans-serif;
  color:var(--text); font-size:15px; line-height:1.5;
  background:var(--surface) !important;
  border-radius:22px !important;
  padding:28px 26px !important;
  max-width:460px;
}
.popup-order,
.popup-order *{ box-sizing:border-box; }
.popup-order a{ color:var(--coral); text-decoration:none; }
.popup-order a:hover{ color:var(--coral-deep); text-decoration:underline; }

/* контейнер содержимого: аккуратная прокрутка на маленьких экранах */
.popup-order .form-content{ max-height:calc(100dvh - 120px); overflow-y:auto; margin:-4px; padding:4px; }
.popup-order .form-content::-webkit-scrollbar{ width:8px; }
.popup-order .form-content::-webkit-scrollbar-thumb{ background:var(--line-strong); border-radius:8px; }

/* ---------------------------------------------------------------------------
   Шапка семинара + инфо-карта (news.detail/order.schedule)
   --------------------------------------------------------------------------- */
.popup-order .popup-form__head{
  display:block; margin:0 0 18px; gap:0;
  font-family:'Manrope',sans-serif;
  font-size:23px; font-weight:800; line-height:1.2; letter-spacing:-.4px;
  color:var(--ink);
}

.popup-order .popup-course-info{
  margin:0 0 20px; padding:16px 18px;
  background:var(--cream); border:1px solid var(--line); border-radius:var(--radius);
}
.popup-order .popup-course-info__title{
  margin:0 0 12px; padding:0;
  font-size:11.5px; font-weight:700; letter-spacing:.6px; text-transform:uppercase;
  color:var(--coral-deep);
}
.popup-order .popup-course-info__inner p{
  display:flex; justify-content:space-between; align-items:baseline; gap:14px;
  margin:0 0 9px; font-size:14px;
}
.popup-order .popup-course-info__inner p:last-child{ margin-bottom:0; }
.popup-order .popup-course-info__inner p span:first-child{ color:var(--muted); }
.popup-order .popup-course-info__value{ color:var(--ink); font-weight:700; text-align:right; }

/* блок оплаты — «Оплата: сумма», выделен коралловым тинтом */
.popup.popup-order .popup-course-info.paysystem{
  margin:20px 0 12px; padding:14px 18px;
  background:var(--coral-tint); border-color:#f3d3b6;
}
.popup.popup-order .popup-course-info.paysystem p{ margin:0; }
.popup.popup-order .popup-course-info.paysystem span:first-child{
  color:var(--coral-deep); font-weight:700; text-transform:none; font-size:14px; letter-spacing:0;
}
.popup.popup-order .popup-course-info.paysystem .popup-course-info__value{
  color:var(--coral-deep); font-size:18px; font-weight:800;
}

/* ---------------------------------------------------------------------------
   Поля ввода
   --------------------------------------------------------------------------- */
.popup-order .input-group{ margin-bottom:15px; }
.popup-order .input-group:last-child{ margin-bottom:0; }
.popup-order .input-group__title{
  margin:0 0 7px 2px; padding:0;
  font-size:11.5px; font-weight:700; letter-spacing:.5px; text-transform:uppercase;
  color:var(--muted);
}
.popup-order .input-group__title span{ color:var(--coral); }

/* .input-wrap = само поле (сбрасываем родной «пузырёк» radius:25px + тень) */
.popup-order .input-wrap{
  position:relative; display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:11px 14px; border:1.5px solid var(--line-strong); border-radius:var(--radius-sm);
  background:var(--surface); box-shadow:none; transition:border-color .15s, box-shadow .15s;
}
.popup-order .input-wrap:focus-within{ border-color:var(--coral); box-shadow:0 0 0 4px var(--coral-tint); }
.popup-order .input-wrap input,
.popup-order .input-wrap textarea{
  width:100%; padding:0; border:none; outline:0; background:transparent;
  font-family:'Manrope',sans-serif; font-size:15px; line-height:1.45; color:var(--ink);
}
.popup-order .input-wrap input::placeholder,
.popup-order .input-wrap textarea::placeholder{ color:var(--faint); font-weight:400; font-size:15px; }
.popup-order .input-wrap textarea{ height:104px; resize:none; }
.popup-order .input-wrap input.input-user-locked,
.popup-order .input-wrap input:disabled{ color:var(--muted); }
.popup-order .input-group.input-group-disabled .input-wrap{ background:var(--cream); border-color:var(--line); box-shadow:none; }

/* состояние ошибки поля */
.popup-order .input-group.input-group-error .input-wrap{ border-color:var(--danger); box-shadow:none; }
.popup-order .input-group.input-group-error .input-group__title{ color:var(--danger); }
.popup-order .input-group.input-group-error input,
.popup-order .input-group.input-group-error textarea{ color:var(--danger); }
.popup-order .input-group__error-text{ text-align:left; color:var(--danger); font-size:12.5px; margin-top:5px; }

/* ---------------------------------------------------------------------------
   Кастомный селект даты / тарифа (.styled-select: input readonly + каретка)
   --------------------------------------------------------------------------- */
.popup-order .input-wrap.styled-select{ cursor:pointer; padding-right:44px; }
.popup-order .styled-select input.input-date{
  cursor:pointer; caret-color:transparent; color:var(--ink); font-weight:600;
}
.popup-order .styled-select svg{
  position:absolute; right:14px; top:50%; transform:translateY(-50%);
  width:22px; height:22px; pointer-events:none; color:var(--muted);
}
.popup-order .styled-select svg path{ fill:currentColor; }
.popup-order .input-wrap.styled-select:hover{ border-color:var(--coral); }

/* ---------------------------------------------------------------------------
   Чекбокс оферты
   --------------------------------------------------------------------------- */
.popup-order .checkbox-outer{ display:block; }
.popup-order .checkbox-outer input{ display:none; }
.popup-order .checkbox-outer label{
  display:flex; align-items:center; gap:11px; cursor:pointer;
  font-size:13.5px; line-height:1.4; color:var(--text);
}
.popup-order .checkbox-outer label .checkbox{
  position:relative; flex:none; width:22px; min-width:22px; height:22px;
  border-radius:6px; border:1.5px solid var(--line-strong); background:var(--surface);
  transition:background .15s, border-color .15s;
}
.popup-order .checkbox-outer label .checkbox::before{
  content:''; position:absolute; left:6px; top:2.5px; width:6px; height:11px;
  border:solid #fff; border-width:0 2.5px 2.5px 0; transform:rotate(45deg);
  opacity:0; transition:opacity .15s;
}
.popup-order .checkbox-outer input:checked + label .checkbox{ background:var(--coral); border-color:var(--coral); }
.popup-order .checkbox-outer input:checked + label .checkbox::before{ opacity:1; }
.popup-order .checkbox-outer label:hover .checkbox{ border-color:var(--coral); }

/* ---------------------------------------------------------------------------
   Способы оплаты (radio-строка с логотипом)
   --------------------------------------------------------------------------- */
.popup.popup-order .checkbox-outer.radio input{ display:none; }
.popup.popup-order .checkbox-outer.radio label{
  display:flex; align-items:center; gap:12px; cursor:pointer;
  padding:12px 14px; border:1.5px solid var(--line-strong); border-radius:var(--radius-sm);
  background:var(--surface); transition:border-color .15s, background .15s;
}
.popup.popup-order .checkbox-outer.radio label:hover{ border-color:var(--coral); }
.popup.popup-order .checkbox-outer.radio label .checkbox{
  position:relative; flex:none; width:20px; min-width:20px; height:20px;
  border-radius:50%; border:1.5px solid var(--line-strong); background:var(--surface); transition:.15s;
}
.popup.popup-order .checkbox-outer.radio label .checkbox::before{
  content:''; position:absolute; left:50%; top:50%; width:10px; height:10px;
  border-radius:50%; background:var(--coral); transform:translate(-50%,-50%) scale(0);
  transition:transform .15s;
}
.popup.popup-order .checkbox-outer.radio input:checked + label{ border-color:var(--coral); background:var(--coral-tint); }
.popup.popup-order .checkbox-outer.radio input:checked + label .checkbox{ border-color:var(--coral); }
.popup.popup-order .checkbox-outer.radio input:checked + label .checkbox::before{ transform:translate(-50%,-50%) scale(1); }
.popup.popup-order .checkbox-outer.radio label img{ height:34px; width:auto; }
.popup.popup-order .checkbox-outer.radio label span{ font-size:14px; font-weight:600; color:var(--ink); }

/* ---------------------------------------------------------------------------
   Ошибки формы (сводка) и кнопка отправки
   --------------------------------------------------------------------------- */
.popup-order .form-result{ padding:0; text-align:left; }
.popup-order .form-result:not(:empty){ margin-bottom:14px; }
.popup-order .form-result .form-result__error{
  margin:0 0 4px; padding:0; color:var(--danger); font-size:13.5px; font-weight:600;
}
.popup-order .popup-form__error{ margin:0 0 12px; text-align:left; color:var(--danger); font-size:13.5px; }

.popup.popup-order .btn.btn-orange.btn-submit,
.popup-order .btn-submit{
  display:flex; align-items:center; justify-content:center;
  width:100%; margin:20px 0 0; padding:14px 24px;
  background:var(--coral); border:1.5px solid var(--coral); border-radius:var(--radius-pill);
  color:#fff; font-family:'Manrope',sans-serif; font-size:15px; font-weight:700; letter-spacing:.2px;
  cursor:pointer; transition:background .15s, border-color .15s;
}
.popup.popup-order .btn.btn-orange.btn-submit:hover,
.popup-order .btn-submit:hover{ background:var(--coral-deep); border-color:var(--coral-deep); color:#fff; }
.popup.popup-order .btn.btn-orange.btn-submit:disabled,
.popup-order .btn-submit:disabled{ background:var(--muted); border-color:var(--muted); cursor:not-allowed; }

/* ---------------------------------------------------------------------------
   Экран «успех» (остаётся в потоке записи, приводим к теме)
   --------------------------------------------------------------------------- */
.popup-order .form-result .text-center{ text-align:center; }
.popup-order .form-result h3{
  margin:6px 0 10px; font-family:'Manrope',sans-serif; font-size:20px; font-weight:800;
  line-height:1.25; color:var(--ink);
}
.popup-order .form-result p{ margin:0 0 8px; color:var(--text); font-size:14.5px; }
.popup-order .form-result p b{ color:var(--ink); }

/* индикатор загрузки (три коралловых квадрата) уже коралловый — центрируем */
.popup-order svg[viewBox="0 0 200 200"]{ display:block; margin:10px auto; }

/* ---------------------------------------------------------------------------
   Каретка селекта (svg внутри .styled-select нарисован с fill="black")
   перекрыта выше через .styled-select svg path{ fill:currentColor }.
   Адаптив
   --------------------------------------------------------------------------- */
@media (max-width:560px){
  .popup-order{ padding:22px 18px !important; border-radius:20px !important; }
  .popup-order .popup-form__head{ font-size:20px; margin-bottom:14px; }
  .popup-order .popup-course-info{ padding:14px 15px; }
  .popup.popup-order .btn.btn-orange.btn-submit,
  .popup-order .btn-submit{ padding:13px 20px; }
}