/* ===== Callback component (scoped) ===== */
.ms-callback{ max-width:560px; margin-inline:auto; color:#fff; }
.ms-callback__head{ margin-bottom:10px; }
.ms-callback__title{ margin:4px 0 6px; font-size:clamp(20px,3.2vw,26px); font-weight:800; }
.ms-callback__subtitle{ margin:0 0 10px; color:var(--muted,#b7bdc6); }

.ms-callback__summary{ display:flex; flex-wrap:wrap; gap:8px; margin:8px 0 14px; }
.ms-callback__pill{
  display:inline-flex; align-items:center; gap:8px; white-space:nowrap;
  padding:8px 12px; border-radius:999px; border:1px solid var(--border, rgba(255,255,255,.12));
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  color:#fff; font-weight:600; font-size:.95rem; box-shadow:0 10px 28px rgba(0,0,0,.18);
}

.ms-callback__status{ min-height:22px; margin:6px 0; font-size:.95rem; }
.ms-callback__status--ok{ color:#6ee7a3; }
.ms-callback__status--err{ color:#ff8692; }

.ms-callback__form{ padding:18px; display:grid; gap:14px;
  background:var(--panel, rgba(255,255,255,.06));
  border:1px solid var(--border, rgba(255,255,255,.12));
  border-radius:16px; box-shadow:0 18px 50px rgba(0,0,0,.35);
}

.ms-callback__field{ display:grid; gap:6px; }

.ms-callback label{ color:#fff; font-weight:600; font-size:.95rem; }
.ms-callback input, .ms-callback select, .ms-callback textarea{
  width:100%; border-radius:10px; border:1px solid #3a3a3a; background:#1f1f1f; color:#fff;
  padding:1rem .85rem; transition:border-color .15s ease, box-shadow .15s ease;
}
.ms-callback input:focus, .ms-callback select:focus, .ms-callback textarea:focus{
  outline:none; border-color:#ff6a3d; box-shadow:0 0 0 3px rgba(255,106,61,.25);
}

.ms-callback__hint{ color:var(--muted,#b7bdc6); font-size:.88rem; margin:4px 0 0; }
.ms-callback__hint a{ color:inherit; text-decoration:underline dotted; }

.ms-callback__actions{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-top: 34px}
.ms-callback__btn{
  appearance:none; cursor:pointer; border-radius:12px; border:1px solid var(--border, rgba(255,255,255,.12));
  padding:12px 16px; color:#fff; background:transparent; font-weight:800;
  transition:transform .18s ease, background .18s ease, border-color .18s ease;
  text-decoration:none; display:inline-flex; align-items:center; justify-content:center;
}
.ms-callback__btn:hover{ transform:translateY(-1px); }
.ms-callback__btn[disabled]{ cursor:not-allowed; transform:none; }
.ms-callback__btn--primary{ background:#ff6a3d; border-color:#ff6a3d; }

@media (max-width:420px){
  .ms-callback__actions{ flex-direction:column; }
  .ms-callback__btn{ width:100%; }
}

/* Success panel */
.ms-callback__success{ text-align:center; padding:32px 24px;
  background:var(--panel, rgba(255,255,255,.06));
  border:1px solid var(--border, rgba(255,255,255,.12));
  border-radius:16px; box-shadow:0 18px 50px rgba(0,0,0,.35);
}
.ms-callback__success-title{ margin:12px 0 6px; font-size:22px; }
.ms-callback__success-text{ color:var(--muted,#b7bdc6); margin-bottom:16px; }
.ms-callback__success-ico{ width:88px; height:88px; margin:0 auto; }
.ms-callback__success-ico svg{ width:100%; height:100%; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.ms-callback__success-circle{ stroke:rgba(255,255,255,.25); }
.ms-callback__success-check{ stroke:#32d296; stroke-dasharray:48; stroke-dashoffset:48; }
@keyframes ms-callback-check{ to{ stroke-dashoffset:0; } }
@media (prefers-reduced-motion: no-preference){
  .ms-callback__success-check{ animation: ms-callback-check 600ms ease forwards 200ms; }
}