/* The primary menu (primary-menu.php, #624). Colours come from the palette of appearance.css, so light and dark
   need no separate rules. Without JavaScript the panels open on hover and focus (desktop) or stay open (mobile).
   Every rule starts at the header's menu wrapper, named twice: the parent theme colours the links in it with
   `#header .header_default .header_main_menu_wrapper a`, which a single class after #header would not outweigh. */
#header .header_main_menu_wrapper.header_main_menu_wrapper .mec-primary-navigation { --mec-menu-accent: #f00; --mec-menu-on-accent: #fff; position: relative; z-index: 2; /* above the parent's .header_bottom::after */ font-family: var(--mec-ui-font, Arial, Helvetica, sans-serif); color: var(--mec-ink, #19222e); text-align: left; }
#header .header_main_menu_wrapper.header_main_menu_wrapper .mec-primary-navigation :is(ul, li) { margin: 0; padding: 0; list-style: none; }
#header .header_main_menu_wrapper.header_main_menu_wrapper .mec-primary-navigation li::before { content: none; }
#header .header_main_menu_wrapper.header_main_menu_wrapper .mec-primary-navigation :is(a, button, span) { font-family: inherit; }
#header .header_main_menu_wrapper.header_main_menu_wrapper .mec-primary-navigation button { margin: 0; border: 0; border-radius: 0; background: none; box-shadow: none; color: inherit; cursor: pointer; text-align: left; }
#header .header_main_menu_wrapper.header_main_menu_wrapper .mec-primary-navigation :is(a, button):focus-visible { outline: 3px solid var(--mec-ui-focus, #2463a7); outline-offset: -3px; }
#header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-item--agro { --mec-menu-accent: #00af00; }
#header .header_main_menu_wrapper.header_main_menu_wrapper :is(.mec-menu-icon, .mec-menu-arrow) { flex: 0 0 auto; fill: currentColor; }
#header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-icon { width: 1.15em; height: 1em; }
#header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-arrow { width: .7em; height: .7em; }
#header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-link { display: flex; align-items: center; gap: 7px; color: var(--mec-ink, #19222e); font-weight: 700; text-decoration: none; text-transform: uppercase; white-space: nowrap; }
#header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-tab-link { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; color: var(--mec-ink, #19222e); font-size: 16px; font-weight: 700; line-height: 1.25; text-decoration: none; text-transform: uppercase; }
#header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-group-title { display: block; padding: 10px 10px 5px; color: var(--mec-ink, #19222e); font-size: 16px; font-weight: 700; line-height: 1.5; text-decoration: none; text-transform: uppercase; }
#header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-leaf { display: block; padding: 0 10px; color: var(--mec-ink, #19222e); font-size: 15px; font-weight: 400; line-height: 1.5; text-decoration: none; text-transform: uppercase; }
#header .header_main_menu_wrapper.header_main_menu_wrapper a:is(.mec-menu-group-title, .mec-menu-leaf):is(:hover, :focus-visible) { color: var(--mec-link, #b9151c); }
#header .header_main_menu_wrapper.header_main_menu_wrapper :is(.mec-menu-leaf, .mec-menu-group-title, .mec-menu-tab-link)[aria-current="page"] { color: var(--mec-link, #b9151c); text-decoration: underline; text-underline-offset: 3px; }

