/* T379: one footer bottom anatomy for Travel (footer#contact), Visa and Shop
   (footer.ts-footer). Loaded by the Travel HTML pages and by the Next root layout,
   like dock.css. Each rule names both footers in one selector list; do not copy
   these rules into experience.css, mobile.css, public-shell.css or shop-effects.css.
   Order on every width: payment row, trust row, then the bottom bar with copyright
   and Powered by on the left, policy links and Credits in one row on the right.
   App widths (<=1024px) keep the app-footer contract (TOKENS.md: policy links hidden)
   and show Credits centered under Powered by on all three. */

/* Trademark after FiKHSONS: one style everywhere (footers, account and workspace). */
.group-credit sup {
  position: relative;
  top: -0.5em;
  margin-left: 1px;
  font-size: 0.6em;
  font-weight: 500;
  line-height: 0;
  vertical-align: baseline;
}

/* Bottom bar, every width (T246 geometry, previously copied in two files). */
:is(footer#contact .footer-bottom, footer.ts-footer .ts-footer-bottom) {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 10px 24px;
  margin-top: 18px;
  border-top: 1px solid rgba(11, 63, 93, 0.12);
}
:is(footer#contact .footer-bottom .copyright, footer.ts-footer .ts-footer-bottom .ts-copyright) {
  display: flex;
  align-items: baseline;
  gap: 4px 10px;
  margin: 0;
  padding: 0;
}
:is(footer#contact .footer-bottom .copyright, footer.ts-footer .ts-footer-bottom .ts-copyright)
  > :is(.copyright-main, .group-credit) {
  display: inline;
  margin: 0;
  color: inherit;
  font: inherit;
}
:is(footer#contact .footer-bottom .group-credit a, footer.ts-footer .ts-footer-bottom .group-credit a) {
  color: inherit;
  font: inherit;
  font-weight: 600;
  text-decoration: none;
}
:is(footer#contact .footer-bottom .footer-policies, footer.ts-footer .ts-footer-bottom .ts-footer-policies) {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px 24px;
  width: auto;
  margin: 0;
  padding: 0;
}

/* Credits disclosure (T363), same place and type as the policy links. */
:is(.geo-attribution, .ts-geo-attribution) {
  margin: 0;
  font: inherit;
  line-height: inherit;
}
:is(.geo-attribution, .ts-geo-attribution) > summary {
  padding: 0;
  cursor: pointer;
  list-style: none;
  color: #0b3f5d;
  font: inherit;
}
:is(.geo-attribution, .ts-geo-attribution)
  > summary::-webkit-details-marker {
  display: none;
}
:is(.geo-attribution, .ts-geo-attribution)
  > summary:focus-visible {
  outline: 2px solid #b81d24;
  outline-offset: 2px;
}
:is(.geo-attribution, .ts-geo-attribution)[open] {
  flex-basis: 100%;
}
:is(.geo-attribution, .ts-geo-attribution) > a {
  display: inline-block;
  padding: 4px 0 0 12px;
  color: #0b3f5d;
  font: inherit;
}
:is(.geo-attribution, .ts-geo-attribution):not([open]) > a {
  display: none;
}
:is(footer#contact .footer-bottom, footer.ts-footer .ts-footer-bottom)
  :is(.footer-policies > a, .ts-footer-policies > a, summary, details > a):is(:hover, :focus-visible) {
  color: #b81d24;
}

@media (min-width: 1025px) {
  :is(footer#contact .footer-bottom, footer.ts-footer .ts-footer-bottom) {
    flex-direction: row;
    flex-wrap: wrap;
    padding: 14px 0 4px;
    text-align: left;
  }
  :is(footer#contact .footer-bottom .copyright, footer.ts-footer .ts-footer-bottom .ts-copyright) {
    flex: 0 1 auto;
    flex-wrap: wrap;
    justify-content: flex-start;
    color: #5a6975;
    font: 400 12px/1.6 Roboto, Arial, sans-serif;
    text-align: left;
  }
  :is(footer#contact .footer-bottom .footer-policies, footer.ts-footer .ts-footer-bottom .ts-footer-policies) {
    flex: 1 1 auto;
    justify-content: flex-end;
    font: 400 12px/1.6 Roboto, Arial, sans-serif;
  }
  :is(footer#contact .footer-bottom .footer-policies, footer.ts-footer .ts-footer-bottom .ts-footer-policies)
    > a {
    color: #0b3f5d;
    font: inherit;
  }
  :is(.geo-attribution, .ts-geo-attribution)[open] {
    text-align: right;
  }

  /* Payment row: label beside the card marks, as on the Travel desktop footer. */
  :is(footer#contact .footer-payments, footer.ts-footer .ts-footer-payments) {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-top: 18px;
    margin-bottom: 0;
    padding: 0;
    border: 0;
  }
  :is(footer#contact .footer-payments > p, footer.ts-footer .ts-pay-label) {
    display: flex;
    align-items: center;
    margin: 0;
    color: #0b3f5d;
    font: 500 13px/1.4 Roboto, Arial, sans-serif;
  }
  :is(footer#contact .payment-marks, footer.ts-footer .ts-pay-marks) {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
  }
  :is(footer#contact .payment-mark, footer.ts-footer .ts-pay-mark) {
    display: grid;
    place-items: center;
    box-sizing: border-box;
    width: 38px;
    height: 24px;
    overflow: hidden;
    border: 1px solid #dce5ec;
    border-radius: 3px;
    background: #fff;
  }
  :is(footer#contact .payment-mark img, footer.ts-footer .ts-pay-mark img) {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  /* Trust row: privacy, connection and network links between payments and the bar. */
  :is(footer#contact .experience-trust, footer.ts-footer .ts-footer-trust) {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 24px;
    margin-top: 0;
    margin-bottom: 0;
    padding: 22px 0;
    border-top: 1px solid #e4edf2;
  }
  :is(footer#contact .experience-trust a, footer.ts-footer .ts-footer-trust a) {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #0b3f5d;
    font: 400 12px/1.65 Roboto, Arial, sans-serif;
    text-decoration: none;
  }
  :is(footer#contact .experience-trust svg, footer.ts-footer .ts-footer-trust svg) {
    flex: none;
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
  }
}

@media (max-width: 1024px) {
  :is(footer#contact .footer-bottom, footer.ts-footer .ts-footer-bottom) {
    flex-direction: column;
    align-items: center;
    padding: 12px 30px 0;
    text-align: center;
  }
  :is(footer#contact .footer-bottom .copyright, footer.ts-footer .ts-footer-bottom .ts-copyright) {
    flex-wrap: wrap;
    justify-content: center;
    white-space: normal;
    text-align: center;
  }
  /* App-footer contract: policy links stay hidden; the row still carries Credits. */
  :is(footer#contact .footer-bottom .footer-policies, footer.ts-footer .ts-footer-bottom .ts-footer-policies) {
    justify-content: center;
    font: 400 11px/1.5 Roboto, Arial, sans-serif;
  }
  :is(footer#contact .footer-bottom .footer-policies, footer.ts-footer .ts-footer-bottom .ts-footer-policies)
    > a {
    display: none;
  }
  :is(.geo-attribution, .ts-geo-attribution) > summary {
    padding: 6px 8px;
  }
}

/* T382: on pages with Travelsian's Lisra chat the round button (54 px, 18 px from the
   corner) must not cover the last footer link on desktop. */
@media (min-width: 1025px) {
  html.has-lisra-chat :is(footer#contact .footer-bottom, footer.ts-footer .ts-footer-bottom) {
    padding-right: 76px;
  }
}