:root{
--lk-text: var(--site-wc-price, rgba(19, 22, 11, 0.8));
--lk-muted: var(--site-header-text-color, #75767b);
--lk-accent: var(--site-header-accent-color, #ff7300);
--lk-border: rgba(19, 22, 11, 0.12);
--lk-bg: #ffffff;
--lk-header-h: var(--site-header-height, 100px);
}
.lk-sm-lock { overflow: hidden; }
.lk-sm-trigger{
display:inline-flex;
align-items:center;
gap:.5rem;
padding:.75rem 1rem;
border:1px solid var(--lk-border);
border-radius:12px;
background:var(--lk-bg);
color:var(--lk-text);
cursor:pointer;
} .lk-sm-overlay{
position:fixed;
left:0; right:0;
top:var(--lk-header-h);
height:calc(100vh - var(--lk-header-h));
background:rgba(0,0,0,.35);
opacity:0;
pointer-events:none;
transition:opacity .2s ease;
z-index:99998;
}
.lk-sm-overlay.is-open{
opacity:1;
pointer-events:auto;
} .lk-sm-drawer{
position:fixed;
left:0;
top:var(--lk-header-h);
height:calc(100vh - var(--lk-header-h));
width:360px;
max-width:92vw;
background:var(--lk-bg);
color:var(--lk-text);
transform:translateX(-105%);
transition:transform .22s ease, width .22s ease;
z-index:99999;
box-shadow:0 10px 35px rgba(0,0,0,.18);
display:flex;
flex-direction:column;
}
.lk-sm-drawer.is-open{ transform:translateX(0); }
.lk-sm-drawer.is-expanded{ width:min(1080px, 96vw); max-width:100%; top:0px; height:100%;}
.lk-sm-header{
display:flex;
align-items:center;
gap:12px;
padding:18px 18px;
border-bottom:1px solid var(--lk-border);
}
.lk-sm-close{
font-size:30px;
line-height:1;
background:none;
border:0;
cursor:pointer;
color:var(--lk-text);
}
.lk-sm-title{
font-weight:700;
font-size:22px;
} .lk-sm-body{
display:flex;
min-height:0;
height:100%;
}
.lk-sm-col{
overflow:auto;
padding:16px;
min-height:0;
}
.lk-sm-col--cats{
width:340px;
border-right:1px solid var(--lk-border);
background:rgba(0,0,0,0.01);
}
.lk-sm-col--panel{
flex:1;
min-width:0;
} .lk-sm-catlist{ list-style:none; margin:0; padding:0; }
.lk-sm-catbtn{
width:100%;
display:flex;
justify-content:space-between;
align-items:center;
gap:12px;
padding:14px 12px;
border:0;
background:transparent;
cursor:pointer;
border-radius:14px;
position:relative;
color:var(--lk-text);
font-weight:600;
}
.lk-sm-catbtn:hover{ background:rgba(0,0,0,.03); }
.lk-sm-catbtn.is-active{
background:rgba(0,0,0,.03);
}
.lk-sm-catbtn.is-active::after{
content:"";
position:absolute;
left:12px; right:12px;
bottom:0;
height:3px;
background:var(--lk-accent);
border-radius:999px;
}
.lk-sm-catleft{
display:flex;
align-items:center;
gap:12px;
min-width:0;
}
.lk-sm-caticon{
width:28px; height:28px;
display:inline-flex;
align-items:center;
justify-content:center;
flex:0 0 auto;
}
.lk-sm-caticon--empty{
background:rgba(0,0,0,.05);
border-radius:8px;
}
.lk-sm-termthumb{
width:28px;
height:28px;
object-fit:contain;
display:block;
opacity:1 !important;
filter:none !important;
mix-blend-mode:normal !important;
} .lk-sm-panel-empty{
opacity:.65;
padding:10px;
}
.lk-sm-panel-top{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
padding:6px 4px 8px;
}
.lk-sm-panel-titlewrap{
display:flex;
align-items:center;
gap:12px;
min-width:0;
}
.lk-sm-panel-icon .lk-sm-termthumb{
width:34px;
height:34px;
}
.lk-sm-panel-title{
font-weight:800;
font-size:38px;
line-height:1.05;
letter-spacing:-0.02em;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.lk-sm-seeall{
text-decoration:none;
color:var(--lk-accent);
font-weight:700;
}
.lk-sm-panel-divider{
height:2px;
background:rgba(19, 22, 11, 0.8);
opacity:.35;
margin:10px 0 18px;
} .lk-sm-seeall{
display:inline-flex;
align-items:center;
justify-content:center;
padding:10px 14px;
border-radius:200px;
background: white;
color: #ff7300;
font-weight:800;
border-color:#ff7300;
border:solid;
text-decoration:none;
line-height:1;
white-space:nowrap;
}
.lk-sm-seeall:hover{
opacity:.92;
text-decoration:none;
} .lk-sm-groups{
display:grid;
grid-template-columns: minmax(260px, 1fr) minmax(220px, 340px);
gap:32px;
align-items:start;
}
.lk-sm-groups-left .lk-sm-group{
margin-bottom:14px;
}
.lk-sm-groups-left .lk-sm-group:last-child{ margin-bottom:0; } .lk-sm-groups-brand{
border-left:1px solid var(--lk-border);
padding-left:28px;
}
.lk-sm-group--brand .lk-sm-links{
max-height:62vh;
overflow:auto;
padding-right:6px;
} .lk-sm-group-toggle{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
padding:10px 0;
background:none;
border:0;
border-bottom:1px solid var(--lk-border);
cursor:pointer;
color:var(--lk-text);
font-weight:800;
font-size:18px;
text-align:left;
}
.lk-sm-group-titletext{ font: inherit; }
.lk-sm-chev{
width:18px; height:18px;
display:inline-block;
position:relative;
opacity:.75;
}
.lk-sm-chev::before{
content:"";
position:absolute;
inset:0;
border-right:2px solid currentColor;
border-bottom:2px solid currentColor;
transform:rotate(45deg);
top:-2px;
}
.lk-sm-group.is-open .lk-sm-chev::before{
transform:rotate(-135deg);
top:4px;
} .lk-sm-links{
display:flex;
flex-direction:column;
gap:10px;
padding:12px 0 16px;
}
.lk-sm-links a{
text-decoration:none;
color:var(--lk-muted);
font-weight:600;
}
.lk-sm-links a:hover{
color:var(--lk-text);
text-decoration:none;
} @media (min-width: 821px){
.lk-sm-group-toggle{ cursor:default; }
.lk-sm-group-toggle .lk-sm-chev{ display:none; }
.lk-sm-links{ display:flex !important; }
} @media (max-width: 820px){ .lk-sm-panel-top{
display:flex !important;
padding: 8px 0 6px;
}
.lk-sm-panel-titlewrap{
display:none !important;
}
.lk-sm-panel-divider{
display:none !important;
}
.lk-sm-seeall{
width:100%;
border-width: 1px;
margin-bottom: 5px;
} .lk-sm-groups{
display:block;
flex-direction:column;
gap:18px;
}
.lk-sm-groups-brand{ order:-1; }
.lk-sm-groups-left{ order:1; }
.lk-sm-drawer.is-expanded{ width:100%; }
.lk-sm-body{
flex-direction:column;
}
.lk-sm-col--cats{
width:100%;
border-right:0;
border-bottom:1px solid var(--lk-border);
background:transparent;
}
.lk-sm-col--panel{
width:100%;
padding-top:4px;
}
.lk-sm-panel-title{ font-size:26px; }
.lk-sm-groups-brand{
border-left:0;
padding-left:0;
border-top:1px solid var(--lk-border);
padding-top:10px;
} .lk-sm-links{ display:none; padding-top:10px; }
.lk-sm-group.is-open .lk-sm-links{ display:flex; }
} .lk-sm-loading, .lk-sm-error{
padding:10px;
opacity:.75;
color:var(--lk-muted);
} .lk-sm-mobile-panel-item{
list-style:none;
margin:0;
padding:0 12px 12px;
}
.lk-sm-mobile-panel{
background: var(--lk-bg);
border-top: 1px solid var(--lk-border);
padding-top: 10px;
} .lk-sm-drawer,
.lk-sm-overlay{
height: calc(100dvh - var(--site-header-height, 100px));
} @supports not (height: 100dvh) {
.lk-sm-drawer,
.lk-sm-overlay{
height: calc(100vh - var(--site-header-height, 100px));
}
} .lk-sm-col,
.lk-sm-drawer{
-webkit-overflow-scrolling: touch;
overscroll-behavior: contain;
} .lk-sm-chips{
display:grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap:10px;
margin-bottom:14px;
}
.lk-sm-chip{
display:inline-flex;
align-items:center;
justify-content:center;
padding:12px 12px;
border-radius:999px;
border:1px solid var(--lk-border);
background:rgba(0,0,0,.02);
color:var(--lk-text);
text-decoration:none;
font-weight:700;
line-height:1.1;
text-align:center;
}
.lk-sm-chip:hover{
background:rgba(0,0,0,.04);
text-decoration:none;
} @media (min-width: 821px){
.lk-sm-chips{
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
@media (max-width: 420px){ .lk-sm-chips{ grid-template-columns: 1fr; } }