/* V216 — sticky purchase ticker, sticky popular platforms, resilient payment logos */

:root{
  --buy-utility-h:43px;
  --buy-header-h:72px;
}

/* Keep the worldwide/verified activity ticker visible while scrolling. */
.utility-bar{
  position:sticky!important;
  top:0!important;
  z-index:92!important;
  min-height:var(--buy-utility-h)!important;
  box-shadow:0 1px 0 rgba(22,34,65,.04)!important;
}
.header{
  top:var(--buy-utility-h)!important;
  z-index:88!important;
}
.platform-switch-rail{
  top:calc(var(--buy-utility-h) + var(--buy-header-h))!important;
  z-index:84!important;
  box-shadow:0 8px 24px rgba(18,33,65,.045)!important;
}

.utility-grid{
  min-height:var(--buy-utility-h)!important;
}
.utility-spotlight{
  min-width:0!important;
  max-width:min(620px,58vw)!important;
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  grid-template-areas:"dot service" "dot meta"!important;
  align-items:center!important;
  gap:2px 8px!important;
  padding:6px 12px!important;
  border-radius:14px!important;
  white-space:normal!important;
}
.utility-live-dot{grid-area:dot!important;align-self:center!important}
.utility-platform-pill{grid-area:service!important;min-width:0!important;display:flex!important;align-items:center!important;gap:7px!important}
.utility-platform-pill strong{
  display:block!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  font-size:11px!important;
  line-height:1.2!important;
}
.utility-spotlight small{
  grid-area:meta!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  font-size:9.5px!important;
  line-height:1.2!important;
}

/* Home + service pages: keep popular platform logos close while scrolling. */
.platform-switch-rail{
  background:rgba(255,255,255,.94)!important;
  -webkit-backdrop-filter:blur(16px) saturate(135%)!important;
  backdrop-filter:blur(16px) saturate(135%)!important;
}
.platform-switch-track{
  min-height:54px!important;
  gap:9px!important;
  padding-block:7px!important;
}
.platform-switch-track a{
  min-height:38px!important;
  padding:6px 10px!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.72)!important;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease!important;
}
.platform-switch-track a:hover{
  transform:translateY(-1px)!important;
  box-shadow:0 8px 18px rgba(22,36,70,.07)!important;
}
.platform-switch-icon,
.platform-switch-icon img{
  width:22px!important;
  height:22px!important;
  object-fit:contain!important;
}
html[data-theme="dark"] .platform-switch-rail{background:rgba(12,20,34,.95)!important}
html[data-theme="dark"] .platform-switch-track a{background:rgba(22,33,53,.84)!important}

/* Bottom-right verified order card: lighter, smaller and never render raw external URL text as icon. */
.buyenify-spotlight{
  width:min(390px,calc(100vw - 28px))!important;
  min-height:76px!important;
  padding:11px 12px!important;
  border-radius:20px!important;
  box-shadow:0 18px 46px rgba(23,37,72,.16)!important;
}
.spotlight-icon{
  width:50px!important;
  height:50px!important;
  border-radius:15px!important;
  overflow:hidden!important;
}
.spotlight-brand-icon{width:30px!important;height:30px!important;object-fit:contain!important}
.spotlight-copy{min-width:0!important}
.spotlight-meta{font-size:9px!important;line-height:1.2!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.spotlight-copy strong{font-size:13px!important;line-height:1.25!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.spotlight-copy small{font-size:10.5px!important;line-height:1.25!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.spotlight-link{width:45px!important;height:45px!important;border-radius:14px!important}
.spotlight-close{top:6px!important;right:7px!important}

/* Payment methods: always render known built-in marks even when admin logo fields are empty. */
.footer-payment-rail{
  margin-top:24px!important;
  padding:16px 18px!important;
  border:1px solid rgba(220,226,238,.75)!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.55)!important;
}
.footer-payment-logos{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:18px 24px!important;
  overflow:visible!important;
}
.footer-payment-logo{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:70px!important;
  height:34px!important;
  padding:5px 8px!important;
  border-radius:10px!important;
  background:rgba(255,255,255,.72)!important;
}
.footer-payment-logo img{
  display:block!important;
  width:auto!important;
  height:20px!important;
  max-width:82px!important;
  max-height:22px!important;
  object-fit:contain!important;
  opacity:.86!important;
  filter:none!important;
}
.footer-payment-logo-mastercard img{height:24px!important;max-width:38px!important}
.footer-payment-logo-amex img{height:22px!important;max-width:36px!important}
.footer-payment-logo-visa img{height:17px!important;max-width:54px!important}
.footer-payment-security{
  margin-top:10px!important;
  justify-content:center!important;
}
html[data-theme="dark"] .footer-payment-rail{
  background:rgba(255,255,255,.035)!important;
  border-color:#28364d!important;
}
html[data-theme="dark"] .footer-payment-logo{
  background:rgba(255,255,255,.92)!important;
}
html[data-theme="dark"] .footer-payment-logo img{opacity:.9!important}
html[data-theme="dark"] .footer-payment-logo .payment-mark-dark{display:block!important}
html[data-theme="dark"] .footer-payment-logo.has-dark-mark .payment-mark-light{display:none!important}
html:not([data-theme="dark"]) .footer-payment-logo .payment-mark-dark{display:none!important}

@media(max-width:760px){
  :root{--buy-utility-h:36px;--buy-header-h:66px}
  .utility-grid{min-height:36px!important;grid-template-columns:minmax(0,1fr) auto!important;gap:6px!important}
  .utility-promo{display:none!important}
  .utility-theme{display:none!important}
  .utility-spotlight{
    max-width:100%!important;
    width:100%!important;
    min-height:30px!important;
    padding:4px 8px!important;
    border-radius:10px!important;
    gap:1px 6px!important;
  }
  .utility-platform-pill img{width:16px!important;height:16px!important}
  .utility-platform-pill strong{font-size:9.5px!important}
  .utility-spotlight small{font-size:8.2px!important}
  .platform-switch-rail{top:calc(var(--buy-utility-h) + var(--buy-header-h))!important}
  .platform-switch-track{min-height:48px!important;gap:7px!important;padding:6px 4px!important;overflow-x:auto!important;scrollbar-width:none!important}
  .platform-switch-track::-webkit-scrollbar{display:none!important}
  .platform-switch-track a{flex:0 0 auto!important;min-height:34px!important;padding:5px 8px!important;border-radius:10px!important}
  .platform-switch-track a span{font-size:10px!important}
  .platform-switch-icon,.platform-switch-icon img{width:19px!important;height:19px!important}
  .buyenify-spotlight{left:10px!important;right:10px!important;bottom:10px!important;width:auto!important;min-height:66px!important;padding:9px 10px!important;border-radius:17px!important}
  .spotlight-icon{width:44px!important;height:44px!important;border-radius:13px!important}
  .spotlight-brand-icon{width:27px!important;height:27px!important}
  .spotlight-copy strong{font-size:12px!important}.spotlight-copy small{font-size:9.5px!important}.spotlight-meta{font-size:8px!important}
  .spotlight-link{width:40px!important;height:40px!important}
  .footer-payment-rail{padding:13px 10px!important}
  .footer-payment-logos{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:9px 6px!important}
  .footer-payment-logo{min-width:0!important;width:100%!important;height:30px!important;padding:4px!important}
  .footer-payment-logo img{height:16px!important;max-width:54px!important}
  .footer-payment-logo-mastercard img{height:20px!important;max-width:31px!important}
  .footer-payment-security{font-size:9px!important;gap:8px!important}
}