.vw .vw-progress { margin: 0 0 14px; }
.vw .vw-count { margin: 8px 0 0; font-size: 13px; font-weight: 700; color: #153E35; }
.vw .vw-stepper { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; }
.vw .vw-dot { position: relative; flex: 1 1 0; display: flex; justify-content: flex-end; }
.vw .vw-dot:first-child { flex: 0 0 auto; }
.vw .vw-dot:not(:first-child)::before { content: ""; position: absolute; left: 0; right: 24px; top: 50%; height: 3px; margin-top: -1.5px; background: #e2e8f0; }
.vw .vw-dot.is-done:not(:first-child)::before, .vw .vw-dot.is-current:not(:first-child)::before { background: #153E35; }
.vw .vw-dot-mark { position: relative; z-index: 1; width: 24px; height: 24px; border-radius: 50%; border: 2px solid #cbd5e1; background: #fff; display: grid; place-items: center; color: #fff; transition: background .2s ease, border-color .2s ease; }
.vw .vw-dot-mark svg { width: 14px; height: 14px; }
.vw .vw-dot.is-done .vw-dot-mark { background: #153E35; border-color: #153E35; }
.vw .vw-dot.is-current .vw-dot-mark { background: #E8A92D; border-color: #E8A92D; box-shadow: 0 0 0 4px #f4b5442b; }
.vw .vw-step { display: grid; gap: 16px; }
.vw .vw-step-title { margin: 0; font-size: 17px; font-weight: 800; color: #0f172a; }
.vw .vw-summary { display: grid; gap: 0; margin: 0; border: 1px solid #e2e8f0; border-radius: 12px; overflow: hidden; }
.vw .vw-summary > div { display: flex; justify-content: space-between; gap: 12px; padding: 9px 12px; border-bottom: 1px solid #eef2f1; font-size: 14px; }
.vw .vw-summary > div:last-child { border-bottom: 0; }
.vw .vw-summary dt { color: #64748b; }
.vw .vw-summary dd { margin: 0; font-weight: 700; text-align: right; overflow-wrap: anywhere; }
.vw .vw-warning { margin: 0; padding: 10px 12px; border-radius: 10px; background: #fef2f2; color: #b91c1c; font-size: 14px; font-weight: 600; }
.vw .vw-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 22px; border-radius: 12px; font-weight: 700; font-size: 15px; cursor: pointer; border: 1px solid #153E35; }
.vw .vw-btn--primary { background: #153E35; color: #fff; }
.vw .vw-btn--primary:hover { background: #0F3029; }
.vw .vw-btn--ghost { background: #fff; color: #153E35; }

@media (max-width: 639px) {
  .vw .vw-nav { position: sticky; bottom: 0; z-index: 5; margin: 0 -16px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid #e2e8f0; }
  .vw .vw-nav .vw-btn { flex: 1; }
  .vw .vw-nav .vw-cancel { display: none; }
  .vw .vw-nav { justify-content: flex-end; }
}

.vw .vw-draft { display: grid; gap: 10px; margin: 0 0 14px; padding: 12px; border: 1px solid #cfd8d3; border-radius: 12px; background: #f4f8f6; font-size: 14px; }
.vw .vw-draft p { margin: 0; }
.vw .vw-dot .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }

/* In the modal the progress stays at the top and the buttons at the bottom; only the step fields scroll. */
#form-modal-body .vw .vw-progress { position: sticky; top: 0; z-index: 6; margin: 0; padding: 8px 0 10px; background: #FBF9F4; }
#form-modal-body .vw .vw-nav { position: sticky; bottom: 0; z-index: 6; margin: 0; padding: 12px 0 4px; background: #FBF9F4; border-top: 1px solid #e8e4d8; }
.vw .vw-note { margin: 0; padding: 10px 12px; border-radius: 10px; background: #fff7e6; color: #8a5a00; font-size: 14px; font-weight: 600; }
.vw .vw-invalid { border-color: #dc2626 !important; box-shadow: 0 0 0 2px #fecaca; }

.vw .vw-upload { display: grid; gap: 14px; padding: 8px 0 4px; }
.vw .vw-upload-title { margin: 0; font-size: 20px; font-weight: 800; color: #0f172a; }
.vw .vw-upload-hint { margin: 0; font-size: 14px; color: #64748b; }
.vw .vw-up-head { display: flex; justify-content: space-between; gap: 12px; margin: 0 0 6px; font-size: 14px; font-weight: 700; color: #153E35; }
.vw .vw-up-bar { height: 10px; border-radius: 5px; background: #e2e8f0; overflow: hidden; }
.vw .vw-up-bar span { display: block; height: 100%; border-radius: 5px; background: #153E35; transition: width .15s linear; }
.vw .vw-upload-status { margin: 0; font-size: 14px; font-weight: 600; color: #8a5a00; }
.vw .vw-upload-status.is-busy::after { content: ""; display: inline-block; width: 12px; height: 12px; margin-left: 8px; vertical-align: -1px; border: 2px solid #E8A92D; border-top-color: transparent; border-radius: 50%; animation: vw-spin .8s linear infinite; }
@keyframes vw-spin { to { transform: rotate(360deg); } }
.vw.is-sending .vw-progress, .vw.is-sending .vw-step, .vw.is-sending .vw-nav, .vw.is-sending .vw-warning, .vw.is-sending .vw-note, .vw.is-sending .vw-draft { display: none !important; }
