/* The header Tools menu as fly-outs (class-ows-stacks-nav-flyout.php, nav-flyout.js).
 * LAYOUT ONLY. Every row is the header's own dropdown row (li.ows-weekly-dropdown__item > a) and
 * every label its own heading (li.ows-weekly-dropdown__heading), so the type, colours, hover and
 * live tint are exactly the live dropdowns' (Aaron, 2026-10-22: "the same font as what we have on
 * live ... that specific font needs to be what carries over"). This file only sets out the columns,
 * the arrows, the open state and the phone screens. */

html body #mainNav li.ows-tkfly .screen-reader-text {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* The Tools list lets the columns stand outside it. */
@media (min-width: 992px) {
  html body #mainNav .ows-weekly-dropdown.has-tkfly { overflow: visible !important; max-height: none !important; }
}
html body #mainNav #main-menu li.ows-tkfly { position: static !important; }

/* Lists inside the panel: no bullets, no indent; rows stacked like the dropdown's. */
html body #mainNav li.ows-tkfly .ows-tkfly__list { list-style: none !important; margin: 0 !important; padding: 0 !important; }
html body #mainNav li.ows-tkfly .ows-tkfly__list > li { display: block; margin: 0; }
html body #mainNav li.ows-tkfly .ows-tkfly__list > li.ows-weekly-dropdown__heading:first-child { border-top: 0 !important; margin-top: 0 !important; padding-top: 6px !important; }
html body #mainNav li.ows-tkfly .ows-tkfly__sep { height: 1px; background: rgba(47, 47, 47, .09); margin: 6px 11px; }

/* The arrow on a row that opens something. */
html body #mainNav li.ows-tkfly .ows-tkfly__chev {
  flex: 0 0 auto; width: 6px; height: 6px; margin: 0 2px 0 8px;
  border: solid currentColor; border-width: 2px 2px 0 0; transform: rotate(45deg);
}
/* Open: the dropdown's own hover look, held while its menu is open. */
html body #mainNav #main-menu li.ows-tkfly.is-flyout > a.ows-tkfly__entry,
html body #mainNav #main-menu li.ows-tkfly .ows-tkfly__panel a.ows-tkfly__row.is-active { background: var(--ows-weekly-orange-soft, #fff0e2) !important; }
html body #mainNav #main-menu li.ows-tkfly.is-flyout > a.ows-tkfly__entry .ows-weekly-dropdown__label,
html body #mainNav #main-menu li.ows-tkfly .ows-tkfly__panel a.ows-tkfly__row.is-active .ows-weekly-dropdown__label { color: var(--ows-weekly-orange, #ff7a00) !important; }

/* ---- the panel: columns side by side, in the dropdown's own box ------------------------- */
html body #mainNav li.ows-tkfly .ows-tkfly__panel[hidden],
html body #mainNav li.ows-tkfly .ows-tkfly__menu[hidden],
html body #mainNav li.ows-tkfly .ows-tkfly__sportset[hidden] { display: none !important; }
html body #mainNav li.ows-tkfly .ows-tkfly__panel {
  position: absolute; top: -1px; left: 100%; right: auto; z-index: 10001;
  display: flex; flex-direction: row; align-items: stretch;
  background: var(--ows-weekly-cream, #f5f0e8); border: 1px solid rgba(47, 47, 47, .13); border-radius: 0 0 10px 10px;
  box-shadow: 0 14px 28px rgba(47, 47, 47, .12); text-align: left;
}
html body #mainNav li.ows-tkfly .ows-tkfly__panel.is-left { left: auto; right: 100%; flex-direction: row-reverse; }
html body #mainNav li.ows-tkfly .ows-tkfly__menu {
  display: block; box-sizing: border-box; width: var(--tkfly-col, 220px); max-height: var(--tkfly-max, 70vh);
  overflow-y: auto; overscroll-behavior: contain; padding: 10px 10px 10px 0;
}
html body #mainNav li.ows-tkfly .ows-tkfly__menu:focus { outline: none; }
html body #mainNav li.ows-tkfly .ows-tkfly__menu:not([data-depth="0"]) { border-left: 1px solid rgba(47, 47, 47, .09); }
html body #mainNav li.ows-tkfly .ows-tkfly__panel.is-left .ows-tkfly__menu:not([data-depth="0"]) { border-left: 0; border-right: 1px solid rgba(47, 47, 47, .09); }

/* The Back row is not a live link: the dropdown's plain row colour (it sits inside a live row, whose
   orange label rule reaches every label below it). */
html body #mainNav #main-menu li.ows-tkfly .ows-tkfly__backrow > a .ows-weekly-dropdown__label { color: var(--ows-weekly-charcoal, #2f2f2f); }
/* The Back row and the list's name only show on a phone. */
html body #mainNav li.ows-tkfly .ows-tkfly__top { display: none !important; }

