/* ADS-B Exchange: Tailvision app bar, top of the homepage (scrolls away with the page) */
.adsbx-appbar, .adsbx-appbar * { box-sizing: border-box; }
.adsbx-appbar {
  position: relative; z-index: 9990; width: 100%;
  display: grid; align-items: center; column-gap: 16px;
  grid-template-columns: auto 1fr auto auto auto;
  grid-template-areas: "icon text badges divider close";
  min-height: 48px; padding: 7px 24px 7px 72px;
  background: linear-gradient(90deg, #3A2AB0 0%, #5B3FD9 55%, #3C5BE0 100%);
  font-family: inherit; color: #FFFFFF; text-align: left; line-height: 1.3;
  overflow: hidden; transition: max-height 0.22s ease, padding 0.22s ease, opacity 0.18s ease;
  max-height: 200px;
}
.adsbx-appbar.is-leaving { max-height: 0; padding-top: 0; padding-bottom: 0; min-height: 0; opacity: 0; }
.adsbx-appbar p { margin: 0; }
.adsbx-appbar a { text-decoration: none !important; border: 0; background: none; padding: 0; margin: 0; }

.adsbx-appbar__icon { grid-area: icon; display: block; width: 30px; height: 30px; border-radius: 7px; }
.adsbx-appbar__text { grid-area: text; min-width: 0; display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.adsbx-appbar .adsbx-appbar__title { font-size: 15px; font-weight: 700; letter-spacing: -0.01em !important; text-transform: none !important; color: #FFFFFF !important; }
.adsbx-appbar .adsbx-appbar__sub { font-size: 13px; text-transform: none !important; letter-spacing: normal !important; color: rgba(255, 255, 255, 0.78) !important; }
.adsbx-appbar .adsbx-appbar__sub--mobile, .adsbx-appbar .adsbx-appbar__title-short { display: none; }

.adsbx-appbar__badges { grid-area: badges; display: flex; align-items: center; gap: 8px; }
.adsbx-appbar a.adsbx-appbar__badge { display: block; line-height: 0; border-radius: 6px; overflow: hidden; box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.45); transition: box-shadow 0.15s ease, transform 0.15s ease; }
.adsbx-appbar a.adsbx-appbar__badge:hover { box-shadow: 0 0 0 2px #FFFFFF; }
.adsbx-appbar__badge img { display: block; width: 95px; height: 28px; }

.adsbx-appbar__divider { grid-area: divider; width: 1px; height: 22px; margin: 0 2px; background: rgba(255, 255, 255, 0.22); }
.adsbx-appbar button.adsbx-appbar__close {
  grid-area: close; width: 30px; height: 30px; margin: 0; padding: 0; border: 0; border-radius: 50%;
  background: rgba(255, 255, 255, 0.12); color: #FFFFFF; cursor: pointer; box-shadow: none;
  display: flex; align-items: center; justify-content: center;
}
.adsbx-appbar button.adsbx-appbar__close:hover { background: rgba(255, 255, 255, 0.22); }
.adsbx-appbar a:focus-visible, .adsbx-appbar button:focus-visible { outline: 2px solid #FFFFFF; outline-offset: 3px; }

/* Phones and small tablets: two rows, both store badges */
@media (max-width: 768px) {
  .adsbx-appbar {
    grid-template-columns: 28px 34px 1fr;
    grid-template-areas: "close icon text" ". badges badges";
    column-gap: 10px; row-gap: 8px; padding: 8px 12px 9px 6px;
  }
  .adsbx-appbar__icon { width: 34px; height: 34px; }
  .adsbx-appbar__text { flex-direction: column; align-items: flex-start; gap: 1px; }
  .adsbx-appbar .adsbx-appbar__title { font-size: 13px; }
  .adsbx-appbar .adsbx-appbar__title-full, .adsbx-appbar .adsbx-appbar__sub--desktop { display: none; }
  .adsbx-appbar .adsbx-appbar__title-short { display: inline; }
  .adsbx-appbar .adsbx-appbar__sub { font-size: 11px; }
  .adsbx-appbar .adsbx-appbar__sub--mobile { display: inline; }
  .adsbx-appbar__badges { grid-column: 2 / 4; gap: 8px; }
  .adsbx-appbar__badge img { width: 88px; height: 26px; }
  .adsbx-appbar__divider { display: none; }
  .adsbx-appbar button.adsbx-appbar__close { width: 28px; height: 30px; background: none; }
}

@media (prefers-reduced-motion: reduce) {
  .adsbx-appbar, .adsbx-appbar a.adsbx-appbar__badge { transition: none; }
}