/* Form 8 journey: intentionally loaded after legacy styles. */
#application, #tracking { background: #f6f8fb; margin: 0 -40px; padding-bottom: 32px; }
.app-top-bar { display:flex; justify-content:space-between; align-items:center; gap:24px; background:#0c3158; color:#fff; padding:22px 32px; margin:0 0 34px; border-radius:0; }
.app-brand { font-size:18px; font-weight:750; }
.app-meta { display:flex; align-items:center; gap:14px; color:#a9c6e3; }
.ref-number { font-weight:700; color:#fff; }
.journey-pill { border:1px solid #31577f; border-radius:999px; padding:5px 12px; font-size:13px; }
.form-layout { display:grid; grid-template-columns:320px minmax(0, 1fr); gap:0; align-items:stretch; }
.form-sidebar { width:auto; min-height:680px; background:#fbfcfe; border:1px solid #dfe6ee; border-radius:0; }
.sidebar-heading { padding:28px 24px 16px; color:#4a6078; font-size:14px; font-weight:500; }
.form-sidebar ul { margin:0; padding:0; list-style:none; }
.form-sidebar .sidebar-item { min-height:50px; padding:13px 24px; display:flex; align-items:center; gap:12px; border:0; color:#08294c; font-size:16px; line-height:1.35; }
.form-sidebar .sidebar-item.active { border-left:4px solid #e87518; background:#fff0e3; color:#06274b; }
.form-sidebar .sidebar-item .dot { flex:0 0 10px; width:10px; height:10px; margin:0; background:#d9e0e8; }
.form-sidebar .sidebar-item.active .dot { background:#e87518; }
.form-sidebar .sidebar-item.saved .dot { background:#219b62; }
.status-text { margin-left:auto; color:#219b62; white-space:nowrap; font-size:13px; }
.form-content-area { min-height:680px; padding:42px 46px; border:0; border-left:1px solid #dfe6ee; border-radius:0; background:#fff; }
.form-section { display:none; min-height:590px; position:relative; }
.form-section.active { display:block; }
.form-section h2, .tracking-content h1 { margin:0 0 6px; color:#071f3a; font-size:27px; }
.form-group { margin:26px 0; }
.form-group label { display:block; color:#061f3d; font-weight:650; margin-bottom:8px; }
.form-group input, .form-group select { box-sizing:border-box; width:100%; padding:14px 15px; border:1px solid #dce4ed; border-radius:8px; background:#fff; font:inherit; }
.form-group input.field-error, .form-group select.field-error { border-color:#c73e31; box-shadow:0 0 0 3px rgba(199,62,49,.12); }
.form-actions { position:absolute; left:0; right:0; bottom:0; display:flex; justify-content:space-between; padding-top:30px; border-top:1px solid #dfe6ee; }
.btn-simulate-fill { margin-left:auto; margin-right:12px; border-color:#6a87a4; color:#173f67; }
.tracking-content { min-height:740px; }
.tracking-content .ref-title { color:#e66f12; font-size:16px; font-weight:800; letter-spacing:.3px; margin:18px 0; }
.tracking-content > .muted { font-size:18px; margin-bottom:35px; }
.tracking-stepper { max-width:700px; margin:0; }
.timeline-event { position:relative; padding:0 0 28px 40px; }
.timeline-event::before { content:""; position:absolute; left:9px; top:18px; bottom:-1px; border-left:2px solid #dde4ec; }
.timeline-event:last-child::before { display:none; }
.timeline-event::after { content:""; position:absolute; left:1px; top:1px; width:16px; height:16px; border-radius:50%; background:#dfe5ec; }
.timeline-event.done::after { background:#219b62; }
.timeline-event.current::after { background:#113a63; }
.timeline-event h4 { margin:0 0 5px; font-size:20px; color:#061f3d; }
.timeline-event p { margin:0; color:#526987; font-size:16px; }
.tracking-next { max-width:none; margin:22px 0 30px; padding:26px 32px; background:#edf4fb; border-left:4px solid #163d65; }
.tracking-next h3 { margin:0 0 10px; font-size:21px; }
.tracking-next .split { display:flex; justify-content:space-between; gap:16px; margin-top:18px; }
.tracking-footnote { max-width:none; margin:0; padding:22px; border:0; border-radius:8px; background:#fff0e3; color:#904a0c; font-size:16px; line-height:1.45; }
.review-header { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; padding-bottom:24px; border-bottom:1px solid #dfe6ee; }
.review-header h1 { margin:8px 0; color:#071f3a; }
.review-header .journey-pill { color:#516b86; border-color:#cfdbe7; white-space:nowrap; }
.review-ready { display:flex; gap:12px; align-items:center; margin:24px 0; padding:16px 20px; color:#126943; background:#eaf7f0; border-left:4px solid #219b62; }
.review-ready span { color:#3e6353; }
.form-review-preview { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:18px; }
.review-section-card { border:1px solid #dce4ed; border-radius:10px; padding:20px; background:#fff; }
.review-card-header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:13px; }
.review-card-header h2 { margin:0; color:#08294c; font-size:17px; }
.review-edit-btn { padding:6px 9px; color:#174a79; }
.review-section-card dl { margin:0; }
.review-section-card dl div { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:8px 0; border-top:1px solid #edf1f5; }
.review-section-card dt { color:#61758c; font-size:13px; }
.review-section-card dd { margin:0; color:#0c2948; font-weight:600; font-size:14px; word-break:break-word; }
.review-actions { display:flex; justify-content:flex-end; gap:12px; margin:30px 0 5px; padding-top:22px; border-top:1px solid #dfe6ee; }
.modal { z-index:4000; }
.modal-box { max-width:610px; border-radius:14px; padding:30px 34px; }
.modal-box > h2 { color:#0b3765; margin:0 0 12px; }
.qr-wrap { display:flex; align-items:center; gap:28px; margin:26px 0 20px; }
.handoff-qr-frame { flex:0 0 184px; padding:12px; text-align:center; border:1px solid #cbd9e6; border-radius:10px; background:#fff; box-shadow:0 3px 12px rgba(9,44,99,.08); }
.handoff-qr-frame span { display:block; margin-top:9px; font-size:12px; font-weight:700; color:#526987; }
.qr { box-sizing:border-box; width:160px; height:160px; margin:auto; padding:8px; display:grid; grid-template-columns:repeat(21, 1fr); grid-template-rows:repeat(21, 1fr); gap:0; border:0; border-radius:2px; background:#fff; }
.qr i.dark { background:#0c3765; }
.qr i.light { background:#fff; }
.handoff-details { flex:1; }
.handoff-details b { display:block; color:#0b3765; font-size:17px; }
.handoff-details p { line-height:1.45; }
.handoff-expiry { color:#9a5a12; font-size:13px; font-weight:700; }
@media (max-width:760px) { #application, #tracking { margin:0 -20px; } .app-top-bar, .app-meta { align-items:flex-start; flex-direction:column; } .form-layout { grid-template-columns:1fr; } .form-sidebar { min-height:0; } .form-content-area { border-left:0; padding:28px 20px; } .form-section { min-height:620px; } .tracking-next .split { flex-direction:column; } }
@media (max-width:760px) { .review-header, .review-ready, .review-actions, .qr-wrap { align-items:flex-start; flex-direction:column; } .form-review-preview { grid-template-columns:1fr; } .review-actions { width:100%; } .review-actions .btn { width:100%; } }