/* Multi-level primary navigation: desktop hover dropdown + flyout, mobile accordion. */

.ref-navigation .primary-menu li{position:relative}

/* Caret on any item that owns a submenu. */
.ref-navigation .primary-menu .menu-item-has-children>a,.ref-header.is-scrolled .ref-navigation .primary-menu .menu-item-has-children>a{padding-right:16px}
.ref-navigation .primary-menu .menu-item-has-children>a:before{content:"";position:absolute;right:0;top:50%;width:5px;height:5px;margin-top:-4px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);transition:transform .25s var(--ref-ease)}
.ref-navigation .primary-menu .menu-item-has-children:hover>a:before,.ref-navigation .primary-menu .menu-item-has-children:focus-within>a:before{transform:rotate(-135deg)}
.ref-navigation .primary-menu .sub-menu .menu-item-has-children>a:before{transform:rotate(-45deg);margin-top:-3px}
.ref-navigation .primary-menu .sub-menu .menu-item-has-children:hover>a:before,.ref-navigation .primary-menu .sub-menu .menu-item-has-children:focus-within>a:before{transform:rotate(-45deg)}

.ref-navigation .sub-menu{position:absolute;z-index:60;top:100%;left:-22px;min-width:268px;margin:0;padding:9px 0;list-style:none;background:#fff;box-shadow:0 18px 44px rgba(0,0,0,.17);border-top:2px solid var(--ref-red);opacity:0;visibility:hidden;transform:translateY(9px);transition:opacity .24s var(--ref-ease),transform .24s var(--ref-ease),visibility .24s}
.ref-navigation .sub-menu .sub-menu{top:-9px;left:100%;transform:translateX(9px);border-top:0;border-left:2px solid var(--ref-red)}
.ref-navigation .sub-menu .sub-menu.is-flipped{left:auto;right:100%;transform:translateX(-9px);border-left:0;border-right:2px solid var(--ref-red)}
.ref-navigation .primary-menu>li>.sub-menu.is-flipped{left:auto;right:-22px}

.ref-navigation .primary-menu li:hover>.sub-menu,.ref-navigation .primary-menu li:focus-within>.sub-menu{opacity:1;visibility:visible;transform:none}

.ref-navigation .sub-menu li{border-bottom:1px solid #f0f0f0}
.ref-navigation .sub-menu li:last-child{border-bottom:0}
.ref-navigation .sub-menu a{display:block;padding:12px 30px 12px 20px;color:#222;font-size:14px;line-height:1.45;white-space:normal}
.ref-navigation .sub-menu a:after{display:none}
.ref-navigation .sub-menu a:hover,.ref-navigation .sub-menu .current-menu-item>a{background:#f6f4f0;color:var(--ref-red)}
.ref-navigation .sub-menu .menu-item-has-children>a{padding-right:26px}
.ref-navigation .sub-menu .menu-item-has-children>a:before{right:16px}

/* Keep the parent underline lit while its dropdown is open. */
.ref-navigation .primary-menu>li:hover>a:after,.ref-navigation .primary-menu>li:focus-within>a:after{right:0}

/* Accordion toggle is desktop-hidden; injected by navigation.js. */
.submenu-toggle{display:none}

/* --- Header language picker --- */
.ref-header__language-wrap{position:relative}
.ref-language-menu{position:absolute;z-index:70;top:calc(100% + 14px);right:0;min-width:172px;padding:7px 0;background:#fff;border-top:2px solid var(--ref-red);box-shadow:0 18px 44px rgba(0,0,0,.17)}
.ref-language-menu[hidden]{display:none}
.ref-language-menu a{display:block;padding:10px 18px;color:#222;font-size:14px;line-height:1.4;white-space:nowrap}
.ref-language-menu a:hover{background:#f6f4f0;color:var(--ref-red)}
.ref-language-menu a.is-active{color:var(--ref-red);font-weight:700}

/* --- WooCommerce breadcrumb --- */
.woocommerce .woocommerce-breadcrumb{padding:26px 0 0!important;margin:0!important;color:#7d837e;font-size:12px;letter-spacing:.02em}
.woocommerce .woocommerce-breadcrumb a{color:#7d837e}
.woocommerce .woocommerce-breadcrumb a:hover{color:var(--ref-red)}
.woocommerce .woocommerce-breadcrumb .sep{margin:0 9px;color:#c3c8c3}

@media(max-width:767px){
    .ref-navigation{overflow-y:auto;-webkit-overflow-scrolling:touch}
    .ref-navigation.is-open{max-height:calc(100vh - 56px)}
    .ref-navigation .primary-menu li{position:relative}
    .ref-navigation .primary-menu .menu-item-has-children>a:before{display:none}
    .ref-navigation .primary-menu .menu-item-has-children>a{padding-right:52px}

    .submenu-toggle{display:grid;place-items:center;position:absolute;top:0;right:0;width:48px;height:45px;padding:0;border:0;border-left:1px solid #eee;background:transparent;color:#111;cursor:pointer}
    .submenu-toggle:before{content:"";width:7px;height:7px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .25s var(--ref-ease)}
    .submenu-toggle[aria-expanded="true"]:before{transform:translateY(1px) rotate(-135deg)}
    .submenu-toggle[aria-expanded="true"]{color:var(--ref-red)}

    .ref-navigation .sub-menu{position:static;min-width:0;padding:0;border:0;box-shadow:none;background:#fafafa;opacity:1;visibility:visible;transform:none;display:none}
    .ref-navigation .sub-menu.is-open{display:block}
    /* Reset the desktop flyout offsets the nested rule would otherwise keep. */
    .ref-navigation .sub-menu .sub-menu,.ref-navigation .sub-menu .sub-menu.is-flipped{position:static;left:auto;right:auto;top:auto;transform:none;border:0;background:#f2f2f2}
    .ref-navigation .sub-menu a{padding:12px 16px 12px 26px;font-size:14px}
    .ref-navigation .sub-menu .sub-menu a{padding-left:40px}
    .ref-navigation .sub-menu .menu-item-has-children>a{padding-right:52px}
    .ref-navigation .sub-menu .submenu-toggle{height:42px}
}

@media(prefers-reduced-motion:reduce){
    .ref-navigation .sub-menu,.ref-navigation .primary-menu .menu-item-has-children>a:before,.submenu-toggle:before{transition:none}
}