/* NFL | NBA: two buttons in the dropdown's row type, the chosen one orange. */
html body #mainNav li.ows-tkfly .ows-tkfly__sport { display: flex; margin: 2px 0 8px 11px; border: 1px solid rgba(47, 47, 47, .25); border-radius: 7px; overflow: hidden; }
html body #mainNav #main-menu li.ows-tkfly .ows-tkfly__panel .ows-tkfly__sportbtn {
  flex: 1 1 0; min-height: 34px; margin: 0; padding: 6px 8px !important; border: 0 !important; border-radius: 0 !important;
  background: transparent !important; color: var(--ows-weekly-charcoal, #2f2f2f) !important; cursor: pointer;
  font-family: inherit !important; font-size: 13px !important; font-weight: 400 !important; letter-spacing: 0 !important; text-transform: uppercase !important;
}
html body #mainNav #main-menu li.ows-tkfly .ows-tkfly__panel .ows-tkfly__sportbtn + .ows-tkfly__sportbtn { border-left: 1px solid rgba(47, 47, 47, .25) !important; }
html body #mainNav #main-menu li.ows-tkfly .ows-tkfly__panel .ows-tkfly__sportbtn.is-on { background: var(--ows-weekly-orange, #ff7a00) !important; color: #fff !important; }
html body #mainNav #main-menu li.ows-tkfly .ows-tkfly__panel .ows-tkfly__sportbtn:focus-visible { outline: 2px solid var(--ows-weekly-orange, #ff7a00); outline-offset: -4px; }

/* ---- phones: the header's mobile menu. One list per screen, in place of the Tools list. ---- */
@keyframes ows-tkfly-in { from { transform: translateX(28px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes ows-tkfly-back { from { transform: translateX(-28px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (max-width: 991px) {
  html body #mainNav .ows-weekly-dropdown.is-tkfly-drill > li:not(.is-flyout) { display: none !important; }
  html body #mainNav #main-menu .ows-weekly-dropdown.is-tkfly-drill > li.ows-tkfly.is-flyout > a.ows-tkfly__entry { display: none !important; }
  html body #mainNav li.ows-tkfly .ows-tkfly__panel {
    position: static; display: block; width: 100%; max-width: 100%; box-sizing: border-box;
    border: 0; border-radius: 0; box-shadow: none; background: transparent; overflow: hidden;
  }
  html body #mainNav li.ows-tkfly .ows-tkfly__menu,
  html body #mainNav li.ows-tkfly .ows-tkfly__menu:not([data-depth="0"]) {
    width: 100%; max-height: none; overflow: visible; padding: 0 0 6px; border: 0;
  }
  html body #mainNav li.ows-tkfly .ows-tkfly__menu.is-in { animation: ows-tkfly-in .18s ease-out; }
  html body #mainNav li.ows-tkfly .ows-tkfly__menu.is-back { animation: ows-tkfly-back .18s ease-out; }
  html body #mainNav li.ows-tkfly .ows-tkfly__top { display: block !important; }
  /* Rows a thumb can hit: the same rows, at least 48px tall. */
  html body #mainNav #main-menu li.ows-tkfly > a.ows-tkfly__entry,
  html body #mainNav #main-menu li.ows-tkfly .ows-tkfly__list > li.ows-weekly-dropdown__item > a,
  html body #mainNav #main-menu li.ows-tkfly .ows-tkfly__list > li.ows-weekly-dropdown__item > .ows-weekly-dropdown__disabled { min-height: 48px; }
  html body #mainNav #main-menu li.ows-tkfly .ows-tkfly__panel a.ows-tkfly__back { justify-content: flex-start; gap: 10px; }
  html body #mainNav #main-menu li.ows-tkfly .ows-tkfly__panel a.ows-tkfly__back::before {
    content: ""; flex: 0 0 auto; width: 7px; height: 7px; border: solid currentColor; border-width: 0 0 2px 2px; transform: rotate(45deg);
  }
  html body #mainNav li.ows-tkfly .ows-tkfly__title { border-top: 1px solid rgba(47, 47, 47, .09) !important; margin-top: 4px !important; }
  html body #mainNav li.ows-tkfly .ows-tkfly__sport { margin: 6px 0 8px; }
  html body #mainNav #main-menu li.ows-tkfly .ows-tkfly__panel .ows-tkfly__sportbtn { min-height: 44px; font-size: 14px !important; }
}
@media (prefers-reduced-motion: reduce) {
  html body #mainNav li.ows-tkfly .ows-tkfly__menu.is-in,
  html body #mainNav li.ows-tkfly .ows-tkfly__menu.is-back { animation: none; }
}