.skg{font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial}
.wrap{max-width:1000px;margin:0 auto;padding:12px 16px}
.top{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.top h2{margin:0}
.rating{display:flex;align-items:center;gap:10px}
.rating #skg_avg{font-size:32px;font-weight:800}
.stars{color:#FFB400}
.muted{color:#6B7A90}
.btn{display:inline-block;border:0;border-radius:999px;padding:10px 16px;background:#061d2E;color:#fff;font-weight:700;text-decoration:none}
.hist{display:grid;gap:6px;margin:10px 0 8px}
.hist .row{display:grid;grid-template-columns:60px 1fr 40px;gap:10px;align-items:center}
.hist .bar{background:#e1e5ec;border-radius:6px;overflow:hidden;height:10px}
.hist .bar span{display:block;height:100%;background:#1a73e8}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 16px}
.filters input,.filters select{padding:10px 12px;border:1px solid #dfe3eb;border-radius:24px;background:#fff}
.list{display:grid;gap:10px}
.card{border:1px solid #e5e9f2;border-radius:12px;padding:12px;background:#fff}
.card .meta{display:flex;gap:8px;align-items:center;color:#1f2937}
.card .title{font-weight:700;margin:4px 0}
.card .svc{display:inline-block;background:#eef6ff;border:1px solid #cde2ff;color:#104a82;border-radius:999px;padding:2px 8px;font-size:12px}
.card .media{margin-top:10px}
.card .media img{max-width:100%;border-radius:10px}
.empty{color:#6B7A90;margin:10px 0 20px}
/* Tidstekst ved stjernene */
.skg .card .sk-ago{
  margin-left:.5rem;
  color:#8a6d3b;         /* bytt til #8a6d3b for brun */
  font-weight:600;
  font-size:14px;
  white-space:nowrap;
}
/* Meta-rad under tittelen */
.skg .card .meta{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;        /* viktig på mobil */
}

/* Stjernene */
.skg .card .sk-stars{ color:#FFB400; }

/* "for X … siden" */
.skg .card .sk-ago{
  color:#9aa0a6;         /* bytt til #8a6d3b for brun */
  font-weight:600;
  font-size:14px;
  white-space:nowrap;    /* hindrer brudd på mobil */
}

/* Prikken mellom stjerner og tid */
.skg .card .sk-ago::before{
  content:"•";
  margin:0 6px 0 2px;
  opacity:.6;
}
/* Grå informasjonsbokser under stjerner/tid */
.skg .list .card .sk-pills{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:8px 0;
}
.skg .list .card .pill{
  background:#f1f3f5;
  border:1px solid #e6e8eb;
  color:#333;
  border-radius:12px;
  padding:4px 10px;
  font-size:13px;
  line-height:1.2;
}
.skg .list .card .pill-confirmed{
  background:#e6f7ec;
  border-color:#b5e1c1;
  color:#237a3b;
  font-weight:600;
}
/* Bokser (pills) */
.skg_list .card .sk-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0;
}

.skg_list .card .pill {
  background: #f7f7f9;               /* lys bakgrunn */
  border: 1px solid #ddd;             /* tynn grå kant */
  color: #333;                        /* mørk tekst */
  border-radius: 20px;                /* rund kapsel */
  padding: 5px 12px;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
  box-shadow: 0 1px 2px rgba(0,0,0,0.08); /* lett skygge */
  transition: all 0.2s ease;
}

.skg_list .card .pill:hover {
  background: #eceef1;                /* litt mørkere ved hover */
}

/* Bekreftet kunde – spesiell stil */
.skg_list .card .pill-confirmed {
  background: #e6f7ec;
  border: 1px solid #a8d5b8;
  color: #237a3b;
  font-weight: 600;
  box-shadow: 0 2px 4px rgba(35,122,59,0.1);
}
/* Farge på bakgrunnen (den lyse “skinnen”) */
.skg .hist .bar{
  background: #e6eaf2;   /* bytt denne hvis du vil */
}

/* Farge på selve stolpen (det som er blått nå) */
.skg .hist .bar span{
  background: #0a5fff;   /* sett din ønskede farge her */
}
/* Små media-thumbnails i kortet */
.skg .list .card .media{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:8px;
}

.skg .list .card .thumb{
  width:140px;              /* 👈 juster størrelse her */
  height:100px;
  border:1px solid #e6eaf4;
  border-radius:12px;
  overflow:hidden;
  background:#fff;
}

.skg .list .card .thumb img,
.skg .list .card .thumb video{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
// --- Enkel lightbox for bilder/video ---
$(document).on('click', '.skg .list .card .lb', function (e) {
  e.preventDefault();
  const url = $(this).attr('href');
  const type = $(this).attr('data-type') || 'image';

  // bygg overlay
  const $ov = $('<div class="skg-lb-ov"></div>');
  const $in = $('<div class="skg-lb-in"></div>');
  const $close = $('<button class="skg-lb-close" aria-label="Lukk">×</button>');

  let $content;
  if (type === 'video') {
    $content = $('<video controls autoplay></video>').attr('src', url);
  } else {
    $content = $('<img alt="">').attr('src', url);
  }

  $in.append($close).append($content);
  $ov.append($in);
  $('body').append($ov);

  // lukk på klikk/ESC
  function closeLB(){ $ov.remove(); $(document).off('keydown.skgLb'); }
  $ov.on('click', function(ev){ if (ev.target === this) closeLB(); });
  $close.on('click', closeLB);
  $(document).on('keydown.skgLb', function(ev){ if(ev.key === 'Escape') closeLB(); });
});