﻿/* =========================================================
   BASE (all sizes)
   ========================================================= */
/* Avoid using the same ID repeatedly in HTML.
   If you can, change id="nav-color" to class="nav-color" in markup.
   For now, keep your selector working: */
.nav-color,
.glyphicon-user,
.navbar-inverse .navbar-nav > li > a,
.navbar-nav > li > a {
  color: #1a1542;
  font-size: 16px;
  font-weight: 700;
}
.navbar-inverse .navbar-nav > li > a:hover {
  color: #1a1542;
}
/* Open dropdown styling */
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:hover,
.navbar-inverse .navbar-nav > .open > a:focus {
  background-color: #1a1542;
  color: #f0c05a !important;
}
/* Dropdown items */
.dropdown-menu > li > a {
  display: block;
  padding: 8px 20px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #1a1542 !important;
  white-space: nowrap;
}
/* Entity list (flattened from SCSS nesting) */
.menu-entity-list ul {
  list-style: none;
  padding: 0;
  margin: 0;
  color: #1a1542 !important;
}
.menu-entity-list li a {
  display: block;
  color: #1a1542 !important;
}
/* Megamenu dropdown inner styles */
.megamenu-dropdown {
  padding-top: 10px;
}
.megamenu-dropdown h5 {
  border-bottom: 1px solid #81829e;
  padding-bottom: 0.25rem;
}
.megamenu-dropdown h5 a {
  display: block;
  color: #93272c !important;
}
.megamenu-dropdown .view-all-link {
  padding-left: 25px;
  font-weight: 700;
  color: #1a1542;
  font-size: 14px;
}
.megamenu-dropdown .view-all-link:hover {
  color: #1a1542;
}
/* Make megamenu full width */
.nav > li.megamenu,
.nav-item.megamenu {
  position: static;
}
.megamenu > .dropdown-menu {
  width: 100%;
  left: 0;
  right: 0;
  padding-left: 20px;
  padding-right: 20px;
  min-width: 0;
}
/* =========================================================
   LARGE DESKTOP (1240px+): hover dropdown open
   ========================================================= */
@media screen and (min-width: 1240px) {
  li.dropdown:hover > .dropdown-menu {
    display: block;
  }
}
/* =========================================================
   DESKTOP (992px+): container width + optional flyouts
   ========================================================= */
@media screen and (min-width: 992px) {
  .megamenu-dropdown {
    max-width: 1570px;
    margin: 0 auto;
  }
  /* Column helpers */
  .columns-2 {
    columns: 2;
  }
  .columns-3 {
    columns: 3;
  }
  .columns-4 {
    columns: 4;
  }
  .columns-5 {
    columns: 5;
  }
  .columns-6 {
    columns: 6;
  }
  /* If you actually use .megasubmenu flyouts anywhere */
  .submenu-list {
    position: relative;
  }
  .megasubmenu {
    display: none;
    position: absolute;
    left: 100%;
    top: 0;
    min-width: 300px;
    min-height: 100%;
    padding-top: 0.5rem;
    background: #fff;
  }
  .has-submenu:hover .megasubmenu {
    display: block;
  }
  .sub-menu-indicator {
    position: absolute;
    top: 0.6rem;
    right: 0.5rem;
  }
}
/* =========================================================
   TABLET (768px�991px): NEW
   - stack megamenu into 2 columns
   - disable flyouts
   ========================================================= */
@media screen and (min-width: 768px) and (max-width: 991px) {
  /* Force the md columns to behave like 50% on tablets */
  /* turn the megamenu columns into two vertical lanes */
  .megamenu-dropdown .row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .megamenu-dropdown .col-md-3 {
    float: none;
    /* override bootstrap floats */
    width: 50%;
  }
  /* Force lane order: 1,2 in left lane; 3,4 in right lane */
  .megamenu-dropdown .col-md-3:nth-child(1) {
    order: 1;
  }
  .megamenu-dropdown .col-md-3:nth-child(2) {
    order: 3;
  }
  /* under 1 */
  .megamenu-dropdown .col-md-3:nth-child(3) {
    order: 2;
  }
  .megamenu-dropdown .col-md-3:nth-child(4) {
    order: 4;
  }
  /* under 3 */
  /* Clean wrapping */
  .megamenu-dropdown .row:after {
    content: "";
    display: table;
    clear: both;
  }
  /* Keep dropdown content �stacked� (no flyouts) */
  .megasubmenu {
    position: static;
    min-width: 0;
    min-height: 0;
  }
  /* Optional: slightly smaller nav text */
  .navbar-inverse .navbar-nav > li > a,
  .navbar-nav > li > a {
    font-size: 15px;
  }
}
/* =========================================================
   PHONES (<=767px)
   ========================================================= */
@media screen and (max-width: 767px) {
  /* Stack megamenu columns */
  .megamenu-dropdown .col-md-3 {
    float: none;
    width: 100%;
  }
  /* Make open dropdown scrollable */
  .navbar-nav .open .dropdown-menu {
    max-height: 350px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }
}