/* Mapa IT: adaptación funcional de zenti_soporte_it_3d_indicadores_semanticos.html. */
.it-ops{--it-cyan:#00e5ff;--it-blue:#0045f5;display:grid;gap:18px}
.it-page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:4px 2px 8px}.it-page-head>div:first-child{max-width:790px}.it-kicker{display:inline-flex;align-items:center;gap:8px;color:var(--it-blue);font-size:10px;font-weight:850;letter-spacing:.09em;text-transform:uppercase}.it-kicker::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--it-cyan);box-shadow:0 0 0 4px rgba(0,229,255,.1)}.it-page-head h1{margin:11px 0 7px;color:var(--text);font:700 clamp(27px,3vw,40px)/1.08 'Space Grotesk',sans-serif;letter-spacing:-.045em}.it-page-head p{margin:0;color:var(--muted);font-size:12px;line-height:1.65}.it-page-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}.it-live{display:inline-flex;align-items:center;gap:7px;color:var(--muted);font-size:9px;white-space:nowrap}.it-live i{width:7px;height:7px;border-radius:50%;background:var(--it-cyan);box-shadow:0 0 0 4px rgba(0,229,255,.1)}
.it-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.it-metric{position:relative;overflow:hidden;min-width:0;padding:16px 17px;border:1px solid var(--line);border-radius:13px;background:var(--panel);box-shadow:var(--shadow-sm)}.it-metric::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--sev-ok)}.it-metric.cyan::before{background:var(--it-cyan)}.it-metric.violet::before{background:var(--sev-monitoring)}.it-metric.warning::before{background:var(--sev-normal)}.it-metric.danger::before{background:var(--sev-critical)}.it-metric>span{display:block;overflow:hidden;color:var(--muted);font-size:9px;font-weight:750;text-overflow:ellipsis;white-space:nowrap}.it-metric>strong{display:block;margin-top:12px;color:var(--text);font-size:24px;letter-spacing:-.04em}.it-metric>small{display:block;margin-top:7px;color:var(--muted-2);font-size:8px}
.it-map-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:15px;align-items:stretch}.it-map-panel,.it-asset-rail{min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:15px;background:var(--panel);box-shadow:var(--shadow-sm)}.it-panel-head{min-height:62px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:11px 16px;border-bottom:1px solid var(--line)}.it-panel-head h2{margin:0;color:var(--text);font-size:13px;letter-spacing:-.02em}.it-panel-head p{margin:4px 0 0;color:var(--muted);font-size:9px}.it-panel-tools{display:flex;align-items:center;gap:6px}.it-tool-btn{min-height:31px;padding:0 10px;border:1px solid var(--line);border-radius:8px;color:var(--muted);background:var(--panel-soft);font-size:9px;font-weight:750;white-space:nowrap}.it-tool-btn:hover,.it-tool-btn.active{border-color:color-mix(in srgb,var(--it-blue) 35%,var(--line));color:var(--it-blue);background:color-mix(in srgb,var(--blue-soft) 70%,var(--panel))}
.it-map-shell{position:relative;min-height:570px;overflow:hidden;background:#080a12}.it-map-shell #asset-map{touch-action:none;width:100%;height:570px;min-height:570px;max-height:none;aspect-ratio:auto;border:0;border-radius:0;background:#080a12;cursor:grab;box-shadow:none}.it-map-overlay{position:absolute;left:14px;top:14px;display:flex;gap:7px;pointer-events:none}.it-map-overlay span{display:inline-flex;align-items:center;gap:6px;padding:7px 9px;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#b7c1d4;background:rgba(8,10,18,.74);backdrop-filter:blur(8px);font-size:8px;font-weight:750;text-transform:uppercase;letter-spacing:.05em}.it-map-overlay i{width:6px;height:6px;border-radius:50%;background:var(--it-cyan);box-shadow:0 0 9px var(--it-cyan)}.it-map-help{position:absolute;right:13px;bottom:12px;padding:7px 9px;border:1px solid rgba(255,255,255,.09);border-radius:8px;color:#8792a8;background:rgba(8,10,18,.76);font-size:8px;pointer-events:none}.it-map-shell .asset-hover-popup{z-index:8}.it-legend{display:flex;align-items:center;flex-wrap:wrap;gap:13px;min-height:43px;padding:8px 14px;border-top:1px solid var(--line);color:var(--muted);font-size:8px}.it-legend span{display:inline-flex;align-items:center;gap:6px}.it-legend b{width:20px;height:20px;display:inline-grid;place-items:center;flex:0 0 auto;border-radius:50%;font-size:11px;font-weight:900;line-height:1}.it-legend .operational{color:#fff;background:var(--sev-ok-on-dark);box-shadow:0 0 0 3px color-mix(in srgb,var(--sev-ok-on-dark) 10%,transparent)}.it-legend .critical{color:#fff;background:var(--sev-critical-on-dark);box-shadow:0 0 0 3px color-mix(in srgb,var(--sev-critical-on-dark) 11%,transparent),0 0 12px color-mix(in srgb,var(--sev-critical-on-dark) 40%,transparent);animation:sev-critical-pulse 1.25s ease-in-out infinite}.it-legend .warning{width:12px;height:12px;margin:0 4px;background:var(--sev-normal-on-dark);box-shadow:0 0 0 4px color-mix(in srgb,var(--sev-normal-on-dark) 11%,transparent)}.it-legend .monitoring{width:22px;height:14px;border-radius:50%/60%;color:#fff;background:var(--sev-monitoring-on-dark);font-size:10px;box-shadow:0 0 0 3px color-mix(in srgb,var(--sev-monitoring-on-dark) 10%,transparent)}
.it-count{min-width:25px;height:25px;display:grid;place-items:center;padding:0 7px;border-radius:99px;color:var(--it-blue);background:var(--blue-soft);font-size:9px;font-weight:850}.it-asset-search{padding:12px;border-bottom:1px solid var(--line)}.it-asset-search>input{width:100%;height:35px;padding:0 11px;border:1px solid var(--line);border-radius:9px;outline:0;color:var(--text);background:var(--panel-soft);font-size:10px}.it-asset-search>input:focus{border-color:var(--it-blue);box-shadow:0 0 0 3px rgba(0,69,245,.08)}.it-asset-filters{display:flex;gap:5px;margin-top:9px;overflow:auto;scrollbar-width:none}.it-asset-filters button{height:25px;padding:0 8px;border:1px solid var(--line);border-radius:7px;color:var(--muted);background:transparent;font-size:8px;font-weight:750;white-space:nowrap}.it-asset-filters button.active{border-color:transparent;color:#fff;background:var(--it-blue)}.it-asset-list{max-height:280px;overflow:auto}.it-asset-row{position:relative;width:100%;display:grid;grid-template-columns:34px minmax(0,1fr) 25px;gap:9px;align-items:center;padding:10px 12px;border:0;border-bottom:1px solid var(--line);color:var(--text);background:transparent;text-align:left}.it-asset-row:hover{background:var(--panel-soft)}.it-asset-row.active{background:color-mix(in srgb,var(--blue-soft) 55%,var(--panel))}.it-asset-row.active::before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:3px;border-radius:0 3px 3px 0;background:var(--it-blue)}.it-asset-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;color:var(--it-blue);background:var(--blue-soft);font-size:10px;font-weight:850}.it-asset-copy{min-width:0}.it-asset-copy strong,.it-asset-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.it-asset-copy strong{font-size:10px}.it-asset-copy span{margin-top:3px;color:var(--muted);font-size:8px}.it-asset-state{width:22px;height:22px;display:grid;place-items:center;border-radius:7px;font-size:10px;font-weight:900}.it-asset-state.operational{color:var(--sev-ok);background:var(--sev-ok-soft)}.it-asset-state.monitoring{color:var(--sev-monitoring);background:var(--sev-monitoring-soft)}.it-asset-state.warning{color:var(--sev-normal);background:var(--sev-normal-soft)}.it-asset-state.critical{color:#fff;background:var(--sev-critical);animation:sev-critical-pulse 1.8s ease-in-out infinite}.it-asset-detail{min-height:145px;padding:13px;border-top:1px solid var(--line);background:var(--panel-soft)}.it-asset-empty{padding:22px 12px;color:var(--muted);font-size:9px;line-height:1.55;text-align:center}.it-asset-detail-top{display:flex;justify-content:space-between;gap:9px}.it-asset-detail h3{margin:0;font-size:12px}.it-asset-detail p{margin:3px 0 0;color:var(--muted);font-size:8px}.it-status-pill{align-self:start;padding:5px 7px;border-radius:99px;font-size:7px;font-weight:850}.it-status-pill.operational{color:var(--sev-ok);background:var(--sev-ok-soft)}.it-status-pill.monitoring{color:var(--sev-monitoring);background:var(--sev-monitoring-soft)}.it-status-pill.warning{color:var(--sev-normal);background:var(--sev-normal-soft)}.it-status-pill.critical{color:var(--sev-critical);background:var(--sev-critical-soft)}.it-asset-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:11px}.it-asset-detail-grid>div{padding:8px;border:1px solid var(--line);border-radius:8px;background:var(--panel)}.it-asset-detail-grid span,.it-asset-detail-grid strong{display:block}.it-asset-detail-grid span{color:var(--muted);font-size:7px}.it-asset-detail-grid strong{margin-top:4px;overflow:hidden;font-size:9px;text-overflow:ellipsis}.it-asset-ticket{padding:8px;border-left:2px solid var(--sev-normal);background:color-mix(in srgb,var(--sev-normal) 7%,transparent)}.it-detail-button{width:100%;height:30px;margin-top:10px;border:1px solid var(--line);border-radius:8px;color:var(--it-blue);background:var(--panel);font-size:8px;font-weight:800}.it-manage-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:10px 12px;border-top:1px solid var(--line)}.it-manage-actions button{min-height:30px;border:1px solid var(--line);border-radius:8px;color:var(--text);background:var(--panel-soft);font-size:8px;font-weight:750}.it-manage-actions button:hover,.it-manage-actions button.active{border-color:var(--it-blue);color:var(--it-blue)}.it-manage-actions .map-order-hint{grid-column:1/-1;font-size:8px}
body.it-map-fullscreen-open{overflow:hidden}.it-map-panel.is-fullscreen{position:fixed;z-index:1000;inset:14px;display:flex;flex-direction:column;border-color:rgba(0,229,255,.3);box-shadow:0 25px 90px rgba(0,0,0,.65)}.it-map-panel.is-fullscreen .it-map-shell{flex:1}.it-map-panel.is-fullscreen .it-map-shell #asset-map{touch-action:none;height:100%;min-height:100%}
.it-ticket-console{margin-top:18px;border-radius:15px!important}.it-ticket-console .panel-head{min-height:62px}.it-ticket-toolbar{display:flex;align-items:center;gap:8px;padding:11px 14px;border-bottom:1px solid var(--line);background:var(--panel-soft)}.it-ticket-toolbar input,.it-ticket-toolbar select{height:34px;border:1px solid var(--line);border-radius:8px;color:var(--text);background:var(--panel);font-size:9px}.it-ticket-toolbar input{min-width:260px;flex:1;padding:0 10px}.it-ticket-toolbar select{padding:0 9px}
@media(max-width:1250px){.it-metrics{grid-template-columns:repeat(3,1fr)}.it-map-layout{grid-template-columns:minmax(0,1fr) 295px}}
@media(max-width:980px){.it-map-layout{grid-template-columns:1fr}.it-asset-list{max-height:240px}.it-metrics{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.it-page-head{align-items:flex-start;flex-direction:column}.it-page-actions{width:100%;justify-content:flex-start}.it-live{display:none}.it-metrics{grid-template-columns:1fr}.it-panel-head{align-items:flex-start;flex-direction:column}.it-panel-tools{width:100%;overflow:auto}.it-map-shell,.it-map-shell #asset-map{touch-action:none;height:500px;min-height:500px}.it-ticket-toolbar{align-items:stretch;flex-direction:column}.it-ticket-toolbar input{min-width:0;width:100%}}

/* Dentro de un portal (Premium verde), el chrome del Mapa IT toma el acento verde en vez del azul/cian.
   Scopeado a .it-ops → no afecta al Admin ni se filtra. La escena 3D (mapCanvas.js) y su viewport oscuro
   (#080a12) quedan como están: es el motor, no el tema (excepción intencional documentada). */
body.zenti-client-active .it-ops {
    --it-cyan: var(--accent);
    --it-blue: var(--accent);
    --blue-soft: color-mix(in srgb, var(--accent) 12%, transparent);
}

/* MÓVIL — solo pantallas chicas. La vista de escritorio no cambia.
   Los controles del mapa quedaban por debajo del mínimo tocable con el dedo: la toolbar
   en 31px, las acciones de gestión en 30px y los filtros del rail en 25px. */
@media (max-width: 760px) {
    .it-ops .it-tool-btn { min-height: 42px; padding: 0 14px; }
    .it-ops .it-asset-filters button { height: 40px; padding: 0 12px; }
    .it-ops .it-manage-actions button { min-height: 42px; font-size: 10px; }
    .it-ops .it-manage-actions { gap: 8px; }
    .it-ops .it-detail-button { min-height: 42px; }
    .it-ops .it-asset-search > input { min-height: 42px; }
}