/* ---------------------------------------------------------------------------
   Tab layout

   layout.css styles the nav using .ui-state-active and .ui-state-default but
   relies on jQuery UI's base stylesheet for the structural parts: floating the
   nav items, stripping the list bullets, and hiding inactive panels. That
   stylesheet was loaded from static.jquery.com, which no longer exists.

   This file supplies just those structural rules. It deliberately does not
   restyle anything layout.css already handles.
--------------------------------------------------------------------------- */

#tabs {
  position: relative;
}

#taboptions {
  list-style: none;
  padding: 0;
  margin: 0;
}

#taboptions li {
  float: left;
  list-style: none;
  position: relative;
  white-space: nowrap;
}

#taboptions li a {
  text-decoration: none;
}

/* jQuery UI hid inactive panels with .ui-tabs-hide; the script uses the
   hidden attribute instead. Panels carry display rules from layout.css, so
   the override needs !important to win. */
.tabarea[hidden] {
  display: none !important;
}

/* Before the script runs, show only the home panel. Without this every
   section renders stacked for a moment on a slow connection, which is what
   the site does today when the dead CDN scripts fail to load. */
#tabs:not(.tabs-ready) .tabarea {
  display: none;
}

#tabs:not(.tabs-ready) #tabs-1 {
  display: block;
}

#taboptions li a:focus-visible {
  outline: 2px solid #fff;
  outline-offset: -4px;
}

#tabs::after,
#taboptions::after {
  content: "";
  display: block;
  clear: both;
}
