:root {
--fmw-or: #E8620A;
--fmw-or-h: #CF5208;
--fmw-or-p: #FEF0E7;
--fmw-dk: #1C1C1C;
--fmw-tx: #2A2A2A;
--fmw-mu: #717171;
--fmw-bd: #E8E8E8;
--fmw-bg: #FFFFFF;
--fmw-sf: #F6F5F3;
--fmw-shadow: 0 12px 48px rgba(0, 0, 0, .14), 0 3px 12px rgba(0, 0, 0, .06);
--fmw-ease: cubic-bezier(0.22, 1, 0.36, 1);
} .fiamo-nav-wrap {
position: relative;
}
.fiamo-nav-menu {
list-style: none;
margin: 0;
padding: 0;
display: flex;
align-items: center;
gap: 2px;
flex-wrap: wrap;
} .fmm-walker-item {
position: relative;
}
.fmm-walker-trigger {
display: inline-flex;
align-items: center;
gap: 5px;
padding: 10px 14px;
font-size: 14px;
font-weight: 500;
color: var(--fmw-tx);
text-decoration: none;
border-radius: 6px;
white-space: nowrap;
transition: background .13s ease, color .13s ease;
cursor: pointer;
user-select: none;
}
.fmm-walker-trigger:hover,
.fmm-walker-item.fmm-open .fmm-walker-trigger {
background: var(--fmw-or-p);
color: var(--fmw-or);
}
.fmm-walker-label {
flex: 1;
}
.fmm-walker-chevron {
flex-shrink: 0;
color: var(--fmw-mu);
display: flex;
align-items: center;
transition: transform .15s var(--fmw-ease), color .13s;
}
.fmm-walker-item.fmm-open .fmm-walker-chevron {
transform: rotate(180deg);
color: var(--fmw-or);
} .fmm-walker-panel {
position: fixed; z-index: 999999;
background: var(--fmw-bg);
border: 1px solid var(--fmw-bd);
border-top: 3px solid var(--fmw-or);
border-radius: 0 0 12px 12px;
box-shadow: var(--fmw-shadow);
width: auto;
opacity: 0;
visibility: hidden;
pointer-events: none;
transform: translateY(-8px);
transition: opacity .2s var(--fmw-ease), transform .2s var(--fmw-ease), visibility .2s;
overflow: hidden;
max-height: calc(100vh - 80px);
overflow-y: auto;
scrollbar-width: thin;
left: -9999px; }
.fmm-walker-panel::-webkit-scrollbar {
width: 4px;
}
.fmm-walker-panel::-webkit-scrollbar-thumb {
background: var(--fmw-bd);
border-radius: 4px;
}
.fmm-walker-item.fmm-open .fmm-walker-panel,
.fmm-walker-panel.fmm-walker-panel-open {
opacity: 1;
visibility: visible;
pointer-events: all;
transform: translateY(0);
} .fmm-walker-panel-inner {
display: flex;
gap: 0;
padding: 0;
} .fmm-walker-grid {
list-style: none;
margin: 0;
padding: 16px 0;
min-width: 180px;
border-right: 1px solid var(--fmw-bd);
flex-shrink: 0;
}
.fmm-walker-grid>li>a {
display: block;
padding: 8px 18px;
font-size: 13px;
font-weight: 500;
color: var(--fmw-tx);
text-decoration: none;
transition: background .1s, color .1s;
}
.fmm-walker-grid>li>a:hover {
background: var(--fmw-or-p);
color: var(--fmw-or);
} .fmm-walker-panel-inner {
display: flex;
flex-direction: column;
padding: 16px 20px 20px;
gap: 20px;
} .fmm-walker-group {
display: flex;
flex-direction: column;
gap: 10px;
}
.fmm-walker-group+.fmm-walker-group {
border-top: 1px solid var(--fmw-bd);
padding-top: 16px;
}
.fmm-walker-group-title {
display: inline-block;
font-size: 10px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .09em;
color: var(--fmw-or);
text-decoration: none;
}
.fmm-walker-group-title:hover {
opacity: .75;
} .fmm-walker-group-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 4px 12px;
} .fmm-walker-grid-item {
display: flex;
flex-direction: column;
gap: 2px;
} .fmm-walker-cat-link {
display: flex;
align-items: center;
gap: 8px;
padding: 6px 6px;
border-radius: 5px;
font-size: 12.5px;
font-weight: 600;
color: var(--fmw-dk);
text-decoration: none;
transition: background .1s, color .1s;
margin-top: 4px;
}
.fmm-walker-cat-link:hover {
background: var(--fmw-or-p);
color: var(--fmw-or);
}
.fmm-walker-cat-img {
width: 26px;
height: 26px;
border-radius: 4px;
background: var(--fmw-bd) center/cover no-repeat;
flex-shrink: 0;
}
.fmm-walker-cat-dot {
width: 6px;
height: 6px;
border-radius: 50%;
background: var(--fmw-bd);
flex-shrink: 0;
transition: background .1s, transform .1s;
}
.fmm-walker-cat-link:hover .fmm-walker-cat-dot {
background: var(--fmw-or);
transform: scale(1.4);
}
.fmm-walker-cat-name {
flex: 1;
}
.fmm-walker-cat-count {
font-size: 9.5px;
color: var(--fmw-mu);
background: var(--fmw-sf);
border: 1px solid var(--fmw-bd);
padding: 1px 5px;
border-radius: 20px;
flex-shrink: 0;
} .fmm-walker-subcats {
list-style: none;
margin: 0 0 4px 14px;
padding: 0;
border-left: 2px solid var(--fmw-bd);
}
.fmm-walker-subcat {
display: block;
padding: 2px 10px;
font-size: 11.5px;
color: var(--fmw-mu);
text-decoration: none;
transition: color .1s;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.fmm-walker-subcat:hover {
color: var(--fmw-or);
} .fmm-walker-has-dropdown .sub-menu {
position: absolute;
top: calc(100% + 4px);
left: 0;
list-style: none;
margin: 0;
padding: 6px 0;
background: var(--fmw-bg);
border: 1px solid var(--fmw-bd);
border-radius: 8px;
box-shadow: 0 8px 24px rgba(0, 0, 0, .1);
min-width: 200px;
opacity: 0;
visibility: hidden;
transform: translateY(-6px);
transition: opacity .15s ease, transform .15s ease, visibility .15s;
z-index: 999;
}
.fmm-walker-has-dropdown.fmm-open .sub-menu {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
.fmm-walker-has-dropdown .sub-menu a {
display: block;
padding: 8px 16px;
font-size: 13px;
color: var(--fmw-tx);
text-decoration: none;
transition: background .1s, color .1s;
}
.fmm-walker-has-dropdown .sub-menu a:hover {
background: var(--fmw-or-p);
color: var(--fmw-or);
} @media (max-width: 900px) {
.fiamo-nav-menu {
flex-direction: column;
align-items: stretch;
gap: 0;
}
.fmm-walker-trigger {
padding: 12px 16px;
border-radius: 0;
border-bottom: 1px solid var(--fmw-bd);
justify-content: space-between;
} .fmm-walker-panel {
position: static !important;
width: 100% !important;
left: auto !important;
top: auto !important;
transform: none !important;
border-radius: 0;
border-top: none;
border-left: 3px solid var(--fmw-or);
border-right: none;
border-bottom: none;
box-shadow: none;
opacity: 1 !important;
visibility: visible !important;
pointer-events: all !important;
max-height: none !important;
display: none;
z-index: 1 !important;
}
.fmm-walker-panel.fmm-walker-panel-open {
display: block;
}
.fmm-walker-panel-inner {
flex-direction: column;
}
.fmm-walker-grid {
border-right: none;
border-bottom: 1px solid var(--fmw-bd);
}
.fmm-walker-group-grid {
grid-template-columns: 1fr;
}
.fmm-walker-has-dropdown .sub-menu {
position: static;
opacity: 1;
visibility: visible;
transform: none;
box-shadow: none;
border: none;
border-left: 3px solid var(--fmw-or);
border-radius: 0;
display: none;
}
.fmm-walker-has-dropdown.fmm-open .sub-menu {
display: block;
}
} .has-mega-menu>a .text-wrap::after {
content: '\f107';
font-family: 'FontAwesome';
margin-left: 5px;
font-size: 12px;
}