/* ==========================================================================
   Booking step 2 "Abholdaten" v4 (2026-11-04, owner) – new-demo, design only.
   Loaded by php/fs-p2v4.php after all other booking CSS; everything is scoped to html.fsp2v4.
   One system: navy #0A1628 / #1F3E6B, azure #2E9BDA for focus, soft fields #F4F7FA, lines #E3E8EF.
   Sizes: section number 26px, field icon 34px, card icon 44px, info icon 16px – the same everywhere.
   ========================================================================== */
html.fsp2v4{
  --p4-navy:#0A1628; --p4-navy2:#1F3E6B; --p4-azure:#2E9BDA; --p4-soft:#F4F7FA; --p4-soft2:#EAF1F8;
  --p4-line:#E3E8EF; --p4-ink:#0F1B2D; --p4-text:#33445A; --p4-muted:#5B6B80; --p4-ok:#16804F; --p4-okbg:#ECF8F1;
}

/* ---------- card + heading ---------- */
html.fsp2v4 body .fs-flight-card h3{ font-size:26px !important; font-weight:800 !important; letter-spacing:-.02em; color:var(--p4-navy) !important; margin-bottom:6px !important; }
html.fsp2v4 body .fs-flight-card > p{ font-size:15px !important; line-height:1.5 !important; color:var(--p4-text) !important; margin-bottom:18px !important; }

