/* Progress.tz v2.9.16 — Responsive + Sticky Advertisements */

/*
 Supported legacy/current advertisement selectors are intentionally broad.
 Existing ad markup does not need to be renamed.
*/

:root{
  --progress-ad-max-inline:100%;
  --progress-ad-radius:16px;
  --progress-ad-sticky-top:88px;
  --progress-ad-gap:18px;
  --progress-ad-border:rgba(23,52,94,.14);
  --progress-ad-bg:#ffffff;
}

html[data-theme="dark"],
body[data-theme="dark"],
html.dark,
body.dark,
.dark-mode{
  --progress-ad-border:#294056;
  --progress-ad-bg:#0d1b2a;
}

/* Advertisement shells */
:is(
  .advertisement,
  .advert,
  .ad-card,
  .ad-slot,
  .advert-slot,
  .advertisement-slot,
  .sidebar-ad,
  .right-rail-ad,
  .progress-ad,
  [data-ad],
  [data-ad-slot],
  [data-advertisement]
){
  min-width:0;
  max-width:100%;
  overflow:hidden;
}

/* Creative wrapper */
:is(
  .advertisement,
  .advert,
  .ad-card,
  .ad-slot,
  .advert-slot,
  .advertisement-slot,
  .sidebar-ad,
  .right-rail-ad,
  .progress-ad,
  [data-ad],
  [data-ad-slot],
  [data-advertisement]
) :is(
  img,
  picture,
  video,
  iframe
){
  display:block;
  width:100%;
  max-width:100%;
}

/* Images retain their natural ratio and never stretch. */
:is(
  .advertisement,
  .advert,
  .ad-card,
  .ad-slot,
  .advert-slot,
  .advertisement-slot,
  .sidebar-ad,
  .right-rail-ad,
  .progress-ad,
  [data-ad],
  [data-ad-slot],
  [data-advertisement]
) img{
  height:auto!important;
  object-fit:contain!important;
  object-position:center;
}

/* Video follows its intrinsic ratio. */
:is(
  .advertisement,
  .advert,
  .ad-card,
  .ad-slot,
  .advert-slot,
  .advertisement-slot,
  .sidebar-ad,
  .right-rail-ad,
  .progress-ad,
  [data-ad],
  [data-ad-slot],
  [data-advertisement]
) video{
  height:auto;
  max-height:520px;
  object-fit:contain;
  background:#000;
}

/* External/embed creative: controlled 16:9 frame unless a native ratio is supplied. */
:is(
  .advertisement,
  .advert,
  .ad-card,
  .ad-slot,
  .advert-slot,
  .advertisement-slot,
  .sidebar-ad,
  .right-rail-ad,
  .progress-ad,
  [data-ad],
  [data-ad-slot],
  [data-advertisement]
) iframe{
  border:0;
  aspect-ratio:16 / 9;
  height:auto;
}

/* Prevent ad links from exceeding their column. */
:is(
  .advertisement,
  .advert,
  .ad-card,
  .ad-slot,
  .advert-slot,
  .advertisement-slot,
  .sidebar-ad,
  .right-rail-ad,
  .progress-ad,
  [data-ad],
  [data-ad-slot],
  [data-advertisement]
) > a{
  display:block;
  width:100%;
  max-width:100%;
}

/* Desktop */
@media (min-width:1100px){
  :is(
    .sidebar-ad,
    .right-rail-ad,
    .advertisement.sticky-ad,
    .advert.sticky-ad,
    .ad-card.sticky-ad,
    .ad-slot.sticky-ad,
    [data-ad-sticky="true"],
    [data-ad-position="sidebar"],
    [data-ad-position="right"]
  ){
    position:sticky!important;
    top:var(--progress-ad-sticky-top)!important;
    align-self:start;
    z-index:4;
    max-height:calc(100vh - 110px);
    overflow:auto;
    overscroll-behavior:contain;
  }

  /* Typical right rail ad width — responsive within its actual grid column. */
  :is(
    .sidebar-ad,
    .right-rail-ad,
    [data-ad-position="sidebar"],
    [data-ad-position="right"]
  ){
    width:100%;
    max-width:380px;
    margin-inline:auto;
  }
}

/* Tablet portrait + landscape */
@media (min-width:768px) and (max-width:1099px){
  :is(
    .sidebar-ad,
    .right-rail-ad,
    .advertisement.sticky-ad,
    .advert.sticky-ad,
    .ad-card.sticky-ad,
    .ad-slot.sticky-ad,
    [data-ad-sticky="true"],
    [data-ad-position="sidebar"],
    [data-ad-position="right"]
  ){
    position:sticky!important;
    top:76px!important;
    align-self:start;
    z-index:4;
    max-height:calc(100vh - 96px);
    overflow:auto;
  }

  :is(
    .sidebar-ad,
    .right-rail-ad,
    [data-ad-position="sidebar"],
    [data-ad-position="right"]
  ){
    width:min(100%,340px);
    margin-inline:auto;
  }
}

/* Inline/banner ads: proportional but not sticky. */
:is(
  .top-ad,
  .banner-ad,
  .inline-ad,
  [data-ad-position="top"],
  [data-ad-position="banner"],
  [data-ad-position="inline"]
){
  width:100%;
  max-width:100%;
  position:relative!important;
  top:auto!important;
}

/* Mobile: sticky ads are deliberately disabled. */
@media (max-width:767px){
  :is(
    .advertisement,
    .advert,
    .ad-card,
    .ad-slot,
    .advert-slot,
    .advertisement-slot,
    .sidebar-ad,
    .right-rail-ad,
    .progress-ad,
    [data-ad],
    [data-ad-slot],
    [data-advertisement]
  ){
    position:relative!important;
    top:auto!important;
    width:100%!important;
    max-width:100%!important;
    max-height:none!important;
    overflow:visible;
    margin-inline:0;
  }
}

/* UI polish */
:is(
  .advertisement,
  .advert,
  .ad-card,
  .ad-slot,
  .advert-slot,
  .advertisement-slot,
  .sidebar-ad,
  .right-rail-ad,
  .progress-ad,
  [data-ad],
  [data-ad-slot],
  [data-advertisement]
).progress-ad-managed{
  border-radius:var(--progress-ad-radius);
}

/* Hide accidental overflow from fixed-width ad creative. */
.progress-ad-managed{
  contain:layout paint;
}

.progress-ad-managed img,
.progress-ad-managed video,
.progress-ad-managed iframe{
  border-radius:inherit;
}