/* =====================================================================
 * JFMENU — Menú flyout 3 columnas (Verko) — Juguetes Fantasía
 * Ver views/js/jfmenu.js. Solo escritorio (>=1025px).
 * ===================================================================== */
.jf-fly{
  --mm-primary:#092B44; --mm-accent:#2570B3; --mm-orange:#FE9824;
  --mm-ink:#2b2b2b; --mm-muted:#8a90a0; --mm-line:#eef0f5;
  --mm-hover:#f3f6fb; --mm-active:#eaf2fb;
  display:none; align-items:stretch; width:100%; background:#fff; font-family:inherit;
}
.jf-fly *{ box-sizing:border-box; }

@media (min-width:1025px){
  #iqitmegamenu-wrapper .cbp-hrsub .jf-native{ display:none !important; }
  #iqitmegamenu-wrapper .cbp-hrsub .jf-fly{ display:flex; }
}
@media (max-width:1024px){
  #iqitmegamenu-wrapper .cbp-hrsub .jf-fly{ display:none !important; }
}

/* Izquierda: subcategorías */
.jf-fly__cats{
  list-style:none; margin:0; padding:10px 8px;
  flex:0 0 300px; width:300px;
  border-right:1px solid var(--mm-line);
  max-height:70vh; overflow:auto;
}
.jf-fly__cat{ margin:0; }
.jf-fly__cat-link{
  display:flex; align-items:center; gap:10px;
  padding:9px 12px; border-radius:8px; text-decoration:none;
  color:var(--mm-primary); font-size:13.5px; font-weight:600; line-height:1.25;
}
.jf-fly__cat-link:hover{ background:var(--mm-hover); color:var(--mm-primary); }
.jf-fly__cat-link.is-active{ background:var(--mm-active); color:var(--mm-accent); }
.jf-fly__cat-link:focus-visible{ outline:2px solid var(--mm-accent); outline-offset:-2px; }
.jf-fly__cat-name{ flex:1; }
.jf-fly__cat-arrow{ color:var(--mm-muted); font-size:18px; line-height:1; }
.jf-fly__cat-link.is-active .jf-fly__cat-arrow{ color:var(--mm-accent); }

/* Centro: hijas */
.jf-fly__panel{
  flex:1; min-width:0; padding:18px 24px;
  max-height:70vh; overflow:auto;
}
.jf-fly__all{
  display:inline-block; margin:0 0 12px;
  color:var(--mm-accent); font-weight:700; font-size:14px; text-decoration:none;
}
.jf-fly__all:hover{ text-decoration:underline; color:var(--mm-accent); }
.jf-fly__kids{ list-style:none; margin:0; padding:0; columns:2; column-gap:24px; }
.jf-fly__kid{ break-inside:avoid; }
.jf-fly__kid a{
  display:block; padding:7px 8px; border-radius:6px;
  color:var(--mm-ink); text-decoration:none; font-size:13.5px; line-height:1.35;
}
.jf-fly__kid a:hover{ background:var(--mm-hover); color:var(--mm-accent); }

/* Derecha: banner editable */
.jf-fly__aside{ flex:0 0 280px; width:280px; padding:16px 16px 16px 0; }
.jf-fly__banner{
  display:flex; flex-direction:column; align-items:flex-start; gap:10px;
  min-height:240px; height:100%; padding:22px 20px; border-radius:12px;
  background:linear-gradient(160deg, #092B44 0%, #2570B3 100%);
  background-size:cover; background-position:center;
  color:#fff; text-decoration:none;
}
.jf-fly__banner:hover{ color:#fff; text-decoration:none; }
.jf-fly__banner.has-bg{ justify-content:flex-end; }
.jf-fly__banner-tag{
  background:var(--mm-orange); color:#fff; border-radius:999px;
  padding:4px 12px; font-size:11px; font-weight:700; letter-spacing:.02em;
}
.jf-fly__banner-title{ margin:0; color:#fff; font-size:20px; font-weight:700; line-height:1.2; }
.jf-fly__banner-text{ margin:0; color:rgba(255,255,255,.88); font-size:13px; line-height:1.4; }
.jf-fly__banner-btn{
  margin-top:4px; background:var(--mm-orange); color:#fff; border-radius:8px;
  padding:10px 18px; font-size:13px; font-weight:600;
}
.jf-fly__banner:hover .jf-fly__banner-btn{ filter:brightness(1.06); }
.jf-fly__banner:focus-visible{ outline:3px solid var(--mm-orange); outline-offset:2px; }