/*
 * Custom CSS Overrides
 * Theme: TROQC
 *
 * Use this file for custom styling that overrides
 * plugin or theme defaults (e.g., UberMenu, etc.)
 */

/* ===========================================
   UBERMENU — Match Original TROQC Nav Bar
   =========================================== */

/* --- Main Bar — centered --- */
nav.ubermenu.ubermenu-main {
  background: #3F6D7D !important;
  margin: 10px auto 0 auto;
  padding: 0 30px;
  position: relative;
  display: flex !important;
  justify-content: center !important;
}

/* Center the top-level <ul> */
.ubermenu-main .ubermenu-nav {
  display: flex !important;
  justify-content: center !important;
}

/* Parent items need relative positioning for dropdown centering */
.ubermenu-main .ubermenu-item-level-0 {
  position: relative !important;
}

/* Grain texture overlay (matches original nav) */
nav.ubermenu.ubermenu-main::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.08'/%3E%3C/svg%3E");
  pointer-events: none;
  opacity: 0.4;
  z-index: 0;
}

/* Kill focus outlines on all UberMenu elements */
.ubermenu *:focus {
  outline: none;
}

/* --- Top-Level Links --- */
.ubermenu-main .ubermenu-item-level-0 > .ubermenu-target {
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  letter-spacing: 0.5px !important;
  line-height: 60px !important;
  padding: 0 20px !important;
  background: none !important;
  position: relative !important;
  z-index: 1;
  overflow: visible !important;
}

.ubermenu-main .ubermenu-item-level-0 > .ubermenu-target:hover,
.ubermenu-main .ubermenu-item-level-0 > .ubermenu-target:focus {
  background: none !important;
  color: #fff !important;
}

/* Current/active page item */
.ubermenu-main .ubermenu-current-menu-item > .ubermenu-target,
.ubermenu-main .ubermenu-current-menu-ancestor > .ubermenu-target {
  background: none !important;
  color: #fff !important;
}

/* Title text */
.ubermenu-main .ubermenu-target-title {
  color: #fff !important;
}

/* Sub-indicator arrow */
.ubermenu-main .ubermenu-sub-indicator {
  color: #fff !important;
  font-size: 12px !important;
  margin-left: 4px;
}

/* --- Hover Underline Animation (matches original) --- */
.ubermenu-main .ubermenu-item-level-0 > .ubermenu-target::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  bottom: 8px !important;
  left: 25% !important;
  width: 50% !important;
  height: 1px !important;
  background: #fff !important;
  transform: scaleX(0) !important;
  transition: transform 0.2s ease !important;
  pointer-events: none !important;
}

/* Only show underline on genuine hover, not UberMenu's click-active state */
.ubermenu-main .ubermenu-item-level-0:not(.ubermenu-active) > .ubermenu-target:hover::after {
  transform: scaleX(1) !important;
}

/* Explicitly hide underline when UberMenu marks item as active (clicked) */
.ubermenu-main .ubermenu-item-level-0.ubermenu-active > .ubermenu-target::after {
  transform: scaleX(0) !important;
}

/* --- Dropdown/Submenu — under parent item only --- */
/* Override full-width mega menu to behave like a simple dropdown, centered under parent */
.ubermenu-main .ubermenu-submenu.ubermenu-submenu-drop {
  min-width: auto !important;
  width: auto !important;
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  background: #3F6D7D !important;
  border: none !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}

/* Kill the mega-menu full-width behavior — width fits content */
.ubermenu-main .ubermenu-submenu.ubermenu-submenu-type-mega {
  display: block !important;
  width: max-content !important;
  min-width: 0 !important;
  max-width: none !important;
}

/* Stack submenu items vertically */
.ubermenu-main .ubermenu-submenu .ubermenu-item {
  display: block !important;
  width: 100% !important;
  float: none !important;
}

.ubermenu-main .ubermenu-submenu .ubermenu-target {
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  padding: 10px 20px !important;
  line-height: 1.4 !important;
  white-space: nowrap !important;
  z-index: 1;
  position: relative;
}

.ubermenu-main .ubermenu-submenu .ubermenu-target:hover {
  background: rgba(255, 255, 255, 0.1) !important;
}

/* Submenu hover underline */
.ubermenu-main .ubermenu-submenu .ubermenu-target::after {
  display: none !important;
}

/* --- Mobile Toggle Button --- */
.ubermenu-responsive-toggle.ubermenu-responsive-toggle-main {
  background: #3F6D7D !important;
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  letter-spacing: 0.5px !important;
  max-width: 1300px;
  margin: 10px auto 0 auto;
  padding: 12px 20px !important;
  border: none !important;
}

.ubermenu-responsive-toggle.ubermenu-responsive-toggle-main i {
  color: #fff !important;
  margin-right: 8px;
}

/* Remove border-radius UberMenu might add */
nav.ubermenu.ubermenu-main,
.ubermenu-responsive-toggle.ubermenu-responsive-toggle-main {
  border-radius: 0 !important;
  border: none !important;
}

/* --- Account Bar Below Nav --- */
/* Push account links below UberMenu like original layout */
.site-header-account {
  position: relative;
  z-index: 1;
}