/* ND Domain Prices – CSS v1.1.31 */

/* Palett og base */
.nddp{
  --bg-pill:#FAFBFF; --stroke:#E9EAF0; --text:#201E2C; --muted:#7A7A87;
  --bg-card-white:#FFFFFF; --bg-card-tint:#FCFCFF;

  /* Default-variabler – kan overstyres inline fra PHP */
  --nddp-head-gap-left: 10px;
  --nddp-head-gap-right: 28px;

  --nddp-row-gap-left: 16px;
  --nddp-row-gap-right: 32px;

  max-width:1200px; width:100%; margin:20px auto 40px;
  font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,sans-serif;
  color:var(--text); line-height:1.45; overflow:hidden; position:relative;
}
.nddp *{ box-sizing:border-box; min-width:0; }
.nddp-bg-white .nddp-card{ background:var(--bg-card-white); }
.nddp-bg-tint  .nddp-card{ background:var(--bg-card-tint); }
.nddp-card{ border:0; border-radius:0; padding:10px 14px; }

/* Desktop – 3 kolonner */
.nddp-head{
  display:grid; grid-template-columns:420px 1fr 1fr; gap:10px;
  padding:6px 12px 12px; color:var(--muted); font-size:.9em; font-weight:400;
}
.nddp-rows{ display:grid; gap:8px; padding:0 12px 6px; }
.nddp-row{
  display:grid; grid-template-columns:420px 1fr 1fr; gap:10px;
  align-items:center; padding:16px 20px; background:transparent; border:0; border-radius:10px;
}
.nddp .nddp-rows > .nddp-row:nth-child(odd){ background:var(--bg-pill); border:1px solid var(--stroke); padding:16px 20px; }
.nddp .nddp-rows > .nddp-row:nth-child(even){ background:transparent; border:0; padding:12px 18px; }

.nddp-col{ white-space:nowrap; font-weight:400; overflow:hidden; text-overflow:ellipsis; }
.nddp-col-tld{ white-space:nowrap; }
.nddp .nddp-col-spacer{ display:none; width:0; }

/* Paginering – piler + dots */
.nddp-pager{
  display:flex; justify-content:center; align-items:center; gap:12px;
  padding:18px 6px 4px; color:var(--text); min-height:58px;
}
.nddp .nd-nav{ display:flex; justify-content:center; align-items:center; gap:12px; margin-top:0; }
.nddp .nd-prev,.nddp .nd-next{
  width:34px; height:34px; border-radius:9999px; border:1px solid #201E2C; background:#201E2C; color:#FFF;
  display:inline-flex; justify-content:center; align-items:center; line-height:1; cursor:pointer; user-select:none;
}
.nddp .nd-prev[disabled],.nddp .nd-next[disabled]{ background:#9DA0A9; border-color:#9DA0A9; color:#FFF; }
.nddp .nd-dots{ display:flex; gap:8px; align-items:center; justify-content:center; }
.nddp .nd-dot{ width:6px; height:6px; border-radius:9999px; background:#E0E2E8; transition:width .2s ease, background-color .2s ease; }
.nddp .nd-dot.is-active{ width:18px; background:#1062FE; }

/* Litt ekstra luft over pilene på desktop */
@media (min-width: 821px){
  .nddp-pager{ padding-top: 34px; }
}

/* ===== Mobil: eksplisitt grid for head og rows ===== */
@media (max-width: 820px){
  /* HEADER – 5 kolonner: TLD | lite gap | REG | større gap | REN */
  .nddp .nddp-head{
    display:grid !important;
    grid-template-columns:
      minmax(96px, 1fr)
      var(--nddp-head-gap-left)
      max-content
      var(--nddp-head-gap-right)
      max-content
    !important;
    column-gap: 0 !important;
    row-gap: 6px !important;
    padding-left: 12px;
    padding-right: 12px;
  }
  .nddp .nddp-head .nddp-col-tld{ grid-column:1 !important; text-align:left !important; justify-self:start !important; }
  .nddp .nddp-head .nddp-col-reg{ grid-column:3 !important; text-align:left !important; justify-self:start !important; white-space:normal !important; }
  .nddp .nddp-head .nddp-col-ren{ grid-column:5 !important; text-align:left !important; justify-self:start !important; white-space:normal !important; }

  /* RADER – egen 5-kolonne, med EGEN gap-variabler */
  .nddp .nddp-row{
    display:grid !important;
    grid-template-columns:
      minmax(96px, 1fr)
      var(--nddp-row-gap-left)
      max-content
      var(--nddp-row-gap-right)
      max-content
    !important;
    column-gap: 0 !important;
    row-gap: 8px !important;
    padding-left: 12px;
    padding-right: 12px;
  }
  .nddp .nddp-row .nddp-col-tld{ grid-column:1 !important; text-align:left !important; justify-self:start !important; }
  .nddp .nddp-row .nddp-col-reg{ grid-column:3 !important; text-align:left !important; justify-self:start !important; }
  .nddp .nddp-row .nddp-col-ren{ grid-column:5 !important; text-align:left !important; justify-self:start !important; }

  /* Skjul spacer-noden fra markupen */
  .nddp .nddp-col-spacer{ display:none !important; }

  /* Sikkerhet for brytning av header-tekst */
  .nddp .nddp-head .nddp-col{ max-width:100% !important; overflow-wrap:anywhere; word-break:break-word; }
}