/* Isolated desktop header dropdowns.
   The legacy bundles also style `.dropdown-menu`; using a dedicated component
   prevents those rules from adding a second surface and shifting the mega menu. */
.header-menu-item { position: relative; }
.header-dropdown { position: absolute; top: 100%; z-index: 60; padding-top: .75rem; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 150ms ease, transform 150ms ease, visibility 150ms ease; }
.header-menu-item:hover > .header-dropdown, .header-menu-item:focus-within > .header-dropdown { opacity: 1; visibility: visible; pointer-events: auto; }
.header-dropdown--mega { left: 50%; width: min(44rem, calc(100vw - 2rem)); transform: translate(-50%, -.4rem); }
.header-menu-item:hover > .header-dropdown--mega, .header-menu-item:focus-within > .header-dropdown--mega { transform: translate(-50%, 0); }
.header-dropdown--list { left: 0; width: 18rem; transform: translateY(-.4rem); }
.header-dropdown--end { right: 0; width: 17rem; transform: translateY(-.4rem); }
.header-menu-item:hover > .header-dropdown--list, .header-menu-item:focus-within > .header-dropdown--list, .header-menu-item:hover > .header-dropdown--end, .header-menu-item:focus-within > .header-dropdown--end { transform: translateY(0); }
.header-dropdown-surface { overflow: hidden; padding: .5rem; border: 1px solid rgb(226 232 240); border-radius: 1rem; background: #fff; box-shadow: 0 18px 44px -18px rgb(15 23 42 / .38); }
.header-dropdown-surface--mega { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .25rem; padding: .625rem; }
.header-dropdown-link { display: flex !important; align-items: center; min-height: 2.75rem !important; padding: .625rem .75rem !important; border: 0 !important; border-radius: .75rem; color: #334155 !important; font-size: .875rem !important; font-weight: 600; line-height: 1.35; text-decoration: none; transition: background-color 150ms ease, color 150ms ease, transform 150ms ease; }
.header-dropdown-link:hover, .header-dropdown-link:focus-visible { background: rgb(240 253 244) !important; color: #2f6f22 !important; outline: 0; }
.header-dropdown-link:focus-visible { box-shadow: inset 0 0 0 2px rgb(62 109 38 / .4); }
.header-dropdown-link--featured { color: #2f6f22 !important; font-weight: 800; }
.header-dropdown--end .header-dropdown-surface > a:first-child { display: flex !important; align-items: center; min-height: 2.75rem !important; padding: .625rem .75rem !important; border: 0 !important; border-radius: .75rem; color: #2f6f22 !important; font-size: .875rem !important; font-weight: 800; line-height: 1.35; text-decoration: none; }
.header-dropdown--end .header-dropdown-surface > a:first-child:hover { background: rgb(240 253 244) !important; color: #2f6f22 !important; }
.header-dropdown-divider { height: 1px; margin: .375rem .5rem; background: rgb(226 232 240); }
[data-theme='dark'] .header-dropdown-surface { border-color: rgb(51 65 85); background: #1e293b; box-shadow: 0 18px 44px -18px rgb(0 0 0 / .65); }
[data-theme='dark'] .header-dropdown-link { color: #e2e8f0 !important; }
[data-theme='dark'] .header-dropdown-link:hover, [data-theme='dark'] .header-dropdown-link:focus-visible { background: rgb(51 65 85) !important; color: #86efac !important; }
[data-theme='dark'] .header-dropdown-link--featured { color: #86efac !important; }
[data-theme='dark'] .header-dropdown--end .header-dropdown-surface > a:first-child { color: #86efac !important; }
[data-theme='dark'] .header-dropdown--end .header-dropdown-surface > a:first-child:hover { background: rgb(51 65 85) !important; color: #86efac !important; }
[data-theme='dark'] .header-dropdown-divider { background: rgb(51 65 85); }
