/* Categorias em 2 níveis — painel de subcategorias (computador), linha de subcategorias
   no conteúdo e grupos no menu lateral do celular. 12/10/2026 */

.catitem .cseta{font-size:9px;opacity:.7;margin-left:1px}

.megacat{position:fixed;z-index:45;display:none;background:#fff;color:var(--ink);
  border-radius:0 0 14px 14px;box-shadow:0 18px 40px -12px rgba(0,0,0,.35);padding:16px 18px 18px;
  border-top:3px solid var(--red)}
.megacat.show{display:block}
@media(max-width:640px){ .megacat{display:none !important} }
.megacat-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid var(--line)}
.megacat-head b{font-family:'Archivo',sans-serif;font-size:16px;font-weight:800;text-transform:uppercase;letter-spacing:.3px}
.megacat-head a{font-size:12.5px;font-weight:700;color:var(--red);cursor:pointer}
.megacat-head a:hover{text-decoration:underline}
.megacat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:4px 10px}
.megacat-item{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:9px;cursor:pointer;color:var(--ink);text-decoration:none}
.megacat-item:hover,.megacat-item.active{background:var(--concrete)}
.megacat-ic{width:34px;height:34px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;
  background:var(--accent-bg);color:var(--accent)}
.megacat-ic svg{width:21px;height:21px}
.megacat-ic img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.megacat-nome{font-size:13.5px;font-weight:600;line-height:1.25;flex:1}
.megacat-qtd{font-size:11.5px;color:var(--ink-soft)}

.subcat-row{display:flex;flex-wrap:wrap;gap:8px;margin:-4px 0 18px}
.subcat-chip{border:1.5px solid var(--line);background:#fff;color:var(--ink);font:600 12.5px 'IBM Plex Sans',sans-serif;
  padding:7px 13px;border-radius:999px;cursor:pointer}
.subcat-chip:hover{border-color:var(--ink-soft)}
.subcat-chip.active{background:var(--ink);border-color:var(--ink);color:#fff}
@media(max-width:640px){
  .subcat-row{flex-wrap:nowrap;overflow-x:auto;margin-left:-4px;margin-right:-4px;padding:0 4px 4px;scrollbar-width:none}
  .subcat-row::-webkit-scrollbar{display:none}
  .subcat-chip{flex-shrink:0}
}
.secthead-sub h2{font-size:17px}
.cat-trilha{color:var(--ink-soft);cursor:pointer;text-decoration:none}
.cat-trilha:hover{color:var(--red);text-decoration:underline}
.cat-trilha-sep{margin:0;color:var(--ink-soft);font-weight:500;font-style:normal}

.catdrawer-grupo .catdrawer-item{width:100%;text-align:left}
.catdrawer-seta{margin-left:auto;width:30px;height:30px;flex-shrink:0;display:grid;place-items:center;
  color:var(--ink-soft);transition:transform .18s}
.catdrawer-seta svg{width:24px;height:24px}
.catdrawer-seta.aberto{transform:rotate(180deg);color:var(--ink)}
.catdrawer-subs{display:flex;flex-direction:column;margin:2px 0 8px 68px;border-left:2px solid var(--line)}
.catdrawer-sub{display:flex;justify-content:space-between;align-items:center;gap:8px;text-align:left;border:none;background:none;
  padding:11px 12px;font:500 14px 'IBM Plex Sans',sans-serif;color:var(--ink);cursor:pointer;border-radius:0 8px 8px 0;
  border-bottom:1px solid rgba(0,0,0,.05)}
.catdrawer-sub span{font-size:11.5px;color:var(--ink-soft)}
.catdrawer-sub-tudo{font-weight:700}
.catdrawer-sub.active{background:#fff;font-weight:700}