/* =====================================================================
   [FAMILIE:FAQSOK]  Soekefeltet over FAQ-lista.
   Se docs/architecture/FAMILIE_faqsok.md

   Fargene er hentet fra site.css, ikke valgt paa nytt:
       #04A9FC  butikkens blaa (samme som +/- i FAQ-lista)
       #048fd8  den moerkere blaa paa aapen post
       #232323  broedtekst
       #68747c  dempet tekst
   En egen palett her ville blitt enda et sted som maa holdes i takt
   med resten av sida.

   RAMMENE ER ETT UNNTAK, OG HER ER GRUNNEN.
   Anders 15.10: «Kan du ogsaa gjoere strekene (rammene) her litt
   tykkere? Greier ikke se dem paa skjerm med litt hoey
   brightness-innstilling.»
   De stod paa 1 px #dce4ea - site.css sin egen rammefarge. Den er
   laget for hvit bakgrunn; her ligger den paa #F6FCFF, og da er det
   nesten ingenting igjen av forskjellen. Paa en lys skjerm med hoey
   lysstyrke forsvinner den helt.
   Tykkelsen alene hjelper lite naar kontrasten mangler - det er fargen
   som gjoer jobben, og bredden som gjoer den tydelig. Og «tydelig nok»
   er ikke en smakssak her: WCAG 1.4.11 setter 3,0 for grafiske
   elementer. Maalt:

       #dce4ea (det som stod her)   1,24 mot boksen   1,29 mot hvit
       #7590a8 (foerste forsoek)    1,87              1,94
       #7590a8 (valgt)              3,21              3,33

   Foerste forsoek var bare «litt tykkere og litt moerkere» og hadde
   sett greit ut paa min skjerm - men det er nettopp det som ikke
   virker, for jeg ser ikke Anders' skjerm. Tallet gjoer.

   Blaatonen er beholdt saa det fortsatt hoerer hjemme ved siden av
   #04A9FC; det er bare luminansen som er endret.
   ===================================================================== */

.faq-page .faq-sok{
  margin:0 0 30px;padding:22px 22px 16px;
  background:#F6FCFF;border:2px solid #7590a8;border-radius:14px
}
.faq-page .faq-sok-label{
  display:block;margin:0 0 9px;
  font-size:15px;font-weight:600;color:#183247
}
.faq-page .faq-sok-felt{
  display:block;width:100%;box-sizing:border-box;
  padding:12px 14px;border:2px solid #7590a8;border-radius:9px;
  background:#fff;color:#232323;
  font-family:inherit;font-size:15px;line-height:1.4
}
.faq-page .faq-sok-felt::placeholder{color:#9aa7b1}
.faq-page .faq-sok-felt:focus{
  outline:none;border-color:#04A9FC;box-shadow:0 0 0 3px rgba(4,169,252,.18)
}

/* ---- treffene ---- */
.faq-page .faq-sok-svar{margin:14px 0 0}
.faq-page .faq-sok-tittel{
  margin:0 0 7px;font-size:13px;font-weight:600;color:#68747c;
  text-transform:uppercase;letter-spacing:.04em
}
.faq-page .faq-sok-liste{margin:0;padding:0;list-style:none}
.faq-page .faq-sok-liste li{margin:0 0 5px}
.faq-page .faq-sok-lenke{
  display:flex;gap:10px;align-items:baseline;justify-content:space-between;
  padding:11px 13px;border:2px solid #7590a8;border-radius:9px;
  background:#fff;color:#048fd8;text-decoration:none;
  font-size:15px;font-weight:600;line-height:1.4
}
.faq-page .faq-sok-lenke:hover{border-color:#04A9FC;background:#eaf8ff}
.faq-page .faq-sok-kat{
  flex:0 0 auto;color:#68747c;font-size:12px;font-weight:500;white-space:nowrap
}
.faq-page .faq-sok-tomt{
  margin:0;padding:13px;border:2px dashed #7590a8;border-radius:9px;
  background:#fff;color:#232323;font-size:15px;line-height:1.5
}
.faq-page .faq-sok-tomt a{color:#048fd8}

/* ---- den lille linja om lagring ---- */
.faq-page .faq-sok-note{
  margin:12px 0 0;color:#68747c;font-size:12px;line-height:1.45
}

@media (max-width:560px){
  .faq-page .faq-sok{padding:18px 16px 14px}
  .faq-page .faq-sok-lenke{flex-direction:column;gap:3px}
  .faq-page .faq-sok-kat{white-space:normal}
}
