/* SG304 — iOS App Store top banner hotfix.
   Dedicated stylesheet loaded AFTER the page bundles so the banner cannot be
   left unstyled by the legacy bundled PWA CSS. */
:root{--slr-ios-app-banner-h:70px}

.slr-ios-app-banner,
.slr-ios-app-banner *{box-sizing:border-box!important}

.slr-ios-app-banner{
  --slr-banner-bg:#ffffff;
  --slr-banner-fg:#111318;
  --slr-banner-muted:#69717c;
  --slr-banner-line:rgba(17,24,39,.12);
  --slr-banner-btn:#0a84ff;
  position:fixed!important;
  top:0!important;
  right:0!important;
  left:0!important;
  z-index:2147483000!important;
  width:100%!important;
  height:var(--slr-ios-app-banner-h)!important;
  min-height:var(--slr-ios-app-banner-h)!important;
  max-height:var(--slr-ios-app-banner-h)!important;
  margin:0!important;
  padding:8px 10px!important;
  display:grid!important;
  grid-template-columns:28px 48px minmax(0,1fr) 70px!important;
  align-items:center!important;
  gap:8px!important;
  overflow:hidden!important;
  border:0!important;
  border-bottom:1px solid var(--slr-banner-line)!important;
  border-radius:0!important;
  background:var(--slr-banner-bg)!important;
  color:var(--slr-banner-fg)!important;
  box-shadow:0 2px 10px rgba(15,23,42,.10)!important;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Arial,sans-serif!important;
  line-height:1!important;
  opacity:0;
  transform:translateY(-100%);
  transition:transform .18s ease,opacity .18s ease;
  -webkit-font-smoothing:antialiased;
  isolation:isolate;
}
html[data-sg-theme="dark"] .slr-ios-app-banner,
html[data-slr-theme="dark"] .slr-ios-app-banner{
  --slr-banner-bg:#15171c;
  --slr-banner-fg:#f7f8fb;
  --slr-banner-muted:#a8afb9;
  --slr-banner-line:rgba(255,255,255,.10);
  --slr-banner-btn:#0a84ff;
  box-shadow:0 2px 12px rgba(0,0,0,.32)!important;
}
.slr-ios-app-banner[hidden]{display:none!important}
.slr-ios-app-banner.is-visible{opacity:1!important;transform:translateY(0)!important}

.slr-ios-app-banner-close{
  appearance:none!important;
  -webkit-appearance:none!important;
  width:28px!important;
  height:36px!important;
  min-width:28px!important;
  min-height:36px!important;
  margin:0!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  align-self:center!important;
  border:0!important;
  border-radius:9px!important;
  background:transparent!important;
  box-shadow:none!important;
  color:var(--slr-banner-muted)!important;
  font:400 26px/1 -apple-system,BlinkMacSystemFont,"SF Pro Text",sans-serif!important;
  text-align:center!important;
  cursor:pointer!important;
  transform:none!important;
}
.slr-ios-app-banner-close:active{background:rgba(127,127,127,.12)!important}

.slr-ios-app-banner-icon{
  display:block!important;
  width:48px!important;
  height:48px!important;
  min-width:48px!important;
  max-width:48px!important;
  min-height:48px!important;
  max-height:48px!important;
  margin:0!important;
  padding:0!important;
  object-fit:cover!important;
  border:1px solid rgba(127,127,127,.16)!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:none!important;
}

.slr-ios-app-banner-copy{
  min-width:0!important;
  width:auto!important;
  margin:0!important;
  padding:0!important;
  display:block!important;
  overflow:hidden!important;
  color:var(--slr-banner-fg)!important;
  line-height:1!important;
}
.slr-ios-app-banner-copy strong{
  display:block!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  color:var(--slr-banner-fg)!important;
  font:700 15px/18px -apple-system,BlinkMacSystemFont,"SF Pro Text",sans-serif!important;
  letter-spacing:-.15px!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
}
.slr-ios-app-banner-copy span{
  display:block!important;
  min-width:0!important;
  margin:3px 0 0!important;
  padding:0!important;
  overflow:hidden!important;
  color:var(--slr-banner-muted)!important;
  font:400 11.5px/15px -apple-system,BlinkMacSystemFont,"SF Pro Text",sans-serif!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
}
.slr-ios-app-banner-copy small{display:none!important}

