/* SIMA — Modo "Sistema Operativo": ventanas flotantes (marco uniforme del gestor).
   Rígido = nada de esto aplica (todo cuelga de #sima-panel.os-mode). Ver modules/windows.js + os-mode-plan.md */

/* ── Marco de ventana ───────────────────────────────────────────────────────── */
.sima-win {
  position: fixed; z-index: 5000; display: flex; flex-direction: column;
  min-width: 380px; min-height: 260px; overflow: hidden;
  background: var(--glass-bg); backdrop-filter: blur(var(--glass-blur, 16px)); -webkit-backdrop-filter: blur(var(--glass-blur, 16px));
  border: 1px solid var(--glass-border); border-radius: 14px;
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.5);
}
.sima-win.sima-win-active { box-shadow: 0 26px 70px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(var(--accent-rgb), .35); }
/* Maximizar = llenar el ÁREA ÚTIL (la geometría la fija el JS vía _workArea: excluye sidebar/topbar/taskbar,
   así no tapa ninguna barra). Aquí solo lo VISUAL: opaca + sin backdrop-filter (si no, el matrix rain del
   fondo se filtra y tiñe todo de verde) + sin esquinas. */
.sima-win.sima-win-max {
  border-radius: 0;
  background: var(--panel-bg, #0a0f0c) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}

/* ── Manijas de redimensionado (8 orillas) ──────────────────────────────────── */
.sima-rz { position: absolute; z-index: 6; touch-action: none; }
.sima-rz-n { top: 0; left: 12px; right: 12px; height: 7px; cursor: ns-resize; }
.sima-rz-s { bottom: 0; left: 12px; right: 12px; height: 7px; cursor: ns-resize; }
.sima-rz-e { right: 0; top: 12px; bottom: 12px; width: 7px; cursor: ew-resize; }
.sima-rz-w { left: 0; top: 12px; bottom: 12px; width: 7px; cursor: ew-resize; }
.sima-rz-ne { top: 0; right: 0; width: 16px; height: 16px; cursor: nesw-resize; }
.sima-rz-nw { top: 0; left: 0; width: 16px; height: 16px; cursor: nwse-resize; }
.sima-rz-se { bottom: 0; right: 0; width: 16px; height: 16px; cursor: nwse-resize; }
.sima-rz-sw { bottom: 0; left: 0; width: 16px; height: 16px; cursor: nesw-resize; }
.sima-win.sima-win-max .sima-rz { display: none; }

/* ── Menú de ventana (click derecho / long-press) ───────────────────────────── */
.sima-win-menu {
  position: fixed; z-index: 100001; min-width: 178px; padding: 6px; border-radius: 12px;
  background: var(--glass-bg); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  border: 1px solid var(--glass-border); box-shadow: 0 16px 44px rgba(0, 0, 0, .55); font-size: .84rem;
}
.sima-win-menu .sima-win-mi { display: flex; align-items: center; gap: 10px; padding: 8px 11px; border-radius: 8px; cursor: pointer; color: var(--text-main); }
.sima-win-menu .sima-win-mi:hover { background: rgba(var(--accent-rgb), .14); }
.sima-win-menu .sima-win-mi i { width: 16px; text-align: center; color: var(--text-muted); }

.sima-win-bar {
  flex-shrink: 0; height: 38px; display: flex; align-items: center; gap: 10px; padding: 0 12px;
  border-bottom: 1px solid var(--glass-border); background: rgba(255, 255, 255, 0.04);
  cursor: grab; touch-action: none; -webkit-user-select: none; user-select: none;
}
.sima-win-title { flex: 1 1 auto; min-width: 0; font-size: .82rem; font-weight: 600; color: var(--text-main); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; gap: 7px; }
.sima-win-title i { color: var(--matrix-color); font-size: .92rem; }

/* Herramientas de la ventana: en el titlebar, del lado OPUESTO al semáforo (convención CIMA). */
.sima-win-tools { display: inline-flex; align-items: center; gap: 2px; flex-shrink: 0; }
.sima-win-tool { width: 28px; height: 26px; border: 0; background: transparent; color: var(--text-muted); border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; font-size: .9rem; font-family: inherit; padding: 0; }
.sima-win-tool .sima-win-tool-lbl { font-size: .76rem; margin-left: 5px; }
.sima-win-tool:has(.sima-win-tool-lbl) { width: auto; padding: 0 9px; }
.sima-win-tool:hover { background: color-mix(in srgb, var(--text-main) 12%, transparent); color: var(--text-main); }
.sima-win-tool.sima-win-tool-danger:hover { background: color-mix(in srgb, var(--danger, #ff5f56) 22%, transparent); color: var(--danger, #ff5f56); }
.sima-win-tool-gap { display: inline-block; width: 10px; flex: 0 0 auto; }
/* Variantes: save = acción principal (Guardar); warn/status = estado con etiqueta, sin acción. */
.sima-win-tool.sima-win-tool-save { background: var(--accent); color: var(--accent-text, #fff); }
.sima-win-tool.sima-win-tool-save:hover { background: color-mix(in srgb, var(--accent) 85%, var(--text-main)); color: var(--accent-text, #fff); }
.sima-win-tool.sima-win-tool-warn, .sima-win-tool.sima-win-tool-warn:hover { color: var(--warn, #f59e0b); background: transparent; cursor: default; }
.sima-win-tool.sima-win-tool-status, .sima-win-tool.sima-win-tool-status:hover { background: transparent; cursor: default; }
.sima-win-tool.sima-win-tool-warn i, .sima-win-tool.sima-win-tool-status i { font-size: .6rem; }

/* Detach en el header de una pestaña: ícono "abrir en ventana" dentro del botón de tab. */
.sima-tab-detach { display: inline-flex; align-items: center; margin-left: 6px; opacity: .5; cursor: pointer; font-size: .82rem; transition: opacity .12s, color .12s; }
.sima-tab-detach:hover { opacity: 1; color: var(--accent); }
.sima-win-body { flex: 1; overflow: auto; position: relative; min-height: 0; min-width: 0; }
/* Blindaje de ancho (global, sin @media): la tabla debe scrollear DENTRO de .sima-tbl-wrap en vez de
   empujar el ancho de la ventana flotante o desacoplada. Los items flex por defecto no bajan de su
   contenido (min-width:auto); forzamos min-width:0 en la cadena del cuerpo de ventana hasta el wrap. */
.sima-win-body .mac-win, .sima-win-body .mnt-win, .sima-win-body .pm-win, .sima-win-body .tn-win,
.sima-win-body .mac-body, .sima-win-body .sima-section, .sima-win-body #sp-view,
.sima-win-body #cat-tabbody, .sima-win-body .mac-tabbody { min-width: 0; }
.sima-win-body .sima-tbl-wrap { min-width: 0; max-width: 100%; }

/* La <section> movida adentro debe verse aunque no tenga .active; sin el padding/min-height del layout normal. */
.sima-win .sima-section { display: block !important; padding: 14px !important; min-height: 0 !important; }
/* Evita doble chrome: oculta las barras de ventana propias de cada módulo dentro del marco del gestor. */
.sima-win .mac-bar, .sima-win .mnt-bar, .sima-win .pm-bar, .sima-win .tn-bar { display: none !important; }
.sima-win .mac-win, .sima-win .mnt-win, .sima-win .pm-win, .sima-win .tn-win { border: none !important; border-radius: 0 !important; box-shadow: none !important; height: auto !important; }

/* ── Controles: macOS (semáforo, por defecto) ───────────────────────────────── */
/* OJO colisión: el marco maximizado lleva la clase .sima-win-max (estado), y el DOT
   verde también es .sima-win-max. Por eso TODOS los estilos del semáforo van
   scopeados a .sima-win-dots — si no, el ::before '+'/'□' y el fondo verde del dot
   se aplicaban al marco maximizado (un '+' fantasma como primer flex-item que
   descuadraba la ventana al maximizar). */
.sima-win-dots { display: inline-flex; align-items: center; gap: 8px; }
.sima-win-dots i { width: 12px; height: 12px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; font-style: normal; font-size: .6rem; line-height: 1; color: transparent; transition: color .12s; }
.sima-win-dots .sima-win-close { background: #ff5f56; }
.sima-win-dots .sima-win-min { background: #ffbd2e; }
.sima-win-dots .sima-win-max { background: #27c93f; }
.sima-win-dots:hover i { color: rgba(0, 0, 0, .55); }
.sima-win-dots .sima-win-close::before { content: '\00D7'; }
.sima-win-dots .sima-win-min::before { content: '\2013'; }
.sima-win-dots .sima-win-max::before { content: '\002B'; }

/* ── Controles: Windows (botones cuadrados a la derecha) ─────────────────────── */
#sima-panel.winstyle-win .sima-win-bar { gap: 0; }
#sima-panel.winstyle-win .sima-win-title { order: 1; flex: 1; padding-left: 2px; }
#sima-panel.winstyle-win .sima-win-tools { order: 2; }
#sima-panel.winstyle-win .sima-win-dots { order: 3; gap: 0; align-self: stretch; }
#sima-panel.winstyle-win .sima-win-dots i { width: 42px; height: 38px; border-radius: 0 !important; background: none !important; color: var(--text-muted) !important; font-size: .85rem; }
#sima-panel.winstyle-win .sima-win-dots .sima-win-min { order: 1; }
#sima-panel.winstyle-win .sima-win-dots .sima-win-max { order: 2; }
#sima-panel.winstyle-win .sima-win-dots .sima-win-close { order: 3; }
#sima-panel.winstyle-win .sima-win-dots .sima-win-max::before { content: '\25A1'; }
#sima-panel.winstyle-win .sima-win-dots i:hover { background: rgba(255, 255, 255, .12) !important; color: var(--text-main) !important; }
#sima-panel.winstyle-win .sima-win-dots .sima-win-close:hover { background: #e81123 !important; color: #fff !important; }
#sima-panel.winstyle-win .sima-win { border-radius: 6px; }

.sima-dragging, .sima-dragging * { cursor: grabbing !important; }

/* ── os-mode: la barra superior y los menús quedan POR ENCIMA de las ventanas ── */
#sima-panel.os-mode .sima-sidebar { z-index: 99800; }       /* el menú/taskbar siempre clickeable sobre las ventanas */
#sima-panel.os-mode .sima-main { overflow: hidden; }         /* el fondo no scrollea; las ventanas flotan encima */
#sima-panel #sima-modal { z-index: 100000; }                 /* modales sobre las ventanas */

/* ── Taskbar: sector tras el menú (solo en os-mode + barra superior) ─────────── */
/* "Organizar ventanas" en el menú SIMA: solo tiene sentido en modo SO. */
#sima-panel:not(.os-mode) .sima-nav-windows { display: none !important; }

.sima-taskbar { display: none; }
#sima-panel.os-mode.nav-toolbar .sima-taskbar {
  display: flex; align-items: center; gap: 5px; flex: 0 1 auto; min-width: 0; overflow-x: auto;
  padding: 0 8px; border-left: 1px solid var(--glass-border); height: 100%;
}
.sima-taskbar .sima-task {
  display: inline-flex; align-items: center; gap: 6px; max-width: 160px; flex-shrink: 0;
  padding: 5px 10px; border-radius: 8px; border: 1px solid transparent; cursor: pointer;
  background: rgba(255, 255, 255, .05); color: var(--text-muted); font-family: inherit; font-size: .76rem;
}
.sima-taskbar .sima-task span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sima-taskbar .sima-task:hover { background: rgba(var(--accent-rgb), .12); color: var(--text-main); }
.sima-taskbar .sima-task.active { border-color: var(--matrix-color); color: var(--matrix-color); background: rgba(var(--accent-rgb), .1); }
.sima-taskbar .sima-task.min { opacity: .55; }

/* ── Pantallas angostas: las ventanas MINIMIZADAS pasan a un DOCK inferior ──────
   (barra fija abajo, scroll horizontal, opaca y responsiva al tema). Se muestra en
   os-mode SÓLO si hay minimizadas (:not(:empty)), sin importar el estilo de nav. */
@media (max-width: 768px) {
  #sima-panel.os-mode .sima-taskbar:not(:empty) {
    display: flex !important; position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: 99850;
    height: 54px; padding: 8px 10px; gap: 6px; overflow-x: auto; overflow-y: hidden;
    border-left: none; border-top: 1px solid var(--glass-border);
    background: var(--win-pop, rgba(20, 22, 38, .94));
    -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
    box-shadow: 0 -6px 24px rgba(0, 0, 0, .3); scrollbar-width: none;
  }
  #sima-panel.os-mode .sima-taskbar:not(:empty)::-webkit-scrollbar { height: 0; display: none; }
  #sima-panel.os-mode .sima-taskbar:empty { display: none !important; }
  #sima-panel.os-mode .sima-taskbar .sima-task { max-width: 200px; padding: 7px 12px; }
}

/* ── Pestañas responsivas por ancho de contenedor (data-w del cuerpo, lo pone windows.js) ─────────
   En 'xs' las pestañas pasan a SOLO ÍCONO (el texto colapsa con font-size:0; el título queda en el
   tooltip que añade el observer). Si aun así desbordan, la barra scrollea con un fade a la derecha
   (data-scroll lo marca el observer). Aplica a las barras comunes (.mac-tabs, .tn-tabstrip, …). */
/* #sima-panel para ganarle en especificidad a `#sima-panel .mac-tab{font-size:.82rem}` (explorer.css). */
#sima-panel [data-w="xs"] .mac-tabs .mac-tab,
#sima-panel [data-w="xs"] .tn-tabstrip .tn-tab { font-size: 0 !important; padding: 6px 9px; gap: 0; }
#sima-panel [data-w="xs"] .mac-tabs .mac-tab i,
#sima-panel [data-w="xs"] .tn-tabstrip .tn-tab i { font-size: .92rem !important; }
#sima-panel [data-w="xs"] .tn-tabstrip .tn-tab .tn-tab-lbl { display: none; }
[data-w="sm"] .mac-tabs, [data-w="xs"] .mac-tabs,
[data-w="sm"] .tn-tabstrip, [data-w="xs"] .tn-tabstrip { gap: 2px; }
.mac-tabs[data-scroll], .tn-tabstrip[data-scroll],
.svc-tabs[data-scroll], .mnt-tabs[data-scroll], .pm-tabbar[data-scroll], .sub-nav[data-scroll] {
    -webkit-mask-image: linear-gradient(to right, #000 86%, transparent);
    mask-image: linear-gradient(to right, #000 86%, transparent);
}
/* Cuerpo más compacto en angosto: menos padding en la sección movida a la ventana. */
.sima-win-body[data-w="xs"] .sima-section,
.sima-win-body[data-w="xs"] .mac-body { padding: 9px !important; }