/* TELADIN v329 - Consolidated submenu contrast and hierarchy */

/*
  The submenu background and text colors are controlled together.
  This avoids light text remaining on a white menu at tablet/mobile widths.
*/
html body .site-header .shared-mega-menu {
  --submenu-surface: #ffffff;
  --submenu-card-surface: #ffffff;
  --submenu-border: #dfe5ea;
  --submenu-title: #17384d;
  --submenu-title-hover: #087fae;
  --submenu-item: #4f5b67;
  --submenu-item-hover: #087fae;

  background: var(--submenu-surface) !important;
}

html body .site-header
.shared-mega-menu
.hancom-mega__col,
html body .site-header
.shared-mega-menu
.hancom-mega__col:first-child {
  background: var(--submenu-card-surface) !important;
  border-color: var(--submenu-border) !important;
}

html body .site-header
.shared-mega-menu
.hancom-mega__col h4 {
  margin: 0 0 6px !important;
  padding: 0 !important;
  color: var(--submenu-title) !important;
}

html body .site-header
.shared-mega-menu
.hancom-mega__col h4
.hancom-mega__title-link {
  display: inline-block !important;
  width: auto !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;

  color: var(--submenu-title) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.02em !important;
  opacity: 1 !important;
}

html body .site-header
.shared-mega-menu
.hancom-mega__col h4
.hancom-mega__title-link:hover,
html body .site-header
.shared-mega-menu
.hancom-mega__col h4
.hancom-mega__title-link:focus-visible {
  color: var(--submenu-title-hover) !important;
  opacity: 1 !important;
}

html body .site-header
.shared-mega-menu
.hancom-mega__col > a:not(.hancom-mega__title-link) {
  min-height: 34px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 5px 0 !important;

  color: var(--submenu-item) !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  opacity: 1 !important;
}

html body .site-header
.shared-mega-menu
.hancom-mega__col > a:not(.hancom-mega__title-link):hover,
html body .site-header
.shared-mega-menu
.hancom-mega__col > a:not(.hancom-mega__title-link):focus-visible {
  color: var(--submenu-item-hover) !important;
}

/*
  Tablet/mobile currently uses a white submenu in the TELADIN layout.
  Keep dark text explicitly instead of assuming a dark device theme.
*/
@media (max-width: 900px) {
  html body .site-header .shared-mega-menu {
    --submenu-surface: #ffffff;
    --submenu-card-surface: #ffffff;
    --submenu-border: #d9e0e6;
    --submenu-title: #17384d;
    --submenu-title-hover: #087fae;
    --submenu-item: #485560;
    --submenu-item-hover: #087fae;

    background: var(--submenu-surface) !important;
  }

  html body .site-header
  .shared-mega-menu
  .hancom-mega__col h4 {
    margin-bottom: 6px !important;
  }

  html body .site-header
  .shared-mega-menu
  .hancom-mega__col h4
  .hancom-mega__title-link {
    display: block !important;
    width: 100% !important;
    color: var(--submenu-title) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
  }

  html body .site-header
  .shared-mega-menu
  .hancom-mega__col > a:not(.hancom-mega__title-link) {
    color: var(--submenu-item) !important;
    font-size: 15px !important;
    font-weight: 400 !important;
  }
}

/* Windows/high-contrast accessibility mode */
@media (forced-colors: active) {
  html body .site-header .shared-mega-menu,
  html body .site-header .shared-mega-menu .hancom-mega__col {
    background: Canvas !important;
    border-color: CanvasText !important;
  }

  html body .site-header
  .shared-mega-menu
  .hancom-mega__col h4
  .hancom-mega__title-link,
  html body .site-header
  .shared-mega-menu
  .hancom-mega__col > a:not(.hancom-mega__title-link) {
    color: CanvasText !important;
  }
}