/**
 * File: assets/css/frontend/navigation/desktop.css
 * Purpose: Styles icon-aware premium desktop Primary Menu items, pill current state, badges and accessible dropdown panels.
 * Scope: Desktop Primary Menu internals only; row composition and mobile off-canvas are separate.
 * Related PHP: src/Frontend/Header/Components/PrimaryNavigation.php, src/Frontend/Navigation/Walkers/AccessibleMenuWalker.php
 * Related CSS: assets/css/frontend/header/navigation.css
 * Related JS: assets/js/frontend/navigation/desktop.js
 * Package: HyperDAF Pro
 */

.hdf-primary-navigation { display: flex; max-width: 100%; min-width: 0; height: 100%; align-items: stretch; }
.hdf-primary-navigation > .hdf-icon { display: none; }
.hdf-primary-menu,
.hdf-primary-menu .sub-menu { margin: 0; padding: 0; list-style: none; }
.hdf-primary-menu { display: flex; width: max-content; max-width: 100%; height: 100%; align-items: center; gap: clamp(.1rem, .35vw, .45rem); white-space: nowrap; }
.hdf-primary-menu > li { position: relative; display: flex; min-height: 1.75rem; align-items: center; }
.hdf-menu-item__row { display: flex; min-width: 0; align-items: center; }
.hdf-primary-menu > li > .hdf-menu-item__row { position: relative; height: 100%; }
.hdf-primary-menu a { color: var(--hdf-color-text-primary); text-decoration: none; }

.hdf-primary-menu > li > .hdf-menu-item__row > a {
    display: inline-flex;
    min-height: 1.75rem;
    align-items: center;
    gap: .36rem;
    padding: .25rem clamp(.5rem, .62vw, .75rem);
    border-radius: var(--hdf-radius-pill);
    color: var(--hdf-color-text-primary);
    font-size: clamp(.7rem, .7vw, .78rem);
    font-weight: 600;
    line-height: 1;
    transition: background-color 180ms ease, color 180ms ease, box-shadow 180ms ease;
}
.hdf-menu-item__icon { display: inline-flex; width: .92rem; height: .92rem; align-items: center; justify-content: center; color: var(--hdf-color-text-secondary); }
.hdf-menu-item__icon .hdf-icon { width: 100%; height: 100%; }
.hdf-menu-item__badge { display: inline-flex; min-height: .95rem; align-items: center; padding: 0 .3rem; border-radius: .25rem; color: var(--hdf-color-on-primary-strong); font-size: .52rem; font-weight: 700; letter-spacing: .03em; line-height: 1; text-transform: uppercase; }
.hdf-menu-item__badge--new { background: var(--hdf-color-info); }
.hdf-menu-item__badge--sale { background: var(--hdf-color-success); }

.hdf-primary-menu > li > .hdf-menu-item__row > a:hover,
.hdf-primary-menu > li > .hdf-menu-item__row > a:focus-visible { background: var(--hdf-color-surface-hover); color: var(--hdf-color-primary-strong); }
.hdf-primary-menu > li.current-menu-item > .hdf-menu-item__row > a,
.hdf-primary-menu > li.current_page_item > .hdf-menu-item__row > a,
.hdf-primary-menu > li.current-menu-ancestor > .hdf-menu-item__row > a {
    background: linear-gradient(145deg, var(--hdf-color-primary-strong), var(--hdf-color-primary-hover));
    color: var(--hdf-color-on-primary-strong);
    box-shadow: var(--hdf-shadow-sm);
}
.hdf-primary-menu > li.current-menu-item .hdf-menu-item__icon,
.hdf-primary-menu > li.current_page_item .hdf-menu-item__icon,
.hdf-primary-menu > li.current-menu-ancestor .hdf-menu-item__icon { color: currentColor; }

.hdf-submenu-toggle { display: inline-flex; width: 1.35rem; height: 1.35rem; align-items: center; justify-content: center; margin-inline-start: -.45rem; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--hdf-color-text-muted); cursor: pointer; }
.hdf-submenu-toggle:hover,
.hdf-submenu-toggle:focus-visible,
.hdf-submenu-toggle[aria-expanded="true"] { color: var(--hdf-color-primary-strong); }
.hdf-submenu-toggle .hdf-icon { width: .78rem; height: .78rem; transition: transform 180ms ease; }
.hdf-submenu-toggle[aria-expanded="true"] .hdf-icon { transform: rotate(180deg); }
.hdf-submenu-toggle--visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.hdf-primary-menu .sub-menu { position: absolute; z-index: var(--hdf-z-index-dropdown); top: calc(100% - var(--hdf-border-width-default)); left: 0; display: none; min-width: var(--hdf-navigation-submenu-width, var(--hdf-component-navigation-submenu-width)); padding: .5rem; border: 1px solid var(--hdf-color-border); border-radius: var(--hdf-radius-lg); background: var(--hdf-color-surface); box-shadow: var(--hdf-shadow-md); }
.hdf-navigation-submenu-right .hdf-primary-menu > li > .sub-menu { right: 0; left: auto; }
.hdf-primary-menu .sub-menu .sub-menu { top: -.5rem; left: calc(100% - var(--hdf-border-width-default)); }
.hdf-navigation-submenu-right .hdf-primary-menu .sub-menu .sub-menu { right: calc(100% - var(--hdf-border-width-default)); left: auto; }
.hdf-primary-menu li.is-open > .sub-menu { display: grid; }
.hdf-navigation-dropdown-hover-focus .hdf-primary-menu li:hover > .sub-menu,
.hdf-navigation-dropdown-hover-focus .hdf-primary-menu li:focus-within > .sub-menu { display: grid; }
.hdf-primary-menu .sub-menu li { position: relative; }
.hdf-primary-menu .sub-menu .hdf-menu-item__row { width: 100%; }
.hdf-primary-menu .sub-menu a { display: flex; min-width: 0; flex: 1 1 auto; align-items: center; padding: .55rem .75rem; border-radius: var(--hdf-radius-md); white-space: normal; }
.hdf-primary-menu .sub-menu a:hover,
.hdf-primary-menu .sub-menu a:focus-visible,
.hdf-primary-menu .sub-menu .current-menu-item > .hdf-menu-item__row > a { background: var(--hdf-color-surface-subtle); color: var(--hdf-color-primary-strong); }
.hdf-primary-menu .sub-menu::before { position: absolute; right: 0; bottom: 100%; left: 0; height: .5rem; content: ""; }

@media (prefers-reduced-motion: reduce) { .hdf-primary-menu a, .hdf-submenu-toggle .hdf-icon { transition: none; } }