/**
 * CIMA — cmd+k (CommandBar) y lupa expandible del dock.
 * Antes el CSS se inyectaba desde JS (command_bar.js / bar.js); centralizado aquí.
 * Regla de oro: el cristal SIEMPRE en función del tema activo (var(--glass-bg)/var(--glass-blur)).
 */

/* ── CRISTAL CLARO + DESENFOQUE MUY FUERTE (proporcional al tema activo) ──────────────
   Fondo = el cristal CLARO del tema (var(--glass-bg)). El desenfoque = el blur del tema
   + 48px → muchísimo más que el máximo del tema (glass≈24px → 72px), así NO se leen los
   elementos de atrás aunque el cristal sea claro/translúcido. Un solo lugar para tunear. */
.cmdbar,
.dsx-pill,
.dsx-res {
    background: var(--glass-bg, rgba(20, 20, 30, .94));
    border: 1px solid var(--glass-border, rgba(255, 255, 255, .16));
    -webkit-backdrop-filter: blur(calc(var(--glass-blur, 16px) + 48px));
    backdrop-filter: blur(calc(var(--glass-blur, 16px) + 48px));
}

/* ── Modal Ctrl/⌘+K ──────────────────────────────────────────────────────────────── */
/* z-index POR ENCIMA de las ventanas flotantes (99000) y del dock (99500). */
#cmdbar-ov { position: fixed; inset: 0; z-index: 99800; display: none; align-items: flex-start; justify-content: center; background: rgba(0, 0, 0, .45); padding-top: 14vh; }
#cmdbar-ov.show { display: flex; }
.cmdbar { width: 560px; max-width: 94vw; border-radius: 14px; box-shadow: 0 24px 70px rgba(0, 0, 0, .55); overflow: hidden; color: var(--text-main, #fff); }
.cmdbar-in { display: flex; align-items: center; gap: 8px; padding: 13px 16px; border-bottom: 1px solid var(--glass-border, rgba(255, 255, 255, .1)); }
.cmdbar-in .ic { opacity: .7; font-size: 1rem; }
.cmdbar-in input { flex: 1; background: none; border: 0; color: var(--text-main, #fff); font: inherit; font-size: 1rem; outline: none; }
.cmdbar-hint { font-size: .66rem; color: var(--text-muted, rgba(255, 255, 255, .55)); border: 1px solid var(--glass-border, rgba(255, 255, 255, .18)); border-radius: 6px; padding: 1px 6px; }
.cmdbar-res { max-height: 46vh; overflow: auto; padding: 6px; }
.cmdbar-it { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 9px; cursor: pointer; font-size: .88rem; color: var(--text-main, #fff); }
.cmdbar-it:hover, .cmdbar-it.sel { background: color-mix(in srgb, var(--primary) 16%, transparent); }
.cmdbar-it.muted { opacity: .55; cursor: not-allowed; }
.cmdbar-it.muted .ci { color: #fbbf24; opacity: .85; }
.cmdbar-it.muted .csub { color: #fbbf24; opacity: .9; }
.cmdbar-it .ci { width: 22px; text-align: center; opacity: .85; }
.cmdbar-it .csub { margin-left: auto; font-size: .68rem; color: var(--text-muted, rgba(255, 255, 255, .5)); }
.cmdbar-empty { padding: 16px; color: var(--text-muted, rgba(255, 255, 255, .6)); font-size: .85rem; text-align: center; }
/* Anclado: el panel CRECE desde el botón (el transform-origin lo fija JS). */
#cmdbar-ov.anchored { align-items: flex-start; justify-content: flex-start; background: rgba(0, 0, 0, .16); padding: 0; }
#cmdbar-ov.anchored .cmdbar { animation: cmdbargrow .26s cubic-bezier(0.34, 1.56, 0.64, 1); }
@keyframes cmdbargrow { from { opacity: 0; transform: scale(.28); } to { opacity: 1; transform: scale(1); } }

/* ── Lupa expandible del dock ────────────────────────────────────────────────────── */
.dock-item.dock-search { width: auto; background: transparent !important; overflow: visible; position: relative; z-index: 99600; }
.dock-item.dock-search:hover { transform: none; background: transparent !important; }
.dsx-pill { display: flex; align-items: center; gap: 7px; height: 40px; width: 40px; padding: 0 9px; box-sizing: border-box; border-radius: 14px; overflow: hidden; cursor: text; transition: width .4s cubic-bezier(0.22, 1, 0.36, 1), box-shadow .25s; }
.dock-search:hover .dsx-pill, .dock-search:focus-within .dsx-pill { width: 250px; box-shadow: 0 10px 26px rgba(0, 0, 0, 0.3); }
.dsx-ic { color: var(--accent); font-size: 1rem; flex-shrink: 0; }
.dsx-input { flex: 1; min-width: 0; width: 0; background: transparent; border: 0; outline: 0; color: var(--text-main); font: inherit; font-size: 0.84rem; opacity: 0; transition: opacity .22s; }
.dock-search:hover .dsx-input, .dock-search:focus-within .dsx-input { opacity: 1; }
/* Dropdown a NIVEL BODY (position:fixed) — fuera del dock, para que su backdrop-filter
   (el esmerilado del bloque .cmdbar/.dsx-* de arriba) SÍ surta efecto. La posición
   (left/top/bottom) y el display los fija JS. z-index por encima de las ventanas. */
.dsx-res { position: fixed; min-width: 280px; max-width: 340px; max-height: 46vh; overflow: auto; border-radius: 14px; padding: 6px; box-shadow: 0 24px 70px rgba(0, 0, 0, .55); z-index: 99700; display: none; }
.dsx-it { display: flex; align-items: center; gap: 9px; padding: 9px 11px; border-radius: 9px; cursor: pointer; font-size: 0.85rem; color: var(--text-main); }
.dsx-it:hover, .dsx-it.sel { background: color-mix(in srgb, var(--primary) 16%, transparent); }
.dsx-it.muted { opacity: .55; }
.dsx-it .di { width: 18px; text-align: center; opacity: .8; flex-shrink: 0; }
.dsx-it .dlabel { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dsx-it .dsub { margin-left: auto; font-size: .66rem; color: var(--text-muted); flex-shrink: 0; }
