/* Samma enkla offertformulär på alla sidor (Installia-stil, Tommy 2026-10-23).
   Laddas efter tema.css så att fälten blir vita. */
.ns-form-kort {
  max-width: 560px; margin: 0 auto; padding: 32px 22px; border-radius: 20px; background: #fff;
  border: 1px solid #e6e2db; box-shadow: 0 24px 50px -30px rgba(20,24,27,0.45); text-align: left;
  scroll-margin-top: 100px;
}
.ns-form-kort h2 { margin: 0 0 6px; font-size: 26px; font-weight: 800; letter-spacing: -0.02em; text-transform: none; color: #14181b; }
.ns-form-kort .ns-form-sub { margin: 0 0 22px; font-size: 15px; color: #5b6168; }
.ns-form-kort .ns-form { display: grid; gap: 18px; }
.ns-form-kort .ns-falt { display: grid; gap: 8px; }
.ns-form-kort .ns-falt > span { font-size: 15px; font-weight: 700; color: #14181b; }
.ns-form-kort .ns-form .ns-falt input, .ns-form-kort .ns-form .ns-falt textarea {
  width: 100%; min-height: 54px; padding: 14px 16px; border-radius: 12px !important;
  border: 1.5px solid #d8d4cc !important; background: #fff !important; color: #14181b;
  font: 500 16px 'Montserrat', sans-serif; outline: none; box-sizing: border-box;
}
.ns-form-kort .ns-form .ns-falt textarea { min-height: 120px; resize: vertical; }
.ns-form-kort .ns-form .ns-falt select {
  width: 100%; min-height: 54px; padding: 14px 42px 14px 16px; border-radius: 12px !important;
  border: 1.5px solid #d8d4cc !important; color: #14181b; font: 500 16px 'Montserrat', sans-serif; outline: none; box-sizing: border-box;
  appearance: none; -webkit-appearance: none; cursor: pointer;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2314181b' stroke-width='2.4'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 16px center !important;
}
.ns-form-kort .ns-form .ns-falt select:invalid { color: #6a6a70; }
.ns-form-kort .ns-form .ns-falt select:focus { border-color: #14181b !important; }
.ns-form-kort .ns-form .ns-falt input:focus, .ns-form-kort .ns-form .ns-falt textarea:focus { border-color: #14181b !important; }
.ns-form-kort .ns-skicka {
  display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 58px;
  border: 0; border-radius: 12px; background: #14181b; color: #fff; font: 700 18px 'Montserrat', sans-serif; cursor: pointer;
}
.ns-form-kort .ns-skicka svg { width: 20px; height: 20px; }
.ns-form-kort .ns-skicka:active { transform: scale(.98); }
.ns-form-kort .ns-skicka:disabled { opacity: .6; cursor: wait; }
.ns-form-kort .ns-fel { margin: 0; font-size: 14px; color: #b00d1a; text-align: center; }
.ns-form-kort .ns-tack { text-align: center; padding: 20px 6px; }
.ns-form-kort .ns-tack strong { display: block; margin-bottom: 8px; font-size: 22px; color: #14181b; }
.ns-form-kort .ns-tack p { margin: 0; color: #5b6168; line-height: 1.6; }

/* Lägenhet i formuläret: storlek, inglasad balkong och ungefärligt pris */
.ns-lgh { display: grid; gap: 12px; padding: 18px 16px; border-radius: 16px; background: #f4f6f9; border: 1px solid #e3e7ec; }
.ns-lgh[hidden] { display: none; }
.ns-lgh.saknas .ns-lgh-storlek { outline: 2px solid #d1101f; outline-offset: 4px; border-radius: 12px; }
.ns-lgh-rubrik { font-size: 15px; font-weight: 700; color: #14181b; }
.ns-lgh-rubrik small { font-weight: 500; color: #5b6168; }
.ns-lgh-storlek { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ns-lgh-storlek button {
  min-height: 46px; border: 1.5px solid #d3d8df; border-radius: 999px; background: #fff; color: #14181b;
  font: 700 15px 'Montserrat', sans-serif; cursor: pointer;
}
.ns-lgh-storlek button.vald { background: #1e2b3c; border-color: #1e2b3c; color: #fff; }
.ns-lgh-ingar { margin: -2px 0 4px; font-size: 13.5px; line-height: 1.5; color: #5b6168; }
.ns-lgh-rad { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border-radius: 12px; background: #fff; border: 1px solid #e3e7ec; }
.ns-lgh-rad strong { display: block; font-size: 15px; color: #14181b; }
.ns-lgh-rad span { font-size: 13px; color: #5b6168; }
.ns-lgh-steg { display: flex; align-items: center; gap: 10px; }
.ns-lgh-steg button { width: 40px; height: 40px; border: 1.5px solid #1e2b3c; border-radius: 50%; background: #fff; color: #1e2b3c; font: 700 20px/1 'Montserrat', sans-serif; cursor: pointer; }
.ns-lgh-steg output { min-width: 22px; text-align: center; font-size: 18px; font-weight: 800; color: #14181b; }
.ns-lgh-pris { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding-top: 4px; }
.ns-lgh-pris span { font-size: 14px; color: #5b6168; }
.ns-lgh-pris strong { font-size: 24px; font-weight: 800; color: #1e2b3c; }
.ns-lgh .ns-lgh-framkorning { margin: -8px 0 0; text-align: right; }

/* Läsbar mörk text i lägenhetsrutan även på sidor med vit text (glas-sidor) */
html body .ns-form-kort .ns-lgh :is(span, strong, p, small, output) { color: #14181b !important; }
html body .ns-form-kort .ns-lgh :is(.ns-lgh-ingar, .ns-lgh-rad span, .ns-lgh-pris span, .ns-lgh-rubrik small) { color: #5b6168 !important; }
html body .ns-form-kort .ns-lgh .ns-lgh-pris strong { color: #1e2b3c !important; }
html body .ns-form-kort .ns-lgh-storlek button.vald { color: #fff !important; }
