/* ============================================================
   HUF — Componente: Paleta de comandos (.hd-command-palette)
   ------------------------------------------------------------
   Botón disparador: vive en el sidebar (nunca en la topbar, que se oculta en
   escritorio, HVL — .hd-shell > .hd-topbar { display:none } a partir de
   992px, ver shell.css) para que el atajo tenga siempre una entrada visible,
   no solo por teclado. El modal reusa .hd-modal (motor genérico
   wwwroot/js/huf/hd-modal.js); solo se agrega la geometría propia del
   buscador + lista de resultados.
   Motor: wwwroot/js/huf/hd-command-palette.js.
   ============================================================ */

.hd-command-palette__kbd {
    margin-left: auto;
    flex-shrink: 0;
    font-size: var(--hd-text-micro);
    font-weight: 600;
    color: var(--hd-theme-text-muted);
    border: 1px solid var(--hd-color-border);
    border-radius: var(--hd-radius-sm);
    padding: 2px 6px;
    font-variant-numeric: tabular-nums;
}

.hd-shell--collapsed .hd-sidebar .hd-command-palette__kbd {
    display: none;
}

.hd-modal--command-palette .hd-modal__dialog {
    max-width: 36rem; /* 576px — más angosto que un modal de formulario */
    align-self: flex-start;
    margin-top: 12vh;
}

.hd-command-palette {
    padding: 0;
}

.hd-command-palette__search {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--hd-space-3);
    padding: var(--hd-space-4) var(--hd-space-5);
    border-bottom: 1px solid var(--hd-color-border);
}

.hd-command-palette__search .hd-icon {
    color: var(--hd-theme-text-muted);
    flex-shrink: 0;
}

.hd-command-palette__input {
    flex: 1 1 auto;
    border: none;
    background: none;
    outline: none;
    font-size: var(--hd-text-title);
    color: var(--hd-theme-text);
}

.hd-command-palette__input::placeholder {
    color: var(--hd-theme-text-muted);
}

.hd-command-palette__results {
    list-style: none;
    margin: 0;
    padding: var(--hd-space-2);
    max-height: 60vh;
    overflow-y: auto;
}

.hd-command-palette__result a {
    display: flex;
    align-items: center;
    gap: var(--hd-space-3);
    height: var(--hd-size-control);
    padding: 0 var(--hd-space-3);
    border-radius: var(--hd-radius-sm);
    color: var(--hd-theme-text);
    text-decoration: none;
    font-size: var(--hd-text-base);
}

.hd-command-palette__result .hd-icon {
    color: var(--hd-theme-text-muted);
    flex-shrink: 0;
}

.hd-command-palette__result.is-active a {
    background: rgba(148, 163, 184, 0.08);
}

.hd-command-palette__result.is-active .hd-icon {
    color: var(--hd-theme-accent-text);
}

.hd-command-palette__empty {
    margin: 0;
    padding: var(--hd-space-6) var(--hd-space-5);
    text-align: center;
    color: var(--hd-theme-text-muted);
    font-size: var(--hd-text-caption);
}

@media (max-width: 575.98px) {
    .hd-modal--command-palette .hd-modal__dialog {
        margin-top: 0;
    }
}