/* ═══════════════════════════════════════════
 * RNF Live Search v4.0 — Rose&Fly
 * Dropdown compact — header Astra
 * ═══════════════════════════════════════════ */

:root {
  --rf-rose: #8B2252;
  --rf-rose-light: #C1526E;
  --rf-rose-bg: rgba(139, 34, 82, .06);
  --rf-ink: #2d2d2d;
  --rf-muted: #888;
  --rf-ease: cubic-bezier(.4, 0, .2, 1);
}

/* ── Reset Astra interferences ── */
.rnf-lsa-v3,
.rnf-lsa-v3 *,
.rnf-lsa-v3 *::before,
.rnf-lsa-v3 *::after {
  box-sizing: border-box;
}
form.rnf-lsa__field,
form.rnf-lsa__field * {
  margin: 0;
  float: none;
}
form.rnf-lsa__field {
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  max-width: none !important;
}

/* ── Container ── */
.rnf-lsa-v3 {
  position: relative;
  width: 100%;
  max-width: 980px;
  margin: 0 auto;
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* ── Field layout ── */
.rnf-lsa__search-container { width: 100%; }
form.rnf-lsa__field {
  display: flex !important;
  align-items: center !important;
  gap: 10px;
}

/* ── Rosy ── */
.rnf-lsa__rosy {
  height: 54px;
  width: auto;
  flex-shrink: 0;
  border-radius: 0 !important;
  object-fit: contain;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.10));
}

/* ── Input wrapper (ancre pour absolute) ── */
.rnf-lsa__input-wrap {
  position: relative;
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
}

/* ── Input ── */
.rnf-lsa-v3 .rnf-lsa__input {
  width: 100% !important;
  height: 44px !important;
  padding: 0 70px 0 16px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #fff !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  color: var(--rf-ink) !important;
  font-family: inherit !important;
  outline: none !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  line-height: normal !important;
}
.rnf-lsa-v3 .rnf-lsa__input::placeholder {
  color: #b9b9b9 !important;
  opacity: 1;
}
.rnf-lsa-v3 .rnf-lsa__input:focus {
  box-shadow: 0 0 0 3px rgba(255,255,255,.15) !important;
}
.rnf-lsa-v3 .rnf-lsa__input::-webkit-search-cancel-button,
.rnf-lsa-v3 .rnf-lsa__input::-webkit-search-decoration {
  display: none !important;
  -webkit-appearance: none !important;
}

/* ── Loupe — icône simple dans l'input ── */
.rnf-lsa-v3 .rnf-lsa__submit {
  position: absolute !important;
  right: 6px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 32px !important;
  height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--rf-rose) !important;
  cursor: pointer !important;
  z-index: 2;
  transition: color .2s, background .2s;
  line-height: 1 !important;
  min-width: 0 !important;
  min-height: 0 !important;
}
.rnf-lsa-v3 .rnf-lsa__submit:hover {
  background: rgba(139, 34, 82, .08) !important;
}
.rnf-lsa-v3 .rnf-lsa__submit:active {
  transform: translateY(-50%) scale(.93) !important;
}
.rnf-lsa-v3 .rnf-lsa__submit svg {
  pointer-events: none;
  display: block;
}

/* ── Clear ── */
.rnf-lsa-v3 .rnf-lsa__clear {
  position: absolute !important;
  right: 36px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 26px !important;
  height: 26px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: #aaa !important;
  cursor: pointer !important;
  visibility: hidden;
  opacity: 0;
  transition: opacity .15s, color .15s, background .15s;
  z-index: 2;
  line-height: 1 !important;
  min-width: 0 !important;
  min-height: 0 !important;
}
.rnf-lsa-v3 .rnf-lsa__clear:hover {
  color: var(--rf-rose) !important;
  background: rgba(139, 34, 82, .06) !important;
}

/* ═══════════════════════════════════════════
 *  DROPDOWN
 * ═══════════════════════════════════════════ */
