/* assets/css/ali-v6.css — escritorio (≥1024px) con la estructura de un marketplace B2B:
   · header: barra superior (logo, buscador ancho con cámara y botón naranja, Entregar en, idioma-moneda,
     cotizaciones, Iniciar sesión, "Crear cuenta") + segunda fila con el mega-menú "Todas las categorías";
   · portada: hero claro con pestañas Productos / Proveedores / Zonas Francas / Mundial, buscador grande,
     franja "Bienvenido a…" y fila de tarjetas (categorías con panel lateral, historial, sigue buscando,
     selección destacada).
   Se carga después de ali-v5.css. MÓVIL Y TABLET NO CAMBIAN: todo lo visual vive dentro de
   @media (min-width: 1024px); por debajo, los elementos .ik6-d (solo escritorio) quedan ocultos. */

@media (max-width: 1023.98px) {
    .ik6-d { display: none !important; }
}

@media (min-width: 1024px) {
:root {
    --ik6-o: #AB733C;            /* bronce de la marca (acento de acción) */
    --ik6-o-d: #95622f;
    --ik6-o-soft: #fdf6ea;
    --ik6-grad: linear-gradient(90deg, #CD9765 0%, #AB733C 100%);
    --ik6-ring: linear-gradient(90deg, #AB733C 0%, #CD9765 50%, #AB733C 100%);
    --ik6-ink: #1f2329;
    --ik6-ink-2: #4b5260;
    --ik6-muted: #767b85;
    --ik6-line: #ececec;
    --ik6-card: #f6f6f6;
    --ik6-ease: cubic-bezier(.2, .8, .2, 1);
}
.ik6-nd { display: none !important; }
.ik6-sr { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
/* Íconos de Material Symbols: si la fuente no carga, el texto del ligado nunca desborda */
.ik6-ic { width: 22px; flex: none; overflow: hidden; font-size: 21px; color: var(--ik6-muted); }

/* ══════════════════════ HEADER ══════════════════════ */
#main-header { padding: 12px 0 0; }
#main-header .container > .mt-12 { display: none !important; }                      /* fila 2 anterior → .ik6-row2 */
#main-header .header-deliver, #main-header .header-action--lang { display: none !important; }
#main-header .container > .flex:first-child { min-height: 52px; gap: 8px; }
#main-header .logo img { height: 34px !important; }

/* Buscador ancho (en la portada aparece al pasar el buscador del hero; en el resto siempre) */
#main-header .main-header--search { flex: 1 1 0; min-width: 0 !important; max-width: 780px; justify-content: flex-start; padding: 0 12px 0 28px; }
#main-header .main-header--search-box { max-width: none; min-width: 0; height: 44px; border: 2px solid transparent; border-radius: 999px;
    background: linear-gradient(#fff, #fff) padding-box, var(--ik6-ring) border-box !important; box-shadow: none !important; }
#main-header .main-header--search-box input { font-size: 14.5px !important; padding: 0 18px; color: var(--ik6-ink); }
#main-header .main-header--search-image { border-left: 0; width: 44px; border-radius: 50%; transition: background .15s; }
#main-header .main-header--search-image:hover { background: #f5f5f5; }
#main-header .main-header--search-image svg { width: 22px; height: 22px; }
#main-header .main-header--search-btn { height: 34px; margin: 3px 3px 3px 2px; padding: 0 20px !important; background: var(--ik6-grad) !important;
    font-size: 14px !important; font-weight: 700; letter-spacing: .01em; transition: filter .15s; }
#main-header .main-header--search-btn:hover { filter: brightness(1.06); }

#main-header .header-action { gap: 22px !important; }
#main-header .header-action .chat-icon-btn { overflow: hidden; }
.ik6-deliver { display: flex; flex-direction: column; justify-content: center; line-height: 1.2; text-decoration: none; color: var(--ik6-ink); }
.ik6-deliver-k { font-size: 12px; color: var(--ik6-muted); }
.ik6-deliver-v { display: inline-flex; align-items: center; gap: 5px; font-size: 14px; }
.ik6-deliver-v .ik-flag { width: 20px; height: 14px; }
.ik6-deliver:hover .ik6-deliver-v b { color: var(--ik6-o); }
.ik6-hbtn { display: inline-flex; align-items: center; gap: 7px; padding: 0; border: 0; background: none; color: var(--ik6-ink); font: 500 14px/1 Inter, system-ui, sans-serif;
    text-decoration: none; cursor: pointer; white-space: nowrap; transition: color .15s; }
.ik6-hbtn:hover { color: var(--ik6-o); }
.ik6-hbtn:focus-visible, .ik6-deliver:focus-visible { outline: 2px solid var(--ik6-o); outline-offset: 4px; border-radius: 6px; }
.ik6-hicon { width: 34px; height: 34px; justify-content: center; border-radius: 50%; }
.ik6-hicon:hover { background: rgba(0,0,0,.05); }
#main-header .header-action--login { font-size: 14px; font-weight: 500; }
#main-header .header-action--login .ik6-d { display: inline; }
#main-header .header-action--login:hover { color: var(--ik6-o) !important; }
#main-header .header-action > .btn.btn-primary { height: 40px; padding: 0 22px; border: 0; border-radius: 999px; background: var(--ik6-o); color: #fff;
    font-size: 14.5px; font-weight: 700; box-shadow: 0 4px 12px rgba(171,115,60,.25); transition: background .15s, transform .15s; }
#main-header .header-action > .btn.btn-primary:hover { background: var(--ik6-o-d); transform: translateY(-1px); }
#main-header .header-action > .btn.btn-primary .ik6-d { display: inline; }

/* Fila 2 */
.ik6-row2 { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 42px; }
#main-header.ik6-compact .ik6-row2 { display: none; }
#main-header.ik6-compact { padding-bottom: 10px; }
.ik6-row2-l, .ik6-row2-r { display: flex; align-items: center; gap: 28px; min-width: 0; white-space: nowrap; }
.ik6-row2-r { overflow: hidden; }
.ik6-row2-link, .ik6-row2-r a { font-size: 14px; color: var(--ik6-ink); text-decoration: none; transition: color .15s; }
.ik6-row2-link:hover, .ik6-row2-r a:hover { color: var(--ik6-o); }

/* ── Mega-menú "Todas las categorías" ── */
.ik6-cat { position: static; }
.ik6-cat-trigger { display: inline-flex; align-items: center; gap: 7px; height: 42px; padding: 0; border: 0; background: none; color: var(--ik6-ink);
    font: 500 14px/1 Inter, system-ui, sans-serif; cursor: pointer; position: relative; }
.ik6-cat-trigger::after { content: ''; position: absolute; left: 0; right: 0; bottom: 4px; height: 2px; border-radius: 2px; background: var(--ik6-o); transform: scaleX(0); transition: transform .2s var(--ik6-ease); }
.ik6-cat-trigger:hover, .ik6-cat-trigger[aria-expanded="true"] { color: var(--ik6-o); }
.ik6-cat-trigger[aria-expanded="true"]::after { transform: scaleX(1); }
.ik6-cat-trigger:focus-visible { outline: 2px solid var(--ik6-o); outline-offset: 2px; border-radius: 6px; }
.ik6-cat-caret { transition: transform .2s; opacity: .7; }
.ik6-cat-trigger[aria-expanded="true"] .ik6-cat-caret { transform: rotate(180deg); }
.ik6-cat-scrim { display: none; }
html.ik6-dim #main-header { background: #fff !important; }
html.ik6-dim body::after { content: ''; position: fixed; inset: 0; z-index: 45; background: rgba(15,20,27,.35); animation: ik6Fade .2s ease both; }

.ik6-cat-panel { position: absolute; z-index: 80; top: 100%; left: 0; right: 0; margin-top: 2px; display: grid; grid-template-columns: 290px minmax(0, 1fr);
    height: min(540px, calc(100vh - var(--ik-header-h, 120px) - 24px)); min-height: 320px; overflow: hidden;
    background: #fff; border: 1px solid var(--ik6-line); border-radius: 16px; box-shadow: 0 24px 60px rgba(15,20,27,.18);
    opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity .18s ease, transform .22s var(--ik6-ease), visibility 0s linear .22s; }
.ik6-cat.is-open .ik6-cat-panel { opacity: 1; visibility: visible; transform: none; transition: opacity .18s ease, transform .22s var(--ik6-ease), visibility 0s; }
.ik6-cat-side { margin: 0; padding: 10px 0; list-style: none; overflow-y: auto; border-right: 1px solid var(--ik6-line); background: #fafafa; scrollbar-width: thin; }
.ik6-cat-item, .ik6-side-item { display: flex; align-items: center; gap: 12px; padding: 9px 16px 9px 20px; color: var(--ik6-ink); font-size: 14px; text-decoration: none; transition: background .12s, color .12s; }
.ik6-cat-item.is-on { background: #fff; color: var(--ik6-o); font-weight: 600; box-shadow: inset 3px 0 0 var(--ik6-o); }
.ik6-cat-item.is-on .ik6-ic, .ik6-side-item.is-on .ik6-ic { color: var(--ik6-o); }
.ik6-cat-item:focus-visible, .ik6-side-item:focus-visible, .ik6-tile:focus-visible, .ik6-viewall:focus-visible { outline: 2px solid var(--ik6-o); outline-offset: -2px; border-radius: 8px; }
.ik6-cat-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ik6-chev { flex: none; width: 7px; height: 7px; border-top: 1.6px solid currentColor; border-right: 1.6px solid currentColor; transform: rotate(45deg); opacity: .45; margin-right: 4px; }
.ik6-cat-main { overflow-y: auto; padding: 22px 30px 26px; scrollbar-width: thin; }
.ik6-cat-pane { display: none; }
.ik6-cat-pane.is-on, .ik6-fly.is-on { display: block; animation: ik6In .22s var(--ik6-ease) both; }
.ik6-cat-pane header, .ik6-fly header { display: flex; align-items: baseline; gap: 12px; margin-bottom: 20px; }
.ik6-cat-pane h4, .ik6-fly h3 { margin: 0; font: 700 19px/1.2 Inter, system-ui, sans-serif; color: var(--ik6-ink); }
.ik6-cat-count { font-size: 13px; color: var(--ik6-muted); }
.ik6-viewall { margin-left: auto; font-size: 13.5px; font-weight: 600; color: var(--ik6-o); text-decoration: none; white-space: nowrap; }
.ik6-viewall::after { content: ' ›'; }
.ik6-viewall:hover { text-decoration: underline; }
.ik6-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 20px 14px; }
.ik6-tile { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; color: var(--ik6-ink); text-decoration: none; font-size: 13px; line-height: 1.3; padding: 4px; }
.ik6-tile-pic { width: 84px; height: 84px; flex: none; border-radius: 50%; background: #f5f3f0 center / cover no-repeat; display: grid; place-items: center; overflow: hidden;
    transition: transform .2s var(--ik6-ease), box-shadow .2s; }
.ik6-tile-pic--ic { background: var(--ik6-o-soft); }
.ik6-tile-pic--ic .material-symbols-outlined { width: 34px; overflow: hidden; font-size: 34px; color: #C5743A; }
.ik6-tile:hover .ik6-tile-pic { transform: translateY(-3px); box-shadow: 0 8px 18px rgba(29,37,48,.14); }
.ik6-tile:hover .ik6-tile-name { color: var(--ik6-o); }
.ik6-tile-name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ik6-tile-n { font-size: 12px; color: var(--ik6-muted); }
@keyframes ik6In { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@keyframes ik6Fade { from { opacity: 0; } to { opacity: 1; } }

/* ══════════════════════ PORTADA ══════════════════════ */
body.a5-home { background: radial-gradient(900px 340px at 8% 0%, rgba(205,151,101,.24), transparent 70%) no-repeat,
                            radial-gradient(1000px 420px at 92% 6%, rgba(29,37,48,.07), transparent 70%) no-repeat,
                            linear-gradient(180deg, #fdf6ea 0, #fff 520px) no-repeat, var(--a5-bg); }
body.a5-home #main-header:not(.has-bg) { background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; }
body.a5-home #main-header::before { display: none; }
body.a5-home #main-header.has-bg { background: rgba(255,255,255,.97); }
body.a5-home .a5-hero { display: none; }
body.a5-home .a5-stats { margin-top: 36px; }

.ik6-hero { display: block; padding: 22px 0 46px; }
.ik6-tabs { display: flex; justify-content: center; gap: 48px; margin-bottom: 22px; }
.ik6-tabs button { position: relative; padding: 2px 0 12px; border: 0; background: none; color: var(--ik6-ink); font: 700 30px/1.2 Inter, system-ui, sans-serif;
    letter-spacing: -.01em; cursor: pointer; transition: color .15s; }
.ik6-tabs button:hover { color: var(--ik6-o); }
.ik6-tabs button.is-on { color: var(--ik6-o); }
.ik6-tabs button::after { content: ''; position: absolute; left: 50%; bottom: 0; width: 52px; height: 4px; margin-left: -26px; border-radius: 4px; background: var(--ik6-o);
    transform: scaleX(0); transition: transform .25s var(--ik6-ease); }
.ik6-tabs button.is-on::after { transform: scaleX(1); }
.ik6-tabs button:focus-visible { outline: 2px solid var(--ik6-o); outline-offset: 4px; border-radius: 8px; }

.ik6-sbox { max-width: 960px; margin: 0 auto; padding: 14px 16px 14px 20px; border: 2px solid transparent; border-radius: 20px;
    background: linear-gradient(#fff, #fff) padding-box, var(--ik6-ring) border-box; box-shadow: 0 10px 30px rgba(171,115,60,.10); transition: box-shadow .2s; }
.ik6-sbox:focus-within { box-shadow: 0 12px 36px rgba(171,115,60,.20); }
.ik6-sbox-q { display: block; width: 100%; height: 40px; padding: 0 !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; background: none !important;
    color: var(--ik6-ink); font: 500 16px Inter, system-ui, sans-serif; }
.ik6-sbox-q::placeholder { color: #8f949c; transition: color .16s; }
.ik6-sbox-q.is-swap::placeholder { color: transparent; }
.ik6-sbox-bar { display: flex; align-items: center; gap: 14px; margin-top: 12px; }
.ik6-sbox-tool { display: inline-flex; align-items: center; gap: 8px; padding: 6px 4px; border: 0; background: none; color: var(--ik6-ink); font: 600 14px Inter, system-ui, sans-serif;
    cursor: pointer; border-radius: 8px; transition: color .15s; }
.ik6-sbox-tool:hover { color: var(--ik6-o); }
.ik6-sbox-tool:focus-visible { outline: 2px solid var(--ik6-o); outline-offset: 2px; }
.ik6-sbox-check input { width: 16px; height: 16px; margin: 0; accent-color: var(--ik6-o); cursor: pointer; }
.ik6-sbox-check svg { display: none; }
.ik6-sbox-sep { width: 1px; height: 18px; background: #dcdcdc; }
.ik6-sbox-go { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; height: 46px; padding: 0 28px; border: 0; border-radius: 999px; background: var(--ik6-grad); color: #fff;
    font: 700 16px Inter, system-ui, sans-serif; cursor: pointer; box-shadow: 0 8px 18px rgba(171,115,60,.30); transition: transform .15s, filter .15s, box-shadow .15s; }
.ik6-sbox-go:hover { transform: translateY(-1px); filter: brightness(1.05); box-shadow: 0 10px 22px rgba(171,115,60,.38); }
.ik6-sbox-go:focus-visible { outline: 2px solid var(--ik6-ink); outline-offset: 3px; }

.ik6-band { display: block; background: #f4f4f4; }
.ik6-band-in { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 80px; }
.ik6-band h2 { margin: 0; font: 700 20px/1.2 Inter, system-ui, sans-serif; color: var(--ik6-ink); white-space: nowrap; }
.ik6-band nav { display: flex; align-items: center; min-width: 0; }
.ik6-band nav a { display: inline-flex; align-items: center; gap: 8px; padding: 0 18px; color: var(--ik6-ink); font: 600 16px Inter, system-ui, sans-serif; text-decoration: none; white-space: nowrap; transition: color .15s; }
.ik6-band nav a + a { border-left: 1px solid #cfcfcf; }
.ik6-band nav a:last-child { padding-right: 0; }
.ik6-band nav a:hover { color: var(--ik6-o); }

.ik6-cards { display: block; background: #fff; padding: 28px 0 10px; }
.ik6-cards-in { position: relative; display: grid; grid-template-columns: 290px repeat(3, minmax(0, 1fr)) minmax(0, 1.55fr); gap: 12px; height: 306px; }
.ik6-side { min-width: 0; border-radius: 12px; background: var(--ik6-card); overflow: hidden; }
.ik6-side-list { height: 100%; margin: 0; padding: 8px 6px 8px 8px; list-style: none; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #c9c9c9 transparent; }
.ik6-side-item { padding: 10px 12px; border-radius: 8px; font-size: 15px; font-weight: 500; }
.ik6-side-item:hover, .ik6-side-item.is-on { background: #fff; color: var(--ik6-o); }
.ik6-fly { position: absolute; z-index: 6; top: 0; bottom: 0; left: 302px; right: 0; display: none; padding: 20px 26px; overflow-y: auto;
    background: #fff; border: 1px solid var(--ik6-line); border-radius: 12px; box-shadow: 0 16px 40px rgba(15,20,27,.14); scrollbar-width: thin; }
.ik6-fly .ik6-tiles { grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); }
.ik6-fly .ik6-tile-pic { width: 76px; height: 76px; }

.ik6-card { min-width: 0; display: flex; flex-direction: column; padding: 16px; border-radius: 12px; background: var(--ik6-card); }
.ik6-card h3 { margin: 0; font: 700 17.5px/1.25 Inter, system-ui, sans-serif; color: var(--ik6-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ik6-card-sub { display: block; margin: 3px 0 0; font-size: 14px; color: var(--ik6-muted); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
a.ik6-card-sub:hover { color: var(--ik6-o); }
.ik6-card-pic { position: relative; flex: 1; min-height: 0; margin-top: 14px; display: block; overflow: hidden; border-radius: 10px; background: #fff; }
.ik6-img { position: absolute; inset: 0; background: #f3f1ee center / cover no-repeat; transition: transform .45s var(--ik6-ease); }
.ik6-card-pic:hover .ik6-img, .ik6-pick-pic:hover .ik6-img { transform: scale(1.05); }
.ik6-pill { position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%); padding: 5px 13px; border-radius: 999px; background: #fff; color: var(--ik6-ink);
    font: 700 14.5px/1.2 Inter, system-ui, sans-serif; white-space: nowrap; box-shadow: 0 2px 10px rgba(0,0,0,.12); }

.ik6-picks { position: relative; min-width: 0; display: flex; flex-direction: column; align-items: center; padding: 16px 18px 12px; border-radius: 12px; overflow: hidden;
    background: radial-gradient(260px 200px at 80% 20%, rgba(255,255,255,.7), transparent 70%), linear-gradient(160deg, #fdf6ea 0%, #f3e2cb 55%, #e6c8a3 100%); }
.ik6-picks h3 { margin: 0; font: 800 28px/1.2 Inter, system-ui, sans-serif; color: #1D2530; letter-spacing: -.01em; white-space: nowrap; }
.ik6-picks-track { position: relative; flex: 1; width: 100%; min-height: 0; margin-top: 6px; }
.ik6-pick { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; opacity: 0; visibility: hidden; transition: opacity .5s ease, visibility 0s linear .5s; }
.ik6-pick.is-on { opacity: 1; visibility: visible; transition: opacity .5s ease, visibility 0s; }
.ik6-pick-tag { padding: 3px 11px; border-radius: 999px; background: rgba(255,255,255,.8); color: #9a5a22; font-size: 12.5px; font-weight: 700; }
.ik6-pick-pic { position: relative; flex: 1; min-height: 0; aspect-ratio: 1 / 1; max-width: 80%; margin-top: 8px; overflow: hidden; border-radius: 14px; background: #fff; box-shadow: 0 10px 24px rgba(120,60,10,.18); }
.ik6-pick-cta { position: relative; z-index: 2; margin-top: -20px; padding: 9px 44px; border-radius: 999px; background: var(--ik6-grad); color: #fff; font: 700 16px/1.2 Inter, system-ui, sans-serif;
    text-decoration: none; white-space: nowrap; box-shadow: 0 8px 18px rgba(171,115,60,.32); transition: transform .15s, filter .15s; }
.ik6-pick-cta:hover { transform: translateY(-1px); filter: brightness(1.05); }
.ik6-dots { display: flex; gap: 6px; margin-top: 10px; }
.ik6-dots button { width: 7px; height: 7px; padding: 0; border: 0; border-radius: 999px; background: rgba(29,37,48,.25); cursor: pointer; transition: width .25s, background .25s; }
.ik6-dots button.is-on { width: 20px; background: var(--ik6-o); }
.ik6-dots button:focus-visible { outline: 2px solid var(--ik6-o); outline-offset: 2px; }
}

/* Escritorio compacto (1024–1279px): menos aire en el header y una tarjeta "Sigue buscando" */
@media (min-width: 1024px) and (max-width: 1279.98px) {
    #main-header .header-action { gap: 16px !important; }
    #main-header .main-header--search { padding: 0 6px 0 16px; }
    #main-header .main-header--search-btn { padding: 0 14px !important; }
    #main-header .header-action > .btn.btn-primary { padding: 0 16px; }
    .ik6-row2-l, .ik6-row2-r { gap: 20px; }
    .ik6-row2-link, .ik6-row2-r a, .ik6-cat-trigger { font-size: 13.5px; }
    .ik6-row2-r a[href$="/pricing/"] { display: none; }
    .ik6-tabs { gap: 36px; } .ik6-tabs button { font-size: 26px; }
    .ik6-cards-in { grid-template-columns: 260px repeat(2, minmax(0, 1fr)) minmax(0, 1.5fr); }
    .ik6-card--2 { display: none !important; }
    .ik6-card h3 { font-size: 16.5px; }
    .ik6-fly { left: 272px; }
    .ik6-band nav a { font-size: 15px; padding: 0 14px; }
}
@media (min-width: 1024px) and (prefers-reduced-motion: reduce) {
    .ik6-cat-panel, .ik6-pick, .ik6-img, .ik6-tabs button::after { transition: none !important; }
    .ik6-cat-pane.is-on, .ik6-fly.is-on, html.ik6-dim #main-header { background: #fff !important; }
html.ik6-dim body::after { animation: none !important; }
}