/**
 * Structural Pages Menu - Custom Flyout Styles
 * Ensures the nested menu items fly out to the right exactly like the Gavias theme reference menu.
 */

.block-structural-pages-menu {
  padding: 0 !important;
}

/* Apply the gray background and padding directly to the nav so it remains styled even if detached by the sticky script */
.sidebar .structural-pages-menu {
  padding: 30px;
  background-color: #f3f3f3;
  border-radius: 10px;
  width: 100%;
}

/* Remove the padding and background from the outer Drupal block wrapper to avoid double padding */
.sidebar [id^="block-structuralpagesmenublock"] {
  padding: 0 !important;
  background: transparent !important;
}

/* Position relative on parent items to anchor the absolute sub-menu */
.structural-pages-menu .structural-pages-menu__item {
  position: relative;
}

/* Hide sub-menus by default and position them to the right */
.structural-pages-menu .sub-menu {
  position: absolute;
  top: 0;
  left: 100%;
  visibility: hidden;
  opacity: 0;
  min-width: 260px;
  background-color: #ffffff;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
  z-index: 999;
  transition: all 0.25s ease-out;
  transform: translateY(10px);
  pointer-events: none;
  border-left: 2px solid var(--notech-theme-color, #db162f);
  list-style: none;
  padding: 0;
  margin: 0;
}

/* Show submenu on hover or focus */
.structural-pages-menu .structural-pages-menu__item:hover>.sub-menu,
.structural-pages-menu .structural-pages-menu__item:focus-within>.sub-menu {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  padding: 5px 30px !important;
}

/* Add an indicator icon (arrow) to items that have children */
.structural-pages-menu .structural-pages-menu__item--has-children>a::after {
  content: " \203A";
  float: right;
  font-family: monospace;
  font-size: 1.4em;
  font-weight: bold;
  line-height: 0.8;
  opacity: 0.4;
  transition: opacity 0.2s;
}

.structural-pages-menu .structural-pages-menu__item--has-children:hover>a::after {
  opacity: 1;
}

/* Styles for the links inside the flyout menus */
.structural-pages-menu .sub-menu>li>a {
  display: block;
  padding: 12px 20px;
  font-size: 14px;
  color: #333333;
  text-decoration: none;
  border-bottom: 1px solid #f2f2f2;
  transition: all 0.2s ease;
  background-color: transparent;
  font-weight: 500;
}

.structural-pages-menu .sub-menu>li:last-child>a {
  border-bottom: none;
}

.structural-pages-menu .sub-menu>li>a:hover {
  color: var(--notech-theme-color, #db162f);
  background-color: #fcfcfc;
  padding-left: 25px;
  /* Subtle interactively indication */
}

/* Ensure active trail items inside submenu remain highlighted */
.structural-pages-menu .sub-menu .menu-item--active-trail>a,
.structural-pages-menu .sub-menu .is-active {
  color: var(--notech-theme-color, #db162f);
}