/* Match the isolated IMS purchase UI to ERABUS. Native account styles stay separate. */
html:not(.widget-account) body { display: flow-root; color: #23384a; font: 500 18px/1.6 "Segoe UI", Arial, sans-serif; }
html:not(.widget-account) #app { display: flow-root; color: #23384a; font-family: "Segoe UI", Arial, sans-serif; font-size: 18px; line-height: 1.6; }
html:not(.widget-account) #app :is(h1, .octobus__title, .octobus__subtitle) { color: #142f4b; font-family: Montserrat, "Segoe UI", sans-serif; font-size: clamp(24px, 2.8vw, 32px) !important; font-weight: 750; line-height: 1.3; letter-spacing: -.035em; }
html:not(.widget-account) #app :is(h2, .title-info) { color: #173c60; font-family: Montserrat, "Segoe UI", sans-serif; font-size: 21px; font-weight: 650; line-height: 1.5; }
html:not(.widget-account) #app .result__title .octobus__price { color: #354f63; font: 500 18px/1.6 "Segoe UI", Arial, sans-serif; }
html:not(.widget-account) #app :is(.octobus__input, .octobus__select select) { min-height: 48px; border-color: #b9cbd5; border-radius: 6px; color: #173b56; font: 500 18px/1.5 "Segoe UI", Arial, sans-serif; }
html:not(.widget-account) #app .octobus__label { color: #29485f !important; font: 600 16px/1.5 "Segoe UI", Arial, sans-serif !important; }
html:not(.widget-account) #app .octobus__help { font-size: 15px !important; line-height: 1.6; }
html:not(.widget-account) #app .octobus__checkbox { color: #354f63; font-size: 16px; line-height: 1.65; }
html:not(.widget-account) #app .octobus__button { min-height: 48px; height: auto; padding: 11px 20px; border-radius: 6px; font: 700 16px/1.5 Montserrat, "Segoe UI", sans-serif; }
html:not(.widget-account) #app .octobus__button.is-primary { border-color: #f8ce46 !important; color: #15354f !important; background: #f8ce46 !important; }
html:not(.widget-account) #app .octobus__button.is-primary:hover { border-color: #ffdb6f !important; background: #ffdb6f !important; }
html:not(.widget-account) #app .octobus__button:focus-visible { outline: 3px solid #246ac0; outline-offset: 3px; }
html:not(.widget-account) #app .trips-menu { color: #4b6377; font: 650 14px/1.5 "Segoe UI", Arial, sans-serif !important; letter-spacing: .025em; }
html:not(.widget-account) #app .ticket { padding: 24px; border: 1px solid #d4dfe5; border-left: 3px solid #173c60; border-radius: 10px; color: #23384a; background: #fff; box-shadow: 0 4px 16px #102d4906; }
html:not(.widget-account) #app .ticket > .octobus__columns > .octobus__column { min-width: 0; }
html:not(.widget-account) #app .ticket :is(.time-departure, .time-arrived) { display: block; color: #173c60; font: 800 26px/1.25 Montserrat, "Segoe UI", sans-serif; font-weight: 800 !important; letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
html:not(.widget-account) #app .ticket :is(.date-departure, .date-arrived) { display: block; margin-top: 5px; color: #526b7b; font: 500 15px/1.5 "Segoe UI", Arial, sans-serif; }
html:not(.widget-account) #app .ticket .address-block { margin-top: 10px; }
html:not(.widget-account) #app .ticket :is(.city-departure, .city-arrived) { color: #23384a; font: 600 17px/1.55 "Segoe UI", Arial, sans-serif; white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
html:not(.widget-account) #app .ticket .stop-address { display: block; margin-top: 4px; color: #354f63; font: 500 16px/1.6 "Segoe UI", Arial, sans-serif; overflow-wrap: anywhere; }
html:not(.widget-account) #app .ticket .time-inway { color: #173c60; font: 650 18px/1.6 "Segoe UI", Arial, sans-serif; }
html:not(.widget-account) #app .ticket .places { color: #173c60; font: 700 21px/1.5 Montserrat, "Segoe UI", sans-serif; }
html:not(.widget-account) #app .ticket .ticket__price { margin: 0; color: #173c60 !important; font: 800 32px/1.25 Montserrat, "Segoe UI", sans-serif; letter-spacing: -.045em; font-variant-numeric: tabular-nums; white-space: normal; }
html:not(.widget-account) #app .ticket .carrier { margin: 0; color: #526b7b; font: 500 15px/1.6 "Segoe UI", Arial, sans-serif; font-size: 15px !important; font-weight: 500 !important; }
html:not(.widget-account) #app .ticket .change { color: #354f63; font-size: 15px !important; line-height: 1.6; }
html:not(.widget-account) #app :is(.station-name, .octobus__content) { color: #354f63; font-size: 16px !important; line-height: 1.65; }
html:not(.widget-account) #app .ticket .details-button { color: #173c60; font: 700 16px/1.5 "Segoe UI", Arial, sans-serif; }
html:not(.widget-account) #app .checkout-trip .octobus__price { color: #173c60 !important; font: 800 25px/1.35 Montserrat, "Segoe UI", sans-serif; font-variant-numeric: tabular-nums; }
html:not(.widget-account) #app .total { color: #173c60; font: 700 24px/1.5 Montserrat, "Segoe UI", sans-serif; }
html:not(.widget-account) #app .total.has-text-primary { color: #173c60 !important; font-size: 34px !important; font-weight: 800 !important; letter-spacing: -.04em; }
@media (min-width: 1024px) {
    html:not(.widget-account) #app .ticket > .octobus__columns:first-child > .octobus__column:last-child,
    html:not(.widget-account) #app .trips-menu > .octobus__column:last-child { flex: 0 0 240px; }
}
@media (max-width: 1023px) {
    html:not(.widget-account) #app .ticket .ticket__price { font-size: 30px; }
}
@media (min-width: 769px) and (max-width: 1023px) {
    html:not(.widget-account) #app .trips-menu { display: none !important; }
    html:not(.widget-account) #app .ticket > .octobus__columns:first-child { flex-wrap: wrap; }
    html:not(.widget-account) #app .ticket > .octobus__columns:first-child > .octobus__column:last-child { flex: 0 0 100%; margin-top: 12px; border-top: 1px solid #e2e9ec; }
}
@media (max-width: 600px) {
    html:not(.widget-account) #app .ticket { padding: 20px 16px; }
    html:not(.widget-account) #app .ticket .ticket__price { font-size: 28px; }
    html:not(.widget-account) #app .ticket :is(.time-block:not(.trip-arrow-div), .address-block) { display: block !important; width: 100%; max-width: none; }
    html:not(.widget-account) #app .ticket > .octobus__columns:first-child > .octobus__column:last-child > .octobus__columns.is-mobile { flex-wrap: wrap; gap: 12px; margin-left: 0; margin-right: 0; }
    html:not(.widget-account) #app .ticket > .octobus__columns:first-child > .octobus__column:last-child > .octobus__columns.is-mobile > .octobus__column { flex: 1 1 100%; padding-left: 0; padding-right: 0; }
}