/* All desktop presentation is isolated from Bootstrap and the legacy menu. */
.ddng { clear: both; font-family: 'Source Sans 3', Arial, sans-serif; }
.ddng *, .ddng *::before, .ddng *::after { box-sizing: border-box; }
.ddng-nav { display: none; }
.ddng-panel[hidden] { display: none !important; }
.ddng-preview-note { min-height: 650px; padding: 48px 24px; }
@media (min-width: 992px) {
  .ddng-nav { display: block; width: 100%; background: #232e3f; color: #fff; }
  .dark-mode .ddng-nav { margin-top: 4px; }
  .ddng-top { display: flex; flex-wrap: wrap; justify-content: space-between; min-height: 37px; width: 100%; max-width: 1620px; list-style: none; margin: 0 auto; padding: 0; }
  /* Match the legacy Bootstrap nav’s two empty flex items and outer spacing. */
  .ddng-top::before, .ddng-top::after { content: ""; display: block; }
  .ddng-item { list-style: none; margin: 0; padding: 0; }
  .ddng-trigger { display: flex; align-items: stretch; min-height: 37px; font-size: 13px; font-weight: 500; line-height: 23px; white-space: nowrap; }
  .ddng-trigger > a { display: block; padding: 7px 5px; color: #fff; font-family: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; text-decoration: none; }
  .ddng-trigger-with-panel > a { padding-right: 0; }
  .ddng-toggle { appearance: none; border: 0; border-radius: 0; background: transparent; color: #fff; padding: 7px 5px 7px 0; min-width: 0; font: inherit; cursor: pointer; }
  /* Preserve the extra word space before the legacy color menu caret. */
  .ddng-item[data-ddng-item="colors"] .ddng-toggle { margin-left: .2em; }
  .ddng-toggle .fa-caret-down { width: 1em; height: 1em; padding-left: 4px; }
  .ddng-item.is-open > .ddng-trigger { background: #30465a; }
  .ddng .ddng-trigger > a:hover,
  .ddng .ddng-trigger > a:focus,
  .ddng .ddng-trigger > a:active { text-decoration: none; border: 0; box-shadow: none; }
  .ddng .ddng-trigger > a:focus:not(:focus-visible),
  .ddng .ddng-toggle:focus:not(:focus-visible) { outline: none; }
  .ddng a:focus-visible, .ddng button:focus-visible { outline: 2px solid #1688d1; outline-offset: 3px; }
  .ddng-trigger a:focus-visible, .ddng-toggle:focus-visible { outline-color: white; outline-offset: -3px; }
  .ddng-panel { position: fixed; left: 0; width: 100%; z-index: 1100; padding: 22px 24px 28px; margin: 0; border: 0; border-radius: 0; background: #fff; color: #172333; box-shadow: 0 8px 24px rgba(0,0,0,.14); overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; scrollbar-gutter: stable; text-align: left; }
  .ddng-panel a { color: #172333; text-decoration: none; white-space: normal; overflow-wrap: anywhere; font-size: 15px; line-height: 1.45; }
  .ddng-panel a:hover { color: #087bbd; text-decoration: underline; }
  .ddng-overview { margin-bottom: 18px; font-weight: 650; }
  .ddng-overview a, .ddng-overview > span { color: #087bbd; }
  .ddng-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; align-items: start; }
  .ddng-with-card.ddng-card-beside { grid-template-columns: minmax(0, 1fr) 260px; }
  .ddng-groups { display: grid; grid-template-columns: repeat(var(--ddng-columns, 3), minmax(0, 1fr)); column-gap: 32px; align-items: start; min-width: 0; }
  .ddng-column { min-width: 0; }
  .ddng-group { margin: 0 0 12px; min-width: 0; break-inside: avoid; }
  .ddng-group-title > a { font-weight: 650; display: block; padding: 3px 0; }
  .ddng-layout-headed .ddng-group-title { border-bottom: 1px solid #d9e0e5; margin-bottom: 8px; padding-bottom: 4px; }
  .ddng-layout-headed .ddng-group-title > a { color: #087bbd; font-size: 14px; text-transform: uppercase; letter-spacing: .025em; }
  .ddng-layout-headed .ddng-group-title > a::after { content: ' →'; }
  .ddng-children { list-style: none; padding: 0; margin: 0; }
  .ddng-children > li { list-style: none; margin: 0; padding: 0; }
  .ddng-children a { display: block; font-weight: 400; padding: 3px 0; }
  .ddng-children > .ddng-parent > a { font-weight: 650; }
  .ddng-children .ddng-children, .ddng-layout-compact .ddng-group > .ddng-children { padding-left: 18px; }
  .ddng-children .ddng-parent { margin-top: 8px; margin-bottom: 8px; }
  .ddng-card { max-width: 360px; }
  .ddng-card a { display: block; }
  .ddng-card a:hover, .ddng-card a:focus { color: #172333; text-decoration: none; background: transparent; }
  .ddng-card a:hover .ddng-card-action,
  .ddng-card a:focus-visible .ddng-card-action { color: #055a8b; text-decoration: underline; }
  .ddng-card img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: center top; border-radius: 0; margin-bottom: 12px; }
  .ddng-card strong { display: block; font-size: 19px; line-height: 1.3; }
  .ddng-card p { margin: 8px 0; }
  .ddng-card-action { display: block; color: #087bbd; margin-top: 8px; }
  .ddng-brands { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 20px; list-style: none; margin: 0; padding: 0; }
  .ddng-brands li { list-style: none; margin: 0; }
  .ddng-brands a { display: flex; align-items: center; justify-content: center; min-height: 72px; }
  .ddng-brand-image { width: 140px; height: 60px; object-fit: contain; }
  .ddng-decoration { list-style: none; padding: 0; margin: 0; }
  .ddng-decoration a { display: block; padding: 6px 0; }
  .ddng-custom { min-width: 0; }
  .ddng-colors table { width: 100%; table-layout: fixed; }
  .ddng-colors ul { list-style: none; margin: 0; padding: 0; }
  .ddng-colors .filter-checkbox { display: none; }
  .ddng-colors .item-list > ul { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 12px 16px; }
  .ddng-colors .item-list > ul > li { list-style: none; margin: 0; padding: 0; }
  .ddng-colors a { display: flex; align-items: center; gap: 8px; padding: 5px 0; }
  .ddng-colors .circle-container { display: block; flex: 0 0 24px; width: 24px; height: 24px; margin: 0; padding: 0; border: 0; box-shadow: none; }
  .ddng-colors .faceted-search-color-category { display: block; width: 24px; height: 24px; border: 1px solid rgba(0, 0, 0, .12); border-radius: 50%; box-shadow: none; margin: 0; }
  .ddng-colors .menu-color-name { display: inline; position: static; color: inherit; }
  .ddng-mobile { display: none; }
}
@media (max-width: 991px) {
  /* Keep the page header's positioned search controls below the drawer. */
  .ddng-mobile { z-index: 10; }
  .ddng-mobile #menu-primary-navigation-mobile li > a,
  .ddng-mobile #menu-primary-navigation-mobile li > a:hover,
  .ddng-mobile #menu-primary-navigation-mobile li > a:focus,
  .ddng-mobile #menu-primary-navigation-mobile li > a:active,
  .ddng-mobile #menu-primary-navigation-mobile li.open > a,
  .ddng-mobile #menu-primary-navigation-mobile li.active > a {
    background: transparent; background-image: none; box-shadow: none; color: #dadada;
  }
  .ddng-mobile #menu-primary-navigation-mobile .dropdown-menu {
    background: transparent; border: 0; box-shadow: none;
  }
  .ddng-mobile #menu-primary-navigation-mobile a:focus-visible {
    outline: 2px solid #dadada; outline-offset: -2px;
  }

  .ddng-panel { display: none !important; }
  .ddng-mobile .cd-panel-close { display: block; font-size: 30px; padding: 0 15px; }
}

@media (min-width: 1150px) {
  .ddng-trigger { font-size: 15px; }
}