@media (min-width: 960px) {
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-link { height: 56px; padding: 0 8px; border-radius: var(--mec-ui-radius, 8px); font-size: 13px; line-height: 1; transition: color .2s ease, background-color .2s ease; }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-item:is(:hover, :focus-within, .is-open, .mec-menu-item--current) > .mec-menu-link { background: var(--mec-tint, #fff0f2); color: var(--mec-link, #b9151c); }

  /* The panel spans the menu's row. A short delay on closing lets the pointer travel from the item to the panel. */
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-panel { position: absolute; top: 100%; right: 0; left: 0; z-index: 1001; visibility: hidden; opacity: 0; transform: translateY(8px); border-top: 3px solid var(--mec-menu-accent); background: var(--mec-surface, #fff); box-shadow: 5px 5px 15px rgba(0, 0, 0, .45); transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s; }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-item:is(:hover, :focus-within) > .mec-menu-panel,
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-item.is-open > .mec-menu-panel { visibility: visible; opacity: 1; transform: none; transition-delay: .08s, .08s, .08s; }
  /* After Escape the panel stays closed until the pointer or the focus leaves its item. */
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-item.is-dismissed:not(.is-open) > .mec-menu-panel { visibility: hidden; opacity: 0; }

  /* Tabs in the first column; the open tab's groups fill the second column over every row. The last row takes
     the height that the groups need beyond the tabs, so the tabs keep their own height. */
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-tabs { display: grid; grid-template-columns: 23% minmax(0, 1fr); grid-template-rows: repeat(var(--mec-menu-tabs, 4), min-content) 1fr; }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-tab { display: contents; }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-tab-link { grid-column: 1; min-height: 80px; padding: 0 14px 0 20px; }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-tab-panel { display: none; grid-column: 2; grid-row: 1 / -1; padding: 10px; border-left: 1px solid var(--mec-line, #dcdcdc); }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-tab.is-active > .mec-menu-tab-link,
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-tab-link:is(:hover, :focus-visible) { background: var(--mec-menu-accent); color: var(--mec-menu-on-accent); }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-tab.is-active > .mec-menu-tab-panel { display: block; }
  /* Without JavaScript: the tab under the pointer or holding the focus, otherwise the first one. */
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-primary-navigation:not(.is-enhanced) .mec-menu-tabs:has(> .mec-menu-tab:not(.is-active):is(:hover, :focus-within)) > .mec-menu-tab.is-active > .mec-menu-tab-panel { display: none; }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-primary-navigation:not(.is-enhanced) .mec-menu-tabs:has(> .mec-menu-tab:not(.is-active):is(:hover, :focus-within)) > .mec-menu-tab.is-active > .mec-menu-tab-link { background: none; color: var(--mec-ink, #19222e); }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-primary-navigation:not(.is-enhanced) .mec-menu-tab:is(:hover, :focus-within) > .mec-menu-tab-panel { display: block; }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-groups { display: grid; grid-template-columns: repeat(var(--mec-menu-columns, 3), minmax(0, 1fr)); gap: 20px 0; }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-group { padding-bottom: 5px; }
}

@media (max-width: 959px) {
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu > .mec-menu-item { border-bottom: 1px solid var(--mec-line, #dce1e8); }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-link { width: 100%; min-height: 60px; padding: 0 12px; font-size: 14px; }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-link > .mec-menu-arrow { margin-left: auto; transition: transform .2s ease; }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-tab-link { min-height: 56px; padding: 0 12px 0 28px; font-size: 14px; text-transform: none; }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-tab-link > .mec-menu-arrow { transform: rotate(90deg); transition: transform .2s ease; }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-link[aria-expanded="true"] > .mec-menu-arrow { transform: rotate(180deg); }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-tab-link[aria-expanded="true"] > .mec-menu-arrow { transform: rotate(-90deg); }
  #header .header_main_menu_wrapper.header_main_menu_wrapper :is(.mec-menu-link, .mec-menu-tab-link)[aria-expanded="true"] { background: var(--mec-menu-accent); color: var(--mec-menu-on-accent); }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-item--current > .mec-menu-link:not([aria-expanded="true"]) { background: var(--mec-tint, #fff0f2); color: var(--mec-link, #b9151c); }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-tab-panel { padding: 8px 12px 16px 20px; }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-group-title { padding-top: 14px; }
  #header .header_main_menu_wrapper.header_main_menu_wrapper :is(.mec-menu-group-title, .mec-menu-leaf) { overflow-wrap: anywhere; }
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-menu-leaf { padding-block: 6px; }
  /* With JavaScript the levels are an accordion; without it everything stays readable, fully open. */
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-primary-navigation.is-enhanced .mec-menu-item:not(.is-open) > .mec-menu-panel,
  #header .header_main_menu_wrapper.header_main_menu_wrapper .mec-primary-navigation.is-enhanced .mec-menu-tab:not(.is-open) > .mec-menu-tab-panel { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  #header .header_main_menu_wrapper.header_main_menu_wrapper :is(.mec-menu-panel, .mec-menu-link, .mec-menu-arrow) { transition: none !important; }
}
