/* R169 — concise progress context above the existing booking form. */
.f24-pbf { margin: 0 0 1rem; padding: .82rem .9rem; border: 1px solid #e0e7ff; border-radius: 1rem; background: linear-gradient(135deg,#f8faff,#f5f3ff); }
.f24-pbf-steps { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: .28rem; margin: 0; padding: 0; list-style: none; }
.f24-pbf-steps li { display: flex; min-width: 0; align-items: center; gap: .34rem; color: #94a3b8; font-size: .72rem; font-weight: 750; white-space: nowrap; }
.f24-pbf-steps li span { display: inline-grid; flex: 0 0 auto; width: 1.35rem; height: 1.35rem; place-items: center; border: 1px solid #cbd5e1; border-radius: 999px; background: #fff; color: #64748b; font-size: .67rem; }
.f24-pbf-steps li.is-done, .f24-pbf-steps li.is-current { color: #3730a3; }
.f24-pbf-steps li.is-done span { border-color: #818cf8; background: #eef2ff; color: #4338ca; }
.f24-pbf-steps li.is-current span { border-color: #4f46e5; background: #4f46e5; color: #fff; box-shadow: 0 2px 6px rgba(79,70,229,.25); }
.f24-pbf-summary { margin: .65rem 0 0; color: #475569; font-size: .76rem; line-height: 1.35; }
@media (max-width: 520px) { .f24-pbf { padding: .72rem; } .f24-pbf-steps { gap: .16rem; } .f24-pbf-steps li { justify-content:center; } .f24-pbf-steps li b { display:none; } .f24-pbf-summary { font-size:.73rem; } }