/* Estilo del menú de navegación + ancho completo */

/* ---- Ancho: completo hasta 1920 y más, adaptable hasta móvil ---- */
@media(min-width:821px){
  body main{max-width:none; padding:34px clamp(20px,2.6vw,56px) 60px;}
  body[data-ancho="limitado"] main{max-width:1180px; padding:34px 42px 60px;}
}
@media(max-width:820px){ body main{max-width:none;} }

/* ---- Ajustes ---- */
.hc-mxo-t{font-weight:700;font-size:13px;margin:14px 0 8px;color:var(--walnut)}
.hc-mxo-ahora{font-weight:500;color:var(--walnut-soft);font-size:12px}
.hc-mxo-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px}
.hc-mxo{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;font:inherit;color:var(--walnut);background:var(--white);border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;min-height:44px;cursor:pointer}
.hc-mxo b{font-size:13.5px}
.hc-mxo span{font-size:12px;color:var(--walnut-soft);line-height:1.35}
.hc-mxo:hover{border-color:var(--gold)}
.hc-mxo.on{border-color:var(--gold);box-shadow:0 0 0 2px var(--gold-dim,rgba(200,160,60,.25))}
.hc-mxo:focus-visible,#hcMx button:focus-visible,.hc-pal button:focus-visible,.hc-estsel button:focus-visible,.hc-navtabs button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

/* ---- Lateral: p1 selector, p3 acordeón+buscador, p5 pestañas ---- */
.hc-est-off,.hc-q-off,.hc-tab-off{display:none !important}
.hc-estsel{position:relative;margin:4px 0 8px}
.hc-estsel-b{width:100%;display:flex;align-items:center;gap:9px;font:inherit;font-weight:600;font-size:14px;color:var(--sb-text,inherit);background:rgba(127,127,127,.12);border:1px solid rgba(127,127,127,.28);border-radius:10px;padding:9px 11px;min-height:42px;cursor:pointer}
.hc-estsel-b .t{flex:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hc-estsel-l{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:30;background:var(--white);color:var(--walnut);border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.25);padding:4px;max-height:60vh;overflow:auto}
.hc-estsel-l[hidden]{display:none}
.hc-estsel-l button{width:100%;display:flex;align-items:center;gap:9px;font:inherit;font-size:14px;color:inherit;background:none;border:0;border-radius:8px;padding:9px 10px;min-height:42px;cursor:pointer;text-align:left}
.hc-estsel-l button:hover,.hc-estsel-l button[aria-selected="true"]{background:var(--ivory-dim,rgba(127,127,127,.15))}
.dot{width:10px;height:10px;border-radius:50%;flex:none;display:inline-block}
.hc-navq{display:flex;align-items:center;gap:8px;background:rgba(127,127,127,.12);border:1px solid rgba(127,127,127,.28);border-radius:10px;padding:0 10px;margin:8px 0 6px;min-height:40px;flex:none}
.hc-navq input{flex:1;min-width:0;background:none;border:0;outline:0;color:inherit;font:inherit;font-size:14px;padding:8px 0}
.hc-est-n{font-size:11px;font-weight:700;padding:1px 7px;border-radius:99px;background:rgba(127,127,127,.22);margin-left:auto;margin-right:6px}
body.hc-q .nav-group.collapsed{display:block !important}
.sidebar:not(.expanded):not(.open) .hc-navq,.sidebar:not(.expanded) .hc-estsel,.sidebar:not(.expanded) .hc-navtabs{display:none}
.hc-navtabs{display:flex;gap:4px;margin:0 0 10px;padding:4px;background:rgba(127,127,127,.12);border-radius:12px}
.hc-navtabs button{flex:1;min-height:40px;border:0;border-radius:9px;background:none;color:inherit;cursor:pointer;font-size:15px;opacity:.7}
.hc-navtabs button[aria-selected="true"]{background:var(--gold);color:var(--on-accent);opacity:1}

