/*
 * Braillard — Overlay de recherche (issue #15)
 * Plein écran blanc, grand champ souligné (Helvetica), flèche charte.
 */
.br-search{
  /* au-dessus de TOUT, y compris le menu overlay mobile connecté qui monte à
     100000 pour couvrir la barre d'admin WP (retour client 14.07 : recherche
     ouverte depuis le menu = cachée dessous). */
  position: fixed; inset: 0; z-index: 100001;
  background: rgba(255, 255, 255, 0.98);
  /* Ouverture douce (issue #28) : display:none n'est pas animable → l'overlay
     reste dans le flux, masqué par visibility+opacity. À la fermeture, la
     visibility est RETARDÉE pour ne pas couper le fondu sortant — même
     technique que le menu overlay (header.css). */
  display: flex;
  align-items: center; justify-content: center;
  visibility: hidden; opacity: 0;
  transition: opacity .35s ease, visibility 0s linear .35s;
}
.br-search[data-open="true"]{
  visibility: visible; opacity: 1;
  transition: opacity .35s ease, visibility 0s;
}
body.br-search-open{ overflow: hidden; }
/* léger glissement du bloc formulaire, courbe maison */
.br-search .br-search__form{
  transform: translateY(14px);
  transition: transform .5s cubic-bezier(.16, 1, .3, 1);
}
.br-search[data-open="true"] .br-search__form{ transform: none; }
@media (prefers-reduced-motion: reduce){
  .br-search{ transition: opacity 0s, visibility 0s; }
  .br-search .br-search__form{ transition: none; transform: none; }
}

.br-search__close{
  position: absolute; top: clamp(20px, 3vw, 44px); right: clamp(20px, 3.24vw, 56px);
  background: none; border: 0; cursor: pointer; color: var(--br-black);
  font-size: clamp(22px, 1.7vw, 28px); padding: 8px;
}
.br-search__close:hover{ opacity: .55; }

.br-search__form{
  width: min(980px, 84vw);
  display: flex; align-items: center; gap: clamp(20px, 2.5vw, 40px);
  border-bottom: 1px solid var(--br-black);
  padding-bottom: clamp(10px, 1.2vw, 18px);
}
.br-search__input,
.br-search__input:focus,
.br-search__input:hover{
  /* !important : le reset global (Hello/reset.css) redessine bordure/fond des inputs */
  border: 0 !important; outline: 0 !important; background: none !important;
  box-shadow: none !important; padding: 0 !important;
}
.br-search__input{
  flex: 1; min-width: 0;
  border-radius: 0;
  font-family: var(--br-font-body);
  font-weight: 400;
  font-size: clamp(26px, 3.47vw, 60px); /* même échelle que les titres de section */
  line-height: 1.2;
  color: var(--br-black);
  -webkit-appearance: none; appearance: none;
}
.br-search__input::placeholder{ color: #b5b0a9; }
.br-search__input::-webkit-search-cancel-button{ -webkit-appearance: none; }

.br-search__submit{
  background: none; border: 0; cursor: pointer; color: var(--br-black);
  display: inline-flex; padding: 4px;
}
.br-search__submit svg{ width: clamp(70px, 7vw, 105px); height: auto; display: block; transition: transform .3s ease; }
.br-search__submit:hover svg{ transform: translateX(6px); }
