/* NF WC Category Selector – styles (v1.5.4) */
.nfwc-wrap{
  max-width:1200px;
  margin:16px auto;
  padding:22px;
  border-radius:20px;
  background:#fff;
  box-shadow:0 10px 40px rgba(0,0,0,.08);
  box-sizing:border-box;
}

/* Liten hjelpetekst øverst */
.nfwc-help{
  margin:0 0 10px;
  font-size:.9rem;
  line-height:1.5;
  color:#6b7280;
  font-weight:600;
}

/* 6 felter + 1 autokolonne til knappen. Litt lavere min-bredde + litt mindre gap */
.nfwc-grid{
  display:grid;
  grid-template-columns:repeat(6, minmax(136px,1fr)) minmax(150px, max-content);
  grid-auto-rows:auto;
  gap:14px;
  align-items:end;
}

.nfwc-grid label{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-weight:600;
  color:#6b7280;
}

.nfwc-sel{
  width:100%;
  padding:.9rem 1.1rem;
  border:1px solid #e5e7eb;
  border-radius:14px;
  background:#f8fafc;
  outline:none;
  transition:.15s;
}
.nfwc-sel:focus{
  border-color:#94a3b8;
  box-shadow:0 0 0 3px rgba(148,163,184,.25);
}

/* Knapp */
.nfwc-go{
  justify-self:end;
  align-self:center;
  min-height:48px;
  padding:.9rem 22px .6rem;
  border-radius:9999px;
  border:0;
  background:#111827;
  color:#fff;
  font-weight:700;
  box-shadow:0 10px 25px rgba(0,0,0,.15);
  cursor:pointer;
  white-space:nowrap;
  max-width:260px;   /* sikkerhetsnett */
  overflow:hidden;
  text-overflow:ellipsis;
  position:relative;
  transition:.15s ease;
}

.nfwc-go:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 30px rgba(15,23,42,.25);
}

/* --- RESPONSIVE LOGIKK --- */
/* Flytt knappen til egen rad tidligere, så den aldri kuttes */
@media (max-width:1400px){
  .nfwc-grid{
    grid-template-columns:repeat(6, minmax(140px,1fr));
  }
  .nfwc-go{
    grid-column:1 / -1;      /* ny rad, høyrejustert */
    justify-self:end;
  }
}

/* Mellomstore skjermer: 3 kolonner brede felt + knapp under */
@media (max-width:1200px){
  .nfwc-grid{
    grid-template-columns:repeat(3, minmax(200px,1fr));
  }
  .nfwc-go{
    grid-column:1 / -1;
    justify-self:start;
  }
}

/* Telefon: ett felt per rad, knappen full bredde */
@media (max-width:760px){
  .nfwc-grid{
    grid-template-columns:1fr;
  }
  .nfwc-go{
    justify-self:stretch;
    width:100%;
  }
}

/* Loading-state for select (visuelt hint ved AJAX-løp) */
.nfwc-sel.is-loading{
  background-image:linear-gradient(90deg,#f3f4f6,#e5e7eb,#f3f4f6);
  background-size:200% 100%;
  animation:nfwcShimmer 1.2s infinite;
  cursor:progress;
}

@keyframes nfwcShimmer{
  0%{ background-position:-200% 0; }
  100%{ background-position:200% 0; }
}