/* ---- Piezas comunes ---- */
#hcMx{font-family:inherit;color:var(--walnut)}
:where(#hcMx button){font:inherit;color:inherit;cursor:pointer}
.hc-mx-back{position:fixed;inset:0;z-index:58;background:rgba(0,0,0,.45)}
.hc-mx-back.clear{background:transparent;z-index:55}
.hc-mx-cap{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--walnut-soft);margin:12px 4px 6px}
.hc-mx-grid{display:grid;gap:8px}
.hc-mx-grid.g2{grid-template-columns:repeat(2,1fr)}.hc-mx-grid.g3{grid-template-columns:repeat(3,1fr)}.hc-mx-grid.g4{grid-template-columns:repeat(4,1fr)}
.hc-mx-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:76px;padding:10px 6px;background:var(--white);border:1px solid var(--line);border-radius:12px;font-size:12.5px;text-align:center;line-height:1.2}
.hc-mx-tile i{font-size:21px}
.hc-mx-tile.on,.hc-mx-row.on{border-color:var(--gold);background:var(--gold-dim,rgba(200,160,60,.18))}
.hc-mx-tile[hidden]{display:none}
.hc-mx-chips{display:flex;gap:6px;overflow-x:auto;padding:2px 2px 6px;scrollbar-width:thin}
.hc-mx-chip{display:flex;align-items:center;gap:6px;white-space:nowrap;background:var(--white);border:1px solid var(--line);border-radius:99px;padding:8px 13px;min-height:40px;font-size:13px}
.hc-mx-chip.on{background:var(--gold);color:var(--on-accent);border-color:var(--gold);font-weight:600}
.hc-mx-list{display:flex;flex-direction:column;gap:2px}
.hc-mx-list.wide{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.hc-mx-row{display:flex;align-items:center;gap:10px;text-align:left;background:none;border:1px solid transparent;border-radius:9px;padding:9px 10px;min-height:42px;font-size:14px;width:100%}
.hc-mx-row i{width:20px;text-align:center}
.hc-mx-row:hover{background:var(--ivory-dim,rgba(127,127,127,.14))}
.hc-mx-x,.hc-mx-x2{border:0;background:var(--white);border:1px solid var(--line);width:44px;height:44px;border-radius:50%;font-size:16px}
.hc-mx-sheet{position:fixed;left:0;right:0;bottom:0;z-index:59;max-height:78vh;overflow:auto;background:var(--white);border-radius:18px 18px 0 0;padding:8px 14px calc(18px + env(safe-area-inset-bottom));box-shadow:0 -10px 40px rgba(0,0,0,.3)}
.hc-mx-sheet.above-bar{bottom:calc(62px + env(safe-area-inset-bottom));border-radius:18px 18px 0 0;max-height:66vh}
.hc-mx-handle{width:42px;height:4px;border-radius:4px;background:var(--line);margin:4px auto 6px}

/* ---- Raíl (p2, p6, m3) ---- */
.hc-mx-dock{position:fixed;z-index:50;display:flex;background:var(--sidebar-bg);color:var(--sb-text)}
.hc-mx-rail{display:flex;flex-direction:column;align-items:center;gap:6px;width:68px;padding:12px 0;overflow:auto;background:var(--sidebar-bg);border-right:1px solid var(--sb-line);scrollbar-width:none}
.hc-mx-rail hr{width:32px;border:0;border-top:1px solid var(--sb-line);margin:4px 0}
.hc-mx-rb{width:48px;height:48px;border-radius:14px;border:0;background:none;color:var(--sb-text);display:flex;align-items:center;justify-content:center;font-size:19px;flex:none}
.hc-mx-rb:hover{background:rgba(127,127,127,.18)}
.hc-mx-rb.on{background:rgba(127,127,127,.26);box-shadow:inset 3px 0 0 var(--gold)}
.hc-mx-rb .ini{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:13px;font-weight:700;text-transform:uppercase}
.hc-mx-panel{width:224px;padding:16px 10px;overflow:auto;background:var(--sidebar-bg);color:var(--sb-text);border-right:1px solid var(--sb-line)}
.hc-mx-panel .hc-mx-row{color:var(--sb-text)}
.hc-mx-pt{font-weight:700;font-size:15px;margin:0 6px 10px}
.hc-mx-dock.p2{left:0;top:0;bottom:0}
body[data-hc-menu="p2"] .sidebar,body[data-hc-menu="p4"] .sidebar,body[data-hc-menu="p6"] .sidebar{display:none}
@media(min-width:821px){
  body[data-hc-menu="p2"] .app{padding-left:292px}
  body[data-hc-menu="p6"] .app{padding-left:68px}
  body[data-hc-menu="p4"] .app{padding-top:58px}
}
.hc-mx-dock.p6{left:0;top:0;bottom:0}
.hc-mx-fly{position:fixed;left:68px;top:0;bottom:0;z-index:56;width:240px;box-shadow:10px 0 30px rgba(0,0,0,.3)}
.hc-mx-fly .hc-mx-panel{height:100%}

/* ---- Menú superior (p4) y pestañas (m6) ---- */
.hc-mx-top{position:fixed;left:0;right:0;top:0;z-index:50;display:flex;align-items:center;gap:6px;padding:8px 16px;background:var(--sidebar-bg);color:var(--sb-text);border-bottom:1px solid var(--sb-line);min-height:56px}
.hc-mx-brand{display:flex;align-items:center;gap:8px;background:none;border:0;font-size:15px;padding:8px 10px;min-height:40px}
.hc-mx-tabs{display:flex;gap:4px;overflow-x:auto;flex:1;scrollbar-width:none}
.hc-mx-tabs button{white-space:nowrap;background:none;border:0;border-radius:9px;padding:9px 12px;min-height:40px;font-size:14px;font-weight:600}
.hc-mx-tabs button i{font-size:10px;margin-left:3px}
.hc-mx-tabs button:hover,.hc-mx-tabs button.on{background:rgba(127,127,127,.24)}
.hc-mx-srch{display:flex;align-items:center;gap:8px;background:rgba(127,127,127,.16);border:1px solid rgba(127,127,127,.3);border-radius:10px;padding:8px 12px;min-height:40px;font-size:13px}
.hc-mx-srch kbd,.hc-pal kbd{font:inherit;font-size:11px;border:1px solid rgba(127,127,127,.4);border-radius:5px;padding:1px 6px;opacity:.8}
.hc-mx-mega,.hc-mx-drop{position:fixed;z-index:56;left:0;right:0;top:56px;background:var(--white);color:var(--walnut);border-bottom:1px solid var(--line);box-shadow:0 14px 30px rgba(0,0,0,.25);padding:14px clamp(16px,3vw,48px) 18px;max-height:calc(100vh - 80px);overflow:auto}
.hc-mx-mega.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px 18px}
.hc-mx-mt{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px;margin:0 6px 6px}
.hc-mx-fab{position:fixed;right:16px;bottom:calc(86px + env(safe-area-inset-bottom));z-index:49;width:54px;height:54px;border-radius:50%;border:0;background:var(--gold);color:var(--on-accent);font-size:20px;box-shadow:0 8px 24px rgba(0,0,0,.35)}