/* ---------- "In 3 Schritten" strip ---------- */
html.fsp2v4 .fsp4-how{ margin:0 0 22px; padding:16px 16px 14px; border-radius:18px; background:linear-gradient(135deg,#0A1628 0%,#1F3E6B 100%); color:#fff; font-family:inherit; }
html.fsp2v4 .fsp4-how[hidden]{ display:none !important; }
html.fsp2v4 .fsp4-how-title{ display:flex; align-items:center; gap:8px; margin:0 0 12px; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#E2C877; }
html.fsp2v4 .fsp4-how ol{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; counter-reset:none; }
html.fsp2v4 .fsp4-how li{ position:relative; display:flex; align-items:flex-start; gap:10px; margin:0; padding:12px; border-radius:14px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.10); }
html.fsp2v4 .fsp4-how li::before{ display:none !important; }
html.fsp2v4 .fsp4-how-ic{ position:relative; flex:none; width:34px; height:34px; border-radius:50%; background:#fff; color:var(--p4-navy); display:flex; align-items:center; justify-content:center; }
html.fsp2v4 .fsp4-how-ic svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
html.fsp2v4 .fsp4-how-n{ position:absolute; top:-5px; right:-5px; width:17px; height:17px; border-radius:50%; background:#E2C877; color:#0A1628; font-size:10.5px; font-weight:800; line-height:17px; text-align:center; }
html.fsp2v4 .fsp4-how b{ display:block; font-size:14px; font-weight:800; line-height:1.3; color:#fff; }
html.fsp2v4 .fsp4-how small{ display:block; margin-top:2px; font-size:12.5px; font-weight:500; line-height:1.4; color:#C9D6E6; }

/* ---------- section headings: number + title + one hint line ---------- */
html.fsp2v4 body #pjTbsFlightDetailsForm{ gap:22px !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm label[data-fsp4-n]{
  display:flex !important; align-items:center; justify-content:flex-start !important; gap:10px; margin:0 0 8px !important; width:100%; text-align:left !important;
  font-size:15px !important; font-weight:800 !important; letter-spacing:0 !important; text-transform:none !important; color:var(--p4-ink) !important; line-height:1.3 !important;
}
html.fsp2v4 body #pjTbsFlightDetailsForm label[data-fsp4-n]::before{
  content:attr(data-fsp4-n); flex:none; width:26px; height:26px; border-radius:50%; background:var(--p4-navy); color:#fff;
  font-size:13px; font-weight:800; line-height:26px; text-align:center;
}
/* sub-field labels (airline, terminal, train fields) */
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-flight-fields-row label,
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-field-group > label:not([data-fsp4-n]){
  font-size:12.5px !important; font-weight:700 !important; letter-spacing:.02em !important; text-transform:none !important; color:var(--p4-muted) !important; margin:0 0 6px !important;
}
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-p2-hint{
  margin:-2px 0 10px 36px !important; font-size:13.5px !important; line-height:1.45 !important; color:var(--p4-muted) !important;
}

/* ---------- fields + one icon size ---------- */
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-input-wrap .fs-icon,
html.fsp2v4 body #pjTbsFlightDetailsForm .custom-input-wrapper > .icon,
html.fsp2v4 body #pjTbsFlightDetailsForm .fsdp-ic{
  width:34px !important; height:34px !important; border-radius:50% !important; background:var(--p4-soft2) !important; color:var(--p4-navy2) !important;
  box-shadow:none !important; font-size:14px !important; font-weight:800 !important;
}
html.fsp2v4 body #pjTbsFlightDetailsForm .fsdp-ic svg{ width:17px !important; height:17px !important; stroke:currentColor !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fsdp-ic{ flex:0 0 34px !important; display:grid !important; place-items:center; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-input-wrap .fs-icon,
html.fsp2v4 body #pjTbsFlightDetailsForm .custom-input-wrapper > .icon{ left:11px !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-input-wrap input,
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-input-wrap select,
html.fsp2v4 body #pjTbsFlightDetailsForm .custom-input-wrapper .custom-display-trigger{
  height:56px !important; min-height:56px !important; padding-left:56px !important; border:1.5px solid var(--p4-line) !important; background:var(--p4-soft) !important; border-radius:14px !important;
}
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-input-wrap input:focus,
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-input-wrap select:focus{ border-color:var(--p4-azure) !important; background:#fff !important; box-shadow:0 0 0 4px rgba(46,155,218,.16) !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-p2-datetime .fs-input-wrap input{ padding-left:54px !important; }
/* date/time picker button looks like the other fields */
html.fsp2v4 body #pjTbsFlightDetailsForm .fsdp-trg{
  min-height:56px !important; border:1.5px solid var(--p4-line) !important; background:var(--p4-soft) !important; border-radius:14px !important; padding:8px 14px 8px 11px !important; gap:11px !important; box-shadow:none !important;
}
html.fsp2v4 body #pjTbsFlightDetailsForm .fsdp-trg:hover{ border-color:#C7D3E0 !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fsdp-trg:focus-visible{ outline:none; border-color:var(--p4-azure) !important; box-shadow:0 0 0 4px rgba(46,155,218,.16) !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fsdp-l{ font-size:12px !important; color:var(--p4-muted) !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fsdp-v{ font-size:16px !important; font-weight:700 !important; color:var(--p4-ink) !important; }

/* ---------- info lines: one style ---------- */
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-flight-disclaimer,
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-p2-note-auto,
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-train-info-note{
  display:flex !important; align-items:flex-start !important; gap:8px !important; margin:10px 0 0 !important; padding:10px 12px !important;
  border-radius:12px !important; background:var(--p4-soft) !important; border:0 !important; font-size:13px !important; font-weight:500 !important; line-height:1.45 !important; color:var(--p4-text) !important;
}
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-flight-disclaimer i,
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-p2-note-auto i,
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-train-info-note i{ flex:none; width:16px; font-size:15px !important; line-height:19px !important; color:var(--p4-azure) !important; margin:0 !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-p2-note-auto + .fs-flight-fields-row,
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-flight-disclaimer + .fs-p2-note-auto{ margin-top:8px !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-flight-fields-row{ margin-top:14px !important; gap:12px !important; }

/* flight found / not found */
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-flight-recognized{ border:1.5px solid #BFE6D0 !important; background:var(--p4-okbg) !important; border-radius:16px !important; padding:14px !important; gap:12px !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-flight-recognized-icon{ width:44px !important; height:44px !important; min-width:44px !important; border-radius:50% !important; background:var(--p4-ok) !important; color:#fff !important; font-size:17px !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-flight-recognized-title{ font-size:15px !important; font-weight:800 !important; color:#0E5C38 !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-flight-recognized-desc{ font-size:13.5px !important; line-height:1.5 !important; color:#24563D !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-p2-reco-btn{ min-height:48px !important; padding:10px 14px !important; font-size:14.5px !important; font-weight:700 !important; border-radius:12px !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-p2-reco-time{ font-size:16px !important; font-weight:800 !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-flight-not-found{ border-radius:12px !important; font-size:13.5px !important; }

/* ---------- flight / train cards ---------- */
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-arrival-card{ border-radius:18px !important; padding:16px !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-arrival-card-icon{ width:44px !important; height:44px !important; min-width:44px !important; border-radius:14px !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-arrival-card-icon svg{ width:22px !important; height:22px !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-arrival-card-badge{ display:none !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-arrival-card.fsp4-has-rule .fs-arrival-card-explain{ display:none !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-arrival-card-explain{ font-size:13.5px !important; line-height:1.5 !important; color:var(--p4-text) !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-arrival-card:focus-visible{ outline:3px solid var(--p4-azure); outline-offset:2px; }
/* the time rule inside the flight card */
html.fsp2v4 .fsp4-rule{ grid-column:1 / -1; width:100%; margin-top:12px; padding-top:12px; border-top:1px dashed #C9D5E3; }
html.fsp2v4 .fsp4-rule-t{ margin:0 0 8px; font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--p4-navy2); }
html.fsp2v4 .fsp4-rule-row{ display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:12px; background:#fff; border:1px solid var(--p4-line); }
html.fsp2v4 .fsp4-rule-row + .fsp4-rule-row{ margin-top:6px; }
html.fsp2v4 .fsp4-rule-ic{ flex:none; width:34px; height:34px; border-radius:50%; background:var(--p4-soft2); color:var(--p4-navy2); display:flex; align-items:center; justify-content:center; }
html.fsp2v4 .fsp4-rule-ic svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
html.fsp2v4 .fsp4-rule-k{ flex:1; min-width:0; font-size:13px; font-weight:600; line-height:1.3; color:var(--p4-text); }
html.fsp2v4 .fsp4-rule-v{ flex:none; text-align:right; font-size:14px; font-weight:800; line-height:1.25; color:var(--p4-navy); }
html.fsp2v4 .fsp4-rule-v small{ display:block; font-size:11.5px; font-weight:600; color:var(--p4-muted); }
html.fsp2v4 .fsp4-rule-row.fsp4-on{ border-color:#16804F; background:#ECF8F1; box-shadow:0 0 0 2px rgba(22,128,79,.14); }
html.fsp2v4 .fsp4-rule-row.fsp4-on .fsp4-rule-ic{ background:#16804F; color:#fff; }
html.fsp2v4 .fsp4-rule-row.fsp4-on .fsp4-rule-v{ color:#0E5C38; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-p2-reco-btn i{ color:#E2C877 !important; font-size:16px !important; }
html.fsp2v4 .fsp4-rule-foot{ display:flex; align-items:flex-start; gap:8px; margin-top:8px; font-size:12.5px; line-height:1.45; color:var(--p4-muted); }
html.fsp2v4 .fsp4-rule-foot svg{ flex:none; width:16px; height:16px; margin-top:1px; fill:none; stroke:var(--p4-azure); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
html.fsp2v4 .fs-arrival-card:not(.active) .fsp4-rule{ opacity:.75; }

/* round-trip block headings, same icon size */
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-p2-block-head{ display:flex !important; align-items:center; gap:10px; font-size:15px !important; font-weight:800 !important; padding:12px 16px !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .fs-p2-block-head i{ width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.12); display:inline-flex; align-items:center; justify-content:center; font-size:15px !important; }

/* buttons */
html.fsp2v4 body #pjTbsFlightDetailsForm button[type="submit"]{ min-height:56px !important; border-radius:14px !important; font-size:16px !important; font-weight:800 !important; }
html.fsp2v4 body #pjTbsFlightDetailsForm .pjTbsBtnBackToHome{ min-height:56px !important; border-radius:14px !important; }

/* ==========================================================================
   +/- buttons (passengers, child seats, luggage) – touch-safe
   - touch-action:manipulation stops the double-tap zoom on phones (2 quick taps = 2 counts)
   - 44 px targets on touch screens, real minus sign, press feedback
   - the number box cannot be tapped (iOS zoomed into the 14 px read-only field)
   ========================================================================== */
html.fsp2v4 body .fs-mobile-pax-luggage .btn-group.pjTbs-spinner{
  display:inline-flex !important; align-items:center !important; gap:6px !important; border:0 !important; background:transparent !important; overflow:visible !important; border-radius:0 !important;
}
html.fsp2v4 body .fs-mobile-pax-luggage .btn-group.pjTbs-spinner > .btn.pjTbs-spinner{
  width:44px !important; height:44px !important; min-width:44px !important; max-width:none !important; min-height:44px !important; padding:0 !important; margin:0 !important;
  border:0 !important; border-radius:12px !important; background:var(--p4-soft2) !important; color:var(--p4-navy) !important;
  font-size:0 !important; line-height:1 !important; display:inline-flex !important; align-items:center !important; justify-content:center !important;
  touch-action:manipulation; -webkit-tap-highlight-color:transparent; -webkit-user-select:none; user-select:none; cursor:pointer;
  transition:background-color .12s ease, transform .08s ease;
}
html.fsp2v4 body .fs-mobile-pax-luggage .btn-group.pjTbs-spinner > .btn.pjTbs-spinner::before{ content:"+"; font-size:22px; font-weight:700; line-height:1; }
html.fsp2v4 body .fs-mobile-pax-luggage .btn-group.pjTbs-spinner > .btn.pjTbs-spinner[data-dir="-1"]::before{ content:"\2212"; }
html.fsp2v4 body .fs-mobile-pax-luggage .btn-group.pjTbs-spinner > .btn.pjTbs-spinner:active{ background:#D5E2F0 !important; transform:scale(.94); }
html.fsp2v4 body .fs-mobile-pax-luggage .btn-group.pjTbs-spinner > .btn.pjTbs-spinner:disabled{ opacity:.35; cursor:not-allowed; transform:none; }
html.fsp2v4 body .fs-mobile-pax-luggage .btn-group.pjTbs-spinner > .btn.pjTbs-spinner:focus-visible{ outline:3px solid var(--p4-azure); outline-offset:2px; }
html.fsp2v4 body .fs-mobile-pax-luggage .pjTbs-spinner-result{
  width:34px !important; height:44px !important; border:0 !important; background:transparent !important; padding:0 !important;
  font-size:18px !important; font-weight:800 !important; color:var(--p4-ink) !important; text-align:center !important; pointer-events:none !important;
}
html.fsp2v4 body .fs-mobile-pax-luggage .pjTbs-extra-row,
html.fsp2v4 body .fs-mobile-pax-luggage .input-group-all{ min-height:68px; padding-top:10px !important; padding-bottom:10px !important; touch-action:manipulation; }
/* all +/- groups in one column; names written like the passenger names */
html.fsp2v4 body .fs-mobile-pax-luggage .input-group-all{ display:flex !important; align-items:center !important; gap:10px; }
html.fsp2v4 body .fs-mobile-pax-luggage .input-group-all > :first-child{ flex:1 1 auto; min-width:0; }
html.fsp2v4 body .fs-mobile-pax-luggage .input-group-all > .btn-group.pjTbs-spinner,
html.fsp2v4 body .fs-mobile-pax-luggage .extra-input{ margin-left:auto !important; flex:none !important; }
html.fsp2v4 body .fs-mobile-pax-luggage .input-group-all label,
html.fsp2v4 body .fs-mobile-pax-luggage .input-group-all .luggage-label-text{ text-transform:none !important; letter-spacing:0 !important; font-size:14.5px !important; font-weight:700 !important; color:var(--p4-ink) !important; }
html.fsp2v4 body #step2_row_golf .btn-group.pjTbs-spinner{ gap:6px !important; }
html.fsp2v4 body .fs-mobile-pax-luggage .extra-icon{ width:40px !important; height:40px !important; min-width:40px !important; }
html.fsp2v4 body .fs-mobile-pax-luggage .extra-name label{ font-size:14.5px !important; }
html.fsp2v4 body .fs-mobile-pax-luggage .extra-desc{ font-size:12px !important; }
html.fsp2v4 body .fs-mobile-pax-luggage .custom-field-group > label{ font-size:15px !important; font-weight:800 !important; text-transform:none !important; letter-spacing:0 !important; color:var(--p4-ink) !important; }

/* ---------- phones ---------- */
@media (max-width:767px){
  html.fsp2v4 body .fs-flight-card h3{ font-size:22px !important; }
  html.fsp2v4 body .fs-flight-card > p{ font-size:14px !important; margin-bottom:14px !important; }
  html.fsp2v4 .fsp4-how{ margin-bottom:18px; padding:14px 12px 12px; border-radius:16px; }
  html.fsp2v4 .fsp4-how ol{ grid-template-columns:minmax(0,1fr); gap:0; }
  html.fsp2v4 .fsp4-how li{ padding:9px 4px; background:none; border:0; border-radius:0; align-items:center; }
  html.fsp2v4 .fsp4-how li + li{ border-top:1px solid rgba(255,255,255,.10); }
  html.fsp2v4 .fsp4-how b{ font-size:14px; }
  html.fsp2v4 .fsp4-how small{ font-size:12.5px; }
  html.fsp2v4 body #pjTbsFlightDetailsForm{ gap:20px !important; }
  html.fsp2v4 body #pjTbsFlightDetailsForm .fs-p2-hint{ margin-left:0 !important; }
  html.fsp2v4 body #pjTbsFlightDetailsForm .fs-flight-fields-row{ grid-template-columns:minmax(0,1fr) !important; }
  html.fsp2v4 .fsp4-rule-row{ padding:8px; }
  html.fsp2v4 .fsp4-rule-k{ font-size:12.5px; }
  html.fsp2v4 .fsp4-rule-v{ font-size:13.5px; }
}
@media (prefers-reduced-motion:reduce){
  html.fsp2v4 body .fs-mobile-pax-luggage .btn-group.pjTbs-spinner > .btn.pjTbs-spinner{ transition:none; }
  html.fsp2v4 body .fs-mobile-pax-luggage .btn-group.pjTbs-spinner > .btn.pjTbs-spinner:active{ transform:none; }
}

/* ==========================================================================
   One box for flight / train (2026-11-04, owner; sample /fs-lab/zug-flug-vorschau/)
   The site's two cards become a two-way switch on top; the chosen option's details open below in the same box.
   Strong prefix (4 ids) so it wins over fs-booking-v2 and the phone layout fs-m2 (:not(#a):not(#b)).
   ========================================================================== */
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode{ border:1.5px solid var(--p4-line); border-radius:20px; background:#fff; overflow:hidden; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-cards{
  display:grid !important; grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important; gap:6px !important; margin:0 !important; padding:6px !important; background:var(--p4-soft) !important; border:0 !important; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card{
  position:relative !important; display:grid !important; grid-template-columns:52px minmax(0,1fr) !important; grid-template-areas:"ic t" "ic d" !important;
  column-gap:12px !important; row-gap:2px !important; align-items:center !important; align-content:center !important;
  min-height:72px !important; height:auto !important; margin:0 !important; padding:10px 34px 10px 12px !important;
  border:1.5px solid transparent !important; border-radius:15px !important; background:transparent !important; box-shadow:none !important; text-align:left !important;
  cursor:pointer; touch-action:manipulation; -webkit-tap-highlight-color:transparent; transition:background-color .15s, border-color .15s, box-shadow .15s; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card:hover{ background:rgba(255,255,255,.65) !important; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card.active{ background:#fff !important; border-color:var(--p4-navy) !important; box-shadow:0 4px 14px rgba(10,22,40,.10) !important; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card:focus-visible{ outline:3px solid var(--p4-azure); outline-offset:2px; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card-top{ display:contents !important; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card-icon{
  grid-area:ic !important; position:static !important; width:52px !important; height:52px !important; min-width:52px !important; margin:0 !important;
  border-radius:14px !important; background:#E4EEF8 !important; display:flex !important; align-items:center; justify-content:center; box-shadow:none !important; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card.active .fs-arrival-card-icon{ background:#DCEBFA !important; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card-icon svg{ width:46px !important; height:46px !important; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card-title{ grid-area:t !important; align-self:end; margin:0 !important; font-size:15px !important; font-weight:800 !important; line-height:1.25 !important; color:var(--p4-ink) !important; text-align:left !important; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card-desc{ grid-area:d !important; align-self:start; margin:0 !important; font-size:12.5px !important; font-weight:500 !important; line-height:1.3 !important; color:var(--p4-muted) !important; text-align:left !important; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode :is(.fs-arrival-card-explain,.fs-arrival-card-badge,.fs-arrival-card .fsp4-rule){ display:none !important; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card-check{
  position:absolute !important; top:8px !important; right:8px !important; left:auto !important; width:20px !important; height:20px !important; margin:0 !important;
  border-radius:50% !important; border:1.5px solid #C7D3E0 !important; background:#fff !important; display:flex !important; align-items:center; justify-content:center; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card-check svg{ width:12px !important; height:12px !important; opacity:0; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card.active .fs-arrival-card-check{ background:var(--p4-navy) !important; border-color:var(--p4-navy) !important; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card.active .fs-arrival-card-check svg{ opacity:1; }
/* details under the switch */
html.fsp2v4 .fsp4-pflight{ padding:16px 16px 18px; animation:fsp4in .22s ease; }
html.fsp2v4 .fsp4-pflight[hidden]{ display:none !important; }
html.fsp2v4 .fsp4-pflight .fsp4-rule{ margin:0; padding:0; border:0; opacity:1 !important; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode #fs_train_fields_container{ margin:0 !important; padding:16px 16px 18px !important; gap:12px !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; animation:fsp4in .22s ease; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode #fs_train_fields_container .fs-field-group{ margin:0 !important; }
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode #fs_train_fields_container .fs-train-info-note{ margin:0 !important; }   /* stays after the fields: its text says the station is "above" */
html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode #train_station{ text-overflow:ellipsis; padding-right:30px !important; }
@keyframes fsp4in{ from{ opacity:0; transform:translateY(-4px); } to{ opacity:1; transform:none; } }
@media (max-width:767px){
  html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card{
    grid-template-columns:minmax(0,1fr) !important; grid-template-areas:"ic" "t" "d" !important; row-gap:6px !important; align-content:start !important;
    min-height:0 !important; padding:10px 10px 12px !important; }
  html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card-icon{ width:46px !important; height:46px !important; min-width:46px !important; }
  html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card-icon svg{ width:40px !important; height:40px !important; }
  html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card-title{ font-size:14px !important; align-self:start; }
  html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode .fs-arrival-card-desc{ font-size:12px !important; }
  html.fsp2v4 .fsp4-pflight{ padding:14px 12px 16px; }
  html.fsp2v4:not(#q1):not(#q2):not(#q3) body #pjTbsFlightDetailsForm .fsp4-mode #fs_train_fields_container{ padding:14px 12px 16px !important; }
}
@media (prefers-reduced-motion:reduce){ html.fsp2v4 .fsp4-pflight, html.fsp2v4 .fsp4-mode #fs_train_fields_container{ animation:none !important; } }