/* NewsDesk 2.2.97 – mobile WordPress toolbar and header stability.
 * Fix the extra WordPress html offset while retaining the fixed three-band header.
 * The admin toolbar stays visible on mobile instead of scrolling off the page.
 */
@media (max-width:782px) {
  /* WordPress injects html {margin-top:46px} for its normally non-fixed toolbar.
     With NewsDesk's fixed header the margin adds a second unwanted blank strip. */
  html, html:has(> body.admin-bar) { margin-top: 0 !important; scroll-padding-top: calc(var(--dv-header, 160px) + 46px); }
  html body.admin-bar #wpadminbar {
    display:block !important;
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    height:46px !important;
    min-height:46px !important;
    z-index:2147483100 !important;
    transform:none !important;
    visibility:visible !important;
    opacity:1 !important;
  }
  html body.admin-bar header.site-header,
  html body.admin-bar.darkvideo-home-landing header.site-header {
    position:fixed !important;
    top:46px !important;
    z-index:2147482000 !important;
  }
  html body.admin-bar main#content.site-content,
  html body.admin-bar.darkvideo-home-landing main#content.site-content {
    padding-top:calc(var(--dv-header, 160px) + 46px) !important;
    margin-top:0 !important;
  }
  html body.admin-bar .mobile-menu-panel {top:calc(var(--dv-header, 160px) + 46px) !important;}
  html body.admin-bar .mobile-overlay {top:46px !important;}
  /* The mobile landing area begins after the fixed header; no duplicate spacer. */
  html body.darkvideo-home-landing .dv-front-page-container,
  html body.darkvideo-home-landing .dv-front-page-center,
  html body.darkvideo-home-landing .dv-mobile-home {
    margin-top:0 !important;
  }
  html body.darkvideo-home-landing .dv-mobile-home > :first-child,
  html body.darkvideo-home-landing .dv-mobile-home > .dv-theme-livedesk-home:first-child {
    margin-top:0 !important;
  }
}

/* Keep the Breaking News title legible at all times (also while the Website
   Viewer is open). The three rotating visual treatments remain lightweight,
   but the words never animate to opacity zero or outside their label. */
html body header.site-header .nd-ref-breaking .nd-ref-breaking-title,
html body header.site-header .nd-ref-breaking .nd-ref-breaking-title > span {
  visibility: visible !important;
  opacity: 1 !important;
}
html body header.site-header .nd-ref-breaking.nd-breaking-stage-1 .nd-ref-breaking-title > span {
  animation:nd297LabelSlide 5s ease-out 1 both !important;
}
html body header.site-header .nd-ref-breaking.nd-breaking-stage-2 .nd-ref-breaking-title > span {
  animation:nd297LabelZoom 5s ease-out 1 both !important;
}
html body header.site-header .nd-ref-breaking.nd-breaking-stage-3 .nd-ref-breaking-title > span {
  animation:nd297LabelSweep 5s ease-out 1 both !important;
}
@keyframes nd297LabelSlide {
  0%{transform:translateX(-5px) skewX(-7deg)}
  16%,100%{transform:none}
}
@keyframes nd297LabelZoom {
  0%{transform:scale(.91)}
  16%{transform:scale(1.045)}
  24%,100%{transform:scale(1)}
}
@keyframes nd297LabelSweep {
  0%{transform:translateX(5px) skewX(7deg)}
  18%,100%{transform:none}
}
@media(prefers-reduced-motion:reduce){
  html body header.site-header .nd-ref-breaking.nd-breaking-stage-1 .nd-ref-breaking-title > span,
  html body header.site-header .nd-ref-breaking.nd-breaking-stage-2 .nd-ref-breaking-title > span,
  html body header.site-header .nd-ref-breaking.nd-breaking-stage-3 .nd-ref-breaking-title > span { animation:none !important;transform:none !important; }
}
