/* Engine additions to the real NewsUp/Newspaperex stylesheet (main.css): what the original did with its scripts, its plugins
   or the WordPress runtime, plus the accessibility details a static copy needs. */
[hidden] { display: none !important; }
.skip-link { position: absolute; left: -9999px; top: 0; z-index: 100000; background: #fff; color: #000; padding: 8px 14px; }
.skip-link:focus { left: 8px; top: 8px; }
.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal; }
a:focus-visible, button:focus-visible, .ta_upscr:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

/* ---- navbar -------------------------------------------------------------------------------------------------- */
.navbar-toggler { cursor: pointer; }
/* without JavaScript the collapsed menu would be unreachable on narrow screens: show it open */
html:not(.js) #navbar-wp.collapse:not(.show) { display: block; }
/* submenus: hover and keyboard focus on wide screens (the original used SmartMenus), the .show class set by newsup.js elsewhere */
.navbar-nav .dropdown-menu.show { display: block; }
@media (min-width: 992px) {
  /* newsup.js opens them with .show (hover, focus, arrow keys); without it plain CSS does */
  html:not(.js) .navbar-nav li.dropdown:hover > .dropdown-menu,
  html:not(.js) .navbar-nav li.dropdown:focus-within > .dropdown-menu { display: block; }
  /* what SmartMenus set inline on the submenus: shrink to the items, 10em..20em, first level under its link, next levels beside it */
  .navbar-wp .navbar-nav:not(.sm-collapsible) li.dropdown > .dropdown-menu { width: max-content; min-width: 10em; max-width: 20em; top: auto; left: 0; margin: 0; z-index: 11; }
  .navbar-wp .navbar-nav:not(.sm-collapsible) li.dropdown li.dropdown > .dropdown-menu { top: 0; left: 100%; margin-left: -2px; }
  .navbar-nav li.dropdown { position: relative; }
}

/* the search icon (out of scope) sat left of the bell: keep the bell and the toggler together at the right on narrow screens */
.m-header .btn-bell.mx-2 { margin-left: auto !important; }

/* ---- ticker (jquery.marquee: 50px/s, two copies, pauses on hover) ---------------------------------------------- */
.mg-latest-news-slider.marquee { overflow: hidden; white-space: nowrap; }
.mg-latest-news-slider.marquee .js-marquee-wrapper { display: flex; width: max-content; animation: newsup-marquee var(--marquee-time, 30s) linear infinite; }
.mg-latest-news-slider.marquee .js-marquee-wrapper.is-paused { animation-play-state: paused; }
.mg-latest-news-slider.marquee .js-marquee { flex: none; margin-right: 20px; }
@keyframes newsup-marquee { from { transform: translateX(0); } to { transform: translateX(var(--marquee-shift, -50%)); } }
/* without JS the list is simply there; with reduced motion it stays still and can be scrolled */
@media (prefers-reduced-motion: reduce) {
  .mg-latest-news-slider.marquee { overflow-x: auto; }
  .mg-latest-news-slider.marquee .js-marquee-wrapper { animation: none; }
  .mg-latest-news-slider.marquee .js-marquee[aria-hidden="true"] { display: none; }
}

/* ---- carousel (OwlCarousel 1: one slide, arrows) --------------------------------------------------------------- */
.owl-carousel.owl-loaded { display: block; }
.owl-carousel.owl-loaded .owl-wrapper { display: block; }
.owl-carousel:not(.owl-loaded) { display: block; }
.owl-carousel:not(.owl-loaded) .item:nth-child(n+2) { display: none; }
.owl-controls .owl-buttons div { cursor: pointer; }
@media (prefers-reduced-motion: reduce) { .owl-carousel .owl-wrapper { transition: none !important; } }

/* ---- tabs ---------------------------------------------------------------------------------------------------- */
#exTab2 .nav-tabs .nav-link { cursor: pointer; }
/* without JavaScript the tab links still reach their list: the targeted pane replaces the default one */
html:not(.js) #exTab2 .tab-content:has(.tab-pane:target) > .tab-pane.active:not(:target) { display: none; }
html:not(.js) #exTab2 .tab-content > .tab-pane:target { display: block; opacity: 1; }

/* ---- sidebar gallery (the justified-gallery plugin's tiles, without its script) --------------------------------- */
.nu-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(var(--nu-row, 160px), 1fr)); gap: 3px; padding: 3px; }
.nu-gallery .nu-gallery-item { margin: 0; aspect-ratio: 1; overflow: hidden; }
.nu-gallery .nu-gallery-item a { display: block; height: 100%; }
.mg-sidebar .nu-gallery .nu-gallery-item img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ---- avatars: the export has no gravatar, a neutral picture keeps the author block's layout -------------------------- */
.mg-author-pic img.avatar { border-radius: 50%; background: #e6e6e6; }
.ta_upscr { cursor: pointer; }

/* ---- reduced motion: the ticker label's endless ripple (theme CSS) and smooth scrolling stay still ---------------- */
@media (prefers-reduced-motion: reduce) {
  .bn_title .title::after,
  .bn_title .title .effect-ripple::before,
  .bn_title .title .effect-ripple::after { animation: none; }
  html { scroll-behavior: auto; }
}

/* the <style> block the theme prints at the end of every page (customizer): the title tabs' notch takes the tab's colour */
.wp-block-search .wp-block-search__label::before, .mg-widget .wp-block-group h2:before, .mg-sidebar .mg-widget .wtitle::before, .mg-sec-title h4::before, footer .mg-widget h6::before { background: inherit; }
