/* Cautarea de produse. Culorile vin din tema. */

.cautare-panou { position: fixed; inset: 0; z-index: 9998; }
.cautare-panou[hidden] { display: none; }

.cautare-fundal {
  position: absolute; inset: 0; background: rgba(0, 0, 0, .7);
  opacity: 0; transition: opacity .2s ease;
}
.cautare-panou--deschis .cautare-fundal { opacity: 1; }

.cautare-continut {
  position: relative; margin: 8vh auto 0; width: min(680px, calc(100vw - 32px));
  max-height: 80vh; display: flex; flex-direction: column;
  background: var(--nl-surface, #0d0c11);
  border: 1px solid var(--nl-line2, rgba(255, 255, 255, .11));
  border-radius: 18px; corner-shape: squircle;
  overflow: hidden;
  transform: translateY(-12px); opacity: 0;
  transition: transform .2s ease, opacity .2s ease;
}
.cautare-panou--deschis .cautare-continut { transform: none; opacity: 1; }

.cautare-bara {
  display: flex; align-items: center; gap: 8px; padding: 8px 8px 8px 18px;
  border-block-end: 1px solid var(--nl-line, rgba(255, 255, 255, .055));
}
#cautare-camp {
  flex: 1; padding: 14px 0; border: 0; background: none;
  color: var(--nl-text, #f4f1f8); font: inherit; font-size: 1.05rem;
}
#cautare-camp:focus { outline: none; }
#cautare-camp::placeholder { color: var(--nl-faint, #67616f); }
.cautare-x {
  background: none; border: 0; color: var(--nl-muted, #9e97a8);
  font-size: 1.6rem; line-height: 1; cursor: pointer; padding: 4px 12px;
}
.cautare-x:hover { color: var(--nl-text, #f4f1f8); }

.cautare-rezultate { overflow-y: auto; padding: 8px; }
.cautare-gol { padding: 34px 20px; text-align: center; color: var(--nl-muted, #9e97a8); line-height: 1.7; }
.cautare-gol a { color: var(--np, #ff36b0); }
.cautare-numar { margin: 6px 12px 10px; font-size: .78rem; color: var(--nl-faint, #67616f); }

.cautare-lista { display: flex; flex-direction: column; gap: 2px; }
.cautare-rezultat {
  display: flex; align-items: center; gap: 14px;
  padding: 10px 12px; border-radius: 12px; corner-shape: squircle;
  color: inherit; text-decoration: none;
}
.cautare-rezultat:hover { background: rgba(255, 255, 255, .045); }
.cautare-rezultat img, .cautare-rezultat .fara-poza {
  width: 52px; height: 52px; object-fit: cover; flex: none;
  border-radius: 9px; corner-shape: squircle;
  background: var(--nl-surface2, #121117);
}
.cautare-rezultat > div { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.r-nume { font-weight: 600; font-size: .95rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.r-pret { color: var(--np, #ff36b0); font-size: .86rem; font-variant-numeric: tabular-nums; }

@media (max-width: 640px) {
  .cautare-continut { margin-top: 0; width: 100vw; max-height: 100vh; height: 100vh; border-radius: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .cautare-continut, .cautare-fundal { transition: none; }
}
