/* Visa application wizard + payment selection (authenticated flow).
   Loaded on top of the visa-apply design family; uses its tokens only. */

.va-wrap{max-width:900px;margin-inline:auto}
.va-form .is-invalid{border-color:#d64545!important;box-shadow:0 0 0 3px rgba(214,69,69,.10)}
.va-err{display:block;color:#c0392b;font-size:12.5px;font-weight:700;margin-top:6px;line-height:1.5}
.va-err[hidden]{display:none!important}

/* hero strip flag (country_flag is an uploaded image) */
.hero-strip .hs-flag{width:52px;height:52px;border-radius:50%;object-fit:cover;background:#fff;border:2px solid rgba(255,255,255,.35);flex:none}
.hero-strip .hs-flag-ph{width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;flex:none}
.hero-strip .hs-flag-ph svg{width:26px;height:26px}

/* 4-step progress labels */
.plabels span{cursor:default}
.plabels span.va-back{cursor:pointer}

/* visa plan cards */
.va-plans{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width:640px){.va-plans{grid-template-columns:1fr}}
.va-plans .ht-choice span{flex:1;min-width:0}
.va-plans .ht-choice b{font-size:15.5px}
.va-price{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:4px;font-size:13.5px;color:var(--muted)}
.va-price s{opacity:.7}
.va-price em{font-style:normal;color:var(--teal-d);font-weight:800}

/* date */
.va-date-display{margin-top:10px;font-size:14px;color:var(--teal-d);font-weight:700}
.datefield input[type=date]{height:100%;min-height:52px}

/* fingerprint cities: radio inputs inside .citybtn */
.cities .citybtn{position:relative}
.cities .citybtn input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.cities .citybtn:has(input:checked){border-color:var(--teal);background:#eefaf7}
.cities .citybtn:has(input:checked) i{border-color:var(--teal);background:var(--teal);box-shadow:inset 0 0 0 3px #fff}
.cities .citybtn:has(input:focus-visible){outline:3px solid var(--teal);outline-offset:2px}
.va-loading{color:var(--muted);font-size:14px;padding:8px 0}

/* traveller counters */
.va-counters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width:640px){.va-counters{grid-template-columns:1fr}}
.va-counter{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:#fff}
.va-counter > span b{display:block;color:var(--navy);font-size:15px}
.va-counter > span small{color:var(--muted);font-size:12.5px}
.va-stepper{display:flex;align-items:center;gap:6px;flex:none}
.va-stepper button{width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:var(--soft);font-weight:900;font-size:18px;color:var(--navy);cursor:pointer;line-height:1}
.va-stepper button:hover{border-color:var(--teal)}
.va-stepper input{width:58px;height:40px;text-align:center;border:1px solid var(--line);border-radius:12px;font-weight:800;font-size:16px;color:var(--navy);background:#fff;-moz-appearance:textfield}
.va-stepper input::-webkit-outer-spin-button,.va-stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.va-vip{margin-top:14px}

/* applicant fields */
.va-form .field{margin-bottom:0}
.va-form .field.va-full{grid-column:1/-1}
.va-form .f2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:640px){.va-form .f2{grid-template-columns:1fr}}
.va-form .field small.ht-help{margin-top:2px}

/* documents */
.va-docprog{margin:4px 0 16px}
.va-docprog .pbar i{width:0}
.va-docprog small{display:block;margin-top:6px;color:var(--muted);font-size:13px;text-align:end}
.va-doc{margin-bottom:14px}
.va-doc > label.upl{margin-top:0}
.va-doc .upl input[type=file]{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.va-doc .upl{position:relative}
.va-doc .upl:focus-within{outline:3px solid var(--teal);outline-offset:2px}
.va-doc .upl .va-check{color:var(--teal-d);margin-inline-start:6px}
.va-files{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px}
.va-file{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;padding:8px 12px;font-size:13.5px;background:#fff}
.va-file .va-fname{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--navy);font-weight:600;direction:ltr;text-align:start}
.va-file .va-fstate{color:var(--muted);font-size:12.5px;white-space:nowrap}
.va-file.is-done{border-color:#bfe8dc;background:#f4fbf9}
.va-file.is-done .va-fstate{color:var(--teal-d);font-weight:700}
.va-file.is-failed{border-color:#f3c6c6;background:#fdf0f0}
.va-file.is-failed .va-fstate{color:#9b2c2c;white-space:normal}
.va-file button{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:15px;padding:2px 6px;border-radius:6px}
.va-file button:hover{color:#c0392b;background:#fdf0f0}
.va-spin{width:14px;height:14px;border:2px solid var(--line);border-top-color:var(--teal);border-radius:50%;animation:vaSpin .8s linear infinite;flex:none}
@keyframes vaSpin{to{transform:rotate(360deg)}}
.va-textdoc{margin-bottom:14px}
.va-textdoc textarea{min-height:96px}

/* review */
.va-review-block + .va-review-block{margin-top:14px;padding-top:14px;border-top:1px dashed var(--line)}
.va-review-block h4{font-size:15px;color:var(--navy);margin-bottom:8px;font-weight:800}
.va-review-block .sumline b{color:var(--navy);text-align:end;max-width:62%;overflow-wrap:anywhere}
.va-doclist{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:14px}
.va-doclist li{display:flex;gap:8px;align-items:center;color:var(--muted)}
.va-doclist li.ok{color:var(--teal-d);font-weight:700}
.va-doclist li::before{content:"○";font-weight:900}
.va-doclist li.ok::before{content:"✓"}
.va-totals{background:var(--soft);border-radius:14px;padding:12px 16px;margin-top:14px}
.va-totals .ht-sum.disc{color:#0f6b5c}
.va-vipbadge{display:inline-flex;align-items:center;gap:6px;background:#fff8e8;border:1px solid #f0dcb0;color:#7a5a12;border-radius:20px;padding:3px 12px;font-size:13px;font-weight:700;margin-top:6px}

.stickybar .btn[disabled]{opacity:.55;cursor:not-allowed;box-shadow:none}

/* payment selection */
.va-payopts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media (max-width:720px){.va-payopts{grid-template-columns:1fr}}
.va-payopt{display:flex;flex-direction:column;gap:8px;border:1.5px solid var(--line);border-radius:16px;padding:20px;background:#fff}
.va-payopt.main{border-color:var(--teal);background:#f3fbf9}
.va-payopt .va-payic{width:46px;height:46px;border-radius:14px;background:#e8f6f3;color:var(--teal-d);display:flex;align-items:center;justify-content:center}
.va-payopt .va-payic svg{width:24px;height:24px}
.va-payopt b{color:var(--navy);font-size:17px}
.va-payopt p{color:var(--muted);font-size:14px;flex:1}
.va-payopt .ht-btn{margin-top:6px}
.va-headrow{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.va-headrow h3{margin-bottom:0}
.gw .gwbody .field{margin-bottom:12px}
.gw .gwbody .va-counters{margin-bottom:12px}
.gw .gwbox{max-height:calc(100vh - 36px);overflow:auto}
.gwhead button{border:0;background:rgba(255,255,255,.14);color:#fff;width:34px;height:34px;border-radius:10px;cursor:pointer;font-size:16px}

/* ===== 3-step visa flow (new design) ===== */
.va-paxrow{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:10px 0;border-bottom:1px dashed var(--line)}
.va-paxrow:last-of-type{border-bottom:0}
.va-paxlbl{font-weight:800;color:var(--navy)}
.va-paxlbl small{color:var(--muted);font-weight:600;margin-inline-start:4px}
.va-paxrow .numchips{display:flex;gap:8px;flex-wrap:wrap}
.va-planchip{cursor:pointer;display:inline-flex;gap:8px;align-items:center}
.va-planchip small{color:var(--muted);font-weight:600}
.va-planchip.sel small{color:inherit}
.va-upl{cursor:pointer}
.va-upl.done{border-color:#bfe8dc;background:#f4fbf9}
.va-textdoc{margin:10px 0}
.va-textdoc input,.va-textdoc textarea{width:100%}
.va-file.is-bad{border-color:#f3c6c6;background:#fdf0f0}
.va-file.is-bad .va-fstate{color:#9b2c2c;white-space:normal}
.va-full{grid-column:1/-1}
.va-err{display:block;color:#c0392b;font-size:12.5px;font-weight:600;margin-top:6px}
.docgroup + .docgroup{margin-top:14px}
#mainbtn .spin3{margin-inline-end:8px}
.spin3{width:16px;height:16px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;display:inline-block;vertical-align:-3px;animation:sp3 .8s linear infinite}@keyframes sp3{to{transform:rotate(360deg)}}