/* COMMAND PALETTE (shared v1) - Microsoft Build Studio. Pairs with js/command-palette.js. */
.cmdk { --cmdk-bg: #ffffff; --cmdk-line: #e7dfd5; --cmdk-sunk: #f6f2ec; --cmdk-fg: #201c18; --cmdk-muted: #8a8178; --cmdk-hl: #e8610a; }
body[data-theme="dark-mode"] .cmdk { --cmdk-bg: #1d1d1d; --cmdk-line: #3a3530; --cmdk-sunk: #262321; --cmdk-fg: #f5f2ee; --cmdk-muted: #a59a8d; --cmdk-hl: #f27a2a; }

.cmdk { border: 0; padding: 0; margin: 12vh auto auto; background: transparent; color: var(--cmdk-fg); width: 620px; max-width: calc(100vw - 32px); overflow: visible; }
.cmdk::backdrop { background: rgba(20, 16, 12, 0.38); backdrop-filter: blur(2px); }
.cmdk-box { border: 1px solid var(--cmdk-line); border-radius: 12px; background: var(--cmdk-bg); box-shadow: 0 24px 64px rgba(0, 0, 0, 0.28); overflow: hidden; }
.cmdk[open] .cmdk-box { animation: cmdk-pop 0.16s cubic-bezier(0.2, 0.9, 0.3, 1); }
@keyframes cmdk-pop { from { opacity: 0; transform: scale(0.97) translateY(-6px); } }

.cmdk kbd { font-family: 'JetBrains Mono', monospace; font-size: 10.5px; border: 1px solid var(--cmdk-line); border-bottom-width: 2px; border-radius: 4px; padding: 0 5px; color: var(--cmdk-muted); background: var(--cmdk-bg); }
.cmdk-input { display: flex; align-items: center; gap: 10px; padding: 0 16px; border-bottom: 1px solid var(--cmdk-line); }
.cmdk-input svg { width: 16px; height: 16px; color: var(--cmdk-muted); flex-shrink: 0; }
.cmdk-input input { flex: 1; min-width: 0; height: 52px; border: 0; outline: 0; background: transparent; color: var(--cmdk-fg); font: 500 15px 'Plus Jakarta Sans', sans-serif; }
.cmdk-input input::placeholder { color: var(--cmdk-muted); }
.cmdk-list { max-height: min(400px, 56vh); overflow-y: auto; padding: 6px; overscroll-behavior: contain; }
.cmdk-group { font: 500 10px/1 'JetBrains Mono', monospace; letter-spacing: 0.14em; text-transform: uppercase; color: var(--cmdk-muted); padding: 12px 10px 6px; }
.cmdk-item { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 7px; cursor: pointer; font-size: 13.5px; }
.cmdk-sq { width: 9px; height: 9px; border-radius: 2px; flex-shrink: 0; }
.cmdk-name { font-weight: 650; flex-shrink: 0; max-width: 60%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmdk-name mark { background: none; color: var(--cmdk-hl); }
.cmdk-desc { flex: 1; min-width: 0; color: var(--cmdk-muted); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cmdk-ret { opacity: 0; font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--cmdk-muted); }
.cmdk-item[aria-selected="true"] { background: var(--cmdk-sunk); }
.cmdk-item[aria-selected="true"] .cmdk-ret { opacity: 1; }
.cmdk-empty { padding: 30px 16px; text-align: center; color: var(--cmdk-muted); font-size: 13.5px; }
.cmdk-foot { display: flex; flex-wrap: wrap; gap: 14px; padding: 8px 14px; border-top: 1px solid var(--cmdk-line); background: var(--cmdk-sunk); font-size: 11.5px; color: var(--cmdk-muted); }
.cmdk-foot span { display: inline-flex; gap: 4px; align-items: center; }
.cmdk-foot-r { margin-left: auto; }
@media (max-width: 600px) { .cmdk-foot-r { display: none !important; } .cmdk { margin-top: 8vh; } }

/* Sidebar button */
.sidebar-search {
  display: flex; align-items: center; gap: 8px; width: 100%;
  padding: 8px 10px; border-radius: var(--radius, 10px);
  border: 1px solid rgba(19, 38, 60, 0.18); background: rgba(255, 255, 255, 0.55);
  color: rgba(19, 38, 60, 0.75); font: 500 12px 'Plus Jakarta Sans', sans-serif; cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.sidebar-search:hover { background: rgba(255, 255, 255, 0.8); border-color: rgba(19, 38, 60, 0.28); }
.sidebar-search svg { width: 14px; height: 14px; flex-shrink: 0; }
.sidebar-search span { flex: 1; text-align: left; }
.sidebar-search kbd { font-family: 'JetBrains Mono', monospace; font-size: 10px; border: 1px solid rgba(19, 38, 60, 0.2); border-radius: 4px; padding: 1px 5px; background: rgba(255, 255, 255, 0.6); color: rgba(19, 38, 60, 0.7); }

@media (prefers-reduced-motion: reduce) { .cmdk[open] .cmdk-box { animation: none; } }