/* ---- Barra inferior m4 y pantalla completa m5 ---- */
.hc-mx-bar{flex-direction:row !important;position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;background:var(--white);border-top:1px solid var(--line);padding:6px 4px calc(8px + env(safe-area-inset-bottom))}
.hc-mx-bar button{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;min-height:48px;border:0;background:none;font-size:11px;border-radius:10px;color:var(--walnut-soft)}
.hc-mx-bar button i{font-size:19px}
.hc-mx-bar button.on{color:var(--accent-ink);font-weight:700}
.hc-mx-full{position:fixed;inset:0;z-index:70;background:var(--ivory,var(--white));display:flex;flex-direction:column}
.hc-mx-fh{display:flex;gap:10px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line)}
.hc-mx-q{flex:1;display:flex;align-items:center;gap:8px;background:var(--white);border:1px solid var(--line);border-radius:12px;padding:0 12px;min-height:44px}
.hc-mx-q input{flex:1;min-width:0;border:0;outline:0;background:none;color:inherit;font:inherit;font-size:15px}
.hc-mx-fb{overflow:auto;padding:6px 14px calc(24px + env(safe-area-inset-bottom))}
.hc-mx-dock.m3{left:0;top:0;bottom:0;z-index:60;width:min(86vw,320px);box-shadow:10px 0 40px rgba(0,0,0,.35)}
.hc-mx-dock.m3 .hc-mx-panel{flex:1;width:auto;position:relative}
.hc-mx-dock.m3 .hc-mx-x{position:absolute;top:10px;right:-54px;z-index:2}
body[data-hc-menu="m4"] .mobile-bottom-nav,body[data-hc-menu="m2"] .mobile-bottom-nav.hc-oculto{display:none !important}
@media(max-width:820px){
  body[data-hc-menu="m4"] main{padding-bottom:96px}
  body[data-hc-menu="m6"] .app{padding-top:56px}
  body[data-hc-menu="m6"] .hc-mx-top{position:fixed}
  body.hc-mx-open{overflow:hidden}
}
@media(min-width:821px){ .hc-mx-bar,.hc-mx-fab,.hc-mx-full,.hc-mx-sheet{display:none} }
@media(max-width:820px){ .hc-mx-dock.p2,.hc-mx-dock.p6,.hc-mx-top.p4{display:none} }

/* ---- Paleta de búsqueda ---- */
.hc-pal{position:fixed;inset:0;z-index:90;display:none;align-items:flex-start;justify-content:center;padding:12vh 16px 0}
.hc-pal.on{display:flex}
.hc-pal-back{position:absolute;inset:0;background:rgba(0,0,0,.5)}
.hc-pal-box{position:relative;width:min(560px,100%);background:var(--white);color:var(--walnut);border:1px solid var(--line);border-radius:14px;box-shadow:0 24px 60px rgba(0,0,0,.45);overflow:hidden}
.hc-pal-in{display:flex;align-items:center;gap:10px;padding:0 14px;border-bottom:1px solid var(--line)}
.hc-pal-in input{flex:1;border:0;outline:0;background:none;color:inherit;font:inherit;font-size:16px;padding:15px 0}
.hc-pal-l{max-height:52vh;overflow:auto;padding:6px}
.hc-pal-l button{width:100%;display:flex;align-items:center;gap:10px;background:none;border:0;border-radius:9px;padding:10px;min-height:44px;font:inherit;color:inherit;text-align:left;cursor:pointer}
.hc-pal-l button.on,.hc-pal-l button:hover{background:var(--ivory-dim,rgba(127,127,127,.16))}
.hc-pal-l em{margin-left:auto;font-style:normal;font-size:12px;color:var(--walnut-soft)}
.hc-pal-v{padding:18px;text-align:center;color:var(--walnut-soft)}
@media(prefers-reduced-motion:no-preference){.hc-mx-sheet{animation:hcMxUp .18s ease}@keyframes hcMxUp{from{transform:translateY(24px);opacity:.4}to{transform:none;opacity:1}}}