/* Fase 183 — Mega-menú de categorías con flyout (lib/mega-menu-lib.php).
   Colores por variables: cada plantilla las pasa en el style del .mm */
.mm{
  --mm-accent:#FF6B00; --mm-bg:#141A24; --mm-bg2:#0F141C; --mm-border:#232C3D;
  --mm-text:#F3F4F6; --mm-muted:#9CA3AF;
  width:min(92vw,780px); display:flex; flex-direction:column;
  text-transform:none; letter-spacing:normal; font-weight:400; text-align:left;
  color:var(--mm-text); background:var(--mm-bg);
}
.mm.mm-simple{width:min(92vw,560px)}
.mm a{text-decoration:none}
.mm-search{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--mm-border)}
.mm-search i{color:var(--mm-muted);font-size:12px}
.mm-q{flex:1;background:transparent;border:0;outline:0;color:var(--mm-text);font-size:13px;padding:4px 0}
.mm-q::placeholder{color:var(--mm-muted)}

.mm-body{display:grid;grid-template-columns:240px 1fr;height:min(62vh,420px)}
.mm-padres{list-style:none;margin:0;padding:6px 0;overflow-y:auto;background:var(--mm-bg2);border-right:1px solid var(--mm-border)}
.mm-padre>a{display:flex;align-items:center;gap:8px;padding:10px 14px 10px 13px;border-left:3px solid transparent;
  color:var(--mm-text);font-size:13px;font-weight:600;transition:background .12s,color .12s,border-color .12s}
.mm-nombre{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mm-chev{font-size:10px;opacity:.45;transition:transform .15s,opacity .15s}
.mm-nhijas{font-size:10px;font-weight:700;min-width:18px;text-align:center;padding:1px 5px;border-radius:9px;
  background:color-mix(in srgb,var(--mm-muted) 20%,transparent);color:var(--mm-muted)}
.mm-padre.is-active>a{background:var(--mm-bg);color:var(--mm-accent);border-left-color:var(--mm-accent)}
.mm-padre.is-active .mm-chev{opacity:1;transform:translateX(3px)}
.mm-padre.is-active .mm-nhijas{background:var(--mm-accent);color:#fff}

.mm-paneles{overflow-y:auto;padding:16px 20px}
.mm-panel{display:none}
.mm-panel.is-active{display:block;animation:mmIn .16s ease-out}
@keyframes mmIn{from{opacity:0;transform:translateX(6px)}to{opacity:1;transform:none}}
.mm-panel-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding-bottom:8px;margin-bottom:10px;border-bottom:2px solid var(--mm-accent)}
.mm-panel-titulo{font-size:15px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:var(--mm-text)}
.mm-ver-todo{font-size:11px;font-weight:700;color:var(--mm-accent);white-space:nowrap}
.mm-ver-todo:hover{text-decoration:underline}
.mm-hijas{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:2px 14px}
.mm-hijas a,.mm-grilla a,.mm-resultados a{display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:8px 10px;border-radius:7px;color:var(--mm-text);font-size:13px;transition:background .12s,color .12s}
.mm-hijas a span:first-child::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;
  background:var(--mm-accent);opacity:.55;margin-right:8px;vertical-align:middle}
.mm-hijas a:hover,.mm-grilla a:hover,.mm-resultados a:hover{background:color-mix(in srgb,var(--mm-accent) 15%,transparent);color:var(--mm-accent)}
.mm-hijas a:hover span:first-child::before{opacity:1}
.mm-count{font-size:10px;color:var(--mm-muted);font-family:ui-monospace,monospace}
.mm-sin{color:var(--mm-muted);font-size:12.5px;line-height:1.7;padding:6px 2px}
.mm-sin a{color:var(--mm-accent);font-weight:700}

.mm-grilla{list-style:none;margin:0;padding:10px;display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:2px 10px;max-height:min(62vh,420px);overflow-y:auto}
.mm-resultados{display:none;list-style:none;margin:0;padding:8px;max-height:min(62vh,420px);overflow-y:auto}
.mm-resultados small{color:var(--mm-muted);font-size:11px;margin-left:4px}
.mm-res-vacio{display:none;color:var(--mm-muted);font-size:12.5px;padding:10px}
.mm.is-buscando .mm-body,.mm.is-buscando .mm-grilla{display:none}
.mm.is-buscando .mm-resultados{display:block}
.mm.is-buscando.sin-resultados .mm-res-vacio{display:block}
/* Fase 185: contenedor de las plantillas que arman el menú por JS (ferretería, compustore, …) */
.mm-host{padding:0!important;width:auto!important;min-width:0!important;max-height:none!important;overflow:hidden!important}
.mm-host .mm a{display:flex}
.mm-host .mm .mm-padre>a,.mm-host .mm .mm-ver-todo{justify-content:flex-start}
.mm-host .mm .mm-ver-todo{display:inline-flex;gap:4px;padding:0;background:none!important}
.mm-host .mm .mm-sin a{display:inline;padding:0;background:none!important}
/* ganarle a los estilos genéricos de links de cada plantilla (.fer-nav-drop-menu a, …) */
.mm-host .mm .mm-padre>a{justify-content:flex-start;padding:10px 14px 10px 13px;border-radius:0;font-size:13px}
.mm-host .mm .mm-padre.is-active>a{background:var(--mm-bg);color:var(--mm-accent)}
.mm-host .mm .mm-hijas a,.mm-host .mm .mm-grilla a,.mm-host .mm .mm-resultados a{justify-content:space-between;padding:8px 10px;border-radius:7px;font-size:13px}