/* Menu appearance is saved under Admin > Menu colors and text. Dark defaults preserve the original menu. */
.site-header .product-menu{grid-column:1;grid-row:2;display:block;align-self:center;padding:0;border:0;background:var(--theme-header-background,var(--theme-header));color:var(--theme-header-foreground,var(--theme-header-text));font-size:13px;position:static}
.product-menu-root>summary{display:flex;align-items:center;min-height:38px;padding:6px 0;width:fit-content;cursor:pointer;list-style:none;font-weight:normal}
.product-menu summary::-webkit-details-marker{display:none}
.product-menu-panel{position:absolute;top:100%;left:clamp(18px,3vw,48px);right:clamp(18px,3vw,48px);background:var(--menu-panel-background,#101010);color:var(--menu-item-text,#fff);padding:16px;display:flex;gap:18px;align-items:flex-start;max-height:75vh;overflow:auto;box-shadow:0 8px 20px #0006}
.product-menu-rail{display:flex;flex-direction:column;gap:8px;min-width:135px}
.product-menu-rail>a,.product-menu-rail>button{padding:10px;background:none;color:var(--menu-item-text,#fff);border:0;text-align:left;font:inherit;cursor:pointer}
.product-menu-categories,.product-menu-children{display:flex;align-items:flex-start;gap:8px}
.product-menu-categories[hidden]{display:none}.product-menu-children.vertical{flex-direction:column}.product-menu-children.horizontal{flex-direction:row}
.product-menu-children{padding-left:10px;margin-top:6px}.product-menu-branch{min-width:150px}
.product-menu-branch>summary{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:10px 12px;list-style:none;cursor:pointer;white-space:nowrap;background:var(--menu-category-background,#1b1b1b);color:var(--menu-category-text,#fff)}
.product-menu-branch>summary::after{content:'▾'}.vertical>.product-menu-branch>summary::after{content:'▸'}
.product-menu-categories a{display:block;min-width:140px;padding:10px 12px;white-space:nowrap;color:var(--menu-item-text,#fff);text-decoration:none}
.product-menu a:hover,.product-menu button:hover,.product-menu summary:hover,.product-menu-branch[open]>summary{background:var(--menu-hover-background,#303030);color:var(--menu-hover-text,#fff)}
.site-header .product-menu :is(a,button,summary):focus-visible{outline:2px solid var(--menu-focus,#fff);outline-offset:3px}
.product-menu-empty{padding:10px}
@media(max-width:760px){.site-header .product-menu{grid-row:3;align-self:end}.product-menu-panel{left:0;right:0;max-height:70vh}.product-menu-branch{min-width:140px}}
@media(pointer:coarse){.product-menu a,.product-menu button,.product-menu summary{min-height:44px}}

/* Size the panel to opened branches, not to the full header width. */
.product-menu-panel{right:auto;width:max-content;max-width:calc(100vw - 2 * clamp(18px,3vw,48px));gap:10px;padding:8px}
.product-menu-rail{min-width:0;flex-shrink:0;gap:0}
.product-menu-rail>a,.product-menu-rail>button{display:block;margin:0;padding:10px 12px;line-height:1.45;font-weight:normal;white-space:nowrap}
.product-menu-branch{min-width:0;flex-shrink:0}
.product-menu-categories a{min-width:0}
@media(max-width:760px){.product-menu-panel{left:0;right:auto;max-width:100vw}}

/* Home, Contact US, then Products; categories share the Products row. */
.product-menu-panel{display:grid;grid-template-columns:max-content max-content;grid-template-rows:auto auto auto;align-items:start;gap:0 8px}
.product-menu-rail{display:contents}
.product-menu-rail>.menu-home{grid-column:1;grid-row:1}
.product-menu-rail>.menu-contact{grid-column:1;grid-row:2}
.product-menu-rail>button{grid-column:1;grid-row:3;align-self:start}
.product-menu-categories{grid-column:2;grid-row:3;align-self:start}

.site-header .product-menu-panel a{color:var(--menu-item-text,#fff)}

/* These specific rules keep the saved menu controls independent of header rules. */
.site-header nav.product-menu[data-product-menu]{background:var(--menu-button-background,var(--theme-header-background,#000));color:var(--menu-button-text,var(--theme-header-foreground,#fff))}
.site-header .product-menu-root>summary{color:var(--menu-button-text,var(--theme-header-foreground,#fff))}
.site-header .product-menu-panel :is(a,button,summary):hover,.site-header .product-menu-branch[open]>summary{background:var(--menu-hover-background,#303030);color:var(--menu-hover-text,#fff)}

.site-header .product-menu-root>summary:hover{background:var(--menu-hover-background,#303030);color:var(--menu-hover-text,#fff)}