.rnf-lsa__dropdown {
  position: absolute;
  left: 0; right: 0;
  top: calc(100% + 6px);
  background: #fff;
  border: 1px solid rgba(139,34,82,.10);
  border-radius: 14px;
  box-shadow: 0 10px 36px rgba(0,0,0,.12), 0 2px 8px rgba(0,0,0,.05);
  overflow: hidden;
  z-index: 99999;
  animation: rf-dd-drop .15s var(--rf-ease);
  max-height: 70vh;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(139,34,82,.12) transparent;
}
.rnf-lsa__dropdown::-webkit-scrollbar { width: 4px; }
.rnf-lsa__dropdown::-webkit-scrollbar-thumb { background: rgba(139,34,82,.12); border-radius: 10px; }
@keyframes rf-dd-drop {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Sections */
.rnf-lsa__dd-section { padding: 6px 0; }
.rnf-lsa__dd-section + .rnf-lsa__dd-section { border-top: 1px solid rgba(139,34,82,.05); }
.rnf-lsa__dd-label {
  padding: 6px 16px 3px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .8px;
  color: var(--rf-muted);
}

/* Items */
.rnf-lsa__dd-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px;
  text-decoration: none !important;
  color: var(--rf-ink) !important;
  font-size: 14px;
  cursor: pointer;
  transition: background .1s;
}
.rnf-lsa__dd-item:hover,
.rnf-lsa__dd-item.is-active {
  background: var(--rf-rose-bg);
}
.rnf-lsa__dd-icon {
  flex-shrink: 0;
  color: var(--rf-muted);
  opacity: .55;
}
.rnf-lsa__dd-term span { font-weight: 500; }

/* Produits */
.rnf-lsa__dd-product { padding: 6px 16px; gap: 12px; }
.rnf-lsa__dd-thumb {
  width: 44px; height: 44px;
  flex-shrink: 0;
  border-radius: 8px;
  overflow: hidden;
  background: rgba(139,34,82,.03);
}
.rnf-lsa__dd-thumb img { width: 100%; height: 100%; object-fit: cover; }
.rnf-lsa__dd-thumb-ph {
  display: flex; align-items: center; justify-content: center;
  width: 100%; height: 100%; font-size: 18px;
}
.rnf-lsa__dd-pinfo { flex: 1; min-width: 0; }
.rnf-lsa__dd-pname {
  font-size: 13px; font-weight: 600; color: var(--rf-ink);
  line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rnf-lsa__dd-pprice { font-size: 13px; font-weight: 700; color: var(--rf-rose); margin-top: 1px; }
.rnf-lsa__dd-pprice del { font-weight: 400; color: var(--rf-muted); font-size: 12px; }
.rnf-lsa__dd-pprice ins { text-decoration: none; font-weight: 700; }

/* Footer */
.rnf-lsa__dd-footer { border-top: 1px solid rgba(139,34,82,.07); display: flex; }
.rnf-lsa__dd-footer .rnf-lsa__dd-item {
  flex: 1; justify-content: center;
  font-size: 13px; font-weight: 700; padding: 11px 10px; gap: 4px;
}
.rnf-lsa__dd-fcat { color: var(--rf-rose) !important; border-right: 1px solid rgba(139,34,82,.07); }
.rnf-lsa__dd-fcat:hover { background: var(--rf-rose-bg); }
.rnf-lsa__dd-fcat strong { font-weight: 800; }
.rnf-lsa__dd-fall { color: var(--rf-rose) !important; }
.rnf-lsa__dd-fall:hover { background: var(--rf-rose-bg); }
.rnf-lsa__dd-footer .rnf-lsa__dd-item:only-child { border-right: 0; }

/* ═══════════════════════════════════════════
 *  MOBILE
 * ═══════════════════════════════════════════ */
@media (max-width: 768px) {
  .rnf-lsa-v3 { max-width: 100%; padding: 0 8px; }
  form.rnf-lsa__field { gap: 8px; }

  .rnf-lsa__rosy { height: 42px; }

  .rnf-lsa-v3 .rnf-lsa__input {
    height: 40px !important;
    padding: 0 62px 0 14px !important;
    font-size: 16px !important; /* empêche zoom iOS */
  }
  .rnf-lsa-v3 .rnf-lsa__submit {
    width: 30px !important;
    height: 30px !important;
    right: 5px !important;
  }
  .rnf-lsa-v3 .rnf-lsa__clear {
    right: 33px !important;
    width: 24px !important;
    height: 24px !important;
  }

  .rnf-lsa__dropdown {
    border-radius: 12px;
    top: calc(100% + 4px);
    max-height: 60vh;
  }
  .rnf-lsa__dd-item { padding: 10px 14px; }
  .rnf-lsa__dd-thumb { width: 40px; height: 40px; }
  .rnf-lsa__dd-footer { flex-direction: column; }
  .rnf-lsa__dd-fcat { border-right: 0; border-bottom: 1px solid rgba(139,34,82,.07); }
}

@media (max-width: 480px) {
  .rnf-lsa__rosy { height: 36px; }
  .rnf-lsa-v3 .rnf-lsa__input {
    height: 38px !important;
    padding: 0 58px 0 12px !important;
    font-size: 15px !important;
  }
  .rnf-lsa-v3 .rnf-lsa__submit {
    width: 28px !important;
    height: 28px !important;
    right: 4px !important;
  }
  .rnf-lsa-v3 .rnf-lsa__clear {
    right: 30px !important;
    width: 22px !important;
    height: 22px !important;
  }
}