/* ===========================================================================
   gom-palette.css — Nextgen Stage B : command palette ⌘K.
   Additif, namespacé (.gom-pal / .gom-kbtn), tokens de PROD. Repris fidèlement
   du vrai design (« Optimisation site multi-appareils »). Réversible.
   =========================================================================== */
@keyframes gom-pal-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes gom-pal-pop  { from { transform: translateY(-8px) scale(0.985); opacity: 0; } to { transform: none; opacity: 1; } }

.gom-pal-scrim {
  position: fixed; inset: 0; z-index: var(--z-modal, 100);
  background: var(--surface-overlay); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  display: flex; align-items: flex-start; justify-content: center;
  padding: clamp(60px, 14vh, 140px) var(--space-4) var(--space-4);
  animation: gom-pal-fade var(--dur-fast) var(--ease-out);
}
.gom-pal {
  width: 640px; max-width: 100%; max-height: min(520px, 70dvh);
  display: flex; flex-direction: column;
  background: color-mix(in oklab, var(--surface-raised) 94%, black);
  border: 1px solid var(--border-strong); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-xl), var(--glow-amber); overflow: hidden;
  animation: gom-pal-pop var(--dur-base) var(--ease-out);
}
.gom-pal .pal-in { display: flex; align-items: center; gap: 12px; padding: 15px 18px; border-bottom: 1px solid var(--border-subtle); }
.gom-pal .pal-in .mag { color: var(--fg-3); font-size: 15px; }
.gom-pal .pal-in input { flex: 1; min-width: 0; background: transparent; border: none; outline: none; color: var(--fg-1); font-size: 15.5px; font-family: var(--font-body); }
.gom-pal .pal-in input::placeholder { color: var(--fg-muted); }
.gom-pal .pal-in .esc { font-family: var(--font-mono); font-size: 10px; color: var(--fg-3); border: 1px solid var(--border-default); border-radius: 4px; padding: 2px 6px; flex: 0 0 auto; }
.gom-pal .pal-list { overflow-y: auto; padding: 8px; }
.gom-pal .pal-item {
  display: flex; align-items: center; gap: 12px; width: 100%;
  padding: 10px 12px; border-radius: var(--radius-md); cursor: pointer;
  border: 1px solid transparent; background: transparent; text-align: left;
  color: var(--fg-1); font-size: 14px; font-family: var(--font-body);
}
.gom-pal .pal-item .emo { width: 22px; text-align: center; font-size: 15px; flex: 0 0 auto; }
.gom-pal .pal-item .grp { font-family: var(--font-mono); font-size: 10.5px; color: var(--fg-3); margin-left: auto; white-space: nowrap; text-transform: uppercase; letter-spacing: 0.06em; }
.gom-pal .pal-item.sel { background: var(--surface-tint-amber); border-color: var(--border-amber); }
.gom-pal .pal-item.sel .grp { color: var(--color-amber-300); }
.gom-pal .pal-empty { padding: 26px; text-align: center; color: var(--fg-3); font-size: 13.5px; }
.gom-pal .pal-foot { display: flex; gap: 14px; padding: 9px 16px; border-top: 1px solid var(--border-subtle); font-family: var(--font-mono); font-size: 10px; color: var(--fg-muted); }
.gom-pal .pal-foot kbd { font-family: var(--font-mono); background: var(--surface-sunken); border: 1px solid var(--border-default); border-radius: 3px; padding: 1px 5px; color: var(--fg-2); }

/* ⌘K trigger button (topbar) */
.gom-kbtn {
  display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px;
  border-radius: var(--radius-pill, 999px); background: var(--surface-raised);
  border: 1px solid var(--border-default); color: var(--fg-3);
  font-size: 12.5px; font-family: var(--font-body); cursor: pointer;
  transition: color var(--dur-fast), border-color var(--dur-fast);
}
.gom-kbtn:hover { color: var(--fg-1); border-color: var(--border-strong); }
.gom-kbtn .kk { font-family: var(--font-mono); font-size: 10px; background: var(--surface-sunken); border: 1px solid var(--border-default); border-radius: 4px; padding: 1px 5px; color: var(--fg-3); }
@media (max-width: 760px) { .gom-kbtn .klabel { display: none; } }
@media (max-width: 640px) { .gom-kbtn .kk { display: none; } .gom-kbtn { padding: 8px; } }

@media (prefers-reduced-motion: reduce) { .gom-pal-scrim, .gom-pal { animation-duration: 0.01ms; } }