.sfk-wrapper {
  --sfk-value-col: 160px;
  max-width: 720px;
  margin: 0 auto;
  padding: 28px 20px;
  border-radius: 16px;
  background: #f3f3fc;
  font-weight: 500; /* default for alt unntatt overskrifter */
}

/* Overskrifter */
.sfk-results-title { font-size: 1.3rem; font-weight: 800; margin-bottom: 2px; }

/* Kontroller */
.sfk-controls { display: flex; flex-direction: column; gap: 22px; }
.sfk-control  { display: grid; grid-template-columns: 1fr var(--sfk-value-col); align-items: center; row-gap: 8px; column-gap: 12px; }
.sfk-label    { grid-column: 1 / -1; font-weight: 500; margin: 0; }

/* Range base reset */
.sfk-slider { grid-column: 1 / 2; width: 100%; padding: 0 !important; border: none !important; background: transparent !important; height: 28px;
  -webkit-appearance: none !important; -moz-appearance: none !important; appearance: none !important; outline: none !important; cursor: pointer !important; }

/* Track (8px) */
.sfk-slider::-webkit-slider-runnable-track { height: 8px; background: #ffffff; border: 1px solid #d1d5db; border-radius: 9999px; }
.sfk-slider::-moz-range-track { height: 8px; background: #ffffff; border: 1px solid #d1d5db; border-radius: 9999px; }

/* Thumb (16px) i #b6bfe3 */
.sfk-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 16px; height: 16px; border-radius: 50%; background: #b6bfe3; border: 2px solid #ffffff; box-shadow: 0 1px 2px rgba(0,0,0,0.12); margin-top: calc((8px - 16px)/2); }
.sfk-slider::-moz-range-thumb { width: 16px; height: 16px; border-radius: 50%; background: #b6bfe3; border: 2px solid #ffffff; box-shadow: 0 1px 2px rgba(0,0,0,0.12); }

/* Verdi-pill på samme linje til høyre */
.sfk-slider-meta { grid-column: 2 / 3; justify-self: end; width: var(--sfk-value-col); display: flex; justify-content: flex-end; white-space: nowrap;
  background: #fff; padding: 6px 10px; border-radius: 10px; font-weight: 500; }

/* Resultater */
.sfk-results { margin-top: 26px; display: flex; flex-direction: column; gap: 12px; }

.sfk-result { display: flex; justify-content: space-between; align-items: center; padding: 14px 18px; border-radius: 12px; background: #ffffff; }
.sfk-result-short { background: #dcfce7; } .sfk-result-long { background: #dbeafe; } .sfk-result-total { background: #ede9fe; }
.sfk-result-label { font-weight: 500; } .sfk-result-value { font-variant-numeric: tabular-nums; font-weight: 500; }

/* Mer luft under første overskrift (slider-delen) */
.sfk-wrapper > .sfk-results-title:first-child { margin-bottom: 18px; }

@media (max-width: 500px){ .sfk-wrapper { --sfk-value-col: 120px; } }