.slr-ios-app-banner-action{
  appearance:none!important;
  -webkit-appearance:none!important;
  width:70px!important;
  min-width:70px!important;
  height:32px!important;
  min-height:32px!important;
  margin:0!important;
  padding:0 8px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  align-self:center!important;
  overflow:hidden!important;
  border:0!important;
  border-radius:16px!important;
  background:var(--slr-banner-btn)!important;
  box-shadow:none!important;
  color:#fff!important;
  font:700 11px/1 -apple-system,BlinkMacSystemFont,"SF Pro Text",sans-serif!important;
  letter-spacing:.15px!important;
  text-align:center!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  transform:none!important;
}
.slr-ios-app-banner-action:visited,
.slr-ios-app-banner-action:hover{color:#fff!important;text-decoration:none!important}
.slr-ios-app-banner-action:active{opacity:.72!important}

/* The SerieAGoal shell uses fixed headers. When the custom iOS banner is
   visible, shift those bars down instead of letting the banner overlap them. */
html.slr-ios-banner-visible .sg-topbar{
  top:var(--slr-ios-app-banner-h)!important;
  inset-block-start:var(--slr-ios-app-banner-h)!important;
}
html.slr-ios-banner-visible .sg-sportbar{
  top:calc(var(--sg-topbar-h,58px) + var(--slr-ios-app-banner-h))!important;
}
html.slr-ios-banner-visible body.sg-body:not(.sg-no-contextbar):not(.sg-has-editorial-contextbar){
  padding-top:calc(var(--sg-topbar-h,58px) + var(--sg-contextbar-h,44px) + var(--slr-ios-app-banner-h))!important;
}
html.slr-ios-banner-visible body.sg-body.sg-no-contextbar{
  padding-top:calc(var(--sg-topbar-h,58px) + var(--slr-ios-app-banner-h))!important;
}
html.slr-ios-banner-visible body.sg-body.sg-has-editorial-contextbar{
  padding-top:calc(var(--sg-topbar-h,58px) + var(--sg-contextbar-h,44px) + var(--slr-ios-app-banner-h))!important;
}
html.slr-ios-banner-visible .sg-mobile-menu-overlay{
  top:calc(var(--sg-topbar-h,58px) + var(--slr-ios-app-banner-h))!important;
}

@media(max-width:760px){
  :root{--slr-ios-app-banner-h:68px}
  .slr-ios-app-banner{
    height:68px!important;
    min-height:68px!important;
    max-height:68px!important;
    grid-template-columns:26px 46px minmax(0,1fr) 64px!important;
    gap:7px!important;
    padding:7px 8px!important;
  }
  .slr-ios-app-banner-close{width:26px!important;min-width:26px!important;height:34px!important;min-height:34px!important;font-size:24px!important}
  .slr-ios-app-banner-icon{width:46px!important;height:46px!important;min-width:46px!important;max-width:46px!important;min-height:46px!important;max-height:46px!important;border-radius:11px!important}
  .slr-ios-app-banner-copy strong{font-size:14px!important;line-height:17px!important}
  .slr-ios-app-banner-copy span{font-size:10.5px!important;line-height:14px!important;margin-top:2px!important}
  .slr-ios-app-banner-action{width:64px!important;min-width:64px!important;height:30px!important;min-height:30px!important;border-radius:15px!important;font-size:10.5px!important}
  html.slr-ios-banner-visible body.sg-body:not(.sg-no-contextbar):not(.sg-has-editorial-contextbar){
    padding-top:calc(var(--sg-topbar-h,56px) + var(--sg-contextbar-h,40px) + var(--slr-ios-app-banner-h))!important;
  }
  html.slr-ios-banner-visible body.sg-body.sg-has-editorial-contextbar{
    padding-top:calc(var(--sg-topbar-h,56px) + var(--slr-ios-app-banner-h))!important;
  }
}
@media(max-width:360px){
  .slr-ios-app-banner{grid-template-columns:24px 42px minmax(0,1fr) 58px!important;gap:6px!important;padding-inline:6px!important}
  .slr-ios-app-banner-close{width:24px!important;min-width:24px!important}
  .slr-ios-app-banner-icon{width:42px!important;height:42px!important;min-width:42px!important;max-width:42px!important;min-height:42px!important;max-height:42px!important;border-radius:10px!important}
  .slr-ios-app-banner-copy strong{font-size:13px!important}
  .slr-ios-app-banner-copy span{font-size:10px!important}
  .slr-ios-app-banner-action{width:58px!important;min-width:58px!important;padding-inline:5px!important;font-size:10px!important}
}
@media(prefers-reduced-motion:reduce){.slr-ios-app-banner{transition:none!important}}