/* sp-recherche.css — recherche des simulateurs dans l'en-tête (barres sombres : .header des simulateurs, .ng-nav des pages) */
.sp-rech { position: relative; flex: 0 1 300px; min-width: 170px; margin: 0 1.25rem; }
.sp-rech input[type="search"] {
  width: 100%; box-sizing: border-box; height: 2.15rem; padding: 0 2.4rem 0 2.1rem;
  border: 1px solid rgba(255, 255, 255, 0.28); border-radius: 999px;
  background: rgba(255, 255, 255, 0.1) no-repeat 0.75rem 50% / 0.95rem
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-opacity='.75' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
  color: #fff; font: inherit; font-size: 0.9rem; outline: none; transition: background-color .15s, border-color .15s;
}
.sp-rech input[type="search"]::placeholder { color: rgba(255, 255, 255, 0.7); }
.sp-rech input[type="search"]:focus { background-color: rgba(255, 255, 255, 0.18); border-color: #f59e0b; }
.sp-rech input[type="search"]::-webkit-search-cancel-button { filter: invert(1); opacity: .7; }
.sp-rech-touche {
  position: absolute; right: 0.6rem; top: 50%; transform: translateY(-50%);
  min-width: 1.15rem; padding: 0 0.3rem; border: 1px solid rgba(255, 255, 255, 0.4); border-radius: 4px;
  color: rgba(255, 255, 255, 0.75); font: 600 0.72rem/1.15rem system-ui, sans-serif; text-align: center; pointer-events: none;
}
.sp-rech input:focus ~ .sp-rech-touche, .sp-rech input:not(:placeholder-shown) ~ .sp-rech-touche { display: none; }
.sp-rech-liste {
  position: absolute; z-index: 1000; top: calc(100% + 6px); left: 0; width: max(100%, 420px); max-height: 70vh; overflow-y: auto;
  margin: 0; padding: 0.35rem; list-style: none; box-sizing: border-box;
  background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; box-shadow: 0 14px 34px rgba(15, 23, 42, 0.22);
  text-align: left;
}
.sp-rech-liste[hidden] { display: none; }
.sp-rech-liste li { margin: 0; }
.sp-rech-liste a { display: block; padding: 0.5rem 0.65rem; border-radius: 7px; color: #1e293b !important; text-decoration: none !important; }
.sp-rech-liste li.sp-rech-actif a, .sp-rech-liste a:hover { background: #f1f5f9; }
.sp-rech-nom { display: block; font-weight: 600; font-size: 0.92rem; line-height: 1.3; }
.sp-rech-nom mark { background: rgba(245, 158, 11, 0.3); color: inherit; border-radius: 2px; padding: 0; }
.sp-rech-desc { display: block; margin-top: 0.1rem; color: #64748b; font-size: 0.8rem; line-height: 1.35; font-weight: 400;
  overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.sp-rech-vide { padding: 0.6rem 0.65rem; color: #64748b; font-size: 0.88rem; }
.sp-rech-tous { border-top: 1px solid #e2e8f0; margin-top: 0.3rem !important; padding-top: 0.3rem; }
.sp-rech-tous a { font-size: 0.85rem; font-weight: 600; color: #b45309 !important; }
@media (max-width: 760px) {
  .sp-rech { order: 10; flex: 1 1 100%; margin: 0.5rem 0 0; }
  .sp-rech-liste { width: 100%; }
  .sp-rech-touche { display: none; }
}
@media print { .sp-rech { display: none !important; } }
@media (max-width: 760px) { .header:has(.sp-rech), .ng-nav:has(.sp-rech) { flex-wrap: wrap; } }
.sp-rech-titre { padding: 0.35rem 0.65rem 0.2rem; color: #64748b; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; }