/* Minigarðurinn — bókunarvélin (flutt úr boka.html inline-style) */
/* ---------- Bókunin — DÖKKA þemað ---------- */

/* Framvinda */
.gw-progress {
  display: flex;
  justify-content: center;
  gap: clamp(0.5rem, 3vw, 2rem);
  margin-bottom: 2.6rem;
  flex-wrap: wrap;
}
.gw-dot {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.45rem;
  background: none;
  border: none;
  cursor: default;
  padding: 0;
}
.gw-dot i {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 1px solid var(--line);
  background: transparent;
  transition: all 0.35s var(--ease);
}
.gw-dot span {
  font-family: "Poppins", sans-serif;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
}
.gw-dot.done i {
  background: var(--gold);
  border-color: var(--gold);
}
.gw-dot.done span {
  color: var(--gold);
}
.gw-dot.current i {
  border-color: var(--gold);
  background: var(--bronze);
  box-shadow: 0 0 0 5px rgba(211, 195, 152, 0.15);
  transform: scale(1.2);
}
.gw-dot.current span {
  color: var(--cream);
}
.gw-dot.reachable {
  cursor: pointer;
}
.gw-dot.reachable:hover span {
  color: var(--gold);
}

/* Áberandi vöruhaus */
.bk-producthead {
  text-align: center;
  margin: -0.4rem 0 2.6rem;
}
.bk-producthead .tagline {
  font-family: "Poppins", sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--bronze);
}
.bk-producthead h2 {
  font-family: "Poppins", sans-serif;
  font-size: clamp(1.7rem, 4.5vw, 2.6rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--gold);
  margin: 0.3rem 0 0.2rem;
  line-height: 1.1;
}
.bk-producthead .price {
  font-family: "Poppins", sans-serif;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--cream);
}
.bk-producthead .price small {
  font-weight: 400;
  color: var(--muted);
}

/* Uppsetning */
.bk-layout {
  display: grid;
  grid-template-columns: 1.7fr 1fr;
  gap: 1.5rem;
  align-items: start;
}
.bk-q {
  text-align: center;
  font-size: clamp(1.3rem, 3.2vw, 1.9rem);
  color: var(--cream);
  margin-bottom: 1.8rem;
}
.bk-q-sub {
  text-align: center;
  color: var(--muted);
  font-size: 0.95rem;
  margin: -1.2rem 0 1.8rem;
}
.bk-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1.2rem;
  margin-top: 2.2rem;
  flex-wrap: wrap;
}
.bk-backlink {
  background: none;
  border: none;
  color: var(--muted);
  font-family: "Poppins", sans-serif;
  font-size: 0.8rem;
  letter-spacing: 0.1em;
  cursor: pointer;
  transition: color 0.3s;
}
.bk-backlink:hover {
  color: var(--gold);
}

/* Vöruval */
.bk-cathead {
  font-family: "Poppins", sans-serif;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--bronze);
  text-align: center;
  margin: 2.6rem 0 1.1rem;
}
.bk-cathead:first-of-type {
  margin-top: 0;
}
.bk-products {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.2rem;
}
.bk-products.one {
  grid-template-columns: 1fr;
}
.bk-products.two {
  grid-template-columns: repeat(2, 1fr);
  max-width: 680px;
  margin: 0 auto;
}
.pack.choice.featured {
  border-color: var(--gold);
  background: rgba(211, 195, 152, 0.05);
}
.pack.choice.featured h3 {
  color: var(--gold);
}
.pack.choice .pimg {
  height: 150px;
  margin: -2.4rem -2rem 1.3rem;
  border-radius: var(--radius) var(--radius) 0 0;
  background-size: cover;
  background-position: center;
}
.pack.choice video.pimg {
  object-fit: cover;
  width: calc(100% + 4rem);
}
.bk-products.one .pack.choice .pimg {
  height: 190px;
}
.pack .badge {
  display: inline-block;
  align-self: flex-start;
  font-family: "Poppins", sans-serif;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink);
  background: var(--gold);
  border-radius: 100px;
  padding: 0.35em 1em;
  margin-bottom: 0.7rem;
}
.pack .includes {
  list-style: none;
  margin: 0.2rem 0 0;
  padding: 0;
}
.pack .includes li {
  font-size: 0.84rem;
  color: var(--muted);
  padding: 0.18rem 0 0.18rem 1.2rem;
  position: relative;
}
.pack .includes li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0.18rem;
  color: var(--gold);
  font-size: 0.75rem;
}
.pack .price .freetag {
  font-style: normal;
  color: #9fbf8f;
}

/* Tilboðin: minigolf eða píla? */
.bk-variant {
  display: flex;
  justify-content: center;
  gap: 0.9rem;
  margin-bottom: 2.4rem;
}
.bk-variant button {
  font-family: "Poppins", sans-serif;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.85em 2em;
  border-radius: 100px;
  border: 1px solid var(--line);
  background: var(--char-2);
  color: var(--cream);
  cursor: pointer;
  transition: all 0.25s;
}
.bk-variant button:hover {
  border-color: var(--gold);
}
.bk-variant button.selected {
  background: var(--gold);
  color: var(--ink);
  border-color: var(--gold);
}
.pack .tagline {
  font-family: "Poppins", sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--bronze);
}
.pack p.desc {
  color: var(--muted);
  font-size: 0.92rem;
  flex: 1;
}
.pack.choice {
  cursor: pointer;
  position: relative;
  user-select: none;
}
.pack.choice::after {
  content: "✓";
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 1px solid var(--line);
  display: grid;
  place-items: center;
  font-size: 0.85rem;
  color: transparent;
  transition: all 0.25s;
}
.pack.choice.selected {
  border-color: var(--gold);
  background: rgba(211, 195, 152, 0.07);
}
.pack.choice.selected::after {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--ink);
}

/* Gestir */
.bk-guestgrid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.9rem;
  max-width: 520px;
  margin: 0 auto;
}
.bk-guest {
  aspect-ratio: 1.6;
  background: var(--char-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  font-family: "Poppins", sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--cream);
  cursor: pointer;
  transition: all 0.25s;
}
.bk-guest:hover {
  border-color: var(--gold);
  transform: translateY(-2px);
}
.bk-guest.selected {
  border-color: var(--gold);
  background: rgba(211, 195, 152, 0.08);
  color: var(--gold);
}
.bk-groupnote {
  max-width: 560px;
  margin: 2rem auto 0;
  text-align: center;
  background: var(--char-2);
  border: 1px dashed var(--gold);
  border-radius: var(--radius);
  padding: 1.2rem 1.4rem;
  color: var(--muted);
  font-size: 0.92rem;
}
.bk-groupnote .btn {
  font-size: 0.7rem;
  padding: 0.7em 1.4em;
}

/* Dagatal */
.bk-calhead {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.6rem;
  margin-bottom: 1.2rem;
}
.bk-calhead strong {
  font-family: "Poppins", sans-serif;
  color: var(--cream);
  text-transform: capitalize;
  min-width: 170px;
  text-align: center;
}
.bk-calnav {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--line);
  background: var(--char-2);
  color: var(--gold);
  font-size: 1.2rem;
  cursor: pointer;
  transition: all 0.25s;
}
.bk-calnav:hover {
  background: var(--gold);
  color: var(--ink);
  border-color: var(--gold);
}
.bk-cal {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  max-width: 560px;
  margin: 0 auto;
}
.bk-caldow {
  text-align: center;
  font-family: "Poppins", sans-serif;
  font-size: 0.68rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
  padding-bottom: 0.4rem;
}
.bk-calday {
  aspect-ratio: 1;
  border: 1px solid transparent;
  border-radius: var(--radius);
  background: var(--char-2);
  font-family: "Poppins", sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--cream);
  cursor: pointer;
  transition: all 0.2s;
}
.bk-calday:hover:not(:disabled) {
  border-color: var(--gold);
}
.bk-calday.selected {
  background: var(--gold);
  color: var(--ink);
  border-color: var(--gold);
}
.bk-calday:disabled {
  background: transparent;
  color: rgba(48, 47, 47, 0.25);
  cursor: default;
}

/* Tímar */
.bk-times {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.8rem;
  max-width: 640px;
  margin: 0 auto;
}
.bk-time {
  padding: 0.9rem 0.4rem;
  background: var(--char-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  cursor: pointer;
  transition: all 0.2s;
  text-align: center;
}
.bk-time strong {
  display: block;
  font-family: "Poppins", sans-serif;
  font-size: 1rem;
  color: var(--cream);
}
.bk-time span {
  font-size: 0.7rem;
  color: var(--muted);
}
.bk-time span.few {
  color: #e08c7d;
  font-weight: 600;
}
.bk-time:hover:not(:disabled) {
  border-color: var(--gold);
  transform: translateY(-2px);
}
.bk-time.selected {
  border-color: var(--gold);
  background: rgba(211, 195, 152, 0.08);
}
.bk-time:disabled {
  opacity: 0.4;
  cursor: default;
  background: transparent;
}

/* Meðlæti */
.bk-extras {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}
.bk-extra {
  background: var(--char-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.3rem 1.4rem;
  transition: border-color 0.25s;
}
.bk-extra.active {
  border-color: var(--gold);
}
.bk-extra strong {
  display: block;
  font-family: "Poppins", sans-serif;
  font-size: 0.98rem;
  color: var(--cream);
}
.bk-extra .desc {
  color: var(--muted);
  font-size: 0.85rem;
  margin: 0.2rem 0 0.6rem;
}
.bk-extra .price {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  color: var(--gold);
  font-size: 0.9rem;
  display: block;
  margin-bottom: 0.7rem;
}
.gr-step {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}
.gr-step button {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid var(--line);
  background: none;
  color: var(--gold);
  font-size: 1rem;
  cursor: pointer;
  transition: all 0.25s;
}
.gr-step button:hover {
  background: var(--gold);
  color: var(--ink);
  border-color: var(--gold);
}
.gr-step input {
  width: 48px;
  background: var(--ink);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  color: var(--cream);
  font-family: "Poppins", sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  text-align: center;
  padding: 0.3rem 0.1rem;
  -moz-appearance: textfield;
}
.gr-step input::-webkit-outer-spin-button,
.gr-step input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Framhald — spila meira og borða */
.bk-addons {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.2rem;
  max-width: 760px;
  margin: 0 auto;
}
.bk-addon {
  background: var(--char-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.8rem 1.6rem;
  cursor: pointer;
  user-select: none;
  text-align: center;
  transition:
    border-color 0.25s,
    transform 0.25s var(--ease);
}
.bk-addon:hover {
  border-color: var(--gold);
  transform: translateY(-3px);
}
.bk-addon.selected {
  border-color: var(--gold);
  background: rgba(211, 195, 152, 0.07);
}
.bk-addon strong {
  display: block;
  font-family: "Poppins", sans-serif;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--cream);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.bk-addon .desc {
  color: var(--muted);
  font-size: 0.9rem;
  margin: 0.5rem 0;
  min-height: 3em;
}
.bk-addon .meta {
  font-family: "Poppins", sans-serif;
  font-size: 0.75rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--bronze);
}
.bk-addon .price {
  font-family: "Poppins", sans-serif;
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--gold);
  margin: 0.4rem 0 1rem;
}
.bk-addon .price small {
  font-size: 0.75rem;
  font-weight: 400;
  color: var(--muted);
}
.bk-addon .price .freetag {
  font-style: normal;
  color: #9fbf8f;
}
.bk-addon .btn {
  pointer-events: none;
  font-size: 0.72rem;
  padding: 0.8em 1.6em;
}

/* Staðfesting */
.bk-form {
  max-width: 480px;
  margin: 0 auto;
  background: var(--char-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.8rem;
  display: grid;
  gap: 1.1rem;
}
.bk-field span {
  display: block;
  font-family: "Poppins", sans-serif;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 0.4rem;
}
.bk-field input {
  width: 100%;
  padding: 0.8rem 1rem;
  background: var(--ink);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  font-family: inherit;
  font-size: 1rem;
  color: var(--cream);
  outline: none;
  transition: border-color 0.25s;
}
.bk-field input:focus {
  border-color: var(--gold);
}
.bk-scarcity {
  max-width: 480px;
  margin: 1.4rem auto 0;
  text-align: center;
  background: rgba(211, 195, 152, 0.07);
  border: 1px solid rgba(211, 195, 152, 0.3);
  border-radius: var(--radius);
  padding: 0.8rem 1rem;
  font-size: 0.9rem;
  color: var(--cream);
}
.bk-error {
  text-align: center;
  color: #e08c7d;
  font-size: 0.9rem;
  margin-top: 1rem;
}
/* „Reyna aftur" í villunni (5/10): tengill í sama lit, stór smellflötur */
.bk-error .bk-aftur {
  background-color: transparent;
  border: 0;
  padding: 0.4rem 0.2rem;
  color: var(--gold);
  font: inherit;
  font-weight: 600;
  text-decoration: underline;
  cursor: pointer;
}
.bk-nocharge {
  text-align: center;
  color: var(--muted);
  font-size: 0.82rem;
  margin-top: 0.8rem;
}

/* Staðfest */
.bk-done {
  max-width: 520px;
  margin: 0 auto 2.5rem;
  text-align: center;
  background: var(--char-2);
  border: 1px solid var(--gold);
  border-radius: var(--radius);
  padding: 2.6rem 2rem;
}
.bk-done .check {
  width: 56px;
  height: 56px;
  margin: 0 auto 1.2rem;
  border-radius: 50%;
  background: var(--gold);
  color: var(--ink);
  font-size: 1.8rem;
  display: grid;
  place-items: center;
}
.bk-done h3 {
  font-size: 1.5rem;
  color: var(--cream);
  margin-bottom: 0.5rem;
}
.bk-done p {
  color: var(--muted);
}
/* Innskráning á staðfestingarskrefinu (21/9): gestaspjaldið */
.bk-gestur {
  max-width: 520px;
  margin: 1.6rem auto 0;
  padding: 1.4rem 1.6rem;
  border: 1px solid var(--gold);
  border-radius: var(--radius);
  background: var(--char-2);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.35rem;
}
.bk-gestur.bk-gestur-bjoda { border-color: var(--line); }
.bk-gestur-merki {
  font-family: "Poppins", sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--gold);
}
.bk-gestur strong { font-family: "Poppins", sans-serif; font-size: 1.15rem; color: var(--cream); }
.bk-gestur-uppl { color: var(--muted); font-size: 0.92rem; max-width: 40ch; }
.bk-gestur .btn { margin-top: 0.8rem; }
.bk-gestur-skipta,
.bk-form .bk-gestur-skipta {
  margin-top: 0.6rem;
  background: none;
  border: 0;
  color: var(--muted);
  font-size: 0.85rem;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.bk-gestur-skipta:hover { color: var(--gold); }
.bk-form .bk-gestur-skipta { display: block; margin-left: auto; margin-right: auto; }

/* Greiðsla við bókun: bið eftir stöðu bókunarbeiðninnar (21/9) */
.bk-done .btn { margin-top: 1.4rem; }
.bk-done.bk-bidur { border-color: var(--line); }
.bk-snuningur {
  width: 44px;
  height: 44px;
  margin: 0 auto 1.2rem;
  border-radius: 50%;
  border: 3px solid var(--line);
  border-top-color: var(--gold);
  animation: bkSnuningur 0.9s linear infinite;
}
@keyframes bkSnuningur { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .bk-snuningur { animation: none; border-top-color: var(--line); } }
.bk-done .bno {
  margin-top: 1rem;
  color: var(--cream);
}
.bk-done .bno strong {
  font-family: "Poppins", sans-serif;
  color: var(--gold);
  letter-spacing: 0.08em;
}
.bk-timeline {
  margin-top: 1.4rem;
  padding-top: 1.2rem;
  border-top: 1px solid var(--line);
  text-align: left;
}
.bk-timeline h4 {
  font-size: 0.78rem;
  letter-spacing: 0.2em;
  color: var(--gold);
  margin-bottom: 0.7rem;
  text-align: center;
}
.bk-timeline .tl {
  color: var(--cream);
  font-size: 0.95rem;
  padding: 0.35rem 0 0.35rem 1.2rem;
  position: relative;
}
.bk-timeline .tl::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--bronze);
}
.bk-next {
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
}

/* Samantektin */
.bk-summary {
  position: sticky;
  top: calc(var(--nav-h) + 1rem);
  background: var(--char-2);
  border: 1px solid var(--gold);
  border-radius: var(--radius);
  padding: 1.6rem 1.7rem;
}
.bk-summary h3 {
  font-size: 0.85rem;
  letter-spacing: 0.25em;
  color: var(--gold);
  margin-bottom: 0.9rem;
}
.bk-summary ul {
  list-style: none;
  margin: 0 0 1rem;
  padding: 0 0 0.9rem;
  border-bottom: 1px solid var(--line);
}
.bk-summary ul li {
  display: flex;
  gap: 0.5rem;
  font-size: 0.82rem;
  color: var(--muted);
  padding: 0.15rem 0;
}
.bk-summary ul li span:first-child {
  color: #9fbf8f;
}
.bk-sumrow {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 0.55rem 0;
  border-bottom: 1px solid rgba(211, 195, 152, 0.08);
}
.bk-sumrow .lbl {
  display: block;
  font-family: "Poppins", sans-serif;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--muted);
}
.bk-sumrow strong {
  font-size: 0.95rem;
  color: var(--cream);
  font-weight: 600;
}
.bk-change {
  background: none;
  border: 1px solid var(--line);
  border-radius: 100px;
  color: var(--gold);
  font-size: 0.7rem;
  padding: 0.35em 0.9em;
  cursor: pointer;
  transition: all 0.25s;
  white-space: nowrap;
}
.bk-change:hover {
  background: var(--gold);
  color: var(--ink);
  border-color: var(--gold);
}
.bk-sumlines {
  margin-top: 0.9rem;
}
.bk-sumline {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  font-size: 0.85rem;
  color: var(--muted);
  padding: 0.25rem 0;
}
.bk-hold {
  margin-top: 0.9rem;
  background: rgba(211, 195, 152, 0.1);
  border: 1px solid var(--gold);
  border-radius: var(--radius);
  padding: 0.6rem 0.9rem;
  font-size: 0.85rem;
  color: var(--cream);
  text-align: center;
}
.bk-hold strong {
  font-family: "Poppins", sans-serif;
  color: var(--gold);
}
.bk-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-top: 0.8rem;
  padding-top: 0.8rem;
  border-top: 1px solid var(--line);
}
.bk-total span {
  font-family: "Poppins", sans-serif;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--muted);
}
.bk-total strong {
  font-family: "Poppins", sans-serif;
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--gold);
}

.bk-demonote {
  text-align: center;
  color: var(--muted);
  font-size: 0.78rem;
  margin-top: 2.5rem;
}

@media (max-width: 1024px) {
  .bk-layout {
    grid-template-columns: 1fr;
  }
  .bk-summary {
    position: static;
  }
  .bk-products {
    grid-template-columns: 1fr;
  }
  .bk-extras {
    grid-template-columns: 1fr;
  }
  .bk-addons {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 600px) {
  .bk-times {
    grid-template-columns: repeat(3, 1fr);
  }
  .bk-guestgrid {
    grid-template-columns: repeat(3, 1fr);
    gap: 0.6rem;
  }
}
/* Vöruvalið: full breidd án yfirlits + flýtitakkar */
.bk-layout.single {
  grid-template-columns: 1fr;
}
.bk-shortcuts {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.6rem;
  margin: -0.4rem 0 1.8rem;
}
.bk-chip {
  font-family: "Poppins", sans-serif;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold);
  background: none;
  border: 1px solid var(--gold);
  border-radius: 100px;
  padding: 0.65em 1.5em;
  cursor: pointer;
  transition: all 0.2s;
}
.bk-chip:hover {
  background: var(--gold);
  color: #fff;
}
@media (max-width: 600px) {
  .bk-shortcuts {
    gap: 0.45rem;
    margin-bottom: 1.4rem;
  }
  .bk-chip {
    font-size: 0.68rem;
    padding: 0.6em 1.05em;
    letter-spacing: 0.06em;
  }
}
/* ---------- App-hamur: bókunin án truflana (fyrirmynd poolhouse) ---------- */
.bk-app .site-footer {
  display: none;
}
.bk-app {
  padding-top: 0;
}
.bk-appbar {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 0.8rem 1rem;
  margin: 1rem 0 1.8rem;
}
.bk-appbar img {
  height: 34px;
}
.bk-appbar .bk-appback {
  position: absolute;
  left: 0.9rem;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: 1px solid var(--line);
  border-radius: 100px;
  color: var(--cream);
  font-family: "Poppins", sans-serif;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 0.6em 1.2em;
  cursor: pointer;
  transition: all 0.2s;
}
.bk-appbar .bk-appback:hover {
  color: var(--gold);
  border-color: var(--gold);
}
@media (max-width: 600px) {
  .bk-appbar .bk-appback {
    padding: 0.55em 0.9em;
    font-size: 0.62rem;
  }
  .bk-appbar img {
    height: 28px;
  }
}
/* ---------- Bókunarvélin 2.0: poolhouse-lookið ---------- */
/* Bóka-takkinn á ekki heima í stikunni inni í bókunarvélinni */
.bk-app .header-actions .btn.orv {
  display: none;
}

/* Skrefaröndin: þunnir strikbútar með heiti, eins og hjá poolhouse */
.gw-progress {
  display: flex;
  gap: 10px;
  max-width: 720px;
  margin: 0 auto 2.4rem;
}
.gw-dot {
  flex: 1;
  background: none;
  border: none;
  cursor: default;
  padding: 0;
  text-align: left;
}
.gw-dot span {
  display: block;
  font-family: "Poppins", sans-serif;
  font-size: 0.6rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gw-dot i {
  display: block;
  height: 4px;
  border-radius: 4px;
  background: rgba(48, 47, 47, 0.15);
}
.gw-dot.done i,
.gw-dot.current i {
  background: var(--gold);
}
.gw-dot.current span {
  color: var(--gold);
}
.gw-dot.reachable {
  cursor: pointer;
}
.gw-dot.reachable:hover span {
  color: var(--gold);
}
@media (max-width: 600px) {
  /* Símar: strikin á einni línu, bara núverandi skref með heiti */
  .gw-progress {
    flex-wrap: nowrap;
    gap: 6px;
    margin-bottom: 1.6rem;
    align-items: flex-start;
  }
  .gw-dot {
    min-width: 0;
  }
  .gw-dot span {
    display: none;
  }
  .gw-dot.current span {
    display: block;
    font-size: 0.55rem;
    letter-spacing: 0.06em;
  }
  /* fasti haus-borðinn er ~64px hár á símum — efnið má ekki lenda undir honum */
  .bk-app .section {
    padding-top: 6.8rem;
  }
}

/* Gestaskrefið: stóra spjaldið með −/+ */
.pl-card {
  background: #141313;
  color: #ece8de;
  border-radius: 16px;
  padding: 1.5rem 1.8rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  max-width: 560px;
  margin: 0 auto;
}
.pl-label strong {
  display: block;
  font-family: "Poppins", sans-serif;
  font-size: 1rem;
}
.pl-label span {
  color: #9b968c;
  font-size: 0.85rem;
}
.pl-step {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.pl-btn {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  border: none;
  background: #2b2a27;
  color: #ece8de;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  transition: background 0.2s;
}
.pl-btn:hover {
  background: #cebf95;
  color: #302f2f;
}
.pl-num {
  min-width: 2.4em;
  text-align: center;
  font-family: "Poppins", sans-serif;
  font-size: 1.7rem;
  font-weight: 700;
  background: #fff;
  color: #302f2f;
  border-radius: 12px;
  padding: 0.25em 0.3em;
}
.pl-continue {
  display: block;
  width: min(560px, 100%);
  margin: 2rem auto 0;
  background: #cebf95;
  color: #302f2f;
  /* Gegnsær rammi frá byrjun, svo skiptin úr bíðandi í virkan séu
     litabreyting en ekki stökk í kassastærð (Villi 24/9) */
  border: 1px solid transparent;
  border-radius: 999px;
  font-family: "Poppins", sans-serif;
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  padding: calc(1.15em - 1px);
  cursor: pointer;
  transition:
    background-color 0.22s var(--ease),
    border-color 0.22s var(--ease),
    color 0.22s var(--ease),
    transform 0.18s var(--ease);
}
.pl-continue:hover {
  background: #bfae7f;
  transform: translateY(-2px);
}

/* Dagur & tími í sama glugga */
.bk-dagstimi {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  background: var(--char-2);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 1.8rem;
}
.bk-dt-head {
  font-family: "Poppins", sans-serif;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 1rem;
}
.bk-dt-hint {
  color: var(--muted);
  font-size: 0.95rem;
  padding: 2rem 0;
}
.bk-dagstimi .bk-times {
  max-height: 420px;
  overflow-y: auto;
}
@media (max-width: 800px) {
  .bk-dagstimi {
    grid-template-columns: 1fr;
    padding: 1.2rem;
  }
}

/* Læstur pakki (t.d. fjölskyldutilboð undir 4) */
.pack.choice.laest {
  opacity: 0.55;
  cursor: not-allowed;
}
.bk-laest {
  font-family: "Poppins", sans-serif;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold);
}

/* Lokaskrefið: yfirlitskortið */
.bk-final {
  background: #141313;
  color: #ece8de;
  border-radius: 16px;
  padding: 1.6rem 1.8rem;
  max-width: 560px;
  margin: 0 auto 1.8rem;
}
.bk-final h4 {
  font-family: "Poppins", sans-serif;
  font-size: 0.75rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #cebf95;
  margin-bottom: 1rem;
}
.bk-final-row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid rgba(236, 232, 222, 0.1);
  font-size: 0.95rem;
}
.bk-final-row span {
  color: #9b968c;
}
.bk-final-total {
  display: flex;
  justify-content: space-between;
  padding-top: 1rem;
  font-family: "Poppins", sans-serif;
}
.bk-final-total span {
  font-size: 0.75rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #9b968c;
  align-self: center;
}
.bk-final-total strong {
  font-size: 1.6rem;
  color: #cebf95;
}

/* Val-skjárinn: fjórir stórir */
.bk-val {
  grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 800px) {
  .bk-val {
    grid-template-columns: 1fr;
  }
}
/* ---------- Fókushringur (Villi 24/9) ----------
   Maelt: 21 :focus-reglur voru i sidunni og ENGIN theirra snerti
   bokunartakkana. `kerfi.css` hledst ekki a /boka, svo Chromium teiknadi
   naestum svartan hring a #403C35 flot, osynilegan i raun. Her er einn
   hringur fyrir allt sem tab stoppar a i vélinni, i gulli sem sest.
   `:focus-visible` en ekki `:focus`: musarsmellur faer engan hring,
   lyklabordid faer hann alltaf. */
.bk-app :focus-visible {
  outline: 2px solid var(--gold-bright, #e8dbb4);
  outline-offset: 2px;
}

/* ---------- Röff/töff: dökkt app-þema á bókunina ---------- */
.bk-app {
  background:
    radial-gradient(ellipse at 15% 0%, rgba(211, 195, 152, 0.22), transparent 50%),
    radial-gradient(ellipse at 90% 100%, rgba(168, 131, 79, 0.16), transparent 55%), #35322c;
}
.bk-app .section {
  --ink: #35322c;
  --char: #403c35;
  --char-2: #4a463e;
  --gold: #d3c398;
  --gold-bright: #e8dbb4;
  --bronze: #a8834f;
  --cream: #f2ecdd;
  --muted: #b5ae9f;
  --line: rgba(211, 195, 152, 0.28);
  /* Harlina: sama gull, lagra alfa. Hun var notud a fjorum stodum an thess
     ad vera skilgreind, svo thaer reglur voru ogildar og engin lina sast
     (Villi 24/9: „thad vantar adgreini"). Ekki nyr litur, afleidd vigt. */
  --hair: rgba(211, 195, 152, 0.14);
  background: transparent;
  color: var(--cream);
}
.bk-app .bk-q {
  color: var(--cream);
  font-size: clamp(1.5rem, 3vw, 2.1rem);
  letter-spacing: 0.03em;
}
.bk-app .bk-calday:disabled {
  background: transparent;
  color: rgba(242, 236, 221, 0.28);
}
.bk-app .gw-dot i {
  background: rgba(242, 236, 221, 0.22);
}
.bk-app .gw-dot.done i,
.bk-app .gw-dot.current i {
  background: var(--gold);
  box-shadow: 0 0 12px rgba(211, 195, 152, 0.5);
}
.bk-app .pack.choice {
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.22);
}
.bk-app .pack.choice:hover {
  border-color: var(--gold);
  box-shadow: 0 18px 50px rgba(211, 195, 152, 0.2);
}
.bk-app .pack.choice.selected {
  border-color: var(--gold);
  background: rgba(211, 195, 152, 0.08);
}
.bk-app .bk-dagstimi {
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.22);
}
.bk-app .bk-form input {
  background: #403c35;
  border-color: rgba(211, 195, 152, 0.35);
  color: var(--cream);
}
.bk-app .bk-demonote {
  color: rgba(242, 236, 221, 0.5);
}
.bk-app .bk-groupnote {
  border-color: rgba(211, 195, 152, 0.3);
  color: var(--muted);
}

/* Leikjaröðin í dag & tíma glugganum */
.bk-gamerow {
  margin-top: 1.6rem;
}
.bk-games3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.8rem;
}
.bk-game {
  background: var(--char-2);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 1rem 0.8rem;
  cursor: pointer;
  text-align: center;
  color: var(--cream);
  font-family: inherit;
  transition:
    transform 0.25s var(--ease),
    border-color 0.25s,
    background 0.25s;
}
.bk-game:hover {
  transform: translateY(-3px);
  border-color: var(--gold);
}
.bk-game.selected {
  border-color: var(--gold);
  background: rgba(211, 195, 152, 0.12);
  box-shadow: 0 0 0 1px var(--gold);
}
.bk-game strong {
  display: block;
  font-family: "Poppins", sans-serif;
  font-size: 0.95rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.bk-game span {
  color: var(--muted);
  font-size: 0.8rem;
}
@media (max-width: 600px) {
  .bk-games3 {
    grid-template-columns: 1fr;
  }
}

/* Leikirnir slædast inn frá vinstri þegar dagur er valinn */
@keyframes bkSlida {
  from {
    opacity: 0;
    transform: translateX(-28px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
.bk-gameslide {
  margin-bottom: 1.4rem;
}
.bk-gamescol {
  display: grid;
  gap: 0.6rem;
}
.bk-gamescol .bk-game {
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: left;
  padding: 0.85rem 1.1rem;
  animation: bkSlida 0.45s var(--ease) both;
}
.bk-gamescol .bk-game:nth-child(2) {
  animation-delay: 0.08s;
}
.bk-gamescol .bk-game:nth-child(3) {
  animation-delay: 0.16s;
}
.bk-gamescol .bk-game strong {
  font-size: 0.9rem;
}

/* Vöruhausinn tekur alltaf sama pláss — appið hoppar ekki við leikjaval */
.bk-app .bk-producthead {
  min-height: 128px;
}
.bk-app .bk-producthead.tomur {
  visibility: hidden;
}
@media (max-width: 600px) {
  .bk-app .bk-producthead {
    min-height: 84px;
    margin-bottom: 1.2rem;
  }
}

/* Pílulengdirnar slæda niður undir pílunni */
.bk-pilatimar {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
  padding-left: 1.2rem;
}
@keyframes bkNidur {
  from {
    opacity: 0;
    transform: translateY(-16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.bk-pilatimi {
  background: rgba(211, 195, 152, 0.06);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 0.55rem 0.5rem;
  cursor: pointer;
  color: var(--cream);
  font-family: inherit;
  text-align: center;
  animation: bkNidur 0.55s var(--ease) both;
  transition:
    border-color 0.2s,
    background 0.2s,
    transform 0.2s;
}
.bk-pilatimi:nth-child(2) {
  animation-delay: 0.1s;
}
.bk-pilatimi:nth-child(3) {
  animation-delay: 0.2s;
}
.bk-pilatimi:hover {
  transform: translateY(-2px);
  border-color: var(--gold);
}
.bk-pilatimi.selected {
  border-color: var(--gold);
  background: rgba(211, 195, 152, 0.14);
  box-shadow: 0 0 0 1px var(--gold);
}
.bk-pilatimi strong {
  display: block;
  font-family: "Poppins", sans-serif;
  font-size: 0.85rem;
}
.bk-pilatimi .undir {
  display: block;
  font-style: normal;
  font-family: "Poppins", sans-serif;
  font-size: 0.68rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--gold);
  margin: 0.1rem 0 0.15rem;
}
.bk-pilatimi span {
  color: var(--muted);
  font-size: 0.75rem;
}

/* Borðakortin — borða fyrst / eftir leik */
.bk-bordval {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.2rem;
  max-width: 640px;
  margin: 0 auto;
}
.bk-bordkort {
  position: relative;
  overflow: hidden;
  background: linear-gradient(160deg, var(--char-2), var(--char));
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 2rem 1.6rem 1.7rem;
  cursor: pointer;
  text-align: center;
  color: var(--cream);
  font-family: inherit;
  display: grid;
  gap: 0.45rem;
  justify-items: center;
  /* Sama hreyfimál og annars staðar í vélinni (Villi 24/9): stutt,
     ease-out, lyftan mæld í tveimur pixlum en ekki fimm. */
  transition:
    transform 0.2s var(--ease),
    border-color 0.2s var(--ease),
    box-shadow 0.2s var(--ease);
}
.bk-bordkort::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 0%, rgba(211, 195, 152, 0.16), transparent 65%);
  opacity: 0;
  transition: opacity 0.2s var(--ease);
}
@media (hover: hover) and (pointer: fine) {
  .bk-bordkort:hover {
    transform: translateY(-2px);
    border-color: var(--gold);
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.28);
  }
  .bk-bordkort:hover::before {
    opacity: 1;
  }
}
.bk-bordkort:active {
  transform: scale(0.985);
}
.bk-bordkort.selected {
  border-color: var(--gold);
  box-shadow: 0 0 0 1px var(--gold);
}
.bk-bordkort .tag {
  font-family: "Poppins", sans-serif;
  font-size: 0.78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--gold);
}
/* Klukkan er FYRIRSOGN kortsins (Villi 24/9). Adur var hun grafin inni i
   setningu og kortin lasust eins og tveir textareitir. Nu: kveikja,
   klukka, ein stutt lina, og hvad er laust. */
.bk-bordkort .klukka {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(1.8rem, 3.6vw, 2.4rem);
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--gold-bright);
}
.bk-bordkort .kl {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(2rem, 4.5vw, 2.8rem);
  line-height: 1;
  color: var(--gold-bright);
}
.bk-bordkort .kl small {
  font-size: 0.45em;
  font-weight: 600;
  color: var(--muted);
  vertical-align: 0.5em;
}
.bk-bordkort .note {
  font-size: 0.88rem;
  color: var(--cream);
}
.bk-bordkort .laust {
  margin-top: 0.15rem;
  font-family: "Poppins", sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
}
.bk-bordkort.selected .laust {
  color: var(--gold);
}
.bk-bordnei {
  display: block;
  margin: 1.4rem auto 0;
  background: none;
  border: none;
  color: var(--muted);
  font-family: inherit;
  font-size: 0.9rem;
  text-decoration: underline;
  text-underline-offset: 4px;
  cursor: pointer;
  transition: color 0.2s;
}
.bk-bordnei:hover {
  color: var(--cream);
}
/* Áfram, sleppa tilboðum (29/9): undir tilboðunum á PC, sama textatakki og
   „Nei takk" í borðaskrefinu, nógu hár fyrir fingur */
.bk-tilbod-undir .bk-sleppa-tilbod {
  min-height: 2.75rem;
  margin-top: 0.6rem;
}
/* Bóka aftur á kvittuninni (29/9): hrein ný bókun, sami textatakki */
.bk-done .bk-boka-aftur {
  min-height: 2.75rem;
  margin-top: 1rem;
}
.bk-bordval.eitt {
  grid-template-columns: minmax(0, 320px);
  justify-content: center;
}
@media (max-width: 560px) {
  .bk-bordval {
    grid-template-columns: 1fr;
  }
}

/* Bættu við — kassarnir gerðir girnilegir */
.bk-app .bk-extra {
  position: relative;
  overflow: hidden;
  background: linear-gradient(165deg, var(--char-2), var(--char));
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 1.6rem 1.5rem 1.4rem;
  text-align: center;
  display: grid;
  gap: 0.35rem;
  justify-items: center;
  transition:
    transform 0.3s var(--ease),
    border-color 0.3s,
    box-shadow 0.3s;
}
.bk-app .bk-extra::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% -20%, rgba(211, 195, 152, 0.18), transparent 60%);
  opacity: 0;
  transition: opacity 0.35s;
  pointer-events: none;
}
.bk-app .bk-extra:hover {
  transform: translateY(-5px);
  border-color: var(--gold);
  box-shadow: 0 22px 55px rgba(0, 0, 0, 0.35);
}
.bk-app .bk-extra:hover::before,
.bk-app .bk-extra.active::before {
  opacity: 1;
}
.bk-app .bk-extra.active {
  border-color: var(--gold);
  box-shadow:
    0 0 0 1px var(--gold),
    0 18px 45px rgba(0, 0, 0, 0.3);
}
.bk-app .bk-extra strong {
  font-family: "Poppins", sans-serif;
  font-size: 1.02rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--cream);
}
.bk-app .bk-extra .desc {
  color: var(--muted);
  font-size: 0.85rem;
  margin: 0;
}
.bk-app .bk-extra .price {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 1.35rem;
  color: var(--gold-bright);
  margin-top: 0.2rem;
}
.bk-app .bk-extra .gr-step {
  margin-top: 0.7rem;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  background: rgba(0, 0, 0, 0.25);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0.3rem;
}
.bk-app .bk-extra .gr-step button {
  width: 2.1rem;
  height: 2.1rem;
  border-radius: 50%;
  border: none;
  background: rgba(211, 195, 152, 0.12);
  color: var(--gold-bright);
  font-size: 1.1rem;
  cursor: pointer;
  transition:
    background 0.2s,
    transform 0.15s;
}
.bk-app .bk-extra .gr-step button:hover {
  background: var(--gold);
  color: var(--ink);
  transform: scale(1.08);
}
.bk-app .bk-extra .gr-step input {
  width: 2.6rem;
  text-align: center;
  background: none;
  border: none;
  color: var(--cream);
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-size: 1rem;
}
.bk-app .bk-extra .gr-step input::-webkit-outer-spin-button,
.bk-app .bk-extra .gr-step input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* ---------- Animation-stælar ---------- */
@keyframes bkInn {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.bk-main > * {
  animation: bkInn 0.45s var(--ease) both;
}
.bk-main > *:nth-child(2) {
  animation-delay: 0.06s;
}
.bk-main > *:nth-child(3) {
  animation-delay: 0.12s;
}
.bk-main > *:nth-child(4) {
  animation-delay: 0.18s;
}
.bk-products .pack.choice {
  animation: bkInn 0.5s var(--ease) both;
}
.bk-products .pack.choice:nth-child(1) {
  animation-delay: 0.05s;
}
.bk-products .pack.choice:nth-child(2) {
  animation-delay: 0.12s;
}
.bk-products .pack.choice:nth-child(3) {
  animation-delay: 0.19s;
}
.bk-products .pack.choice:nth-child(4) {
  animation-delay: 0.26s;
}
.bk-summary {
  animation: bkInn 0.5s 0.15s var(--ease) both;
}
.pl-card {
  animation: bkInn 0.45s var(--ease) both;
}
.pl-continue {
  animation: bkInn 0.45s 0.12s var(--ease) both;
}
.bk-final {
  animation: bkInn 0.5s var(--ease) both;
}
#boka-app.bk-noanim *,
#boka-app.bk-noanim {
  animation: none !important;
}
@media (prefers-reduced-motion: reduce) {
  .bk-main > *,
  .bk-products .pack.choice,
  .bk-summary,
  .pl-card,
  .pl-continue,
  .bk-final {
    animation: none;
  }
}

/* ---------- Fyrsti skjárinn: val + gestafjöldi saman (poolhouse) ---------- */
.bk-valgrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem;
  max-width: 640px;
  margin: 0 auto 2.2rem;
}
.bk-valkort {
  position: relative;
  overflow: hidden;
  cursor: pointer;
  aspect-ratio: 16 / 7;
  border-radius: 14px;
  border: 2px solid transparent;
  background-size: cover;
  background-position: center;
  padding: 0;
  font-family: inherit;
  text-align: left;
  transition:
    transform 0.25s var(--ease),
    border-color 0.25s,
    opacity 0.25s;
  animation: bkInn 0.45s var(--ease) both;
}
.bk-valkort:nth-child(2) {
  animation-delay: 0.06s;
}
.bk-valkort:nth-child(3) {
  animation-delay: 0.12s;
}
.bk-valkort:nth-child(4) {
  animation-delay: 0.18s;
}
.bk-valkort {
  /* bakgrunnsmyndin má ekki skína gegnum gegnsæja borðann = ljóti ramminn */
  background-clip: padding-box;
  background-color: #1c1b18;
}
.bk-valkort video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
/* Runuspilun: mjúk krossblöndun á milli vídeóa */
.bk-valkort video.vseq {
  opacity: 0;
  transition: opacity 0.4s ease;
}
.bk-valkort video.vseq.virk {
  opacity: 1;
}
.bk-valkort::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.72), rgba(0, 0, 0, 0.12) 55%);
  transition: opacity 0.25s;
}
.bk-valkort:hover {
  transform: translateY(-3px);
}
.bk-valkort.selected {
  border-color: var(--gold);
}
.bk-valkort:not(.selected) {
  opacity: 0.85;
}
.bk-valkort .nafn {
  position: absolute;
  z-index: 2;
  left: 0.9rem;
  bottom: 0.7rem;
  right: 0.9rem;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 0.98rem;
  color: #fff;
  line-height: 1.2;
}
.bk-valkort .undirn {
  display: block;
  font-style: normal;
  font-weight: 500;
  font-size: 0.72rem;
  color: rgba(255, 255, 255, 0.75);
  letter-spacing: 0.04em;
  margin-top: 0.1em;
}
.bk-valkort .merki {
  position: absolute;
  z-index: 2;
  top: 0.55rem;
  right: 0.55rem;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--gold);
  color: var(--ink);
  font-size: 0.8rem;
  font-weight: 700;
  opacity: 0;
  transform: scale(0.5);
  transition:
    opacity 0.25s,
    transform 0.25s var(--ease);
}
.bk-valkort.selected .merki {
  opacity: 1;
  transform: scale(1);
}
.bk-q2 {
  margin-top: 0.4rem;
  font-size: clamp(1.2rem, 2.4vw, 1.6rem);
}
.bk-app .bk-val-side .pl-card {
  margin-bottom: 1.2rem;
}
.pl-continue:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
@media (max-width: 560px) {
  .bk-valgrid {
    grid-template-columns: 1fr;
  }
  .bk-valkort {
    aspect-ratio: 16 / 6;
  }
}

/* ---------- Afsláttar-lookið (grænt, poolhouse) — notað víðar síðar ---------- */
.bk-app .section {
  --spara: #4cd97b;
}
/* Græna afsláttarpillan flýtur út fyrir hornið uppi hægra megin */
.bk-game {
  position: relative;
  overflow: visible;
}
.bk-combo {
  position: absolute;
  top: -0.65em;
  right: -0.55em;
  z-index: 2;
  padding: 0.22em 0.65em;
  font-style: normal;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.06em;
  border-radius: 100px;
  background: var(--spara);
  color: #10241a;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
}
.bk-spara {
  display: block;
  font-style: normal;
  font-size: 0.75rem;
  color: var(--spara);
  font-weight: 600;
  margin-top: 0.15rem;
}
.bk-spara-note {
  margin-top: 0.3rem;
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-size: 0.85rem;
  color: var(--spara);
}
.bk-sumline-spara span {
  color: var(--spara) !important;
  font-weight: 600;
}
.bk-final-spara span,
.bk-final-spara strong {
  color: var(--spara) !important;
}

/* ---------- Viðburðavalið í vélinni: neon-plakatkortin ---------- */
.bk-evgrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.2rem;
}

/* ---------- Fótboltinn: liðaval + leikjalisti ---------- */
.bk-lidaval {
  display: flex;
  gap: 0.6rem;
  margin: 0 0 1.2rem;
}
.bk-lid {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  padding: 0.6rem 0.8rem;
  border: 1px solid var(--line);
  border-radius: 100px;
  background: var(--char-2);
  cursor: pointer;
  transition: all 0.25s var(--ease);
  font-family: "Poppins", sans-serif;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--cream);
}
.bk-lid img {
  width: 26px;
  height: 26px;
  padding: 3px;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 8px;
  object-fit: contain;
}
.bk-lid:hover {
  border-color: var(--gold);
}
.bk-lid.selected {
  border-color: var(--gold);
  background: rgba(211, 195, 152, 0.08);
}
.bk-leikjalisti {
  margin: 0 0 1.2rem;
}
.bk-leikur {
  display: flex;
  align-items: baseline;
  gap: 0.9rem;
  width: 100%;
  text-align: left;
  padding: 0.7rem 0.9rem;
  margin-bottom: 0.5rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--char-2);
  color: var(--cream);
  cursor: pointer;
  transition: all 0.2s var(--ease);
  font-size: 0.9rem;
}
.bk-leikur:hover {
  border-color: var(--gold);
}
.bk-leikur.selected {
  border-color: var(--gold);
  background: rgba(211, 195, 152, 0.08);
}
.bk-leikur .dags {
  flex: 0 0 auto;
  min-width: 6.5em;
  color: var(--muted);
  font-size: 0.8rem;
}
.bk-leikur strong {
  flex: 1;
}
.bk-leikur .klukkan {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 0.8rem;
}
.bk-komutimar {
  margin-top: 0.2rem;
}
/* Fótboltavaktin í borðaflæðinu */
/* Fotboltavaktin i bordaflaedinu (endurhonnun 24/9). Hun var graen med
   graenni umgjord og las eins og advorun, og leikirnir voru ⚽-linur i
   rod. Nu er hun sama efni og annad i velinni: klukkan fremst, leikurinn
   sem stadreynd, spurningin ein lina. */
.bk-fbvakt {
  margin: 1rem 0 0;
  padding: 1rem 1.2rem 1.1rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--char-2);
}
.bk-fbvakt .bk-q-sub {
  margin: 0.15rem 0;
}
.bk-fbleikur {
  display: grid;
  grid-template-columns: 3.6rem minmax(0, 1fr);
  align-items: center;
  gap: 0.9rem;
  padding: 0.5rem 0;
}
.bk-fbleikur + .bk-fbleikur {
  border-top: 1px solid var(--hair);
}
.bk-fbleikur .kl {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 1.05rem;
  color: var(--gold-bright);
  font-variant-numeric: tabular-nums;
}
.bk-fbleikur .hvad {
  display: grid;
  gap: 0.1rem;
  min-width: 0;
}
.bk-fbleikur .hvad b {
  font-family: "Poppins", sans-serif;
  font-size: 0.98rem;
  color: var(--cream);
}
.bk-fbleikur .hvad em {
  font-style: normal;
  font-size: 0.8rem;
  color: var(--muted);
}
/* Svorin tvo: jafnvaeg, hvorugt er adalkall */
.bk-fbsvar {
  flex: 1 1 10rem;
  padding: 0.7rem 1rem;
  border: 0;
  border-radius: 100px;
  cursor: pointer;
  font-family: "Poppins", sans-serif;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--cream);
  background-color: transparent;
  box-shadow: inset 0 0 0 1px var(--line);
  transition:
    background-color 0.18s var(--ease),
    box-shadow 0.18s var(--ease),
    color 0.18s var(--ease),
    transform 0.16s var(--ease);
}
.bk-fbsvar:active {
  transform: scale(0.97);
}
@media (hover: hover) and (pointer: fine) {
  .bk-fbsvar:hover {
    background-color: rgba(211, 195, 152, 0.1);
    box-shadow: inset 0 0 0 1px var(--gold);
  }
}
.bk-fbsvar.valid {
  color: var(--ink);
  background-color: var(--gold);
  box-shadow: none;
}
/* Maetingin: tveir kostir, klukkan undir */
.bk-fbmaeta-merki {
  margin: 0.9rem 0 0.5rem;
  font-family: "Poppins", sans-serif;
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
}
.bk-fbmaeta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}
.bk-fbmaeta-kostur {
  flex: 1 1 9rem;
  display: grid;
  gap: 0.15rem;
  padding: 0.7rem 1rem;
  text-align: left;
  border: 0;
  border-radius: 14px;
  cursor: pointer;
  color: var(--cream);
  background-color: rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 0 0 1px var(--line);
  transition:
    background-color 0.18s var(--ease),
    box-shadow 0.18s var(--ease),
    transform 0.16s var(--ease);
}
.bk-fbmaeta-kostur:active {
  transform: scale(0.98);
}
@media (hover: hover) and (pointer: fine) {
  .bk-fbmaeta-kostur:hover {
    box-shadow: inset 0 0 0 1px var(--gold);
  }
}
.bk-fbmaeta-kostur strong {
  font-family: "Poppins", sans-serif;
  font-size: 0.95rem;
}
.bk-fbmaeta-kostur span {
  font-size: 0.8rem;
  color: var(--muted);
}
.bk-fbmaeta-kostur.valid {
  background-color: rgba(211, 195, 152, 0.14);
  box-shadow: inset 0 0 0 1px var(--gold);
}
/* Viðburðanótan: gyllt í stað sparnaðargræns */
.bk-vidburdanota {
  border-color: rgba(211, 195, 152, 0.45);
  background: rgba(211, 195, 152, 0.06);
}
/* Fótboltakortið á staðfestingarskrefinu: miðjað og snyrt */
.bk-fbkort {
  max-width: 560px;
  margin: 0 auto 1.4rem;
  padding: 1.3rem 1.5rem 1.4rem;
  text-align: center;
  border-radius: 16px;
}
.bk-fbkort .bk-q-sub {
  margin: 0;
  font-size: 0.95rem;
  color: var(--cream);
}
.bk-fbkort .bk-fbspurning p {
  margin: 0.75rem 0 0.9rem;
  font-family: "Poppins", sans-serif;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold);
}
.bk-fbkort .bk-fbsvor {
  justify-content: center;
}
.bk-fbspurning p {
  margin: 0.6rem 0 0.5rem;
  font-weight: 600;
}
.bk-fbsvor {
  display: flex;
  gap: 0.6rem;
  flex-wrap: wrap;
}
@media (max-width: 640px) {
  .bk-lidaval {
    flex-direction: column;
  }
  .bk-leikur {
    flex-wrap: wrap;
    gap: 0.2rem 0.9rem;
  }
  .bk-leikur .dags {
    min-width: 0;
    width: 100%;
  }
}
.bk-evkort {
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  min-height: 300px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  border: 1px solid rgba(211, 195, 152, 0.2);
  cursor: pointer;
  padding: 0;
  text-align: left;
  font-family: inherit;
  transition:
    transform 0.35s var(--ease),
    box-shadow 0.35s,
    border-color 0.35s;
  animation: bkInn 0.5s var(--ease) both;
}
.bk-evkort:nth-child(2) {
  animation-delay: 0.07s;
}
.bk-evkort:nth-child(3) {
  animation-delay: 0.14s;
}
.bk-evkort:nth-child(4) {
  animation-delay: 0.21s;
}
.bk-evkort:hover {
  transform: translateY(-5px);
  border-color: var(--gold);
  box-shadow: 0 22px 55px rgba(0, 0, 0, 0.5);
}
.bk-evkort.selected {
  border-color: var(--gold);
  box-shadow: 0 0 0 1px var(--gold);
}
.bk-evkort .plakat {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.5s var(--ease);
}
.bk-evkort:hover .plakat {
  transform: scale(1.06);
}
.bk-evkort .plakat b {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  font-size: clamp(1.6rem, 3.2vw, 2.4rem);
  line-height: 0.95;
  text-align: center;
  letter-spacing: 0.02em;
  opacity: 0.85;
  padding: 0 0.5em;
  transform: rotate(-4deg);
}
.bk-evkort.sport .plakat {
  background: radial-gradient(ellipse at 30% 20%, #14532d, #08130c 75%);
}
.bk-evkort.sport .plakat b {
  color: #86efac;
  text-shadow: 0 0 35px rgba(134, 239, 172, 0.5);
}
/* Fótboltakortið: grasvöllur með miðjuhring og miðlínu */
.bk-evkort.fotbolti .plakat {
  background:
    radial-gradient(
      circle at 50% 50%,
      transparent 44px,
      rgba(255, 255, 255, 0.09) 45px,
      rgba(255, 255, 255, 0.09) 47px,
      transparent 48px
    ),
    linear-gradient(
      to bottom,
      transparent calc(50% - 1px),
      rgba(255, 255, 255, 0.09) calc(50% - 1px),
      rgba(255, 255, 255, 0.09) calc(50% + 1px),
      transparent calc(50% + 1px)
    ),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.03) 0 44px, transparent 44px 88px),
    radial-gradient(ellipse at 30% 20%, #14532d, #08130c 75%);
}
.bk-evkort .fb-lidin {
  position: absolute;
  left: 14px;
  bottom: 14px;
  z-index: 2;
  display: flex;
  gap: 0.45rem;
}
.bk-evkort .fb-lidin img {
  width: 34px;
  height: 34px;
  padding: 5px;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 10px;
  object-fit: contain;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.4);
}
.bk-evkort.quiz .plakat {
  background: radial-gradient(ellipse at 70% 25%, #4c1d95, #140b24 75%);
}
.bk-evkort.quiz .plakat b {
  color: #c4b5fd;
  text-shadow: 0 0 35px rgba(196, 181, 253, 0.5);
}
.bk-evkort.tonlist .plakat {
  background: radial-gradient(ellipse at 40% 20%, #9d174d, #1c0710 75%);
}
.bk-evkort.tonlist .plakat b {
  color: #f9a8d4;
  text-shadow: 0 0 35px rgba(249, 168, 212, 0.55);
}
.bk-evkort.bardagi .plakat {
  background: radial-gradient(ellipse at 60% 25%, #7f1d1d, #170707 75%);
}
.bk-evkort.bardagi .plakat b {
  color: #fca5a5;
  text-shadow: 0 0 35px rgba(252, 165, 165, 0.5);
}
.bk-evkort .dags {
  position: absolute;
  top: 0.9rem;
  left: 0.9rem;
  z-index: 2;
  text-align: center;
  background: rgba(19, 18, 16, 0.85);
  border: 1px solid rgba(211, 195, 152, 0.35);
  border-radius: 12px;
  padding: 0.4rem 0.65rem;
  font-family: "Poppins", sans-serif;
  line-height: 1;
}
.bk-evkort .dags strong {
  display: block;
  font-size: 1.35rem;
  font-weight: 700;
  color: #fff;
}
.bk-evkort .dags span {
  font-size: 0.6rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gold);
}
.bk-evkort .efni {
  position: relative;
  z-index: 1;
  display: block;
  padding: 3.5rem 1.2rem 1.2rem;
  background: linear-gradient(to top, rgba(10, 9, 8, 0.92) 30%, transparent);
}
.bk-evkort .efni .titill {
  display: block;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 1.1rem;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 0.2em;
}
.bk-evkort .efni .meta {
  display: block;
  font-size: 0.82rem;
  color: var(--gold);
  font-weight: 600;
  margin-bottom: 0.3em;
}
.bk-evkort .efni .lysing {
  display: block;
  font-size: 0.85rem;
  color: rgba(242, 236, 221, 0.75);
}
@media (max-width: 700px) {
  .bk-evgrid {
    grid-template-columns: 1fr;
  }
  .bk-evkort {
    min-height: 240px;
  }
}

/* Stóri "Næst á dagskrá"-kassinn í viðburðavalinu */
.bk-evnaest {
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  padding: clamp(1.6rem, 3.5vw, 2.6rem);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 1.5rem;
  align-items: center;
  border: 1px solid rgba(211, 195, 152, 0.35);
  background:
    radial-gradient(ellipse at 85% 20%, rgba(140, 60, 200, 0.35), transparent 55%),
    linear-gradient(120deg, #241d2e, #17131c);
  margin-bottom: 2rem;
  animation: bkInn 0.5s var(--ease) both;
}
.bk-evnaest .tagl {
  display: inline-block;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 0.68rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  background: var(--gold);
  color: #131210;
  border-radius: 100px;
  padding: 0.35em 1em;
  margin-bottom: 0.8rem;
}
.bk-evnaest h2 {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  font-size: clamp(1.6rem, 3.8vw, 2.6rem);
  line-height: 1;
  margin: 0 0 0.35em;
  color: #fff;
}
.bk-evnaest .meta {
  color: rgba(242, 236, 221, 0.7);
  font-size: 0.95rem;
  margin: 0;
}
.bk-evklukka {
  display: flex;
  gap: 0.6rem;
  margin: 1.2rem 0 1.4rem;
}
.bk-evklukka div {
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(211, 195, 152, 0.3);
  border-radius: 12px;
  padding: 0.5rem 0.8rem;
  min-width: 3.8rem;
  text-align: center;
}
.bk-evklukka strong {
  display: block;
  font-family: "Poppins", sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  color: #fff;
  font-variant-numeric: tabular-nums;
}
.bk-evklukka span {
  font-size: 0.6rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(242, 236, 221, 0.6);
}
.bk-evnaest .dagsm {
  text-align: center;
  font-family: "Poppins", sans-serif;
  line-height: 1;
  border-left: 1px solid rgba(211, 195, 152, 0.25);
  padding-left: 1.4rem;
}
.bk-evnaest .dagsm strong {
  display: block;
  font-size: clamp(3rem, 6vw, 4.5rem);
  font-weight: 700;
  color: var(--gold);
}
.bk-evnaest .dagsm span {
  font-size: 0.9rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(242, 236, 221, 0.7);
}
.bk-evnaest .plakatmynd {
  display: block;
  width: clamp(240px, 30vw, 460px);
  border-radius: 14px;
  border: 1px solid rgba(211, 195, 152, 0.35);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
}
@media (max-width: 700px) {
  .bk-evnaest {
    grid-template-columns: 1fr;
  }
  .bk-evnaest .dagsm {
    border-left: none;
    padding-left: 0;
    text-align: left;
  }
  .bk-evnaest .plakatmynd {
    width: 100%;
  }
}

/* ---------- Svítuvalið: grand Stella Artois þema ---------- */
.bk-sv-tagl {
  text-align: center;
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-size: 0.78rem;
  letter-spacing: 0.5em;
  text-transform: uppercase;
  color: #c8102e;
  margin: 0 0 0.2rem;
  text-indent: 0.5em;
}
.bk-sv-heading {
  margin-bottom: 0.3rem !important;
  font-size: clamp(2rem, 4.5vw, 3rem) !important;
  letter-spacing: 0.06em !important;
}
.bk-sv-sub {
  text-align: center;
  color: var(--muted);
  margin: 0 0 2rem;
  font-size: 0.98rem;
}
.bk-svgrid {
  display: grid;
  gap: 1.2rem;
}
.bk-svkort {
  position: relative;
  overflow: hidden;
  cursor: pointer;
  text-align: left;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(1.2rem, 3vw, 2.4rem);
  align-items: center;
  padding: clamp(1.5rem, 3.5vw, 2.4rem);
  border-radius: 20px;
  border: 1px solid rgba(211, 195, 152, 0.4);
  background:
    radial-gradient(ellipse at 90% 10%, rgba(200, 16, 46, 0.28), transparent 55%),
    radial-gradient(ellipse at 5% 100%, rgba(211, 195, 152, 0.12), transparent 50%),
    linear-gradient(120deg, #2b0e14, #160709);
  color: #f2ecdd;
  font-family: inherit;
  box-shadow:
    inset 0 0 0 1px rgba(211, 195, 152, 0.08),
    0 14px 40px rgba(0, 0, 0, 0.4);
  transition:
    transform 0.35s var(--ease),
    border-color 0.35s,
    box-shadow 0.35s;
  animation: bkInn 0.5s var(--ease) both;
}
.bk-svgrid .bk-svkort:nth-child(2) {
  animation-delay: 0.08s;
}
.bk-svgrid .bk-svkort:nth-child(3) {
  animation-delay: 0.16s;
}
.bk-svkort:hover {
  transform: translateY(-5px);
  border-color: var(--gold);
  box-shadow:
    inset 0 0 0 1px rgba(211, 195, 152, 0.2),
    0 24px 60px rgba(0, 0, 0, 0.55),
    0 0 40px rgba(211, 195, 152, 0.12);
}
.bk-svkort.selected {
  border-color: var(--gold);
  box-shadow:
    0 0 0 1px var(--gold),
    0 18px 45px rgba(0, 0, 0, 0.45);
}
.bk-svkort .stort {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  line-height: 0.85;
  font-size: clamp(3.2rem, 8vw, 6rem);
  color: var(--gold);
  text-shadow: 0 0 45px rgba(211, 195, 152, 0.35);
  min-width: 2.2em;
  text-align: center;
}
.bk-svkort .stort small {
  display: block;
  font-size: 0.22em;
  font-weight: 600;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: rgba(242, 236, 221, 0.6);
  margin-top: 0.3em;
}
.bk-svkort .innihald {
  display: block;
}
.bk-svkort .nafn {
  display: block;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(1.15rem, 2.4vw, 1.5rem);
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 0.25em;
}
.bk-svkort .badge {
  display: inline-block;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 0.62rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  background: #c8102e;
  color: #fff;
  border-radius: 100px;
  padding: 0.35em 1em;
  margin-bottom: 0.5em;
}
.bk-svkort .verd {
  display: block;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 1.25rem;
  color: var(--gold);
  margin-bottom: 0.4em;
}
.bk-svkort .verd small {
  font-weight: 400;
  font-size: 0.75em;
  color: var(--muted);
}
.bk-svkort .lysing {
  display: block;
  color: rgba(242, 236, 221, 0.75);
  font-size: 0.92rem;
  margin-bottom: 0.7em;
}
.bk-svkort .inni {
  display: grid;
  gap: 0.25em;
}
.bk-svkort .inni span {
  font-size: 0.85rem;
  color: rgba(242, 236, 221, 0.65);
}
@media (max-width: 640px) {
  .bk-svkort {
    grid-template-columns: 1fr;
    text-align: left;
  }
  .bk-svkort .stort {
    text-align: left;
    min-width: 0;
  }
}

/* ---------- Fyrirsögnin á fyrsta skjá: tvær línur, sú seinni gyllt ---------- */
.bk-valq {
  line-height: 1.15;
  margin-bottom: 2rem !important;
}
.bk-valq .lina1 {
  display: block;
  font-family: "Source Sans 3", sans-serif;
  font-weight: 400;
  font-size: clamp(0.95rem, 1.8vw, 1.15rem);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 0.35em;
}
.bk-valq .lina2 {
  display: block;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(1.7rem, 4vw, 2.6rem);
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--gold);
}

/* ---------- Fjöldateljarinn: poolhouse-kassinn ----------
   Dökkur ferkantaður kassi (mjúk horn), svartir hringtakkar og hvítur
   tölukassi — eins og hjá poolhouse. */
.bk-app .pl-card {
  background: rgba(26, 20, 16, 0.85);
  border: 1px solid rgba(211, 195, 152, 0.12);
  border-radius: 14px;
  padding: 0.85rem 1rem 0.85rem 1.5rem;
  max-width: 460px;
  margin-left: auto;
  margin-right: auto;
  color: var(--cream);
}
.bk-app .pl-card .pl-label strong {
  font-size: 1rem;
  color: #fff;
}
.bk-app .pl-card .pl-label span {
  font-size: 0.74rem;
  color: var(--muted);
}
.bk-app .pl-step {
  gap: 0.55rem;
}
.bk-app .pl-btn {
  background: rgba(0, 0, 0, 0.65);
  color: #fff;
  border: none;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  font-size: 1.2rem;
  cursor: pointer;
  transition:
    transform 0.2s var(--ease),
    background 0.2s;
}
.bk-app .pl-btn:hover {
  transform: scale(1.08);
  background: #000;
}
.bk-app .pl-num {
  background: transparent;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.85);
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 1.25rem;
  min-width: 2.7rem;
  padding: 0.35rem 0;
  text-align: center;
  border-radius: 10px;
  transition:
    background 0.25s,
    color 0.25s,
    border-color 0.25s;
}
.bk-app .pl-num:hover {
  background: rgba(0, 0, 0, 0.6);
  color: rgba(255, 255, 255, 0.65);
  border-color: rgba(255, 255, 255, 0.55);
}

/* takkinn þegar kominn = engin teygju-animation */
.bk-fjoldi.strax .pl-card,
.bk-fjoldi.strax .bk-fjoldi-q,
.bk-fjoldi.strax .pl-continue {
  animation: none;
}

/* Fjöldahlutinn: teygist út frá miðju þegar leikur/borð er valið */
@keyframes bkTeygja {
  0% {
    opacity: 0;
    transform: scaleX(0.04);
  }
  55% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: scaleX(1);
  }
}
.bk-fjoldi {
  transform-origin: center;
}
.bk-fjoldi .pl-card {
  animation: bkTeygja 1.8s var(--ease) both;
  transform-origin: center;
}
.bk-fjoldi .bk-fjoldi-q {
  animation: bkInn 0.9s 0.5s var(--ease) both;
}
.bk-fjoldi .pl-continue {
  animation: bkInn 0.9s 1.1s var(--ease) both;
}
.bk-fjoldi-q {
  font-size: clamp(1rem, 1.9vw, 1.25rem) !important;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-family: "Poppins", sans-serif;
  margin-bottom: 1.1rem !important;
}

/* ---------- Stella-logoið í svítuvalinu ---------- */
.bk-sv-logo {
  display: block;
  margin: 0 auto 0.8rem;
  width: clamp(150px, 22vw, 220px);
  height: auto;
  filter: drop-shadow(0 6px 30px rgba(200, 16, 46, 0.35));
  animation: bkInn 0.5s var(--ease) both;
}

/* Flettigluggi rástímanna: 4 tímar í einu, flett með örvum */
.bk-flettir {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  max-width: 640px;
  margin: 0 auto;
}
.bk-fletta {
  flex: none;
}
.bk-fletta:disabled {
  opacity: 0.35;
  cursor: default;
}
.bk-fletta:disabled:hover {
  background: var(--char-2);
  color: var(--gold);
  border-color: var(--line);
}
.bk-flettir-gluggi {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.8rem;
  flex: 1;
  min-width: 0;
}
@media (max-width: 480px) {
  .bk-flettir-gluggi {
    gap: 0.5rem;
  }
  .bk-flettir-gluggi .bk-time {
    padding: 0.7rem 0.2rem;
  }
}

/* Staðfestingargluggi á golftímanum — situr YFIR tímaslottunum í sama
   dökka útliti og vélin, teygist út frá miðju í báðar áttir */
.bk-timasvaedi {
  position: relative;
}
.bk-modal {
  position: absolute;
  inset: 0;
  z-index: 30;
  display: grid;
  place-items: center;
}
.bk-modal-bak {
  position: absolute;
  inset: -0.5rem;
  background: rgba(10, 9, 8, 0.66);
  backdrop-filter: blur(3px);
  border-radius: var(--radius);
}
.bk-modal-kort {
  position: relative;
  background: var(--char-2);
  border: 1px solid var(--gold);
  border-radius: 22px;
  padding: 1.6rem 2rem;
  text-align: center;
  max-width: min(360px, 92%);
  animation: bkModalInn 0.4s cubic-bezier(0.22, 0.9, 0.3, 1) both;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.55);
}
@keyframes bkModalInn {
  from {
    transform: scaleX(0.05);
    opacity: 0;
  }
  to {
    transform: none;
    opacity: 1;
  }
}
.bk-modal-kort h3 {
  font-family: "Poppins", sans-serif;
  font-size: 1.4rem;
  color: var(--gold);
  margin: 0 0 0.3rem;
}
.bk-modal-kort p {
  color: var(--muted);
  margin: 0 0 1.2rem;
}
.bk-modal-kort .btn.solid {
  width: 100%;
  justify-content: center;
  cursor: pointer;
}
.bk-modal-undir {
  color: var(--muted);
  font-size: 0.85rem;
  margin: 0.7rem 0 0 !important;
}
.bk-modal-haetta {
  display: block;
  margin: 0.9rem auto 0;
  background: none;
  border: 0;
  color: var(--muted);
  font: inherit;
  font-size: 0.85rem;
  text-decoration: underline;
  cursor: pointer;
}
.bk-modal-haetta:hover {
  color: var(--cream);
}

/* ---------- Tilboðspakkarnir: compact landscape-kort (skref 4) ---------- */
.bk-pakkar {
  display: grid;
  gap: 0.9rem;
  max-width: 720px;
  margin: 0 auto;
}
.bk-pakki {
  position: relative;
  display: flex;
  align-items: center;
  gap: 1rem;
  background: var(--char-2);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 0.85rem 1rem;
  cursor: pointer;
  user-select: none;
  text-align: left;
  transition:
    border-color 0.25s,
    background 0.25s,
    box-shadow 0.25s;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.22);
}
.bk-pakki:hover {
  border-color: var(--gold);
  box-shadow: 0 18px 50px rgba(211, 195, 152, 0.2);
}
.bk-pakki.selected {
  border-color: var(--gold);
  background: rgba(211, 195, 152, 0.08);
}
.bk-pakki.laest {
  opacity: 0.5;
  cursor: default;
}
.bk-pakki.laest:hover {
  border-color: var(--line);
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.22);
}
.bk-pakki-mynd {
  width: 64px;
  height: 64px;
  flex: 0 0 64px;
  object-fit: cover;
  border-radius: calc(var(--radius) - 6px);
  border: 1px solid var(--line);
}
.bk-pakki-efni {
  flex: 1;
  min-width: 0;
}
.bk-pakki-nafn {
  font-family: "Poppins", sans-serif;
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 0 0 0.25rem;
}
.bk-pakki-inni {
  margin: 0 0 0.35rem;
  font-size: 0.82rem;
  color: var(--muted);
  line-height: 1.5;
}
.bk-pakki-punktur {
  color: var(--gold);
  margin: 0 0.45em;
}
.bk-pakki-verd {
  margin: 0;
  font-size: 0.95rem;
  color: var(--cream);
}
.bk-pakki-verd .was {
  text-decoration: line-through;
  color: var(--muted);
  font-size: 0.82rem;
  margin-right: 0.5em;
}
.bk-pakki-verd strong {
  color: var(--cream);
  font-weight: 700;
}
.bk-pakki-verd small {
  color: var(--muted);
}
.bk-pakki-spar {
  display: inline-block;
  margin-left: 0.7em;
  color: #4cd97b;
  font-size: 0.8rem;
  font-weight: 600;
}
.bk-pakki-afsl {
  position: absolute;
  top: -9px;
  right: 12px;
  background: #4cd97b;
  color: #10241a;
  font-family: "Poppins", sans-serif;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0.15rem 0.55rem;
  border-radius: 100px;
  letter-spacing: 0.05em;
}
/* Einn gylltur pilla a skja (Villi 24/9). Thessi takki var fylltur gulli,
   nakvaemlega eins og AFRAM, og stod nedst i syna svidinu thegar rastimi
   var valinn. Eini heili takkinn i sjonmali var tha sa VALFRJALSI, sem er
   falskur botn. Tilbodid stendur afram a sinum stad, en thad ber nu
   utlinutakka: sama letur, sama form, minni vigt. Engir nyir litir. */
.bk-pakki-velja {
  flex: 0 0 auto;
  font-family: "Poppins", sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  color: var(--cream);
  background-color: transparent;
  box-shadow: inset 0 0 0 1px var(--line);
  padding: 0.45rem 0.9rem;
  border-radius: 100px;
  transition:
    background-color 0.18s var(--ease),
    box-shadow 0.18s var(--ease),
    transform 0.16s var(--ease);
}
.bk-pakki-velja:active {
  transform: scale(0.97);
}
@media (hover: hover) and (pointer: fine) {
  .bk-pakki-velja:hover {
    background-color: rgba(211, 195, 152, 0.1);
    box-shadow: inset 0 0 0 1px var(--gold);
  }
}
/* Valid tilbod ber gullid, thvi tha er thad stadreynd en ekki bod */
.bk-pakki.selected .bk-pakki-velja {
  color: var(--ink);
  background-color: var(--gold);
  box-shadow: none;
}
.bk-pakki.laest .bk-pakki-velja {
  background: var(--line);
  color: var(--muted);
}
.bk-pakki .bk-laest {
  margin: 0.3rem 0 0;
  font-size: 0.78rem;
  color: var(--muted);
}
/* Sími: kortið raðast í hreint grid — mynd + efni hlið við hlið,
   VELJA sem breiður takki neðst (fix Villa 23/7, „spotless í mobil") */
@media (max-width: 640px) {
  .bk-pakki {
    display: grid;
    grid-template-columns: 68px 1fr;
    grid-template-areas:
      "mynd efni"
      "velja velja";
    gap: 0.4rem 0.9rem;
    align-items: start;
    padding: 1rem;
  }
  .bk-pakki-mynd {
    grid-area: mynd;
    width: 68px;
    height: 68px;
  }
  .bk-pakki-efni {
    grid-area: efni;
  }
  .bk-pakki-nafn {
    padding-right: 2.6rem; /* pláss fyrir afsláttarborðann í horninu */
  }
  .bk-pakki-verd {
    margin-top: 0.15rem;
  }
  .bk-pakki-spar {
    display: block;
    margin: 0.15rem 0 0;
  }
  .bk-pakki-velja {
    grid-area: velja;
    text-align: center;
    padding: 0.6rem 0.9rem;
    margin-top: 0.4rem;
  }
}

/* Borðaskref: villunóta þegar borðið náðist ekki */
.bk-bordvilla {
  color: #d99;
  font-style: normal;
  font-size: 0.85em;
}

/* Staðfestingarglugginn í síma: minni spássíur og tímasvæðið heldur
   hæð svo kortið komist fyrir yfir slottunum */
@media (max-width: 640px) {
  .bk-modal-kort {
    padding: 1.2rem 1.1rem;
    max-width: 94%;
  }
  .bk-modal-kort h3 {
    font-size: 1.15rem;
  }
  .bk-timasvaedi:has(.bk-modal) {
    min-height: 320px;
  }
}

/* ---------- Hópefli-kortið undir valgrindinni (27/7) ---------- */
/* Fyrirsögnin eins og „hvað langar ykkur að gera?" — sama stærð OG gull */
.bk-hopefli-q {
  margin-top: 0.4rem;
  margin-bottom: 0.4rem;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(1.7rem, 4vw, 2.6rem) !important;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--gold) !important;
}
.bk-hopefli-sub {
  text-align: center;
  color: var(--muted);
  font-size: 0.92rem;
  max-width: 520px;
  margin: 0 auto 1.2rem;
  line-height: 1.55;
}
.bk-hopefli {
  max-width: 640px;
  margin: 0 auto 2.2rem;
  display: flex;
  justify-content: center;
}
.bk-hopefli .bk-valkort {
  /* sama breidd og eitt kort í 2×2 grindinni — miðjað á hana */
  width: calc(50% - 0.45rem);
  display: block;
  text-decoration: none;
}
@media (max-width: 560px) {
  .bk-hopefli .bk-valkort {
    width: 100%;
  }
}

/* ---------- Sætavalið á viðburðum: sætakort salarins ---------- */
.bk-saeta-tel {
  display: flex;
  align-items: baseline;
  gap: 1rem;
  flex-wrap: wrap;
  color: var(--cream, #f2ecdd);
  font-weight: 600;
  margin: 0 0 0.8rem;
}
.bk-saeta-skyring {
  font-size: 0.82rem;
  font-weight: 400;
  color: rgba(242, 236, 221, 0.55);
}
.bk-salur-ramma {
  border: 1px solid rgba(211, 195, 152, 0.3);
  border-radius: 16px;
  background: rgba(0, 0, 0, 0.25);
  padding: 0.8rem;
  overflow-x: auto;
}
.bk-salur {
  width: 100%;
  min-width: 700px;
  display: block;
}
.bk-salur .svid {
  fill: var(--gold, #d3c398);
}
.bk-salur .svid-t {
  fill: #131210;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 15px;
  text-anchor: middle;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.bk-salur .skilrum {
  fill: rgba(242, 236, 221, 0.45);
}
.bk-salur .sula {
  fill: rgba(242, 236, 221, 0.25);
}
.bk-salur .bord {
  fill: rgba(242, 236, 221, 0.08);
  stroke: rgba(211, 195, 152, 0.4);
}
.bk-salur .bord-t {
  fill: rgba(242, 236, 221, 0.55);
  font-family: "Poppins", sans-serif;
  font-size: 11px;
  text-anchor: middle;
}
.bk-salur .bord-t.inni {
  font-size: 14px;
  font-weight: 600;
  fill: rgba(242, 236, 221, 0.7);
}
.bk-salur .saeti {
  cursor: pointer;
  transition: fill 0.15s;
}
.bk-salur .saeti.laust {
  fill: rgba(242, 236, 221, 0.15);
  stroke: rgba(211, 195, 152, 0.7);
}
.bk-salur .saeti.laust:hover {
  fill: rgba(211, 195, 152, 0.45);
}
.bk-salur .saeti.valid {
  fill: var(--gold, #d3c398);
  stroke: var(--gold, #d3c398);
}
.bk-salur .saeti.tekid {
  fill: rgba(224, 92, 92, 0.3);
  stroke: rgba(224, 92, 92, 0.5);
  cursor: not-allowed;
}
.bk-salur .bord.uppselt {
  fill: rgba(224, 92, 92, 0.12);
  stroke: rgba(224, 92, 92, 0.4);
}
.bk-salur .bord-t.uppselt-t {
  fill: rgba(240, 140, 140, 0.85);
}
.bk-salur .bord-frat {
  fill: rgba(240, 140, 140, 0.9);
  font-family: "Poppins", sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-anchor: middle;
}
.bk-saeta-valin {
  color: var(--gold, #d3c398);
  font-weight: 600;
  margin: 0.8rem 0 0;
}
.bk-saetin {
  margin-top: 0.4rem;
}
.bk-actions .btn.solid:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

/* Sætareglurnar: leiðbeining + Veldu fyrir mig */
.bk-saeta-regla {
  color: #f0b429;
  font-size: 0.9rem;
  font-weight: 600;
  margin: 0.5rem 0 0;
}
.bk-saeta-auto {
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  cursor: pointer;
  color: var(--gold, #d3c398);
  background: none;
  border: 1px solid rgba(211, 195, 152, 0.5);
  border-radius: 100px;
  padding: 0.45em 1.2em;
  margin-left: auto;
  transition: all 0.2s;
}
.bk-saeta-auto:hover {
  background: var(--gold, #d3c398);
  color: #131210;
}

/* ---------- Miðinn: /midi/MG-XXXXXX ---------- */
.bk-midi {
  max-width: 460px;
  margin: 0 auto;
  text-align: center;
  border: 1px solid rgba(211, 195, 152, 0.4);
  border-radius: 20px;
  background: rgba(0, 0, 0, 0.3);
  padding: 0 0 1.8rem;
  overflow: hidden;
}
.bk-midi-plakat {
  width: 100%;
  display: block;
  margin-bottom: 1.4rem;
}
.bk-midi-tagl {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 0.68rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold, #d3c398);
  margin: 0 0 0.3rem;
}
.bk-midi-heiti {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  font-size: clamp(1.6rem, 5vw, 2.2rem);
  color: #fff;
  margin: 0 1rem 0.2rem;
}
.bk-midi-meta {
  color: rgba(242, 236, 221, 0.7);
  margin: 0 0 1.2rem;
}
.bk-midi-linur {
  border-top: 1px dashed rgba(211, 195, 152, 0.35);
  margin: 0 1.4rem;
}
.bk-midi-linur div {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  padding: 0.8rem 0;
  border-bottom: 1px dashed rgba(211, 195, 152, 0.35);
}
.bk-midi-linur span {
  font-size: 0.78rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(242, 236, 221, 0.55);
}
.bk-midi-linur strong {
  color: #f2ecdd;
  text-align: right;
}
.bk-midi-linur strong.gull {
  color: var(--gold, #d3c398);
  font-size: 1.1rem;
}
.bk-midi-texti {
  color: rgba(242, 236, 221, 0.7);
  margin: 1.2rem 1.4rem 0;
}
.bk-midi-bid {
  color: rgba(242, 236, 221, 0.7);
  padding: 2rem;
}
.bk-midi-hlekkur {
  margin-top: 0.9rem;
}

/* Skjáareglan (9/9): leikur sem víkur af skjánum — sýnilegur en óvirkur */
.bk-leikur.vikur {
  opacity: 0.45;
  cursor: not-allowed;
}
.bk-leikur.vikur:hover {
  transform: none;
  border-color: inherit;
}
.bk-leikur.vikur .klukkan {
  font-style: italic;
}

/* =====================================================================
   Bókunarflæðið 21/9: „kortið opnast". UX breyting, sama útlit og fyrr.
   Valkortið opnast á sínum stað með leik, lengd, fjölda, verði og takka.
   Skrefin eru fjögur: Hvað, Hvenær, Aukalega, Staðfesta.
   ===================================================================== */

/* ---------- Fyrsti skjárinn ---------- */
.bk-valq {
  margin-bottom: 1.4rem;
}
.bk-valgrid {
  max-width: 900px;
  margin-bottom: 1rem;
}
.bk-valverd {
  position: absolute;
  z-index: 2;
  top: 0.6rem;
  right: 0.6rem;
  padding: 0.3em 0.8em;
  border-radius: 100px;
  background-color: rgba(21, 20, 18, 0.8);
  color: var(--gold);
  font-family: "Poppins", sans-serif;
  font-size: 0.68rem;
  font-weight: 600;
}
/* Eitthvað er opið: opna kortið fer efst í fulla breidd, hin þrjú minnka í
   eina röð undir því og dofna, þau eru enn einn smellur í burtu */
.bk-valgrid.opid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.bk-valgrid.opid > .bk-valkort {
  aspect-ratio: 16 / 6;
  opacity: 0.6;
  animation: none;
}
.bk-valgrid.opid > .bk-valkort:hover,
.bk-valgrid.opid > .bk-valkort:focus-visible {
  opacity: 1;
}
.bk-valgrid.opid > .bk-valkort .undirn,
.bk-valgrid.opid > .bk-valkort .bk-valverd {
  display: none;
}
.bk-opid {
  order: -1;
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.7fr);
  border: 2px solid var(--gold);
  border-radius: 16px;
  overflow: hidden;
  background: var(--char-2);
  color: var(--cream);
  transform-origin: 50% 0;
  animation: bkOpnast 0.28s var(--ease) both;
}
@keyframes bkOpnast {
  from {
    opacity: 0;
    transform: scale(0.97) translateY(8px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}
.bk-opid > .bk-valkort {
  aspect-ratio: auto;
  min-height: 100%;
  border: 0;
  border-radius: 0;
  cursor: default;
  animation: none;
}
.bk-opid > .bk-valkort:hover {
  transform: none;
}
.bk-opid > .bk-valkort .merki {
  right: auto;
  left: 0.7rem;
  top: 0.7rem;
  width: 1.9rem;
  height: 1.9rem;
}
.bk-opid > .bk-valkort .nafn {
  font-size: 1.25rem;
}
.bk-opid-efni {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1.4rem 1.6rem;
  min-width: 0;
}
.bk-opid-efni .bk-dt-head {
  margin: 0 0 0.6rem;
}
.bk-opid-kostir {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.7rem;
}
.bk-opid-kostir.dalkur {
  grid-template-columns: 1fr;
}
.bk-opid-kostir .bk-game {
  min-height: 3rem;
  padding: 0.75rem 0.9rem;
  text-align: left;
}
.bk-opid-kostir .bk-game:hover {
  transform: none;
}
.bk-opid-kostir .bk-game strong {
  font-size: 0.82rem;
}
.bk-opid-kostir .bk-game.rod {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}
.bk-opid-kostir.dalkur .bk-game strong {
  display: flex;
  justify-content: space-between;
  gap: 0.8rem;
}
.bk-opid-kostir.dalkur .bk-game strong b {
  color: var(--gold);
  white-space: nowrap;
}
.bk-opid-lengd {
  animation: bkNidur 0.22s var(--ease) both;
}
.bk-opid-rod {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.bk-opid-texti .bk-dt-head {
  margin-bottom: 0.15rem;
}
.bk-opid-texti span {
  color: var(--muted);
  font-size: 0.82rem;
}
.bk-opid-texti a {
  color: var(--gold);
  font-size: 0.82rem;
  margin-left: 0.5em;
}
.bk-opid-rod .pl-step {
  gap: 0.6rem;
}
.bk-opid-rod .pl-btn {
  width: 3rem;
  height: 3rem;
  flex-shrink: 0;
}
.bk-opid-rod .pl-num {
  background-color: transparent;
  color: var(--cream);
  border: 1px solid var(--cream);
  font-size: 1.25rem;
  min-width: 2.6em;
}
.bk-opid-lysing {
  color: var(--muted);
  margin: 0;
}
.bk-opid-fotur {
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-top: 1px solid var(--line);
  padding-top: 1rem;
}
.bk-opid-verd {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.bk-opid-verd strong {
  font-family: "Poppins", sans-serif;
  font-size: 1.6rem;
  line-height: 1.15;
  color: var(--gold);
  font-variant-numeric: tabular-nums;
}
.bk-opid-verd span {
  color: var(--muted);
  font-size: 0.85rem;
}
.bk-opid-verd span.spara {
  color: var(--spara);
  font-weight: 600;
}
.bk-opid-fotur .pl-continue {
  width: auto;
  min-width: 15rem;
  flex-shrink: 0;
  margin: 0;
  animation: none;
}
/* Takkinn bíður: segir hvað vantar í stað þess að vera dauður */
.pl-continue.bidur {
  background-color: rgba(211, 195, 152, 0.14);
  color: var(--gold);
  border-style: dashed;
  border-color: rgba(211, 195, 152, 0.5);
  cursor: default;
}
.pl-continue.bidur:hover {
  background-color: rgba(211, 195, 152, 0.14);
  transform: none;
}
.pl-continue:active:not(.bidur) {
  transform: scale(0.98);
}
.bk-hopstrimill {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  max-width: 900px;
  min-height: 3.2rem;
  margin: 0 auto 1rem;
  padding: 0.7rem 1.2rem;
  box-sizing: border-box;
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--cream);
  text-decoration: none;
  transition: border-color 0.2s;
}
.bk-hopstrimill:hover {
  border-color: var(--gold);
}
.bk-hopstrimill strong {
  font-family: "Poppins", sans-serif;
  font-size: 0.8rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold);
  margin-right: 0.8em;
}
.bk-hopstrimill small {
  font-size: 1em;
}
.bk-hopstrimill em {
  font-style: normal;
  font-weight: 600;
  color: var(--gold);
  white-space: nowrap;
}

/* ---------- Samhengislínan efst á skrefum 2 til 4 ---------- */
.bk-samhengi {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 1.6rem;
  padding: 0.3rem 0.35rem 0.3rem 1.2rem;
  box-sizing: border-box;
  border: 1px solid var(--line);
  border-radius: 100px;
  color: var(--cream);
  font-weight: 600;
  font-size: 0.95rem;
}
.bk-samhengi .bk-change {
  min-height: 2.75rem;
  padding: 0 1.1em;
  font-size: 0.75rem;
}

/* ---------- Hvenær: dagaræma, klukkustundir, píla ---------- */
.bk-dagstimi.einn {
  grid-template-columns: minmax(0, 1fr);
  gap: 1.4rem;
}
.bk-dagstimi.einn .bk-dt-col {
  min-width: 0;
}
.bk-raema {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 0.5rem;
}
.bk-raemudagur {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.1rem;
  min-height: 4rem;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: none;
  color: var(--cream);
  font-family: "Poppins", sans-serif;
  cursor: pointer;
  transition:
    background-color 0.15s,
    border-color 0.15s,
    color 0.15s;
}
.bk-raemudagur span {
  font-size: 0.66rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.8;
}
.bk-raemudagur strong {
  font-size: 1.1rem;
}
.bk-raemudagur.sidar {
  border-style: dashed;
}
.bk-raemudagur.sidar strong {
  font-size: 0.72rem;
}
.bk-raemudagur:hover:not(:disabled) {
  border-color: var(--gold);
}
.bk-raemudagur.selected {
  background-color: var(--gold);
  border-color: var(--gold);
  color: var(--ink);
}
.bk-raemudagur:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}
.bk-dagatal {
  max-width: 420px;
  margin: 1.2rem auto 0;
  animation: bkNidur 0.22s var(--ease) both;
}
.bk-dt-dagur {
  color: var(--muted);
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: none;
}
.bk-klst {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0.9rem;
}
.bk-klst-pilla {
  position: relative;
  min-width: 3.6rem;
  min-height: 3rem;
  padding: 0 0.9rem;
  border-radius: 100px;
  border: 1px solid var(--line);
  background: none;
  color: var(--cream);
  font-family: "Poppins", sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition:
    background-color 0.15s,
    border-color 0.15s,
    color 0.15s;
}
.bk-klst-pilla:hover {
  border-color: var(--gold);
}
.bk-klst-pilla.selected {
  background-color: var(--gold);
  border-color: var(--gold);
  color: var(--ink);
}
.bk-klst-pilla.fullt {
  color: var(--muted);
  text-decoration: line-through;
  opacity: 0.55;
}
/* Valinn tími býr í annarri klukkustund en þeirri sem er opin */
.bk-klst-pilla.medval:not(.selected) {
  border-color: var(--gold);
  color: var(--gold);
}
/* ---------------------------------------------------------
   Rástímarnir: skref tvö af tímavalinu (Villi 24/9)
   Í síma er þetta óbreytt, tímarnir standa alltaf opnir undir
   pillunum. Á PC vex hólfið út úr spjaldinu: 0fr → 1fr lætur
   HÆÐINA sjálfa hreyfast, svo allt fyrir neðan, sívalingurinn
   og Áfram, færist niður í sömu hreyfingu í stað þess að hoppa.
   --------------------------------------------------------- */
.bk-rastimar-merki {
  display: none;
}
.bk-rastimar:not(.opin) > div {
  display: none;
}
/* Sími ber stutta formið, PC fullt klukkuform (Villi 24/9) */
.bk-klst-langt {
  display: none;
}
@media (min-width: 861px) {
  .bk-rastimar {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.3s var(--ease);
  }
  .bk-rastimar.opin {
    grid-template-rows: 1fr;
  }
  .bk-rastimar > div,
  .bk-rastimar:not(.opin) > div {
    display: block;
    min-height: 0;
    overflow: hidden;
  }
  /* Innihaldið fylgir á eftir hæðinni, annars birtast fjörutíu
     takkar í fullri skerpu áður en hólfið hefur opnast */
  .bk-rastimar .bk-times,
  .bk-rastimar-merki {
    opacity: 0;
    transform: translateY(-4px);
    transition:
      opacity 0.2s var(--ease),
      transform 0.2s var(--ease);
  }
  .bk-rastimar.opin .bk-times,
  .bk-rastimar.opin .bk-rastimar-merki {
    opacity: 1;
    transform: none;
    transition-delay: 0.08s;
  }
  .bk-rastimar-merki {
    display: block;
    margin: 0 0 0.6rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
  }
  .bk-klst-stutt {
    display: none;
  }
  /* Beinagrindin speglar tvö skrefin: bara pilluröðin, engir tímar.
     Sýndi hún tólf tímablokkir hrundi spjaldið um 260 px um leið og
     svarið kom, því á PC birtast engir tímar fyrr en bil er valið. */
  .bk-beinagrind .bk-times {
    display: none;
  }
  .bk-beinagrind .bk-klst {
    margin-bottom: 0;
  }
  .bk-klst-langt {
    display: inline;
    font-variant-numeric: tabular-nums;
  }
  /* Pillan er ákvörðun, ekki flipi. Hún á að svara undir fingrinum. */
  .bk-klst-pilla {
    transition:
      background-color 0.16s var(--ease),
      border-color 0.16s var(--ease),
      color 0.16s var(--ease),
      transform 0.16s var(--ease);
  }
  .bk-klst-pilla:active:not(:disabled) {
    transform: scale(0.97);
  }
  .bk-klst-pilla:disabled {
    cursor: not-allowed;
  }
  .bk-klst-pilla:disabled:hover {
    border-color: var(--line);
  }
  /* Fellihreyfingin sér um birtinguna, gamla bkInn stekkur ofan í hana */
  .bk-klukkur .bk-times {
    animation: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .bk-rastimar,
  .bk-rastimar .bk-times,
  .bk-rastimar-merki,
  .bk-layout[data-skref="dagstimi"] .bk-dagstimi.einn .bk-timar {
    transition: none;
  }
}
.bk-dagstimi.einn .bk-times {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  max-height: none;
  overflow: visible;
}
.bk-klukkur .bk-times {
  animation: bkInn 0.2s var(--ease) both;
}
/* Valinn tími fyllist gulli, eins og valinn dagur */
.bk-dagstimi.einn .bk-time.selected {
  background-color: var(--gold);
  border-color: var(--gold);
}
.bk-dagstimi.einn .bk-time.selected strong {
  color: var(--ink);
}
.bk-dagstimi.einn .bk-times {
  max-width: none;
  margin: 0;
  gap: 0.5rem;
}
.bk-time:active:not(:disabled) {
  transform: scale(0.97);
}
.bk-pilurod {
  margin-top: 1.4rem;
  padding-top: 1.2rem;
  border-top: 1px solid var(--line);
  animation: bkNidur 0.25s var(--ease) both;
}
/* Fyrir golfid / eftir golfid (Villi 24/9). Adur var merkingin mjor dalkur
   vinstra megin, 3,4 rem, og textinn brotnadi i thrjar linur: "Eftir /
   golfid, fra / kl. 14:05". Tvo ord ofan vid rodina lesast i einu. */
.bk-pilulina {
  margin-top: 1rem;
}
.bk-pilulina h5 {
  margin: 0 0 0.55rem;
  font-family: "Poppins", sans-serif;
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
}

/* ---------- Aukalega: þrír kaflar á einum skjá ---------- */
.bk-aukakafli {
  background: var(--char-2);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 1.3rem 1.4rem;
  margin-bottom: 1rem;
  color: var(--cream);
}
.bk-aukakafli .bk-dt-head {
  margin: 0 0 0.9rem;
}
.bk-aukakafli .bk-q-sub {
  text-align: left;
}
.bk-aukakafli .bk-bordnei {
  min-height: 2.75rem;
  margin-top: 0.8rem;
}
.bk-aukakafli .bk-bordnei.selected {
  color: var(--gold);
}
.bk-aukakafli .bk-pakkar,
.bk-aukakafli .bk-extras {
  margin: 0;
}
.bk-aukakafli .bk-extras {
  grid-template-columns: 1fr;
}
.bk-fleiritilbod {
  display: block;
  min-height: 2.75rem;
  margin-top: 0.4rem;
  padding: 0;
  background: none;
  border: none;
  color: var(--gold);
  font-family: inherit;
  font-size: 0.9rem;
  cursor: pointer;
  text-align: left;
}
.bk-fleiritilbod:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* ---------- Takkinn í yfirlitinu og stikan neðst í síma ---------- */
.bk-summary .pl-continue.bk-sum-afram {
  width: 100%;
  margin: 1.1rem 0 0;
  animation: none;
}
.bk-total strong,
.bk-stika-texti strong {
  font-variant-numeric: tabular-nums;
}
.bk-stika {
  display: none;
}
@media (max-width: 1024px) {
  .bk-stika {
    position: fixed;
    z-index: 60;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 0.7rem 0.9rem calc(0.7rem + env(safe-area-inset-bottom));
    background-color: #151412;
    color: var(--cream);
    border-top: 1px solid var(--line);
    animation: bkStikaUpp 0.28s var(--ease) both;
  }
  .bk-stika-texti {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
  }
  .bk-stika-texti span {
    font-size: 0.8rem;
    color: var(--muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .bk-stika-texti strong {
    font-family: "Poppins", sans-serif;
    font-size: 1.2rem;
    color: var(--gold);
  }
  .bk-stika .pl-continue {
    width: auto;
    margin: 0;
    padding: 1em 1.4em;
    font-size: 0.75rem;
    min-height: 3rem;
    white-space: nowrap;
    animation: none;
  }
  /* Takkarnir í efninu víkja fyrir stikunni */
  .bk-opid-fotur .pl-continue,
  .bk-summary .pl-continue.bk-sum-afram {
    display: none;
  }
  .bk-section:has(.bk-stika) {
    padding-bottom: 6.5rem;
  }
  /* Spjallbólan víkur á meðan stikan er uppi, hún sat ofan á fjöldanum og
     tímunum. Hún er áfram á öllum öðrum síðum og á breiðum skjá. */
  body:has(.bk-stika) .mg-chat {
    display: none;
  }
}
@keyframes bkStikaUpp {
  from {
    transform: translateY(100%);
  }
  to {
    transform: translateY(0);
  }
}
@media (max-width: 700px) {
  .bk-valgrid.opid {
    grid-template-columns: 1fr;
  }
  .bk-valgrid.opid > .bk-valkort {
    aspect-ratio: auto;
    min-height: 3.6rem;
  }
  .bk-opid {
    grid-template-columns: 1fr;
  }
  .bk-opid > .bk-valkort {
    min-height: 5.5rem;
  }
  .bk-opid > .bk-valkort .merki {
    left: auto;
    right: 0.7rem;
  }
  .bk-opid-efni {
    padding: 1rem;
  }
  .bk-opid-kostir {
    grid-template-columns: 1fr;
  }
  .bk-opid-kostir .bk-game {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
  }
  .bk-opid-lengd .bk-opid-kostir {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .bk-opid-lengd .bk-game.rod {
    flex-direction: column;
    gap: 0.1rem;
  }
  .bk-opid-fotur {
    border-top: 0;
    padding-top: 0;
  }
  .bk-opid-verd {
    display: none;
  }
  .bk-opid-texti a {
    display: none;
  }
  .bk-hopstrimill small {
    display: none;
  }
  .bk-raema {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .bk-dagstimi.einn .bk-times {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .bk-klst {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 0.2rem;
    scrollbar-width: none;
  }
  .bk-klst-pilla {
    flex: 0 0 auto;
  }
  .bk-samhengi {
    width: 100%;
    font-size: 0.85rem;
  }
}
@media (prefers-reduced-motion: reduce) {
  .bk-opid,
  .bk-opid-lengd,
  .bk-dagatal,
  .bk-pilurod,
  .bk-klukkur .bk-times,
  .bk-stika {
    animation: none;
  }
}

/* =====================================================================
   22/9: lokafínpúss í síma. Borðið er eigið skref, yfirlit á undan
   skráningu, combóið með tveimur númeruðum tímavölum, og leturkerfið
   samræmt við vefinn (style.css: Poppins 700 uppercase á fyrirsagnir,
   Poppins 600 uppercase 0.14em á takka, Source Sans 3 á texta).
   ===================================================================== */

/* Tímatakkarnir erfðu Arial úr vafranum, ekki letur síðunnar */
.bk-time {
  font-family: inherit;
}

/* ---------- Combóið: 1 minigolf, 2 píla ---------- */
.bk-tvival-haus {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin-bottom: 0.8rem;
}
.bk-tvival-haus .bk-dt-head {
  margin: 0;
}
.bk-tvival-nr {
  flex: 0 0 auto;
  width: 1.7rem;
  height: 1.7rem;
  border-radius: 50%;
  border: 1px solid var(--gold);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 0.78rem;
  color: var(--gold);
  transition:
    background-color 0.2s,
    color 0.2s,
    opacity 0.2s;
}
/* Lokið skref: fyllt gulli með haki */
.bk-tvival.golfvalid > .bk-tvival-haus:first-child .bk-tvival-nr,
.bk-tvival-haus.pila.valid .bk-tvival-nr {
  background-color: var(--gold);
  color: var(--ink);
}
.bk-tvival-haus.pila {
  margin-top: 1.3rem;
  padding-top: 1.2rem;
  border-top: 1px solid var(--line);
  /* Blaðið rennur hingað þegar golfið er valið, fyrirsögnin límd efst má ekki hylja */
  scroll-margin-top: 5.6rem;
}
/* Pílan bíður þar til golfið er valið */
.bk-tvival-haus.pila:not(.virk) {
  opacity: 0.5;
}
.bk-tvival-valid {
  margin-left: auto;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 1rem;
  color: var(--cream);
  font-variant-numeric: tabular-nums;
}
.bk-tvival-haus .bk-change {
  min-height: 2.5rem;
  padding: 0 1em;
}
.bk-pilulina + .bk-pilulina {
  margin-top: 1.2rem;
}

/* ---------- Borðið: tvö kort, valið er ótvírætt, sama val aftur afvelur ---------- */
.bk-bordkort .merki {
  position: absolute;
  top: 0.7rem;
  right: 0.7rem;
  width: 1.6rem;
  height: 1.6rem;
  border-radius: 50%;
  background-color: var(--gold);
  color: var(--ink);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 0.8rem;
  opacity: 0;
  transform: scale(0.5);
  transition:
    opacity 0.2s,
    transform 0.25s var(--ease);
}
.bk-bordkort.selected {
  background: rgba(211, 195, 152, 0.16);
  border-color: var(--gold);
  box-shadow: inset 0 0 0 1px var(--gold);
}
.bk-bordkort.selected .merki {
  opacity: 1;
  transform: scale(1);
}
.bk-bordkort:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.bk-bordkort:disabled:hover {
  transform: none;
  border-color: var(--line);
  box-shadow: none;
}
.bk-bordkort .kl {
  font-size: 1.5rem;
  margin-top: 0.2rem;
}
.bk-bordtimar {
  max-width: 640px;
  margin: 1.4rem auto 0;
  animation: bkNidur 0.25s var(--ease) both;
}
.bk-bordtimar .bk-times {
  max-width: none;
  gap: 0.5rem;
}
/* Valinn borðatími fyllist gulli eins og aðrir valdir tímar */
.bk-bordtimar .bk-time.selected {
  background-color: var(--gold);
  border-color: var(--gold);
}
.bk-bordtimar .bk-time.selected strong {
  color: var(--ink);
}

/* ---------- Yfirlitið sem skref ---------- */
.bk-yfirlit > h3,
.bk-yfirlit > ul {
  display: none;
}
.bk-yfirlit .bk-sumrow {
  padding: 0.75rem 0;
}
.bk-yfirlit .bk-sumrow strong {
  font-size: 1rem;
}
.bk-yfirlit .bk-change {
  min-height: 2.5rem;
  padding: 0 1em;
}
.bk-yfirlit .bk-total strong {
  font-size: 1.5rem;
}
@media (min-width: 861px) {
  .bk-yfirlit {
    max-width: 640px;
    margin: 0 auto;
    background: var(--char-2);
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 1.2rem 1.6rem;
    color: var(--cream);
  }
  .bk-main > .bk-sum-afram {
    max-width: 640px;
    margin: 1.4rem auto 0;
  }
}

/* ---------- Sími: leturkerfið ---------- */
@media (max-width: 860px) {
  /* Stikan ber takkann og frátektina í síma, blaðið endurtekur hvorugt */
  .bk-main > .bk-sum-afram,
  .bk-yfirlit .bk-hold {
    display: none;
  }

  /* Undirfyrirsagnir: gyllta, breiða Poppins-línan, alls staðar eins */
  .bk-layout .bk-dt-head,
  .bk-layout .bk-aukakafli .bk-dt-head {
    font-size: 0.78rem;
    letter-spacing: 0.16em;
  }
  /* Valkostir: Poppins 700 uppercase á heitið, Source Sans á verðið */
  .bk-layout .bk-game strong {
    font-size: 0.92rem;
    letter-spacing: 0.06em;
  }
  .bk-layout .bk-game span {
    font-size: 0.85rem;
  }
  .bk-time strong {
    font-size: 1rem;
  }
  .bk-raemudagur strong {
    font-size: 1.05rem;
  }
  .bk-extra strong {
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
  }
  /* Takkar: sama og .btn á vefnum */
  .pl-continue,
  .bk-stika .pl-continue {
    font-weight: 600;
    font-size: 0.78rem;
    letter-spacing: 0.14em;
  }
  .bk-change {
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 0.66rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }
  .bk-stika-texti span {
    font-size: 0.82rem;
  }
  .bk-stika-texti strong {
    font-size: 1.15rem;
  }

  /* Borðakortin í síma: þéttari, vinstri jöfnuð, ekkert svif undir fingri */
  .bk-bordval {
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }
  .bk-bordkort {
    text-align: left;
    padding: 1rem 2.8rem 1rem 1.1rem;
    gap: 0.3rem;
  }
  .bk-bordkort:hover {
    transform: none;
    box-shadow: none;
  }
  .bk-bordkort.selected:hover {
    box-shadow: inset 0 0 0 1px var(--gold);
  }
  .bk-bordkort .tag {
    font-size: 0.82rem;
  }
  .bk-bordkort .note {
    font-size: 0.88rem;
  }
  .bk-bordtimar .bk-times {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media (prefers-reduced-motion: reduce) {
  .bk-bordtimar,
  .bk-bordkort .merki {
    animation: none;
    transition: none;
  }
}

/* =====================================================================
   22/9 síðdegis, eftir prófun Villa á símanum: ekkert hopp á meðan tímar
   eru sóttir, blaðið rennur alltaf að næsta verki, læsilegri texti, og
   fjöldablaðið fékk stórt tal og hraðval í stað auðs pláss.
   ===================================================================== */

/* ---------- Beinagrind: sama stærð og grindin sem kemur ---------- */
.bk-beinagrind .bk-klst-pilla,
.bk-beinagrind .bk-time {
  display: block;
  border-color: transparent;
  background-color: rgba(211, 195, 152, 0.08);
  animation: bkPuls 1.1s ease-in-out infinite alternate;
}
.bk-beinagrind .bk-klst-pilla {
  width: 3.6rem;
}
.bk-beinagrind .bk-time {
  /* sama hæð og alvöru tímatakki (57 px mælt), svo ekkert hoppi við skiptin */
  min-height: 3.55rem;
}
@keyframes bkPuls {
  from {
    opacity: 0.55;
  }
  to {
    opacity: 1;
  }
}
/* Tímadálkurinn heldur lágmarkshæð svo blaðið hoppi ekki milli daga */
.bk-dagstimi.einn .bk-timar {
  min-height: 15rem;
  scroll-margin-top: 5.4rem;
}
.bk-dagstimi.einn .bk-dt-col.bk-timar .bk-dt-hint {
  padding: 1.2rem 0;
}

@media (max-width: 860px) {
  /* Læsilegt: 16 til 17 px á allan brauðtexta, ekkert undir 15 px */
  .bk-layout .bk-dt-hint,
  .bk-layout .bk-opid-texti span,
  .bk-layout .bk-opid-lysing,
  .bk-yfirlit .bk-sumline {
    font-size: 1rem;
  }
  .bk-layout .bk-dt-head,
  .bk-layout .bk-aukakafli .bk-dt-head {
    font-size: 0.86rem;
    letter-spacing: 0.14em;
  }
  .bk-layout .bk-game strong {
    font-size: 1rem;
  }
  .bk-layout .bk-game span {
    font-size: 0.95rem;
  }
  .bk-time strong {
    font-size: 1.1rem;
  }
  .bk-time span {
    font-size: 0.78rem;
  }
  .bk-raemudagur span {
    font-size: 0.74rem;
  }
  .bk-raemudagur strong {
    font-size: 1.15rem;
  }
  .bk-klst-pilla {
    font-size: 1.02rem;
  }
  .bk-change {
    font-size: 0.72rem;
  }
  .bk-backlink {
    font-size: 0.88rem;
  }
  .pl-continue,
  .bk-stika .pl-continue {
    font-size: 0.82rem;
  }
  .bk-stika-texti span {
    font-size: 0.92rem;
  }
  .bk-stika-texti strong {
    font-size: 1.2rem;
  }
  .bk-bordkort .tag {
    font-size: 0.9rem;
  }
  .bk-bordkort .note {
    font-size: 0.98rem;
  }
  .bk-yfirlit .bk-sumrow .lbl {
    font-size: 0.7rem;
  }
  .bk-yfirlit .bk-sumrow strong {
    font-size: 1.06rem;
  }
  .bk-tvival-valid {
    font-size: 1rem;
  }
  .bk-pakki-inni,
  .bk-pakki-verd,
  .bk-extra .desc {
    font-size: 0.95rem;
  }
}
@media (prefers-reduced-motion: reduce) {
  .bk-beinagrind .bk-klst-pilla,
  .bk-beinagrind .bk-time {
    animation: none;
  }
}

/* ---------- Desktop (Villi 22/9): ekkert hliðarspjald, allt í einni súlu.
   Samhengislínan efst ber frátektina og verðið, Áfram-takkinn fylgir
   skrefinu. Síminn (≤860px) er óbreyttur: stikan neðst ber þetta þar. ---------- */
@media (min-width: 861px) {
  .bk-layout .bk-summary {
    display: none;
  }
  .bk-layout {
    grid-template-columns: 1fr;
  }
  .bk-layout.skref .bk-main {
    width: 100%;
    max-width: 860px;
    margin: 0 auto;
  }
  .bk-samhengi {
    gap: 1.1rem;
    padding-left: 1.4rem;
  }
  /* Línan situr inni í skrefinu, beint fyrir ofan Áfram (Villi 24/9) */
  .bk-main > .bk-samhengi {
    margin: 1.6rem auto 0;
  }
  .bk-layout.stadfesta .bk-main > .bk-samhengi {
    margin-right: 0;
  }
  .bk-samhengi-auki {
    position: relative;
    padding-left: 1.1rem;
    white-space: nowrap;
  }
  .bk-samhengi-auki::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    height: 1.1em;
    width: 1px;
    background: var(--line);
    transform: translateY(-50%);
  }
  .bk-samhengi-hald {
    color: var(--muted);
    font-weight: 500;
    font-variant-numeric: tabular-nums;
  }
  .bk-samhengi-verd {
    color: var(--gold);
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-size: 1.05rem;
    font-variant-numeric: tabular-nums;
  }
  /* Fyrsta skrefið: opna kortið stendur eitt, hin þrjú víkja */
  .bk-valgrid.opid > .bk-valkort {
    display: none;
  }
  /* „12 eða fleiri? Hópapakkar" fer af fjöldalínunni á PC (Villi 23/9),
     Hópefli-línan neðar segir það sama */
  .bk-opid-texti a {
    display: none;
  }
  /* Pílulengdin fær loft frá leikjavalinu, fyrirsögnin lá ofan á kössunum */
  .bk-opid-lengd {
    margin-top: 1.1rem;
  }
  /* Borðskrefið: sama leturstærð og annars staðar, var varla læsilegt */
  .bk-bordval {
    max-width: 720px;
    gap: 1.4rem;
  }
  .bk-bordkort .tag {
    font-size: 0.9rem;
  }
  .bk-bordkort .note {
    font-size: 1.02rem;
    line-height: 1.5;
    color: var(--cream);
    opacity: 0.85;
  }
  .bk-bordtimar .bk-dt-head {
    font-size: 0.9rem;
  }
}
@media (max-width: 860px) {
  .bk-samhengi-auki {
    display: none;
  }
}

/* ---------- Tilboðin inni í Hvenær-spjaldinu undir tímunum (23/9) ---------- */
.bk-tilbod-undir {
  margin-top: 1.4rem;
  padding-top: 1.4rem;
  border-top: 1px solid var(--line);
}
/* Samhengislínan: tvær línur, valið og hvenær (yfirlitsskrefið er farið) */
.bk-samhengi-val {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  line-height: 1.25;
}
.bk-samhengi-val small.bk-samhengi-auki {
  padding-left: 0;
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--muted);
  white-space: normal;
}
.bk-samhengi-val small.bk-samhengi-auki::before {
  display: none;
}

/* ---------- Skipt um dag án hökts (23/9): gamla grindin dofnar á meðan
   nýi dagurinn kemur (úr skyndiminni yfirleitt samstundis) ---------- */
.bk-grind {
  transition: opacity 0.18s ease;
}
.bk-grind.skiptir {
  opacity: 0.45;
  pointer-events: none;
}

/* Eitt borðakort (hitt ekki í boði): stendur eitt í miðjunni (23/9) */
.bk-bordval:has(> :only-child) {
  grid-template-columns: minmax(0, 1fr);
  max-width: 420px;
}

/* Til baka í flútti við efnið á skrefinu (Villi 23/9): sömu breidd og
   Hópefli-línan á fyrsta skrefi og borðakortin á Borð-skrefinu */
.bk-main > .bk-back,
.bk-main .bk-back {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}
.bk-bordval + .bk-back,
.bk-bordtimar + .bk-back,
.bk-bordval ~ .bk-back {
  max-width: 640px;
}
.bk-bordval:has(> :only-child) ~ .bk-back {
  max-width: 420px;
}

/* ---------- Lokaskrefið á PC (endurhannað 23/9, sjá
   design/boka/lokaskref.html) ----------
   Kvittunin vinstra megin er eini flöturinn á skjánum, hægri hliðin er
   það sem er eftir að gera og hefur engan flöt. Frátektin stendur yfir
   báðum dálkunum. Einstaklingur auðkennir sig og fer þá sjálfkrafa áfram,
   fyrirtæki auðkennir sig ekki og fær takkann.
   Letur, reitir og takkar eru sömu gildi og annars staðar í vélinni.
   Síminn (≤860px) er óbreyttur. */
.bk-stadf-pc {
  display: none;
}
.bk-hold-yfir {
  display: none;
}
@media (min-width: 861px) {
  /* Takkinn stendur FYRIR MIÐJU á öllum skrefum. Hann var hægrijafnaður
     hér fyrir lokaskrefið eitt, en reglan lak yfir öll hin og setti
     „Áfram" út í kant undir „Má bjóða ykkur borð?" (Villi 23/9). */
  .bk-main > .bk-sum-afram {
    width: auto;
    min-width: 15rem;
    max-width: none;
    margin: 1.4rem auto 0;
  }
  .bk-layout.stadfesta .bk-main > .bk-sum-afram {
    margin: 1.4rem 0 0 auto;
  }
  .bk-layout.stadfesta {
    grid-template-columns: 420px 420px;
    gap: 48px;
    max-width: 888px;
    margin: 0 auto;
    align-items: start;
  }
  .bk-layout.stadfesta .bk-summary {
    display: block;
    order: -1;
    position: static;
  }
  .bk-layout.stadfesta .bk-main {
    max-width: none;
    margin: 0;
  }
  .container:has(.bk-layout.stadfesta) > .bk-samhengi {
    display: none;
  }
  .bk-layout.stadfesta .bk-stadf-simi {
    display: none;
  }
  /* Fyrirsagnirnar tvær eru jafningjar */
  .bk-layout.stadfesta .bk-stadf-pc {
    display: block;
    text-align: left;
    font-size: 1.25rem;
    margin-bottom: 1.1rem;
  }
  .bk-layout.stadfesta .bk-gestur {
    max-width: none;
    margin-left: 0;
    margin-right: 0;
  }
  /* Formið hefur engan flöt, kvittunin ein ber flötinn á skjánum */
  .bk-layout.stadfesta .bk-innskraning {
    padding: 0;
    background: none;
    border: 0;
    border-radius: 0;
  }
  .bk-layout.stadfesta .bk-main .bk-back {
    text-align: left;
    max-width: none;
    margin-left: 0;
  }
  /* Takkinn fyllir dálkinn og til baka stendur undir honum */
  .bk-layout.stadfesta .bk-actions {
    display: flex;
    flex-direction: column-reverse;
    align-items: stretch;
    gap: 1.3rem;
    margin-top: 1.2rem;
  }
  .bk-layout.stadfesta .bk-actions .btn.solid {
    width: 100%;
    justify-content: center;
  }
  .bk-layout.stadfesta .bk-nocharge {
    text-align: center;
    margin-top: 0.8rem;
  }

  /* Frátektin stendur yfir dálkunum á PC, svo hún er tekin úr
     kvittuninni þar. Síminn heldur sinni inni í yfirlitinu. */
  .bk-layout.stadfesta .bk-summary .bk-hold {
    display: none;
  }
  /* Frátektin: kerfisskilaboð yfir dálkunum */
  .bk-hold-yfir {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    max-width: 888px;
    margin: 0 auto 1.1rem;
    text-align: left;
  }
  .bk-hold-yfir svg {
    flex: 0 0 auto;
    color: var(--gold);
  }
  .bk-hold-yfir strong {
    margin-left: auto;
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--gold-bright);
  }
}

/* ---------- Kvittunin ---------- */
.bk-kv-rod {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.33rem 0;
  font-size: 1rem;
  color: var(--cream);
}
.bk-kv-takn {
  flex: 0 0 auto;
  color: var(--gold);
  opacity: 0.75;
}
.bk-yfirlit .bk-kv-rod + .bk-sumlines,
.bk-kv-rod + .bk-sumlines {
  margin-top: 1.1rem;
  padding-top: 1.1rem;
  border-top: 1px solid var(--line);
}
.bk-kv-trygging {
  margin: 1rem 0 0;
  font-size: 0.85rem;
  line-height: 1.55;
  color: var(--muted);
}

/* ---------- Einstaklingur eða fyrirtæki ---------- */
.bk-hver {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  height: 3.2rem;
  padding: 0.3rem;
  margin-bottom: 1.1rem;
  background: rgba(0, 0, 0, 0.28);
  border: 1px solid var(--line);
  border-radius: 999px;
}
.bk-hver-pilla {
  position: absolute;
  top: 0.3rem;
  bottom: 0.3rem;
  left: 0.3rem;
  width: calc(50% - 0.3rem);
  border-radius: 999px;
  background: #cebf95;
  transition: transform 0.32s var(--ease);
}
.bk-hver-pilla[data-hver="fyrirt"] {
  transform: translateX(100%);
}
.bk-hver button {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  background: none;
  border: 0;
  cursor: pointer;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--muted);
  transition: color 0.32s var(--ease);
}
.bk-hver button.on {
  color: #302f2f;
}

/* ---------- Fyrirtækjaformið ---------- */
.bk-fyrirt {
  display: grid;
  gap: 0.8rem;
  margin-bottom: 0.4rem;
}
.bk-reitur {
  display: grid;
  gap: 0.35rem;
}
.bk-reitur > span {
  font-family: "Poppins", sans-serif;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gold);
}
.bk-reitur input {
  width: 100%;
  box-sizing: border-box;
  min-height: 3.2rem;
  padding: 0 1rem;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: rgba(0, 0, 0, 0.28);
  color: var(--cream);
  font-family: "Source Sans 3", sans-serif;
  font-size: 1.05rem;
}
.bk-reitur input:focus {
  outline: none;
  border-color: var(--gold);
}
/* Villa við reit stendur vinstra megin eins og merkin fyrir ofan hana,
   ekki í miðju eins og villur skrefsins sjálfs */
.bk-fyrirt > .bk-error {
  margin: -0.5rem 0 0;
  text-align: left;
}
/* Nafnið úr fyrirtækjaskránni er staðfesting, ekki reitur */
.bk-ft-stadfest {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  margin-top: -0.2rem;
  padding: 0.85rem 1rem;
  background: rgba(211, 195, 152, 0.08);
  border: 1px solid var(--line);
  border-radius: 12px;
}
.bk-ft-hak {
  flex: 0 0 auto;
  width: 1.4rem;
  height: 1.4rem;
  border-radius: 50%;
  background: #cebf95;
  display: grid;
  place-items: center;
  color: #302f2f;
}
.bk-ft-nafn {
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-size: 1.05rem;
  color: var(--cream);
  line-height: 1.25;
}
.bk-ft-bid {
  margin: -0.2rem 0 0;
  font-size: 0.85rem;
  color: var(--muted);
}

/* ---------- Auðkenningarleiðirnar þrjár ----------
   Þéttar, tákn yfir orði, engir risatakkar. Þær eru ekki til fyrr en
   númerið er orðið gilt, þá opnast rúmið og innihaldið sest í það. */
.mg-inn-reitur-hopur {
  display: grid;
  gap: 0.35rem;
}
.mg-inn-merki {
  font-family: "Poppins", sans-serif;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gold);
}
.mg-inn-opnast {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transition:
    grid-template-rows 0.18s var(--ease),
    opacity 0.12s linear;
}
.mg-inn-opnast > div {
  overflow: hidden;
  transform: translateY(-4px);
  transition: transform 0.18s var(--ease);
}
.mg-inn-opnast.opin {
  grid-template-rows: 1fr;
  opacity: 1;
  transition:
    grid-template-rows 0.26s var(--ease),
    opacity 0.18s linear 0.07s;
}
.mg-inn-opnast.opin > div {
  transform: translateY(0);
  transition: transform 0.26s var(--ease) 0.04s;
}
.mg-inn-spurt {
  margin: 1rem 0 0.7rem;
  font-size: 0.95rem;
  color: var(--muted);
}
/* Íslensku leiðirnar tvær búa í eigin dálki. Erlent númer fellir dálkinn
   saman í 0fr og SMS-flísin rennur út í plássið, engin stökk og enginn
   valkostur sem á ekki við gestinn. */
.mg-inn-flisar {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 0.55rem;
  transition: grid-template-columns 0.34s cubic-bezier(0.22, 1, 0.36, 1);
}
/* Leiðirnar liggja beint undir símareitnum, spurningin sem skildi eftir
   1,7 rem bil er farin (Villi 24/9) */
.mg-inn-opnast .mg-inn-flisar {
  margin-top: 0.7rem;
}
.mg-inn-isl {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.55rem;
  min-width: 0;
  transition:
    opacity 0.17s linear,
    transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}
.mg-inn-flisar.ein {
  grid-template-columns: minmax(0, 12rem) 0fr;
}
.mg-inn-isl.burt {
  opacity: 0;
  transform: translateX(-6px);
  pointer-events: none;
  overflow: hidden;
}
@media (prefers-reduced-motion: reduce) {
  .mg-inn-flisar,
  .mg-inn-isl {
    transition-duration: 0.01s;
  }
  .mg-inn-isl.burt {
    transform: none;
  }
}
.mg-inn-flis {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 5.1rem;
  padding: 0.7rem 0.4rem;
  cursor: pointer;
  background: rgba(0, 0, 0, 0.2);
  border: 1px solid var(--line);
  border-radius: 12px;
  transition:
    border-color 0.22s var(--ease),
    background-color 0.22s var(--ease),
    transform 0.22s var(--ease);
}
.mg-inn-flis .mg-inn-takn {
  display: block;
  color: var(--gold);
}
.mg-inn-flis-nafn {
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-size: 0.78rem;
  line-height: 1.2;
  color: var(--cream);
  text-align: center;
}
.mg-inn-flis:active {
  transform: scale(0.985);
}
/* Biðstaða: leiðirnar slokkna um leið og ein er ræst, sú valda ber
   snúðinn í stað táknsins svo flísin haldi nákvæmlega sömu hæð */
.mg-inn-flis[disabled],
.mg-inn-leid[disabled] {
  cursor: default;
  opacity: 0.4;
}
.mg-inn-flis.bidur,
.mg-inn-leid.bidur {
  opacity: 1;
  border-color: var(--gold);
}
.mg-inn-snuda {
  display: block;
  width: 21px;
  height: 21px;
  box-sizing: border-box;
  border: 2px solid var(--gold);
  border-top-color: transparent;
  border-radius: 50%;
  animation: bk-snuningur 0.62s linear infinite;
}
@media (prefers-reduced-motion: reduce) {
  .mg-inn-snuda {
    animation-duration: 1.6s;
  }
}
@media (hover: hover) and (pointer: fine) {
  .mg-inn-flis:hover {
    border-color: var(--gold);
    background: rgba(211, 195, 152, 0.08);
  }
}

/* ---------- Biðstaða á takka (tvísmellavörn, 23/9) ----------
   Textinn stendur kyrr og heldur breidd takkans, snúðurinn leggst ofan á
   hann. Ekkert hnikast til þótt aðgerðin taki sekúndu. */
.bk-bidur {
  position: relative;
  cursor: progress;
}
/* Textinn hverfur en heldur plássinu sínu, svo breidd takkans haggast
   ekki og snúðurinn stendur einn eftir */
.bk-bidur .bk-bidur-texti {
  opacity: 0;
  transition: opacity 0.16s var(--ease);
}
.bk-snuda {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1.15rem;
  height: 1.15rem;
  margin: -0.575rem 0 0 -0.575rem;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 50%;
  animation: bk-snuningur 0.62s linear infinite;
}
@keyframes bk-snuningur {
  to {
    transform: rotate(360deg);
  }
}
/* Línan undir takkanum skiptir um texta á meðan beðið er — fast lágmark
   svo skiptin hreyfi ekki það sem er fyrir neðan */
.bk-nocharge {
  min-height: 1.4em;
}
@media (prefers-reduced-motion: reduce) {
  .bk-snuda {
    animation-duration: 1.6s;
  }
}

/* ---------- Nýr gestur, framhald af auðkenningunni ----------
   Númerið er staðfest og stendur efst, svo aðeins það sem vantar. Sömu
   reitir og fyrirtækjaformið hinum megin við pilluna. */
.mg-inn-stadfest {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 0.2rem;
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-size: 1rem;
  color: var(--cream);
}
.mg-inn-stadfest-hak {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 1.3rem;
  height: 1.3rem;
  border-radius: 50%;
  background: #cebf95;
  color: #302f2f;
}
.mg-inn-nyskra {
  display: grid;
  gap: 0.8rem;
}
.mg-inn-nyskra .mg-inn-spurt {
  margin: 0.8rem 0 0;
}
.mg-inn-innsl {
  width: 100%;
  box-sizing: border-box;
  min-height: 3.2rem;
  padding: 0 1rem;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: rgba(0, 0, 0, 0.28);
  color: var(--cream);
  font-family: "Source Sans 3", sans-serif;
  font-size: 1.05rem;
}
.mg-inn-innsl:focus {
  outline: none;
  border-color: var(--gold);
}
.mg-inn-smatt {
  margin: -0.2rem 0 0;
  font-size: 0.8rem;
  line-height: 1.5;
  color: var(--muted);
}
.mg-inn-smatt a {
  color: var(--gold);
}
@media (prefers-reduced-motion: reduce) {
  .mg-inn-opnast,
  .mg-inn-opnast.opin,
  .mg-inn-opnast > div,
  .mg-inn-opnast.opin > div {
    transition-duration: 0.12s;
  }
  .mg-inn-opnast > div {
    transform: none;
  }
}
/* Eyðublaðið í innskráningarmódúlnum (PC) */
.mg-inn-eydublad {
  display: grid;
  gap: 0.8rem;
}
.mg-inn-eydublad label {
  display: grid;
  gap: 0.35rem;
  font-family: "Poppins", sans-serif;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gold);
}
.mg-inn-eydublad input.mg-inn-reitur {
  width: 100%;
  box-sizing: border-box;
  min-height: 3.2rem;
  padding: 0 1rem;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: rgba(0, 0, 0, 0.28);
  color: var(--cream);
  font-family: "Source Sans 3", sans-serif;
  font-size: 1.05rem;
}
.mg-inn-eydublad input.mg-inn-reitur:focus {
  outline: none;
  border-color: var(--gold);
}
.mg-inn-eydublad .mg-inn-simareitur {
  margin: 0;
}
.mg-inn-eydublad label.mg-inn-samthykki {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  font-family: "Source Sans 3", sans-serif;
  font-size: 0.88rem;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: var(--muted);
}
.mg-inn-samthykki input {
  margin-top: 0.2rem;
  accent-color: var(--gold);
}
.mg-inn-samthykki a {
  color: var(--gold);
}

/* ---------- „Hvenær viljið þið koma?" á PC, þéttað (Villi 23/9) ----------
   Skrefið var of hátt og „Áfram" lenti langt undir tímavalinu, á eftir
   Til baka. Hér er umframbilið tekið, takkinn settur strax undir valið og
   Til baka færist niður fyrir hann. Sama röð á borðaskrefinu svo gesturinn
   læri hana einu sinni. Síminn (≤860px) er ósnertur, þar ber stikan
   takkann og blaðið heldur sinni hæð. */
@media (min-width: 861px) {
  .bk-layout[data-skref="dagstimi"] .bk-main,
  .bk-layout[data-skref="bord"] .bk-main {
    display: flex;
    flex-direction: column;
  }
  /* Sívalingurinn er kominn niður að Áfram (Villi 24/9), hann er
     staðfesting á því sem verið er að fara að kaupa en ekki haus. */
  .bk-layout[data-skref="dagstimi"] .bk-main > .bk-samhengi,
  .bk-layout[data-skref="bord"] .bk-main > .bk-samhengi {
    order: 1;
    margin: 1.6rem auto 0;
  }
  .bk-layout[data-skref="dagstimi"] .bk-main > .bk-sum-afram,
  .bk-layout[data-skref="bord"] .bk-main > .bk-sum-afram {
    order: 2;
    margin-top: 0.8rem;
  }
  .bk-layout[data-skref="dagstimi"] .bk-main > .bk-back,
  .bk-layout[data-skref="bord"] .bk-main > .bk-back {
    order: 3;
    margin-top: 0.5rem;
    text-align: center;
  }
  /* Spjaldið sjálft: minna loft að innan og milli dálka */
  .bk-layout[data-skref="dagstimi"] .bk-dagstimi {
    padding: 1.3rem 1.4rem;
  }
  .bk-layout[data-skref="dagstimi"] .bk-dagstimi.einn {
    gap: 1rem;
  }
  .bk-layout[data-skref="dagstimi"] .bk-dt-head {
    margin-bottom: 0.65rem;
  }
  /* Lágmarkshæðin var 15rem og skildi eftir auðan flöt undir tímunum.
     24/9: rástíminn er orðinn tvö skref og spjaldið á að vaxa með
     efninu, þá má lágmarkið ekki halda uppi tómum fleti. Það dugar nú
     fyrir pillunum einum, beinagrindin sér um að halda hæðinni meðan
     nýr dagur er sóttur. */
  /* Kláruð ákvörðun dregst saman í 40 px röð. Lágmarkshæðin var sett til
     að halda plássi fyrir grindinni og skilur eftir dauðan flöt þegar hún
     er farin, mælt 30 px (Villi 24/9). */
  .bk-layout[data-skref="dagstimi"] .bk-dagstimi.einn .bk-timar:has(> .bk-tvival) {
    min-height: 0;
  }
  .bk-layout[data-skref="dagstimi"] .bk-dagstimi.einn .bk-timar {
    min-height: 4.4rem;
    /* Hæðin fylgir hólfinu sem opnast, í sömu hreyfingu */
    transition: min-height 0.3s var(--ease);
  }
  .bk-layout[data-skref="dagstimi"] .bk-dt-hint {
    padding: 1rem 0;
  }
  .bk-layout[data-skref="dagstimi"] .bk-dagstimi.einn .bk-dt-col.bk-timar .bk-dt-hint {
    padding: 0.8rem 0;
  }
  /* Fyrirsögnin og samhengisstikan fyrir ofan: minna bil, sama stærð */
  .bk-layout[data-skref="dagstimi"] .bk-q {
    margin-bottom: 0.9rem;
  }
  .container:has(.bk-layout[data-skref="dagstimi"]) > .bk-samhengi {
    margin-bottom: 0.8rem;
  }
}

/* ============================================================
   UPPHAFSSÍÐAN Á PC — ÚTGÁFA 5 (Villi 23/9)
   Setningin ER bókunin: fjöldinn og leikurinn eru orð sem gesturinn
   skiptir um, og hann fer beint í tímavalið. Hin þrjú liggja neðst
   með lifandi myndskeiðum.
   Síminn (≤860px) er ÓBREYTTUR. Hann heldur kortunum fjórum og
   blöðunum, allt hér er inni í min-width: 861px.
   ============================================================ */
.bk-v5 {
  display: none;
}
@media (min-width: 861px) {
  /* Kortin fjögur víkja fyrir hausnum, nema þegar svítan eða
     viðburðir eru valin, þau eiga sitt eigið val í gamla kortinu */
  .bk-valgrid.pc-falid {
    display: none;
  }
  .bk-v5 {
    display: block;
    max-width: 1180px;
    margin: 0 auto;
  }

  /* ---------- Coverid: ein mynd, ein setning, ein rod af styringum ----------
     Myndin skiptir um sig med leidinni, svo floturinn segir hvad er
     valid adur en ordin eru lesin. */
  /* Combo-afslatturinn i efra horninu: hann a ad sjast a medan gesturinn
     telur folkid, ekki fyrst i yfirlitinu (Villi 25/9). */
  /* 25/9: merkid hangir THETT yfir pilu-endanum a ordinu "Minigolf &
     pila" og saest adeins thegar su leid er valin. Smatt, svo thad trodi
     ser ekki inn i setninguna fyrir ofan. Radirnar halda sinu plassi,
     thad stendur utan flaedis. */
  .bk-v5-afsl {
    position: absolute;
    bottom: calc(100% - 0.05rem);
    left: 0;
    z-index: 3;
    font-family: "Poppins", sans-serif;
    font-size: 0.62rem;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: 0.03em;
    padding: 0.16rem 0.48rem;
    border-radius: 100px;
    color: #10241a;
    background-color: var(--spara, #4cd97b);
    transition: transform 0.32s var(--ease);
    pointer-events: none;
  }
  .bk-v5-svid {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 27rem;
    border-radius: 24px;
    overflow: hidden;
    background: var(--char);
  }
  .bk-v5-bak {
    position: absolute;
    inset: 0;
  }
  .bk-v5-bak img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity 0.5s var(--ease);
  }
  .bk-v5-bak img.virk {
    opacity: 1;
  }
  /* Slaedan er stadbundin: hun dekkir thar sem textinn stendur og
     sleppir haegri helmingnum alveg lausum, svo ljosmyndin sjaist. */
  .bk-v5-bak::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
      100deg,
      rgba(27, 25, 22, 0.93) 0%,
      rgba(27, 25, 22, 0.85) 30%,
      rgba(27, 25, 22, 0.46) 54%,
      rgba(27, 25, 22, 0.08) 76%,
      rgba(27, 25, 22, 0) 100%
    );
  }
  .bk-v5-inni {
    position: relative;
    z-index: 2;
    padding: 3rem 3.2rem;
    width: 100%;
    max-width: 62rem;
  }

  /* Setningin. Talan og athofnin eru ordin sem gesturinn a. */
  .bk-v5-setning {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-size: clamp(2.1rem, 3.5vw, 3rem);
    line-height: 1.12;
    letter-spacing: -0.028em;
    margin: 0 0 1.5rem;
    text-transform: none;
    color: var(--cream);
    text-shadow: 0 1px 18px rgba(20, 19, 16, 0.5);
  }
  .bk-v5-setning u {
    color: var(--gold);
    position: relative;
    white-space: nowrap;
    text-decoration: none;
  }
  .bk-v5-setning u::after {
    content: "";
    position: absolute;
    left: 0.02em;
    right: 0.02em;
    bottom: 0.1em;
    height: 2px;
    background-color: currentColor;
    opacity: 0.4;
  }

  /* Leidirnar fimm eru ORD, ekki fimm kassar. Undirstrikid er EITT og
     deilist, thad faerist a milli theirra. */
  .bk-v5-leidir {
    position: relative;
    display: flex;
    align-items: baseline;
    gap: 1.35rem;
    margin-bottom: 1.6rem;
    padding-bottom: 0.7rem;
  }
  .bk-v5-leidir::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background-color: var(--hair);
  }
  .bk-v5-leidir button {
    position: relative;
    padding: 0 0 0.1rem;
    border: 0;
    background: none;
    cursor: pointer;
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 1.02rem;
    letter-spacing: -0.01em;
    color: var(--muted);
    transition: color 0.2s var(--ease);
  }
  .bk-v5-leidir button[aria-selected="true"],
  .bk-v5-leidir button:hover {
    color: var(--cream);
  }
  .bk-v5-leidir .strik {
    position: absolute;
    bottom: -1px;
    height: 2px;
    border-radius: 2px;
    background-color: var(--gold);
    transition:
      transform 0.32s var(--ease),
      width 0.32s var(--ease);
  }

  /* Rodin a sitt plass HVORT SEM leidin ber lengd eda ekki, svo
     coverid haldi somu haed i ollum fimm (Villi 24/9). */
  .bk-v5-lengd {
    height: 5.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  /* Leidir an lengdar bera linu sem segir hvad er verid ad boka, i stad
     tomrums. Sama plass, sama stada (Villi 24/9). */
  .bk-v5-lengd .lysing {
    margin: 0;
    font-size: 1.25rem;
    line-height: 1.3;
    color: var(--cream);
  }
  /* Skiptin milli lysingar og lengdarradar eru hrein thynning. Ekkert
     faerist til, thvi thad ma ekki vera of mikid ad gerast med auganu
     thegar skipt er um leid (Villi 24/9). */
  .bk-v5-lengd > * {
    animation: bkV5Slot 0.22s var(--ease) both;
  }
  @keyframes bkV5Slot {
    from {
      opacity: 0;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .bk-v5-lengd > * {
      animation: none;
    }
  }
  .bk-v5-lengd .merki {
    margin: 0 0 0.5rem;
    min-height: 1rem;
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-size: 0.66rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--gold);
  }
  .bk-v5-lengd .raed {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    height: 2.7rem;
  }
  .bk-v5-lengd button {
    padding: 0.58rem 1.1rem;
    border: 0;
    border-radius: 100px;
    cursor: pointer;
    background-color: rgba(0, 0, 0, 0.34);
    box-shadow: inset 0 0 0 1px var(--line);
    color: var(--cream);
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 0.86rem;
    transition:
      background-color 0.18s var(--ease),
      box-shadow 0.18s var(--ease),
      transform 0.16s var(--ease);
  }
  .bk-v5-lengd button[aria-pressed="true"] {
    background-color: var(--gold);
    color: #2b2820;
    box-shadow: none;
  }
  .bk-v5-lengd button:active {
    transform: scale(0.97);
  }
  @media (hover: hover) and (pointer: fine) {
    .bk-v5-lengd button:hover:not([aria-pressed="true"]) {
      background-color: rgba(211, 195, 152, 0.14);
      box-shadow: inset 0 0 0 1px var(--gold);
    }
  }

  /* Ein rod af styringum. Ekkert meira. */
  .bk-v5-stjorn {
    display: flex;
    align-items: center;
    gap: 1.9rem;
  }
  .bk-v5-teljari {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
  }
  .bk-v5-teljari button {
    width: 2.6rem;
    height: 2.6rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    border: 1px solid var(--line);
    cursor: pointer;
    background-color: rgba(0, 0, 0, 0.3);
    color: var(--cream);
    font-size: 1.1rem;
    line-height: 1;
    transition:
      background-color 0.18s var(--ease),
      border-color 0.18s var(--ease),
      transform 0.16s var(--ease);
  }
  .bk-v5-teljari button:active {
    transform: scale(0.94);
  }
  @media (hover: hover) and (pointer: fine) {
    .bk-v5-teljari button:hover:not(:disabled) {
      background-color: rgba(211, 195, 152, 0.12);
      border-color: var(--gold);
    }
  }
  .bk-v5-teljari output {
    min-width: 2.9rem;
    text-align: center;
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-size: 1.35rem;
    font-variant-numeric: tabular-nums;
  }
  /* Ovalinn fjoldi (29/9): strik i daufum lit, ekki tala sem liti ut eins og val */
  .bk-v5-teljari output.tomt {
    color: var(--muted);
  }
  .bk-v5-teljari button:disabled {
    opacity: 0.35;
    cursor: default;
  }
  /* Hamark svitunnar stendur vid teljarann */
  .bk-v5-hamark {
    margin-left: 0.5rem;
    color: var(--muted);
    font-size: 0.85rem;
    white-space: nowrap;
  }
  /* Bordid synir ekkert verd. An fasts plass hrundi rodin um 6 px og
     coverid stokk til thegar skipt var yfir a bordid (Villi 24/9). */
  .bk-v5-verd {
    min-height: 3.71rem;
  }
  .bk-v5-verd strong {
    display: block;
    font-family: "Poppins", sans-serif;
    font-size: 1.95rem;
    line-height: 1;
    font-variant-numeric: tabular-nums;
  }
  .bk-v5-verd span {
    color: var(--muted);
    font-size: 0.9rem;
  }
  .bk-v5-vantar {
    color: var(--muted);
    font-size: 0.95rem;
  }
  .bk-v5-stjorn .pl-continue {
    width: auto;
    margin: 0;
    padding: 1.05em 2.3em;
  }

  /* ---------- Framundan: tveir kassar ----------
     Bodid er lodrett, myndrondin er breid og lag svo efnid fai fulla
     breidd. Larett skipting skildi efninu eftir 340 px og tha vafdist
     naestum hver lina i tvennt. */
  .bk-v5-hin {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-top: 1rem;
    align-items: stretch;
  }
  .bk-v5-hin > article {
    position: relative;
    display: flex;
    flex-direction: column;
    border-radius: 20px;
    overflow: hidden;
    background: var(--char);
    box-shadow: inset 0 0 0 1px var(--line);
    transition: box-shadow 0.2s var(--ease);
  }
  @media (hover: hover) and (pointer: fine) {
    .bk-v5-hin > article:hover {
      box-shadow: inset 0 0 0 1px var(--gold);
    }
    .bk-v5-hin > article.bk-fr-bolti:hover {
      box-shadow: inset 0 0 0 1px rgba(76, 217, 123, 0.55);
    }
  }
  .bk-fr-mynd {
    position: relative;
    height: 9rem;
    overflow: hidden;
  }
  .bk-fr-mynd img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* Skjarinn i efra horninu VERDUR ad sjast, svo myndin er fest efst */
    object-position: 50% 0%;
    filter: brightness(0.6);
    transition:
      transform 0.55s var(--ease),
      filter 0.3s var(--ease);
  }
  @media (hover: hover) and (pointer: fine) {
    .bk-v5-hin > article:hover .bk-fr-mynd img {
      transform: scale(1.04);
      filter: brightness(0.74);
    }
  }
  /* Slaedan byrjar nedar svo efsti hluti myndarinnar haldi fullri birtu */
  .bk-fr-mynd::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
      to top,
      var(--char) 2%,
      rgba(64, 60, 53, 0.42) 34%,
      rgba(20, 19, 16, 0) 78%
    );
  }
  .bk-fr-efni {
    padding: 1.4rem 1.6rem 1.5rem;
    display: flex;
    flex-direction: column;
    flex: 1;
  }
  /* Leturstærðirnar hækkaðar 25/9 (Villi: of lítið). Allt í kössunum
     fer upp í sama hlutfalli svo stigveldið haldist. */
  .bk-fr-efni h4 {
    font-family: "Poppins", sans-serif;
    font-size: 1.8rem;
    line-height: 1.12;
    letter-spacing: -0.02em;
    /* Vefurinn hastafar h4 sjalfkrafa, thessi tveir eru heiti en ekki
       merkingar og eiga ad lesast eins og fyrirsagnir */
    text-transform: none;
    margin: 0;
    color: var(--cream);
  }
  .bk-fr-efni > p {
    margin: 0.5rem 0 0;
    color: #c2bbae;
    font-size: 1.08rem;
    line-height: 1.5;
    /* Baedi kassarnir eiga ad hefja listann i somu haed tho onnur
       lysingin se lengri en hin */
    min-height: 3.3rem;
  }
  /* Adgreinir milli lysingarinnar og leikjanna sjalfra (Villi 24/9).
     Hun var skrifud 24/9 um morguninn en var osynileg thvi --hair var
     aldrei til; nu er hun skilgreind og linan sest. */
  .bk-fr-listi {
    margin-top: 1.1rem;
    padding-top: 0.2rem;
    border-top: 1px solid var(--line);
  }

  /* „Sja alla leiki" opnar listann a stadnum. Haedin sjalf hreyfist,
     0fr til 1fr, svo kassinn vaxi med leikjunum i stad thess ad hoppa.
     Radirnar thynnast inn hver a eftir annarri, 40 ms a milli. */
  .bk-fr-meira {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.34s var(--ease);
  }
  .bk-fr-meira.opid {
    grid-template-rows: 1fr;
  }
  /* Afgangurinn faer thak. 16 leikir i heilum manudi toku kassann ur 561
     i 1460 px og systkinakassinn togndist med honum, sem skildi eftir
     900 px af engu (Villi 24/9: autt svaedi er ljott). Thakid heldur
     vextinum i horfi og thad sem ekki kemst skrunar innan listans. */
  .bk-fr-meira > div {
    min-height: 0;
    overflow: hidden;
  }
  /* Opinn listinn fær þak og ALLAR raðirnar skrunast saman, líka þær
     þrjár efstu (Villi 25/9). Þakið lendir VILJANDI milli raða: hálfa
     röðin neðst er eina merkið um að listinn haldi áfram. Skrunstikan
     víkur svo pillurnar standi í sama dálki og áður. */
  .bk-fr-skrun.opid {
    max-height: 25rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: none;
  }
  .bk-fr-skrun.opid::-webkit-scrollbar {
    width: 0;
    height: 0;
  }
  .bk-fr-meira.opid .bk-fr-rod {
    animation: bkFrRod 0.26s var(--ease) both;
    animation-delay: calc(0.1s + var(--rod, 0) * 0.04s);
  }
  @keyframes bkFrRod {
    from {
      opacity: 0;
      transform: translateY(6px);
    }
  }
  .bk-fr-orva {
    display: inline-block;
    transition: transform 0.28s var(--ease);
  }
  .bk-fr-cta[aria-expanded="true"] .bk-fr-orva {
    transform: rotate(180deg);
  }
  @media (prefers-reduced-motion: reduce) {
    .bk-fr-meira {
      transition: none;
    }
    .bk-fr-meira.opid .bk-fr-rod {
      animation: none;
    }
    .bk-fr-orva {
      transition: none;
    }
  }
  .bk-fr-rod {
    display: grid;
    grid-template-columns: 2.7rem 1fr auto;
    align-items: center;
    gap: 1rem;
    width: 100%;
    text-align: left;
    padding: 0.78rem 0;
    border: 0;
    border-bottom: 1px solid var(--hair);
    background: none;
    color: inherit;
    font: inherit;
    cursor: pointer;
    transition:
      opacity 0.18s var(--ease),
      padding-left 0.2s var(--ease);
  }
  .bk-fr-rod:hover {
    opacity: 0.78;
    padding-left: 0.3rem;
  }
  /* Beinagrindin heldur nakvaemlega somu haed og radirnar sem koma */
  .bk-fr-beid {
    display: block;
    height: 4.68rem;
    cursor: default;
  }
  .bk-fr-beid:hover {
    opacity: 1;
    padding-left: 0;
  }
  .bk-fr-rod .merki img {
    width: 1.9rem;
    height: 1.9rem;
    object-fit: contain;
  }
  .bk-fr-rod .dagsk {
    width: 2.7rem;
    height: 2.7rem;
    border-radius: 8px;
    display: grid;
    place-items: center;
    align-content: center;
    background-color: rgba(211, 195, 152, 0.1);
    box-shadow: inset 0 0 0 1px var(--hair);
  }
  .bk-fr-rod .dagsk strong {
    font-family: "Poppins", sans-serif;
    font-size: 1.08rem;
    line-height: 1;
    color: var(--cream);
  }
  .bk-fr-rod .dagsk span {
    font-size: 0.6rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--muted);
    margin-top: 0.1rem;
  }
  .bk-fr-rod .hvad {
    min-width: 0;
  }
  .bk-fr-rod .hvad b {
    display: block;
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 1.12rem;
    line-height: 1.2;
    color: var(--cream);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .bk-fr-rod .hvad em {
    display: block;
    font-style: normal;
    color: var(--muted);
    font-size: 0.95rem;
    margin-top: 0.15rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .bk-fr-merki {
    font-family: "Poppins", sans-serif;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    white-space: nowrap;
    padding: 0.3rem 0.65rem;
    border-radius: 100px;
  }
  .bk-fr-merki.bolti {
    color: #8ff0b0;
    box-shadow: inset 0 0 0 1px rgba(76, 217, 123, 0.3);
  }
  .bk-fr-merki.vidb {
    color: var(--gold);
    box-shadow: inset 0 0 0 1px var(--line);
  }
  /* Framundan og hópatilboðin (Villi 25/9). Viðburðir og boltinn deila
     kassa, hvor hópur undir sínu merki: viðburðirnir gylltir efst, boltinn
     með græna punktinum fyrir neðan, sami grænn og pillan hans. */
  .bk-fr-kafli {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0;
    padding: 1.05rem 0 0.2rem;
    font-family: "Poppins", sans-serif;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--gold);
  }
  .bk-fr-kafli.beint {
    color: #8ff0b0;
  }
  .bk-fr-kafli .punktur {
    width: 0.42rem;
    height: 0.42rem;
    border-radius: 50%;
    background-color: #4cd97b;
    box-shadow: 0 0 0 3px rgba(76, 217, 123, 0.18);
  }
  /* Tveir listar í sama kassa: sá seinni fær loft og sína eigin línu */
  /* Seinni hópurinn: merkið ber skilin, engin tvöföld lína */
  .bk-fr-listi + .bk-fr-listi {
    margin-top: 0.4rem;
    border-top: 0;
  }
  .bk-v5-hin > article.bk-fr-hopar .bk-fr-mynd img {
    object-position: 50% 34%;
  }
  a.bk-fr-rod {
    text-decoration: none;
    color: inherit;
  }
  .bk-fr-rod .dagsk.hop {
    color: var(--gold);
  }
  .bk-fr-tomt {
    margin: 0;
    padding: 1.1rem 0;
    color: var(--muted);
    font-size: 0.92rem;
  }
  .bk-fr-allt {
    margin-top: auto;
    padding-top: 1.1rem;
  }
  .bk-fr-cta {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.72rem 1.35rem;
    border-radius: 100px;
    background-color: transparent;
    box-shadow: inset 0 0 0 1px var(--line);
    color: var(--cream);
    text-decoration: none;
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-size: 0.7rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    transition:
      background-color 0.18s var(--ease),
      box-shadow 0.18s var(--ease),
      transform 0.16s var(--ease);
  }
  .bk-fr-cta:active {
    transform: scale(0.975);
  }
  @media (hover: hover) and (pointer: fine) {
    .bk-fr-cta:hover {
      background-color: rgba(211, 195, 152, 0.1);
      box-shadow: inset 0 0 0 1px var(--gold);
    }
  }

/* ============================================================
     BORD A LEIK: GLUGGINN (Villi 24/9)
     Gesturinn helst a sama skja. Glugginn er nu med somu hreyfingu
     og bokunarglugginn (24/9, sidar um daginn): thunn lodrett rond
     a midjunni sem teygir sig samtimis til beggja atta, og svo
     innihaldid. Eitt hreyfikerfi fyrir alla glugga a sidunni.
     ============================================================ */
  .bk-bp-skuggi {
    position: fixed;
    inset: 0;
    /* Yfir fasta hausinn (z-index 100). Gluggi sem hausinn ber ofan a
       er ekki gluggi, hann er kassi inni a sidunni. */
    z-index: 140;
    display: grid;
    place-items: center;
    padding: 2rem;
    background-color: rgba(15, 14, 12, 0.72);
    backdrop-filter: blur(3px);
    opacity: 0;
    transition: opacity 0.2s var(--ease);
  }
  .bk-bp-skuggi[data-stada="opid"] {
    opacity: 1;
  }
  body:has(.bk-bp-skuggi) .mg-chat {
    display: none;
  }
  .bk-bp-skuggi[data-stada="lokast"] {
    transition: opacity 0.18s 0.05s var(--ease);
  }
  /* Vidburdaglugginn byrjar JAFN BREIDUR og boltaglugginn og teygir sig
     ut thegar saetakortid kemur (Villi 25/9). Adur stod hann i fullri
     breidd fra fyrsta skrefi, sem gerdi eina teljararod ad breidum fleti.
     Breidd er lagt eiginleiki ad hreyfa, en hann er eini hluturinn sem
     hreyfist: glugginn er fastur i midju og stendur utan flaedis sidunnar,
     svo ekkert annad haggast. */
  .bk-bp.bk-vp {
    width: min(30rem, 100%);
    transition:
      clip-path 0.24s var(--ease),
      opacity 0.14s var(--ease),
      width 0.34s var(--ease);
  }
  .bk-bp.bk-vp.breitt {
    width: min(52rem, 100%);
  }
  @media (prefers-reduced-motion: reduce) {
    .bk-bp.bk-vp {
      transition: opacity 0.16s var(--ease);
    }
  }
  .bk-bp.bk-vp .bk-salur-ramma {
    margin: 0.6rem 0 0;
  }
  /* Graeni haus boltagluggans a ekki vid vidburdi, thar er gullid (25/9) */
  .bk-bp.bk-vp .bk-bp-haus {
    background: linear-gradient(175deg, rgba(211, 195, 152, 0.14), rgba(64, 60, 53, 0) 100%);
    box-shadow: inset 0 -1px 0 var(--line);
  }
  .bk-bp.bk-vp .bk-bp-haus .merki img {
    width: 3rem;
    height: 3rem;
    border-radius: 8px;
    object-fit: cover;
  }
  .bk-bp.bk-vp .bk-q {
    font-size: 1.15rem;
    margin: 0.4rem 0 0.6rem;
  }
  .bk-bp {
    position: relative;
    width: min(30rem, 100%);
    max-height: calc(100vh - 4rem);
    overflow: auto;
    overscroll-behavior: contain;
    border-radius: 20px;
    background: var(--char);
    box-shadow: inset 0 0 0 1px var(--line);
    clip-path: inset(0 46% 0 46% round 20px);
    opacity: 0;
    transition:
      clip-path 0.24s var(--ease),
      opacity 0.14s var(--ease);
    will-change: clip-path;
  }
  .bk-bp-skuggi[data-stada="opid"] .bk-bp {
    clip-path: inset(0 0 0 0 round 20px);
    opacity: 1;
  }
  .bk-bp-skuggi[data-stada="lokast"] .bk-bp {
    transition:
      clip-path 0.2s 0.05s var(--ease),
      opacity 0.12s 0.13s var(--ease);
  }
  /* Innihaldid bidur eftir plassinu, eins og i stora glugganum */
  .bk-bp-skuggi > .bk-bp > * {
    opacity: 0;
    transition: opacity 0.16s var(--ease);
  }
  .bk-bp-skuggi[data-stada="opid"] > .bk-bp > * {
    opacity: 1;
    transition-delay: 0.13s;
  }
  @media (prefers-reduced-motion: reduce) {
    .bk-bp {
      clip-path: inset(0 0 0 0 round 20px);
      transition: opacity 0.16s var(--ease);
      will-change: auto;
    }
    .bk-bp-skuggi[data-stada="lokast"] .bk-bp {
      transition: opacity 0.14s var(--ease);
    }
    .bk-bp-skuggi[data-stada="opid"] > .bk-bp > * {
      transition-delay: 0.05s;
    }
  }
  .bk-bp:focus {
    outline: none;
  }
  .bk-bp-loka {
    position: absolute;
    top: 0.85rem;
    right: 0.85rem;
    width: 2.2rem;
    height: 2.2rem;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.26);
    color: var(--muted);
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
    transition:
      background-color 0.18s var(--ease),
      color 0.18s var(--ease),
      transform 0.16s var(--ease);
  }
  .bk-bp-loka:hover {
    background-color: rgba(211, 195, 152, 0.14);
    color: var(--cream);
  }
  .bk-bp-loka:active {
    transform: scale(0.94);
  }
  /* Leikurinn er ÞEGAR thekktur, hann stendur sem stadreynd efst */
  .bk-bp-haus {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 0.9rem;
    padding: 1.4rem 3.2rem 1.2rem 1.5rem;
    background: linear-gradient(175deg, rgba(47, 74, 51, 0.55), rgba(64, 60, 53, 0) 100%);
    box-shadow: inset 0 -1px 0 rgba(76, 217, 123, 0.2);
  }
  .bk-bp-haus .merki img {
    width: 2.3rem;
    height: 2.3rem;
    object-fit: contain;
  }
  .bk-bp-haus b {
    display: block;
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 1.12rem;
    line-height: 1.2;
    color: var(--cream);
  }
  .bk-bp-haus em {
    display: block;
    font-style: normal;
    margin-top: 0.15rem;
    color: var(--muted);
    font-size: 0.86rem;
  }
  .bk-bp-efni {
    padding: 1.3rem 1.5rem 1.5rem;
  }
  .bk-bp-lina {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
  }
  .bk-bp-lina .merki {
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 1.02rem;
    color: var(--cream);
  }
  .bk-bp-maeting {
    margin: 0.9rem 0 0;
    color: var(--muted);
    font-size: 0.92rem;
    line-height: 1.5;
  }
  /* Audkenningin vex nidur ur glugganum, sama hreyfing og rastimarnir */
  .bk-bp-opnast {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.3s var(--ease);
  }
  .bk-bp-opnast.opin {
    grid-template-rows: 1fr;
  }
  .bk-bp-opnast > div {
    min-height: 0;
    overflow: hidden;
  }
  .bk-bp-inn {
    margin-top: 1.3rem;
  }
  .bk-bp-villa {
    margin: 0.8rem 0 0;
    color: #e89a9a;
    font-size: 0.9rem;
  }
  .bk-bp-bidur {
    margin: 1.2rem 0 0;
    text-align: center;
    color: var(--muted);
    font-size: 0.92rem;
  }
  .bk-bp-efni > .bk-fr-cta {
    margin-top: 1.3rem;
  }
  /* Bidandi takki: segir ad eitthvad vanti i stad thess ad vera daudur */
  .bk-bp .bk-fr-cta.bidur {
    background-color: rgba(211, 195, 152, 0.14);
    color: var(--gold);
    border-style: dashed;
    border-color: rgba(211, 195, 152, 0.5);
    cursor: default;
  }
  .bk-bp .bk-fr-cta.bidur:hover {
    background-color: rgba(211, 195, 152, 0.14);
  }
  /* Klart */
  .bk-bp-klart {
    text-align: center;
  }
  .bk-bp-hak {
    display: grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    margin: 0.4rem auto 1rem;
    border-radius: 50%;
    background-color: rgba(76, 217, 123, 0.16);
    box-shadow: inset 0 0 0 1px rgba(76, 217, 123, 0.4);
    color: #8ff0b0;
    font-size: 1.35rem;
    animation: bkBpHak 0.34s var(--ease) both 0.06s;
  }
  @keyframes bkBpHak {
    from {
      opacity: 0;
      transform: scale(0.88);
    }
  }
  .bk-bp-klart h3 {
    font-family: "Poppins", sans-serif;
    font-size: 1.3rem;
    margin: 0;
    color: var(--cream);
  }
  .bk-bp-klart p {
    margin: 0.5rem 0 0;
    color: #c2bbae;
    font-size: 0.96rem;
    line-height: 1.5;
  }
  .bk-bp-klart .bk-bp-smatt {
    color: var(--muted);
    font-size: 0.88rem;
  }
  /* Innskraningin er felld inn eins og hun er, hun ma bara ekki klippast */
  .bk-bp .mg-inn-simareitur {
    overflow: visible;
  }

    /* Hopefli vikur af fyrsta skjanum a PC (Villi 24/9). Siminn heldur
     strimlinum thar til annad er akvedid. */
  .bk-hopstrimill {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bk-v5-bak img {
    animation: none;
  }
}

/* ============================================================
   BOKUNARGLUGGINN (Villi 24/9)
   Oll bokunin klarast i glugga a sama skja, engar ser sidur.
   Hreyfingin: glugginn saest fyrst sem thunn lodrett rond a
   midjunni og teygir sig SAMTIMIS til beggja atta ad fullri
   breidd coversins. Thegar plassid er komid birtist innihaldid.
   Lokun gengur nakvaemlega til baka.

   Utfaert med clip-path inset en EKKI scaleX, thvi scaleX teygir
   texta og form med ser. Her hreyfast adeins clip-path og opacity,
   hvorugt snertir layout, svo sidan undir haggast ekki.

   Rondin byrjar i 48% bada vegu en ekki 50%: glugginn kemur aldrei
   ur engu, hann byrjar sem synilegur bordi.

   Glugginn faer engan ytri skugga. clip-path klippir hann af hvort
   sem er, og innri gulllinan a deyfdum bakgrunni ber adskilnadinn.
   ============================================================ */
@media (min-width: 1025px) {
  .bk-gl-skuggi {
    position: fixed;
    inset: 0;
    z-index: 140;
    display: grid;
    place-items: center;
    padding: 2rem 1rem;
    background-color: rgba(15, 14, 12, 0.72);
    backdrop-filter: blur(3px);
    opacity: 0;
    transition: opacity 0.22s var(--ease);
  }
  .bk-gl-skuggi[data-stada="opid"] {
    opacity: 1;
  }
  /* Skugginn bidur adeins med ad hverfa svo glugginn se farinn a undan */
  .bk-gl-skuggi[data-stada="lokast"] {
    transition: opacity 0.2s 0.06s var(--ease);
  }

  .bk-gl {
    position: relative;
    width: min(1180px, 92vw);
    /* Haedin fylgir skrefinu. Fost haed skildi eftir daudan flot a
       stuttu skrefunum; skrefin sjalf opnast med eigin haedarhreyfingu
       svo glugginn vex med theim i stad thess ad stokkva. */
    height: auto;
    max-height: min(88vh, 54rem);
    display: flex;
    flex-direction: column;
    border-radius: 24px;
    background: var(--char);
    box-shadow: inset 0 0 0 1px var(--line);
    clip-path: inset(0 48% 0 48% round 24px);
    opacity: 0;
    transition:
      clip-path 0.28s var(--ease),
      opacity 0.16s var(--ease);
    will-change: clip-path;
  }
  .bk-gl-skuggi[data-stada="opid"] .bk-gl {
    clip-path: inset(0 0 0 0 round 24px);
    opacity: 1;
  }
  /* Lokun er hradari en opnun og bidur i 60 ms eftir ad innihaldid
     se farid, svo ekkert se klippt i burtu i midju kafi */
  .bk-gl-skuggi[data-stada="lokast"] .bk-gl {
    transition:
      clip-path 0.22s 0.06s var(--ease),
      opacity 0.14s 0.14s var(--ease);
  }

  /* Innihaldid bidur thar til plassid er komid og kemur svo i einu lagi.
     Thad teygist ALDREI med glugganum, tilfaerslan er lodrett og orsmá. */
  .bk-gl-efni {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    padding: 2.6rem 2.8rem 2.8rem;
    opacity: 0;
    transform: translateY(5px);
    transition:
      opacity 0.18s var(--ease),
      transform 0.18s var(--ease);
  }
  .bk-gl-skuggi[data-stada="opid"] .bk-gl-efni {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.15s;
  }

  .bk-gl:focus {
    outline: none;
  }

  /* ---------- Fasti adgerdafoturinn (Villi 24/9) ----------
     Maelt adur en hann kom: thegar rastimi var valinn stod AFRAM 255 px
     undir brun gluggans i 1440x900 og 325 px i 1440x800, algerlega falinn,
     og fjorir takkar til vidbotar med honum. Eini takkinn sem sast var
     VELJA a valfrjalsu tilbodi. Foturinn tekur takkann ut ur skrunfletinum
     svo hann geti ekki farid, hvad sem efnid verdur hatt.
     Samhengislinan fylgir honum: hun ber frátektarklukkuna, sem taldi adur
     nidur utan skjas. */
  .bk-gl-fotur {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.7rem;
    padding: 1.05rem 2.8rem 1.35rem;
    background: var(--char);
    box-shadow: 0 -1px 0 var(--line);
  }
  .bk-gl-fotur .bk-samhengi {
    margin: 0;
  }
  .bk-gl-fotur .pl-continue {
    width: auto;
    margin: 0;
    padding: 1.05em 2.6em;
  }
  /* Skrunflöturinn skilar nedsta loftinu thegar foturinn tekur vid */
  .bk-gl:has(.bk-gl-fotur) .bk-gl-efni {
    padding-bottom: 1.1rem;
  }
  .bk-gl-loka {
    z-index: 3;
  }

  /* Innri skrefaskipti: bkInn er sidu-innkoma og of haeg inni i glugga.
     Her er hun hert svo skipti milli skrefa seu snogg. */
  .bk-gl .bk-main > *,
  .bk-gl .bk-summary {
    animation-duration: 0.26s;
  }
  .bk-gl .bk-main > *:nth-child(2) {
    animation-delay: 0.05s;
  }
  .bk-gl .bk-main > *:nth-child(3) {
    animation-delay: 0.09s;
  }
  .bk-gl .bk-main > *:nth-child(4) {
    animation-delay: 0.12s;
  }
  .bk-gl .bk-summary {
    animation-delay: 0.06s;
  }
  /* Yfirlitid loddir vid toppinn a glugganum, ekki vid hausinn a sidunni */
  .bk-gl .bk-summary {
    top: 0;
  }
  .bk-gl .gw-progress {
    margin-bottom: 1.9rem;
  }
  .bk-gl .bk-q {
    margin-bottom: 1.4rem;
  }

  /* Spjallbolan flytur ekki ofan a opnum glugga */
  body:has(.bk-gl-skuggi) .mg-chat {
    display: none;
  }

  /* Coverid undir glugganum tekur ekki vid smellum */
  .bk-section:has(.bk-gl-skuggi) .bk-layout[data-skref="val"] {
    pointer-events: none;
  }

  @media (prefers-reduced-motion: reduce) {
    .bk-gl {
      clip-path: inset(0 0 0 0 round 24px);
      transition: opacity 0.18s var(--ease);
      will-change: auto;
    }
    .bk-gl-skuggi[data-stada="lokast"] .bk-gl {
      transition: opacity 0.16s var(--ease);
    }
    .bk-gl-efni {
      transform: none;
      transition: opacity 0.18s var(--ease);
    }
    .bk-gl-skuggi[data-stada="opid"] .bk-gl-efni {
      transition-delay: 0.06s;
    }
  }
}

/* =========================================================
   Leikjabókunin í síma: skorkortið sem verður miði (Villi 26/9)
   src/components/SimaLeikir.tsx · prótótýpa: design/boka-leikir/loka.html
   =========================================================
   Holurnar fjórar á skorkortinu, svo flettist kortið í miða og
   viðbæturnar og staðfestingin taka við undir honum. Litir úr tokens
   bókunarinnar (.bk-app .section), engir nýir. Aðeins undir 861 px,
   yfir því er skjárinn falinn, líka á meðan síðan vaknar. */
.sl { display: none; }
@media (max-width: 860px) {
  .sl { --sl-ios: cubic-bezier(0.32, 0.72, 0, 1); --sl-ut: cubic-bezier(0.23, 1, 0.32, 1); --sl-cta: #cebf95; --sl-cta-texti: #302f2f; --sl-texti: #c2bbae; --sl-villa: #e08c7d; display: block; position: fixed; inset: 0; z-index: 150; overflow: hidden; color: var(--cream); font-family: "Source Sans 3", sans-serif; background: radial-gradient(ellipse at 15% 0%, rgba(211, 195, 152, 0.16), transparent 50%), var(--ink); }
  body:has(.sl) .mg-chat { display: none; }
  /* núllstillingin nær ekki inn í núverandi staðfestingu og kvittun, þær halda sínum stílum */
  .sl button:where(:not(.sl-stadfesting button, .sl-kvittun button, .sl-saetin button)) { font: inherit; color: inherit; background: none; border: 0; padding: 0; margin: 0; cursor: pointer; touch-action: manipulation; user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent; text-transform: none; letter-spacing: normal; }
  .sl h1 { font-family: "Poppins", sans-serif; font-size: 26px; line-height: 1.12; letter-spacing: -0.02em; text-transform: none; color: var(--cream); margin: 0 2px 14px; }
  .sl p:where(:not(.sl-stadfesting p, .sl-kvittun p)) { margin: 0; }
  .sl-merki { font-family: "Poppins", sans-serif; font-size: 10px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); }
  .sl-kr { font-family: "Poppins", sans-serif; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .sl-ramma { position: absolute; inset: 0; display: flex; flex-direction: column; }
  .sl-haus { flex: 0 0 auto; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: calc(10px + env(safe-area-inset-top, 0px)) 8px 4px; }
  .sl-haus img { height: 26px; opacity: 0.9; }
  /* Mg merkið er hlekkur á forsíðuna (Villi 2/10), 44px snertiflötur */
  .sl-heim { display: grid; place-items: center; min-width: 44px; min-height: 44px; border-radius: 12px; -webkit-tap-highlight-color: transparent; }
  .sl-heim:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
  .sl .sl-baka { justify-self: start; height: 44px; padding: 0 12px 0 6px; display: inline-flex; align-items: center; gap: 2px; color: var(--gold); font-family: "Poppins", sans-serif; font-weight: 600; font-size: 15px; border-radius: 100px; transition: background-color 160ms var(--sl-ut); }
  .sl .sl-baka:active { background-color: rgba(211, 195, 152, 0.12); }

  /* ---------- skorkortið ---------- */
  .sl-kort { flex: 0 0 auto; margin: 6px 16px 0; perspective: 1200px; }
  .sl-kort-snu { display: grid; transform-style: preserve-3d; transition: transform 760ms var(--sl-ios); }
  .sl-kort-framan, .sl-kort-baki { grid-area: 1 / 1; -webkit-backface-visibility: hidden; backface-visibility: hidden; border-radius: 18px; background-color: var(--char); box-shadow: inset 0 0 0 1px var(--line); overflow: hidden; }
  .sl-kort.snuid .sl-kort-snu { transform: rotateY(180deg); }
  /* Sama lágmarkshæð á báðum hliðum: miðinn með pílutíma er hærri en
     skorkortið og kortið stækkaði í flettingunni (hökt, Villi 26/9). Hann
     stækkar aðeins þegar gesturinn bætir sjálfur á hann. */
  .sl-kort-framan, .sl-kort-baki { min-height: 124px; }
  .sl-kort-framan { display: grid; grid-template-rows: auto 1fr; }
  /* flettingunni lokið: 3D sleppt svo miðinn teiknist sem venjulegt spjald */
  .sl-kort.flettur .sl-kort-snu { transform: none; transition: none; }
  /* framhliðin heldur plássinu sínu, annars minnkar miðinn þegar
     flettingunni lýkur og skrefið hnikast (Villi 26/9) */
  .sl-kort.flettur .sl-kort-framan { visibility: hidden; }
  .sl-kort.flettur .sl-kort-baki { transform: none; }
  .sl-kort-haus { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; border-bottom: 1px solid var(--hair); }
  .sl-kort-haus em { font-style: normal; font-family: "Poppins", sans-serif; font-size: 11px; font-weight: 600; color: var(--muted); font-variant-numeric: tabular-nums; }
  /* Hólfin mega ekki skerast við textann (Villi 26/9): fyrsta hólfið
     breiðast, merkin minni og klippt ef þau ná ekki, aldrei yfir línuna */
  .sl-reitir { display: grid; grid-template-columns: 1.3fr 0.9fr 0.9fr 0.9fr; }
  .sl-reitir.thrir { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sl .sl-reitur { position: relative; display: grid; grid-template-rows: auto 1fr; gap: 4px; min-height: 68px; min-width: 0; overflow: hidden; padding: 8px 8px 10px; text-align: left; border-right: 1px solid var(--hair); transition: background-color 240ms var(--sl-ut); }
  .sl .sl-reitur:last-child { border-right: 0; }
  .sl .sl-reitur:disabled { cursor: default; }
  .sl-nr { display: flex; align-items: center; gap: 5px; min-width: 0; font-family: "Poppins", sans-serif; font-size: 9.5px; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--muted); }
  .sl-nr > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sl-nr b { flex: 0 0 auto; width: 16px; height: 16px; border-radius: 50%; display: grid; place-items: center; font-size: 9px; letter-spacing: 0; box-shadow: inset 0 0 0 1px var(--line); color: var(--gold); }
  .sl-reitur.buinn .sl-nr b { background-color: var(--gold); color: var(--sl-cta-texti); box-shadow: none; }
  .sl-gildi { align-self: end; font-family: "Poppins", sans-serif; font-weight: 600; font-size: 15px; line-height: 1.15; min-height: 18px; white-space: nowrap; }
  .sl-gildi small { display: block; font-family: "Source Sans 3", sans-serif; font-weight: 400; font-size: 12px; color: var(--muted); }
  .sl-gildi.autt::before { content: "—"; color: rgba(181, 174, 159, 0.4); }
  .sl-stimpill { animation: slStimpill 380ms var(--sl-ios) both; }
  @keyframes slStimpill { 0% { transform: scale(1.5) rotate(-4deg); opacity: 0; } 60% { opacity: 1; } 100% { transform: none; } }
  .sl-reitur.nuna { background-color: rgba(211, 195, 152, 0.1); }
  .sl-reitur.nuna::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: 0; height: 3px; border-radius: 3px 3px 0 0; background-color: var(--gold); animation: slStrik 360ms var(--sl-ios) both; }
  @keyframes slStrik { from { transform: scaleX(0); } }

  /* ---------- miðinn ---------- */
  /* útfærsla 3: tíminn á stubbnum, listinn með fullri breidd, klukkan í horninu */
  .sl-kort-baki { position: relative; display: grid; grid-template-columns: 112px 1fr; transform: rotateY(180deg); background: linear-gradient(125deg, rgba(211, 195, 152, 0.14), rgba(211, 195, 152, 0) 55%), var(--char); }
  .sl-midi-timi { position: relative; display: flex; flex-direction: column; justify-content: center; padding: 14px 12px 14px 16px; border-right: 2px dashed rgba(211, 195, 152, 0.3); background-color: rgba(0, 0, 0, 0.14); }
  .sl-midi-timi::before, .sl-midi-timi::after { content: ""; position: absolute; right: -10px; width: 18px; height: 18px; border-radius: 50%; background-color: var(--ink); }
  .sl-midi-timi::before { top: -10px; }
  .sl-midi-timi::after { bottom: -10px; }
  .sl-midi-timi strong { font-family: "Poppins", sans-serif; font-size: 32px; line-height: 1; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
  .sl-midi-timi em { font-style: normal; font-family: "Poppins", sans-serif; font-weight: 600; font-size: 13px; color: var(--sl-texti); margin-top: 6px; }
  .sl-midi-timi span { font-family: "Poppins", sans-serif; font-weight: 600; font-size: 13px; color: var(--gold); margin-top: 8px; }
  .sl-midi-listi { display: grid; gap: 7px; align-content: center; min-width: 0; padding: 40px 14px 12px; }
  .sl-midi-listi.an-verds { padding-top: 12px; }
  .sl-midi-listi div { display: flex; align-items: center; gap: 9px; font-size: 15px; line-height: 1.2; }
  .sl-midi-listi svg { color: var(--gold); flex: 0 0 auto; }
  .sl-midi-listi .auki { color: var(--gold); font-weight: 600; animation: slSkipta 300ms var(--sl-ut); }
  /* verðið í horninu á miðanum (Villi 26/9), klukkan er í hausnum */
  .sl-midi-verd { position: absolute; top: 10px; right: 10px; display: inline-flex; align-items: center; height: 26px; padding: 0 11px; border-radius: 100px; background-color: rgba(211, 195, 152, 0.14); color: var(--cream); font-family: "Poppins", sans-serif; font-weight: 700; font-size: 14px; font-variant-numeric: tabular-nums; }
  /* frátektarklukkan í hausnum */
  .sl-haus-haegri { justify-self: end; display: flex; justify-content: flex-end; min-width: 0; }
  .sl-haus-hald { display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 11px; border-radius: 100px; background-color: rgba(211, 195, 152, 0.14); color: var(--gold); font-family: "Poppins", sans-serif; font-weight: 600; font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .sl-haus-hald.bokad { background-color: rgba(76, 217, 123, 0.14); color: var(--spara); }
  .sl-haus-hald .sl-snudur { width: 12px; height: 12px; border-width: 2px; }
  .sl-hak-popp { display: block; animation: slHakPopp 480ms var(--sl-ios) both; }
  @keyframes slHakPopp { from { transform: scale(0.3); opacity: 0; } }
  .sl-snudur { display: block; width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--gold); border-top-color: transparent; animation: slSnua 0.7s linear infinite; }
  @keyframes slSnua { to { transform: rotate(360deg); } }

  /* ---------- sviðið ---------- */
  .sl-svid { position: relative; flex: 1 1 auto; min-height: 0; }
  .sl-hola { position: absolute; inset: 0; overflow-y: auto; scrollbar-width: none; overscroll-behavior: contain; padding: 18px 16px 170px; }
  .sl-hola::-webkit-scrollbar { display: none; }
  .sl[data-skref="stadfesta"] .sl-hola, .sl[data-skref="kvittun"] .sl-hola { padding-bottom: calc(40px + env(safe-area-inset-bottom, 0px)); }
  .sl-hola.inn-h { animation: slInnH 400ms var(--sl-ios) both; }
  .sl-hola.inn-v { animation: slInnV 400ms var(--sl-ios) both; }
  @keyframes slInnH { from { transform: translateX(60px); opacity: 0; } }
  @keyframes slInnV { from { transform: translateX(-60px); opacity: 0; } }
  .sl-undir { color: var(--sl-texti); font-size: 15px; margin: -8px 2px 14px !important; }
  .sl-tilkynning { color: var(--sl-villa); font-size: 14px; margin: 0 2px 12px !important; }

  /* hola 1: leikirnir, þrjú kort undir hvert öðru (útlit A) */
  .sl-leikir { display: grid; gap: 10px; }
  .sl .sl-leikkort { position: relative; display: grid; grid-template-columns: 1fr auto; align-items: end; width: 100%; height: 96px; padding: 14px 16px; border-radius: 18px; overflow: hidden; text-align: left; box-shadow: inset 0 0 0 1px var(--line); isolation: isolate; transition: transform 140ms var(--sl-ut), box-shadow 220ms var(--sl-ut); }
  .sl .sl-leikkort:active { transform: scale(0.98); }
  .sl-leikkort img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform 600ms var(--sl-ios); }
  /* Myndirnar í fullri birtu (Villi 2/10): engin filter-myrkvun, aðeins slæða
     neðst þar sem nafnið og verðið sitja, efri hlutinn sést óhreyfður */
  .sl-leikkort::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgba(20, 19, 16, 0.9) 8%, rgba(20, 19, 16, 0.8) 45%, rgba(20, 19, 16, 0.56) 70%, rgba(20, 19, 16, 0) 100%); }
  .sl-leikkort-texti strong { display: block; font-family: "Poppins", sans-serif; font-size: 20px; letter-spacing: -0.02em; }
  .sl-leikkort-texti small { display: block; color: var(--sl-texti); font-size: 14px; margin-top: 2px; }
  /* afslátturinn í línunni við nafnið, ekki ofan á því */
  .sl .sl-afsl-lina { position: static; display: inline-block; margin-left: 8px; vertical-align: 3px; font-family: "Source Sans 3", sans-serif; letter-spacing: 0; }
  .sl-leikkort-verd { font-size: 15px; text-align: right; }
  .sl-leikkort-verd em { display: block; font-style: normal; font-family: "Source Sans 3", sans-serif; font-weight: 400; font-size: 12px; color: var(--muted); }
  .sl-leikkort-hak { position: absolute; top: 12px; right: 12px; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background-color: var(--cream); color: var(--sl-cta-texti); transform: scale(0); transition: transform 300ms var(--sl-ios); }
  .sl .sl-leikkort[aria-pressed="true"] { box-shadow: inset 0 0 0 2px var(--gold); }
  .sl .sl-leikkort[aria-pressed="true"] img { transform: scale(1.03); }
  .sl-leikkort[aria-pressed="true"] .sl-leikkort-hak { transform: scale(1); }
  .sl-afsl { position: absolute; top: 14px; left: 14px; font-size: 11px; font-weight: 700; padding: 4px 9px; border-radius: 100px; color: #10241a; background-color: var(--spara); }
  .sl-opnast { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 340ms var(--sl-ios); }
  .sl-opnast.opid { grid-template-rows: 1fr; }
  .sl-opnast > div { min-height: 0; overflow: hidden; }
  .sl-lengd-merki { color: var(--sl-texti); font-size: 14px; margin: 16px 2px 8px !important; }
  .sl-pillur { display: flex; gap: 8px; }
  .sl .sl-pillur button { flex: 1; height: 44px; padding: 0 14px; border-radius: 100px; font-family: "Poppins", sans-serif; font-weight: 600; font-size: 14px; box-shadow: inset 0 0 0 1px var(--line); transition: background-color 180ms var(--sl-ut), color 180ms var(--sl-ut), transform 120ms var(--sl-ut); white-space: nowrap; }
  .sl .sl-pillur button:active { transform: scale(0.95); }
  .sl .sl-pillur button[aria-pressed="true"] { background-color: var(--sl-cta); color: var(--sl-cta-texti); box-shadow: none; }

  /* hola 2: fjöldinn, flýtival 2 til 10 og svo plús og mínus */
  .sl-flytival { display: grid; grid-template-columns: repeat(9, 1fr); gap: 5px; margin-bottom: 14px; }
  .sl .sl-flytival button { height: 50px; border-radius: 14px; font-family: "Poppins", sans-serif; font-weight: 600; font-size: 17px; font-variant-numeric: tabular-nums; background-color: rgba(0, 0, 0, 0.2); box-shadow: inset 0 0 0 1px var(--line); transition: background-color 180ms var(--sl-ut), color 180ms var(--sl-ut), transform 120ms var(--sl-ut); }
  .sl .sl-flytival button:active { transform: scale(0.92); }
  .sl .sl-flytival button[aria-pressed="true"] { background-color: var(--sl-cta); color: var(--sl-cta-texti); box-shadow: none; }
  .sl-fjoldi { display: grid; grid-template-columns: 72px 1fr 72px; align-items: center; gap: 12px; padding: 22px 16px; border-radius: 22px; background-color: rgba(0, 0, 0, 0.2); box-shadow: inset 0 0 0 1px var(--line); }
  .sl .sl-fjoldi button { width: 72px; height: 72px; border-radius: 50%; display: grid; place-items: center; background-color: rgba(0, 0, 0, 0.25); box-shadow: inset 0 0 0 1px var(--line); transition: transform 120ms var(--sl-ut), opacity 160ms var(--sl-ut), background-color 160ms var(--sl-ut); }
  .sl .sl-fjoldi button:active { transform: scale(0.9); background-color: rgba(211, 195, 152, 0.16); }
  .sl .sl-fjoldi button:disabled { opacity: 0.3; }
  .sl-fjoldi output { text-align: center; font-family: "Poppins", sans-serif; font-weight: 700; font-size: 56px; line-height: 1; font-variant-numeric: tabular-nums; }
  .sl-fjoldi output small { display: block; margin-top: 6px; font-family: "Source Sans 3", sans-serif; font-weight: 600; font-size: 15px; color: var(--muted); }
  .sl-hopp { animation: slHopp 220ms var(--sl-ut); }
  @keyframes slHopp { 40% { transform: scale(1.1); } }
  .sl-hopar { display: flex; justify-content: space-between; align-items: center; margin-top: 12px; padding: 14px 16px; border-radius: 14px; box-shadow: inset 0 0 0 1px var(--line); color: var(--sl-texti); font-size: 14px; text-decoration: none; }
  .sl-hopar b { color: var(--gold); font-family: "Poppins", sans-serif; font-size: 13px; }

  /* hola 3: dagatalið */
  .sl-dagatal-haus { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
  .sl-dagatal-haus strong { font-family: "Poppins", sans-serif; font-size: 17px; }
  .sl .sl-dagatal-haus button { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; box-shadow: inset 0 0 0 1px var(--line); }
  .sl .sl-dagatal-haus button:disabled { opacity: 0.3; }
  .sl-vikudagar, .sl-dagar { display: grid; grid-template-columns: repeat(7, 1fr); text-align: center; }
  .sl-vikudagar span { font-size: 12px; font-weight: 600; color: var(--muted); padding: 8px 0; }
  .sl .sl-dagar button { position: relative; height: 46px; margin: 2px; border-radius: 12px; font-family: "Poppins", sans-serif; font-weight: 600; font-size: 16px; font-variant-numeric: tabular-nums; transition: background-color 180ms var(--sl-ut), color 180ms var(--sl-ut), transform 120ms var(--sl-ut); }
  .sl .sl-dagar button:active { transform: scale(0.92); }
  .sl .sl-dagar button:disabled { color: rgba(181, 174, 159, 0.3); cursor: default; }
  .sl .sl-dagar button.idag { box-shadow: inset 0 0 0 1px var(--line); }
  .sl .sl-dagar button[aria-pressed="true"] { background-color: var(--sl-cta); color: var(--sl-cta-texti); box-shadow: none; }
  .sl-dagar.saekir button:not(:disabled) { opacity: 0.6; }

  /* hola 4: tíminn */
  .sl-klstraema { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; padding: 2px 16px; margin: 0 -16px 12px; }
  .sl-klstraema::-webkit-scrollbar { display: none; }
  .sl .sl-klstraema button { flex: 0 0 auto; height: 38px; padding: 0 14px; border-radius: 100px; font-family: "Poppins", sans-serif; font-weight: 600; font-size: 14px; box-shadow: inset 0 0 0 1px var(--line); }
  .sl .sl-klstraema button[aria-pressed="true"] { background-color: rgba(211, 195, 152, 0.18); box-shadow: inset 0 0 0 1px var(--gold); }
  .sl .sl-klstraema button:disabled { opacity: 0.35; }
  .sl-grind { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .sl-grind.skipta { animation: slSkipta 260ms var(--sl-ut); }
  @keyframes slSkipta { from { opacity: 0; transform: translateY(6px); } }
  .sl .sl-grind button { position: relative; height: 52px; border-radius: 14px; font-family: "Poppins", sans-serif; font-weight: 600; font-size: 16px; font-variant-numeric: tabular-nums; box-shadow: inset 0 0 0 1px var(--line); background-color: rgba(0, 0, 0, 0.18); transition: background-color 180ms var(--sl-ut), color 180ms var(--sl-ut), transform 120ms var(--sl-ut); }
  .sl .sl-grind button:active { transform: scale(0.95); }
  .sl .sl-grind button[aria-pressed="true"] { background-color: var(--sl-cta); color: var(--sl-cta-texti); box-shadow: none; }
  .sl .sl-grind button:disabled { color: rgba(181, 174, 159, 0.4); text-decoration: line-through; box-shadow: inset 0 0 0 1px var(--hair); background-color: transparent; cursor: default; }
  .sl-faa { position: absolute; top: 6px; right: 7px; width: 6px; height: 6px; border-radius: 50%; background-color: var(--gold); }
  .sl .sl-grind button[aria-pressed="true"] .sl-faa { background-color: var(--sl-cta-texti); }
  .sl-klstmerki { margin: 16px 2px 8px !important; color: var(--muted); font-size: 13px; font-weight: 600; }
  /* beinagrindin í sama útliti og ræman og grindin, svo ekkert hoppar */
  .sl-beinagrind-klst { display: flex; gap: 8px; margin-bottom: 12px; padding: 2px 0; overflow: hidden; }
  .sl-beinagrind-klst span { flex: 0 0 74px; height: 38px !important; border-radius: 100px !important; }
  .sl-beinagrind-grind { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .sl-beinagrind span { height: 52px; border-radius: 14px; background: linear-gradient(90deg, rgba(211, 195, 152, 0.06), rgba(211, 195, 152, 0.13), rgba(211, 195, 152, 0.06)); background-size: 200% 100%; animation: slGlampi 1.2s linear infinite; }
  @keyframes slGlampi { to { background-position: -200% 0; } }
  .sl-tomt { padding: 18px 14px; border-radius: 14px; background-color: rgba(0, 0, 0, 0.2); color: var(--sl-texti); text-align: center; font-size: 15px; }
  .sl .sl-tomt button { display: block; margin: 10px auto 0; height: 40px; padding: 0 16px; border-radius: 100px; box-shadow: inset 0 0 0 1px var(--line); color: var(--gold); font-family: "Poppins", sans-serif; font-weight: 600; font-size: 14px; }

  /* ---------- viðbæturnar (úr A) ---------- */
  .sl-tkort { width: 100%; margin-bottom: 10px; border-radius: 18px; background-color: rgba(0, 0, 0, 0.2); box-shadow: inset 0 0 0 1px var(--line); overflow: hidden; transition: box-shadow 220ms var(--sl-ut), background-color 220ms var(--sl-ut); }
  .sl-tkort.valid { box-shadow: inset 0 0 0 2px var(--gold); background-color: rgba(211, 195, 152, 0.08); }
  .sl .sl-tkort-haus { display: grid; grid-template-columns: 1fr auto; gap: 12px; width: 100%; padding: 14px 16px; text-align: left; align-items: start; }
  .sl-tkort-haus strong { display: block; font-family: "Poppins", sans-serif; font-size: 17px; }
  .sl-innid { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 6px; color: var(--sl-texti); font-size: 14px; }
  .sl-innid span { display: inline-flex; align-items: center; gap: 5px; }
  .sl-innid svg { color: var(--gold); flex: 0 0 auto; }
  .sl-tkort-haus .sl-kr { font-size: 18px; text-align: right; }
  .sl-tkort-haus .sl-kr em { display: block; font-style: normal; font-family: "Source Sans 3", sans-serif; font-weight: 400; font-size: 12px; color: var(--muted); }
  .sl-tkort-fotur { display: flex; align-items: center; justify-content: space-between; padding: 9px 16px; border-top: 1px solid var(--hair); background-color: rgba(0, 0, 0, 0.12); font-size: 13px; color: var(--muted); }
  .sl-velja { display: inline-flex; align-items: center; gap: 8px; font-family: "Poppins", sans-serif; font-weight: 600; font-size: 13px; color: var(--cream); }
  .sl-velja i { width: 20px; height: 20px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--line); display: grid; place-items: center; color: var(--sl-cta-texti); transition: background-color 200ms var(--sl-ut), box-shadow 200ms var(--sl-ut); }
  .sl-tkort.valid .sl-velja i { background-color: var(--gold); box-shadow: none; }
  /* Áfram, sleppa tilboðum (29/9): alltaf til staðar undir tilboðunum, sama textatakki og „Nei takk" á PC */
  .sl .sl-sleppa { display: block; width: 100%; min-height: 48px; margin: 2px 0 12px; color: var(--sl-texti); font-size: 16px; text-align: center; text-decoration: underline; text-underline-offset: 4px; }
  .sl .sl-sleppa[aria-disabled="true"] { opacity: 0.5; cursor: default; }
  .sl-bordkort { padding: 14px 14px 14px 16px; }
  .sl-bord-efri { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  .sl-bord-efri strong { display: block; font-family: "Poppins", sans-serif; font-size: 17px; }
  .sl-bord-efri small { color: var(--sl-texti); font-size: 14px; }
  .sl-bordval { padding-top: 12px; }
  .sl .sl-bordval button { height: 50px; display: grid; align-content: center; line-height: 1.15; }
  .sl-bordval button span { display: block; font-family: "Source Sans 3", sans-serif; font-weight: 400; font-size: 12px; opacity: 0.8; }
  .sl-bord-hint { color: var(--muted); font-size: 14px; margin-top: 10px !important; }
  .sl-villa { color: var(--sl-villa); font-size: 14px; margin-top: 8px !important; }
  .sl .sl-rofi { flex: 0 0 auto; width: 51px; height: 31px; border-radius: 100px; background-color: rgba(0, 0, 0, 0.35); position: relative; transition: background-color 220ms var(--sl-ut); box-shadow: inset 0 0 0 1px var(--line); }
  .sl-rofi::after { content: ""; position: absolute; top: 3px; left: 3px; width: 25px; height: 25px; border-radius: 50%; background-color: var(--cream); transition: transform 260ms var(--sl-ios); box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3); }
  .sl .sl-rofi[aria-checked="true"] { background-color: var(--spara); box-shadow: none; }
  .sl-rofi[aria-checked="true"]::after { transform: translateX(20px); }

  /* ---------- staðfestingin: samantektin úr A, innskráningin undir ---------- */
  .sl-samantekt { border-radius: 18px; background-color: rgba(0, 0, 0, 0.22); padding: 16px; margin-bottom: 18px; }
  .sl-rod { display: flex; align-items: center; gap: 12px; padding: 6px 0; font-size: 15px; }
  .sl-rod svg { color: var(--gold); flex: 0 0 auto; }
  .sl-skil { height: 1px; background-color: var(--line); margin: 10px 0; }
  .sl-lin { display: flex; justify-content: space-between; gap: 12px; padding: 4px 0; font-size: 15px; color: var(--sl-texti); }
  .sl-lin span:last-child { color: var(--cream); font-variant-numeric: tabular-nums; }
  .sl-lin .sl-spara { color: var(--spara) !important; }
  .sl-alls { display: flex; justify-content: space-between; align-items: baseline; padding-top: 4px; }
  .sl-alls strong { font-family: "Poppins", sans-serif; font-size: 22px; }
  /* Núverandi staðfesting ber sína eigin fyrirsögn og samantektarlínu,
     þær eru hér fyrir ofan í útliti A */
  .sl-stadfesting .bk-stadf-simi, .sl-stadfesting .bk-stadf-pc { display: none; }
  .sl-stadfesting .bk-actions { margin-top: 16px; }
  /* Enginn gullkassi utan um innskráninguna, sama og lokaskrefið á PC */
  /* reiturinn sýnir fókusinn á rammanum sínum, ekki annan ramma innan í */
  .sl-stadfesting .mg-inn-simareitur input:focus { outline: none; }
  .sl-stadfesting .bk-innskraning { max-width: none; margin: 0; padding: 0; background: none; border: 0; border-radius: 0; }

  /* ---------- fóturinn ---------- */
  .sl-fotur { position: absolute; left: 0; right: 0; bottom: 0; z-index: 20; padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); background: linear-gradient(rgba(29, 27, 24, 0), rgba(29, 27, 24, 0.92) 28%); }
  .sl-lina { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 0 6px 10px; min-height: 22px; }
  .sl-lina small { color: var(--muted); font-size: 14px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sl-lina strong { font-family: "Poppins", sans-serif; font-size: 20px; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .sl .sl-cta { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: 54px; border-radius: 100px; background-color: var(--sl-cta); color: var(--sl-cta-texti); font-family: "Poppins", sans-serif; font-size: 14px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; transition: transform 120ms var(--sl-ut), background-color 200ms var(--sl-ut), color 200ms var(--sl-ut); }
  .sl .sl-cta:active { transform: scale(0.97); }
  .sl .sl-cta[aria-disabled="true"] { background-color: rgba(211, 195, 152, 0.12); color: var(--gold); box-shadow: inset 0 0 0 1px rgba(211, 195, 152, 0.45); }
  .sl .sl-cta[aria-disabled="true"]:active { transform: none; }
  .sl-cta.bidur .sl-cta-texti::before { content: ""; display: inline-block; width: 14px; height: 14px; margin-right: 10px; vertical-align: -2px; border-radius: 50%; border: 2px solid currentColor; border-top-color: transparent; animation: slSnua 0.7s linear infinite; }
  .sl-hrista { animation: slHrista 320ms var(--sl-ut); }
  @keyframes slHrista { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }
  /* ---------- viðburðirnir og borðið (SimaVidburdir, SimaBord) ---------- */
  .sl-kaflamerki { display: flex; align-items: center; gap: 8px; margin: 20px 2px 10px !important; }
  .sl-hola h1 + .sl-kaflamerki { margin-top: 4px !important; }
  .sl-beint { width: 7px; height: 7px; border-radius: 50%; background-color: var(--spara); box-shadow: 0 0 0 3px rgba(76, 217, 123, 0.2); }
  .sl .sl-vkort { position: relative; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 12px; width: 100%; min-height: 112px; padding: 34px 16px 14px; margin-bottom: 10px; border-radius: 18px; overflow: hidden; text-align: left; box-shadow: inset 0 0 0 1px var(--line); isolation: isolate; transition: transform 140ms var(--sl-ut), box-shadow 220ms var(--sl-ut); }
  .sl .sl-vkort:active { transform: scale(0.98); }
  .sl-vkort img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
  /* Sama regla og leikjakortin: mjó slæða efst undir dagsetningunni, þétt neðst undir textanum */
  .sl-vkort::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to bottom, rgba(20, 19, 16, 0.82) 22px, rgba(20, 19, 16, 0) 46px), linear-gradient(to top, rgba(20, 19, 16, 0.92) 12%, rgba(20, 19, 16, 0.74) 62%, rgba(20, 19, 16, 0.2) 100%); }
  .sl-vkort-dags { position: absolute; top: 12px; left: 16px; font-family: "Poppins", sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gold); }
  .sl-vkort strong { display: block; font-family: "Poppins", sans-serif; font-size: 20px; letter-spacing: -0.02em; }
  .sl-vkort small { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--sl-texti); font-size: 14px; line-height: 1.35; margin-top: 2px; }
  .sl-vkort-verd { font-size: 15px; text-align: right; }
  .sl-vkort-verd em { display: block; font-style: normal; font-family: "Source Sans 3", sans-serif; font-weight: 400; font-size: 12px; color: var(--muted); }
  .sl .sl-vkort[aria-pressed="true"] { box-shadow: inset 0 0 0 2px var(--gold); }
  .sl-lidasia { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin: 0 -16px 10px; padding: 2px 16px; }
  .sl-lidasia::-webkit-scrollbar { display: none; }
  .sl .sl-lidasia button { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 12px 0 8px; border-radius: 100px; box-shadow: inset 0 0 0 1px var(--line); font-family: "Poppins", sans-serif; font-weight: 600; font-size: 13px; white-space: nowrap; transition: background-color 180ms var(--sl-ut), color 180ms var(--sl-ut); }
  .sl .sl-lidasia button.allir { padding: 0 14px; }
  .sl-lidasia img { width: 22px; height: 22px; object-fit: contain; }
  .sl .sl-lidasia button[aria-pressed="true"] { background-color: var(--sl-cta); color: var(--sl-cta-texti); box-shadow: none; }
  .sl-leikjalisti { animation: slSkipta 260ms var(--sl-ut); }
  .sl .sl-leikrod { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 12px; width: 100%; min-height: 64px; padding: 10px 14px 10px 10px; margin-bottom: 6px; border-radius: 16px; text-align: left; background-color: rgba(0, 0, 0, 0.18); box-shadow: inset 0 0 0 1px var(--hair); transition: transform 120ms var(--sl-ut), box-shadow 200ms var(--sl-ut); }
  .sl .sl-leikrod:active { transform: scale(0.98); }
  .sl .sl-leikrod[aria-pressed="true"] { box-shadow: inset 0 0 0 2px var(--gold); }
  .sl-merkin { position: relative; width: 44px; height: 40px; display: grid; place-items: center; }
  .sl-merkin img { width: 34px; height: 34px; object-fit: contain; }
  .sl-merkin.tvo img { position: absolute; width: 28px; height: 28px; }
  .sl-merkin.tvo img:first-child { left: 0; top: 0; }
  .sl-merkin.tvo img:last-child { right: 0; bottom: 0; }
  .sl-leikrod b { display: block; font-family: "Poppins", sans-serif; font-size: 15px; line-height: 1.2; }
  .sl-leikrod small { display: block; color: var(--muted); font-size: 13px; margin-top: 2px; }
  .sl-leikrod-klst { text-align: right; font-family: "Poppins", sans-serif; }
  .sl-leikrod-klst strong { display: block; font-size: 17px; font-variant-numeric: tabular-nums; }
  .sl-leikrod-klst em { display: block; font-style: normal; font-size: 12px; color: var(--muted); font-weight: 600; }
  .sl-beinagrind-listi span { display: block; height: 64px; margin-bottom: 6px; border-radius: 16px; background: linear-gradient(90deg, rgba(211, 195, 152, 0.06), rgba(211, 195, 152, 0.13), rgba(211, 195, 152, 0.06)); background-size: 200% 100%; animation: slGlampi 1.2s linear infinite; }
  .sl-leikupplysing { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; background-color: rgba(0, 0, 0, 0.18); margin-bottom: 16px; font-size: 14px; color: var(--sl-texti); }
  .sl-leikupplysing svg { color: var(--gold); flex: 0 0 auto; }
  .sl-leikupplysing b { color: var(--cream); font-family: "Poppins", sans-serif; }
  .sl .sl-komukort { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 12px; width: 100%; min-height: 72px; padding: 14px 16px; margin-bottom: 10px; border-radius: 18px; text-align: left; background-color: rgba(0, 0, 0, 0.2); box-shadow: inset 0 0 0 1px var(--line); transition: box-shadow 200ms var(--sl-ut), background-color 200ms var(--sl-ut), transform 120ms var(--sl-ut); }
  .sl .sl-komukort:active { transform: scale(0.98); }
  .sl-komukort b { display: block; font-family: "Poppins", sans-serif; font-size: 17px; }
  .sl-komukort small { color: var(--sl-texti); font-size: 14px; }
  .sl-komukort strong { font-family: "Poppins", sans-serif; font-size: 24px; font-variant-numeric: tabular-nums; }
  .sl .sl-komukort[aria-pressed="true"] { box-shadow: inset 0 0 0 2px var(--gold); background-color: rgba(211, 195, 152, 0.08); }
  .sl-dagpunktur { position: absolute; left: 50%; bottom: 4px; width: 5px; height: 5px; margin-left: -2.5px; border-radius: 50%; background-color: var(--spara); }
  .sl-dagpunktur-skyring { display: flex; align-items: center; gap: 8px; margin: 10px 4px 0 !important; color: var(--muted); font-size: 13px; }
  .sl-dagpunktur-skyring i { width: 6px; height: 6px; border-radius: 50%; background-color: var(--spara); }
  .sl-horfa { margin-top: 18px; padding: 14px 16px; border-radius: 18px; background-color: rgba(76, 217, 123, 0.08); box-shadow: inset 0 0 0 1px rgba(76, 217, 123, 0.3); }
  .sl-horfa p { font-size: 15px; line-height: 1.45; margin: 0 0 12px !important; }
  .sl-horfa p svg { color: var(--spara); vertical-align: -3px; }
  .sl-horfa b { font-family: "Poppins", sans-serif; }
  /* sætakort bingósins úr vélinni: fyrirsögnin er okkar, takkinn eins og aðaltakkinn */
  .sl-saetin { color-scheme: dark; }
  .sl-saetin .bk-q { display: none; }
  .sl-saetin .bk-actions { display: flex; flex-direction: column-reverse; gap: 14px; margin-top: 16px; }
  .sl-saetin .bk-actions .btn.solid { width: 100%; height: 54px; border-radius: 100px; }
  /* spurningunni um leikinn er svarað í tímanum, ekki aftur á staðfestingunni */
  .sl-stadfesting .bk-fbvakt { display: none; }
  /* ---------- Stella Artois svítan (SimaSvita) ---------- */
  .sl-kynning { position: relative; height: 210px; margin: 0 0 14px; border-radius: 22px; overflow: hidden; isolation: isolate; box-shadow: inset 0 0 0 1px var(--line); }
  .sl-kynning-bak { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; animation: slRek 9s var(--sl-ut) both; }
  @keyframes slRek { from { transform: scale(1.06); } }
  .sl-kynning::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(20, 19, 16, 0.05) 30%, rgba(20, 19, 16, 0.88)); }
  .sl-kynning-stella { position: absolute; top: 14px; left: 16px; width: 58px; filter: brightness(0) invert(0.92); }
  .sl .sl-kynning h1 { position: absolute; left: 16px; right: 16px; bottom: 14px; margin: 0; font-size: 24px; line-height: 1.1; }
  .sl-kynning h1 small { display: block; margin-top: 6px; font-family: "Source Sans 3", sans-serif; font-weight: 600; font-size: 14px; letter-spacing: 0; color: var(--gold); }
  .sl-flogur { display: flex; flex-wrap: wrap; gap: 6px; }
  .sl-flogur span { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px 0 10px; border-radius: 100px; background-color: rgba(0, 0, 0, 0.22); box-shadow: inset 0 0 0 1px var(--hair); font-size: 14px; }
  .sl-flogur svg { color: var(--gold); }
  .sl .sl-pakki { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 12px; width: 100%; min-height: 74px; padding: 12px 14px 12px 12px; margin-bottom: 8px; border-radius: 18px; text-align: left; background-color: rgba(0, 0, 0, 0.2); box-shadow: inset 0 0 0 1px var(--line); transition: transform 120ms var(--sl-ut), box-shadow 200ms var(--sl-ut), background-color 200ms var(--sl-ut); }
  .sl .sl-pakki:active { transform: scale(0.98); }
  .sl .sl-pakki[aria-pressed="true"] { box-shadow: inset 0 0 0 2px var(--gold); background-color: rgba(211, 195, 152, 0.08); }
  .sl-pakki-takn { width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; background-color: rgba(211, 195, 152, 0.1); color: var(--gold); }
  .sl-pakki b { display: block; font-family: "Poppins", sans-serif; font-size: 16px; line-height: 1.2; }
  .sl-pakki small { display: block; color: var(--sl-texti); font-size: 14px; margin-top: 2px; }
  .sl-pakki-verd { text-align: right; font-family: "Poppins", sans-serif; font-weight: 600; font-size: 15px; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .sl-pakki-verd em { display: block; font-style: normal; font-family: "Source Sans 3", sans-serif; font-weight: 600; font-size: 12px; color: var(--muted); }
  .sl-pakki-verd ins { display: block; text-decoration: none; font-size: 10px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--spara); }
  .sl-smaletur { color: var(--muted); font-size: 13px; line-height: 1.45; margin: 10px 4px 0 !important; }
  /* dagaræman */
  .sl-raema { display: flex; gap: 8px; overflow-x: auto; scroll-snap-type: x proximity; scroll-padding-inline: 16px; scrollbar-width: none; margin: 0 -16px; padding: 2px 16px; overscroll-behavior-x: contain; }
  .sl-raema::-webkit-scrollbar { display: none; }
  .sl .sl-raema button { position: relative; flex: 0 0 auto; width: 58px; height: 70px; border-radius: 16px; display: grid; place-items: center; align-content: center; gap: 2px; scroll-snap-align: start; box-shadow: inset 0 0 0 1px var(--line); background-color: rgba(0, 0, 0, 0.18); transition: background-color 180ms var(--sl-ut), color 180ms var(--sl-ut), transform 120ms var(--sl-ut); }
  .sl .sl-raema button:active { transform: scale(0.95); }
  .sl .sl-raema button:disabled { opacity: 0.35; }
  .sl-raema small { font-size: 12px; font-weight: 600; color: var(--muted); }
  .sl-raema strong { font-family: "Poppins", sans-serif; font-size: 20px; font-variant-numeric: tabular-nums; }
  .sl .sl-raema button[aria-pressed="true"] { background-color: var(--sl-cta); color: var(--sl-cta-texti); box-shadow: none; }
  .sl .sl-raema button[aria-pressed="true"] small { color: rgba(48, 47, 47, 0.75); }
  .sl-raema .sl-dagpunktur { bottom: 7px; }
  .sl-tl-tomt { margin-top: 18px !important; }
  .sl-tl-beinagrind { display: grid; gap: 8px; margin-top: 18px; }
  .sl-tl-beinagrind span { height: 40px; margin-left: 52px; border-radius: 10px; background: linear-gradient(90deg, rgba(211, 195, 152, 0.06), rgba(211, 195, 152, 0.13), rgba(211, 195, 152, 0.06)); background-size: 200% 100%; animation: slGlampi 1.2s linear infinite; }
  /* tímalína dagsins */
  .sl-tl { position: relative; margin: 22px 0 0 2px; }
  .sl-tl-klst { position: absolute; left: 0; width: 44px; transform: translateY(-50%); font-family: "Poppins", sans-serif; font-size: 12px; font-weight: 600; color: var(--muted); font-variant-numeric: tabular-nums; }
  .sl-tl-strik { position: absolute; left: 52px; right: 0; height: 1px; background-color: var(--hair); }
  .sl .sl-tl-rauf { position: absolute; left: 52px; right: 0; display: flex; align-items: flex-start; padding: 0 0 0 12px; border-radius: 10px; font-family: "Poppins", sans-serif; font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; color: rgba(211, 195, 152, 0.55); transition: background-color 160ms var(--sl-ut); }
  .sl-tl-rauf span { transform: translateY(-50%); font-size: 11px; }
  .sl .sl-tl-rauf:active { background-color: rgba(211, 195, 152, 0.12); }
  .sl-tl-upptekid { position: absolute; left: 58px; right: 6px; padding: 7px 12px; border-radius: 12px; pointer-events: none; overflow: hidden; background: repeating-linear-gradient(-45deg, rgba(242, 236, 221, 0.05) 0 6px, rgba(242, 236, 221, 0.02) 6px 12px); box-shadow: inset 0 0 0 1px var(--hair); color: var(--muted); font-size: 13px; font-weight: 600; }
  .sl-tl-tilbod { position: absolute; left: 52px; right: 0; border-radius: 12px; pointer-events: none; background-color: rgba(211, 195, 152, 0.07); box-shadow: inset 2px 0 0 var(--gold); }
  .sl-tl-tilbod span { position: absolute; right: 10px; top: 8px; font-family: "Poppins", sans-serif; font-size: 10px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gold); }
  .sl-tl-leikur { position: absolute; left: 52px; right: 0; height: 0; border-top: 2px solid var(--spara); pointer-events: none; }
  .sl-tl-leikur span { position: absolute; right: 0; top: -12px; display: inline-flex; align-items: center; gap: 5px; max-width: 100%; padding: 2px 9px; border-radius: 100px; background-color: var(--ink); box-shadow: inset 0 0 0 1px rgba(76, 217, 123, 0.5); font-size: 12px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .sl-tl-leikur svg { color: var(--spara); flex: 0 0 auto; }
  .sl-tl-ykkar { position: absolute; left: 58px; right: 6px; z-index: 2; padding: 8px 12px; border-radius: 12px; pointer-events: none; overflow: hidden; background-color: var(--sl-cta); color: var(--sl-cta-texti); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35); transform-origin: top; animation: slBlokk 420ms var(--sl-ios) both; }
  @keyframes slBlokk { from { transform: scaleY(0.6); opacity: 0; } }
  .sl-tl-ykkar b { display: block; font-family: "Poppins", sans-serif; font-size: 17px; font-variant-numeric: tabular-nums; }
  .sl-tl-ykkar small { font-size: 13px; font-weight: 600; }
  /* gæsunartilboðið í fætinum */
  .sl-tilbod { margin: 0 0 10px; padding: 12px 14px; border-radius: 16px; background-color: var(--char); box-shadow: inset 0 0 0 1px var(--gold), 0 12px 30px rgba(0, 0, 0, 0.4); animation: slSkipta 300ms var(--sl-ut); }
  .sl-tilbod p { font-size: 15px; line-height: 1.35; margin: 0 0 10px !important; }
  .sl-tilbod b { font-family: "Poppins", sans-serif; }
  .sl .sl-tilbod .sl-pillur button { height: 38px; }
  /* lykilkortið: bakhlið kortsins á svítunni */
  .sl-kort-baki.sl-lykill { grid-template-columns: 96px 1fr; overflow: hidden; background: radial-gradient(circle at 0% 50%, rgba(211, 195, 152, 0.2), transparent 60%), var(--char); }
  .sl-lykill-stjarna { display: grid; place-items: center; align-content: center; gap: 6px; border-right: 1px solid var(--hair); color: var(--gold); }
  .sl-lykill-stjarna span { font-family: "Poppins", sans-serif; font-weight: 700; font-size: 10px; letter-spacing: 0.22em; }
  .sl-lykill-efni { display: flex; flex-direction: column; justify-content: center; gap: 4px; min-width: 0; padding: 38px 14px 22px; }
  .sl-lykill-efni .sl-merki { position: absolute; top: 15px; left: 110px; }
  .sl-lykill-efni strong { font-family: "Poppins", sans-serif; font-size: 26px; line-height: 1; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
  .sl-lykill-efni span:not(.sl-merki) { font-size: 15px; color: var(--sl-texti); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .sl-lykill-rond { position: absolute; left: 96px; right: 0; bottom: 10px; height: 6px; background-color: rgba(211, 195, 152, 0.16); }
  .sl-toast { position: absolute; left: 50%; bottom: 140px; z-index: 60; transform: translateX(-50%); padding: 10px 16px; border-radius: 100px; background-color: rgba(20, 19, 16, 0.94); color: var(--cream); font-size: 14px; white-space: nowrap; animation: slSkipta 300ms var(--sl-ut); }

  @media (hover: hover) and (pointer: fine) {
    .sl .sl-grind button:not(:disabled):not([aria-pressed="true"]):hover, .sl .sl-pillur button:not([aria-pressed="true"]):hover, .sl .sl-dagar button:not(:disabled):not([aria-pressed="true"]):hover { background-color: rgba(211, 195, 152, 0.08); }
  }
  /* Mjóir símar (320 til 370 px): merkin fá meira pláss, aldrei yfir línuna */
  @media (max-width: 370px) {
    .sl .sl-reitur { padding-left: 6px; padding-right: 6px; }
    .sl-nr { gap: 4px; letter-spacing: 0.04em; }
    .sl-nr b { width: 14px; height: 14px; }
  }
  @media (max-width: 340px) {
    .sl-nr { font-size: 9px; letter-spacing: 0.02em; }
  }
  /* Lágir símar (iPhone SE, 667 px) */
  @media (max-height: 720px) {
    .sl .sl-reitur { min-height: 58px; }
    .sl-hola { padding-top: 12px; }
    .sl h1 { font-size: 22px; }
    .sl .sl-dagar button { height: 40px; }
    .sl-fjoldi { padding: 16px; }
    .sl-fjoldi output { font-size: 46px; }
    .sl .sl-cta { height: 50px; }
  }
  @media (prefers-reduced-motion: reduce) {
    .sl *, .sl *::before, .sl *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; animation-iteration-count: 1 !important; }
  }
}

/* ---------- /boka/val í síma: kortin eins og í prótótýpunni (Villi 26/9) ----------
   Nýju myndirnar, engin myndbönd, jöfn kort með fyrirsögn í setningu. PC
   ber coverið og sér þessi kort aldrei. */
@media (max-width: 860px) {
  .bk-valq { text-align: left; margin-bottom: 16px !important; }
  .bk-valq .lina2 { font-size: 26px; line-height: 1.12; letter-spacing: -0.02em; text-transform: none; color: var(--cream); }
  .bk-valgrid:not(.opid) { gap: 10px; }
  .bk-valgrid:not(.opid) > .bk-valkort { aspect-ratio: auto; height: 120px; border: 0; border-radius: 18px; box-shadow: inset 0 0 0 1px var(--line); opacity: 1; transition: transform 160ms cubic-bezier(0.23, 1, 0.32, 1); }
  .bk-valgrid:not(.opid) > .bk-valkort:active { transform: scale(0.97); }
  .bk-valgrid:not(.opid) > .bk-valkort::before { background: linear-gradient(to top, rgba(20, 19, 16, 0.88), rgba(20, 19, 16, 0.25) 75%); }
  .bk-valgrid:not(.opid) > .bk-valkort .nafn { left: 16px; right: 16px; bottom: 12px; font-size: 19px; letter-spacing: -0.02em; color: var(--cream); }
  .bk-valgrid:not(.opid) > .bk-valkort .undirn { font-size: 14px; font-weight: 400; letter-spacing: 0; color: #c2bbae; margin-top: 2px; }
  .bk-valgrid:not(.opid) > .bk-valkort .bk-valverd { top: 10px; right: 10px; font-size: 12px; color: var(--cream); background-color: rgba(20, 19, 16, 0.6); }
}

/* ============================================================
   LÁGIR SKJÁIR Í TÖLVU (Villi 27/9: „bókunarvélin fittar ekki" á
   fartölvu). Fartölvur með 125–150% stækkun gefa vafra um 1280×600
   til 1536×730. Allt var mælt fyrir breidd, ekki hæð: coverið á
   /boka/val ýtti Bóka út fyrir skjáinn og glugginn skar efnið undir
   fætinum. Hér þjappast aðeins bil og stærðir, útlitið er það sama.
   Stórir skjáir og síminn eru óbreyttir.
   ============================================================ */
@media (min-width: 1025px) {
  /* skrunflötur gluggans fær gulltón í stað hvítrar sjálfgefinnar stiku */
  .bk-gl-efni {
    scrollbar-width: thin;
    scrollbar-color: rgba(211, 195, 152, 0.35) transparent;
  }
}
@media (min-width: 861px) and (max-height: 820px) {
  .section.bk-section {
    padding-top: 104px;
  }
  .bk-section .gw-progress {
    margin-bottom: 1rem;
  }
  .bk-valq {
    margin-bottom: 1rem !important;
  }
  .bk-valq .lina2 {
    font-size: clamp(1.5rem, 4.2vh, 2.6rem);
  }
  .bk-v5-svid {
    min-height: min(27rem, calc(100vh - 240px));
  }
  .bk-v5-inni {
    padding: clamp(1.4rem, 3.4vh, 3rem) 3.2rem;
  }
  .bk-v5-setning {
    font-size: clamp(1.8rem, 5.2vh, 3rem);
    margin-bottom: clamp(0.8rem, 2vh, 1.5rem);
  }
  .bk-v5-leidir {
    margin-bottom: clamp(0.8rem, 2vh, 1.6rem);
  }
}
@media (min-width: 1025px) and (max-height: 820px) {
  .bk-gl-skuggi {
    padding: 0.75rem 1rem;
  }
  .bk-gl {
    max-height: calc(100vh - 1.5rem);
  }
  .bk-gl-efni {
    padding: clamp(1.2rem, 3vh, 2.6rem) 2.6rem 1.4rem;
  }
  .bk-gl .gw-progress {
    margin-bottom: clamp(0.8rem, 2vh, 1.9rem);
  }
  .bk-gl .bk-q {
    margin-bottom: clamp(0.7rem, 1.8vh, 1.4rem);
    font-size: clamp(1.5rem, 4.4vh, 2.2rem);
  }
  .bk-gl-fotur {
    gap: 0.5rem;
    padding: 0.7rem 2.6rem 0.9rem;
  }
}

/* ============================================================
   MIÐINN Í TÖLVU (Villi 27/9, design/boka-tolva/midi.html)
   Sívalningurinn í fæti gluggans og „Bókunin þín" á staðfestingunni
   verða miði, sama útfærsla og í símanum. Ferlið er óbreytt.
   Hreyfingarnar eru úr hópareiknivélinni (hopagluggi.css): ný lína
   rennur inn frá vinstri eins og hg-lina, breytt gildi rís eins og
   hg-ris, sami ferill (--ease) og sömu tímar.
   ============================================================ */
@media (min-width: 1025px) {
  /* ---------- fóturinn: miðinn og takkinn hlið við hlið ---------- */
  .bk-gl-fotur.med-midi {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1.4rem;
  }
  .bk-gl-fotur.med-midi .pl-continue {
    white-space: nowrap;
  }
  .bk-pcmidi {
    position: relative;
    display: grid;
    grid-template-columns: 7.6rem minmax(0, 1fr) auto;
    min-height: 4.6rem;
    border-radius: 18px;
    background: linear-gradient(125deg, rgba(211, 195, 152, 0.14), rgba(211, 195, 152, 0) 55%), var(--char-2);
    box-shadow: inset 0 0 0 1px var(--line);
    text-align: left;
  }
  .bk-pcmidi-stubbur {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0.7rem 0.8rem 0.7rem 1.2rem;
    border-right: 2px dashed rgba(211, 195, 152, 0.3);
    background-color: rgba(0, 0, 0, 0.14);
    border-radius: 18px 0 0 18px;
  }
  /* götin: sami litur og glugginn svo miðinn virðist gataður */
  .bk-pcmidi-stubbur::before,
  .bk-pcmidi-stubbur::after {
    content: "";
    position: absolute;
    right: -11px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: var(--char);
  }
  .bk-pcmidi-stubbur::before {
    top: -11px;
  }
  .bk-pcmidi-stubbur::after {
    bottom: -11px;
  }
  .bk-pcmidi-stubbur strong {
    font-family: "Poppins", sans-serif;
    font-size: 1.65rem;
    line-height: 1;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
    color: var(--cream);
  }
  .bk-pcmidi-stubbur strong.autt {
    color: rgba(181, 174, 159, 0.45);
  }
  .bk-pcmidi-stubbur em {
    margin-top: 0.35rem;
    font-style: normal;
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--muted);
  }
  .bk-pcmidi-listi {
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    gap: 0.35rem 1.3rem;
    min-width: 0;
    padding: 0.7rem 1.2rem;
  }
  .bk-pcmidi-lina {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.95rem;
    color: var(--cream);
    white-space: nowrap;
    animation: bkMidiLina 0.3s var(--ease) both;
  }
  .bk-pcmidi-lina svg {
    flex: 0 0 auto;
    color: var(--gold);
  }
  .bk-pcmidi-lina.auki {
    color: var(--gold);
    font-weight: 600;
  }
  .bk-pcmidi-horn {
    display: grid;
    justify-items: end;
    align-content: center;
    gap: 0.3rem;
    padding: 0.6rem 1rem 0.6rem 0;
  }
  .bk-pcmidi-verd {
    display: inline-flex;
    align-items: center;
    height: 1.9rem;
    padding: 0 0.75rem;
    border-radius: 100px;
    background-color: rgba(211, 195, 152, 0.14);
    font-family: "Poppins", sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--cream);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
  }
  .bk-pcmidi-breyta {
    border: 0;
    background: none;
    padding: 0.15rem 0;
    font-family: "Poppins", sans-serif;
    font-size: 0.76rem;
    font-weight: 600;
    color: var(--gold);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: rgba(211, 195, 152, 0.4);
    cursor: pointer;
  }
  .bk-pcmidi-ris {
    animation: bkMidiRis 0.28s var(--ease) both;
  }
  @keyframes bkMidiLina {
    from {
      opacity: 0;
      transform: translateX(-5px);
    }
  }
  @keyframes bkMidiRis {
    from {
      opacity: 0;
      transform: translateY(5px);
    }
  }

  /* ---------- frátektarklukkan við krossinn ---------- */
  .bk-gl-hald {
    position: absolute;
    z-index: 3;
    top: 0.95rem;
    right: 3.6rem;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    height: 2rem;
    padding: 0 0.8rem;
    border-radius: 100px;
    background-color: rgba(211, 195, 152, 0.14);
    color: var(--gold);
    font-family: "Poppins", sans-serif;
    font-size: 0.82rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    animation: bkMidiRis 0.28s var(--ease) both;
  }
  .bk-gl-hald.bokad {
    background-color: rgba(76, 217, 123, 0.14);
    color: var(--spara, #4cd97b);
  }

  /* ---------- stóri miðinn í stað „Bókunin þín" ---------- */
  .bk-layout.med-midi .bk-summary:has(.bk-stormidi) {
    padding: 0;
    border: 0;
    background: none;
    animation: none;
  }
  .bk-stormidi {
    position: relative;
    border-radius: 22px;
    background: linear-gradient(160deg, rgba(211, 195, 152, 0.16), rgba(211, 195, 152, 0) 55%), var(--char-2);
    box-shadow:
      inset 0 0 0 1px var(--line),
      0 24px 50px rgba(0, 0, 0, 0.28);
    text-align: left;
    animation: bkMidiRis 0.34s var(--ease) both;
  }
  .bk-stormidi-toppur {
    position: relative;
    padding: 1.4rem 1.6rem 1.3rem;
    border-bottom: 2px dashed rgba(211, 195, 152, 0.3);
  }
  .bk-stormidi-toppur::before,
  .bk-stormidi-toppur::after {
    content: "";
    position: absolute;
    bottom: -12px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background-color: var(--char);
  }
  .bk-stormidi-toppur::before {
    left: -12px;
  }
  .bk-stormidi-toppur::after {
    right: -12px;
  }
  .bk-stormidi-merki {
    font-family: "Poppins", sans-serif;
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--gold);
  }
  .bk-stormidi-toppur strong {
    display: block;
    margin-top: 0.55rem;
    font-family: "Poppins", sans-serif;
    font-size: 3rem;
    line-height: 1;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
    color: var(--cream);
  }
  .bk-stormidi-toppur em {
    display: block;
    margin-top: 0.45rem;
    font-style: normal;
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--muted);
  }
  .bk-stormidi-verd,
  .bk-stormidi-bokad {
    position: absolute;
    top: 1.15rem;
    right: 1.15rem;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    height: 1.9rem;
    padding: 0 0.75rem;
    border-radius: 100px;
    background-color: rgba(211, 195, 152, 0.14);
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-size: 0.92rem;
    color: var(--cream);
    font-variant-numeric: tabular-nums;
  }
  .bk-stormidi-bokad {
    background-color: rgba(76, 217, 123, 0.14);
    color: var(--spara, #4cd97b);
    animation: bkMidiRis 0.34s 0.2s var(--ease) both;
  }
  .bk-stormidi-listi {
    display: grid;
    gap: 0.65rem;
    padding: 1.35rem 1.6rem 0.4rem;
  }
  .bk-stormidi-listi .bk-pcmidi-lina {
    font-size: 1rem;
    white-space: normal;
  }
  /* línurnar koma inn hver á eftir annarri, eins og tímarnir í hópareiknivélinni */
  .bk-stormidi-listi .bk-pcmidi-lina:nth-child(2) {
    animation-delay: 0.04s;
  }
  .bk-stormidi-listi .bk-pcmidi-lina:nth-child(3) {
    animation-delay: 0.08s;
  }
  .bk-stormidi-listi .bk-pcmidi-lina:nth-child(4) {
    animation-delay: 0.12s;
  }
  .bk-stormidi-listi .bk-pcmidi-lina:nth-child(n + 5) {
    animation-delay: 0.16s;
  }
  .bk-stormidi-verdlinur {
    display: grid;
    gap: 0.3rem;
    padding: 0.9rem 1.6rem 0;
  }
  .bk-stormidi-verdlinur div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    font-size: 0.88rem;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
  }
  .bk-stormidi-verdlinur div.spara span:last-child {
    color: var(--spara, #4cd97b);
  }
  .bk-stormidi-alls {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin: 0.9rem 1.6rem 0;
    padding-top: 0.9rem;
    border-top: 1px solid var(--hair, rgba(211, 195, 152, 0.14));
  }
  .bk-stormidi-alls span {
    font-family: "Poppins", sans-serif;
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--gold);
  }
  .bk-stormidi-alls strong {
    font-family: "Poppins", sans-serif;
    font-size: 1.85rem;
    color: var(--gold);
    font-variant-numeric: tabular-nums;
  }
  .bk-stormidi-afbokun {
    display: block;
    padding: 0.8rem 1.6rem 1.4rem;
    font-size: 0.8rem;
    color: var(--muted);
  }

  /* kvittunin: miðinn til vinstri, hakið og textinn til hægri */
  .bk-layout.stadfesta.med-midi .bk-done {
    text-align: left;
    padding-top: 0.4rem;
  }
  .bk-layout.stadfesta.med-midi .bk-done .check {
    margin-left: 0;
  }

  @media (max-height: 820px) {
    .bk-stormidi-toppur strong {
      font-size: 2.4rem;
    }
    .bk-stormidi-listi {
      gap: 0.45rem;
      padding-top: 1rem;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .bk-pcmidi-lina,
    .bk-pcmidi-ris,
    .bk-stormidi,
    .bk-stormidi-bokad,
    .bk-gl-hald {
      animation: none;
    }
  }
}

/* ---------- Skorkortið í fæti gluggans (Villi 27/9) ----------
   Sama kort og í símanum: hólf með númeri og merki, gildið rís inn
   þegar það er valið, gullstrikið undir hólfinu sem er næst. Á
   staðfestingunni flettist stóri miðinn inn, sama fletting og kortið
   í símanum (rotateY, iOS-ferill). */
@media (min-width: 1025px) {
  .bk-pcskor {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto 1fr;
    border-radius: 18px;
    background-color: var(--char-2);
    box-shadow: inset 0 0 0 1px var(--line);
    overflow: hidden;
    text-align: left;
  }
  .bk-pcskor-haus {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    padding: 0.5rem 1.1rem;
    border-bottom: 1px solid var(--hair, rgba(211, 195, 152, 0.14));
  }
  .bk-pcskor-haus span {
    font-family: "Poppins", sans-serif;
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--gold);
  }
  .bk-pcskor-holf {
    display: grid;
    min-width: 0;
  }
  .bk-pcskor-reitur {
    position: relative;
    display: grid;
    grid-template-rows: auto 1fr;
    gap: 0.3rem;
    min-width: 0;
    min-height: 4rem;
    padding: 0.55rem 0.8rem 0.65rem;
    border-right: 1px solid var(--hair, rgba(211, 195, 152, 0.14));
    transition: background-color 0.24s var(--ease);
  }
  .bk-pcskor-reitur.nuna {
    background-color: rgba(211, 195, 152, 0.08);
  }
  .bk-pcskor-reitur::after {
    content: "";
    position: absolute;
    left: 0.8rem;
    right: 0.8rem;
    bottom: 0;
    height: 3px;
    border-radius: 3px 3px 0 0;
    background-color: var(--gold);
    transform: scaleX(0);
    transition: transform 0.32s var(--ease);
  }
  .bk-pcskor-reitur.nuna::after {
    transform: scaleX(1);
  }
  .bk-pcskor-nr {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    min-width: 0;
    font-family: "Poppins", sans-serif;
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--muted);
  }
  .bk-pcskor-nr > span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .bk-pcskor-nr b {
    flex: 0 0 auto;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 0.56rem;
    letter-spacing: 0;
    box-shadow: inset 0 0 0 1px var(--line);
    color: var(--gold);
    transition:
      background-color 0.24s var(--ease),
      color 0.24s var(--ease);
  }
  .bk-pcskor-reitur.buinn .bk-pcskor-nr b {
    background-color: var(--gold);
    color: var(--char);
    box-shadow: none;
  }
  .bk-pcskor-gildi {
    align-self: end;
    min-width: 0;
    font-family: "Poppins", sans-serif;
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.15;
    color: var(--cream);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .bk-pcskor-gildi small {
    display: block;
    font-family: "Source Sans 3", sans-serif;
    font-size: 0.76rem;
    font-weight: 400;
    color: var(--muted);
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .bk-pcskor-gildi.autt::before {
    content: "—";
    color: rgba(181, 174, 159, 0.4);
  }
  .bk-pcskor .bk-pcmidi-horn {
    grid-row: 2;
    grid-column: 2;
    padding: 0.5rem 1rem;
    border-left: 1px solid var(--hair, rgba(211, 195, 152, 0.14));
  }

  /* stóri miðinn flettist inn á staðfestingunni, eins og kortið í símanum */
  .bk-layout.med-midi .bk-summary:has(.bk-stormidi) {
    perspective: 1200px;
  }
  .bk-stormidi {
    transform-origin: center;
    animation: bkMidiFlett 0.76s cubic-bezier(0.32, 0.72, 0, 1) both;
  }
  @keyframes bkMidiFlett {
    from {
      opacity: 0;
      transform: rotateY(-90deg);
    }
    35% {
      opacity: 1;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .bk-stormidi {
      animation: none;
    }
    .bk-pcskor-reitur,
    .bk-pcskor-reitur::after,
    .bk-pcskor-nr b {
      transition: none;
    }
  }
}

/* Spjaldtölva (861 til 1024 px): stikan neðst ber Áfram takkann, svo sami
   takkinn í skrefinu sjálfu hverfur. Eitt aðalkall á skjánum (Villi 27/9). */
@media (min-width: 861px) and (max-width: 1024px) {
  body:has(.bk-stika) .bk-layout .bk-main > .bk-sum-afram {
    display: none;
  }
}

/* Framundan kallaður úr leiðsögninni á forsíðunni (#framundan, 27/9):
   gyllt rönd sem dofnar, svo augað finni kassann eftir skrunið. */
@keyframes bkFrKall {
  0%, 55% { box-shadow: inset 0 0 0 2px var(--gold), 0 0 0 6px rgba(211, 195, 152, 0.18); }
  100% { box-shadow: inset 0 0 0 1px var(--line), 0 0 0 0 rgba(211, 195, 152, 0); }
}
.bk-v5-hin > article.bk-fr-framundan.kallad {
  animation: bkFrKall 2.2s var(--ease) both;
}
@media (prefers-reduced-motion: reduce) {
  .bk-v5-hin > article.bk-fr-framundan.kallad {
    animation: none;
    box-shadow: inset 0 0 0 2px var(--gold);
  }
}

/* ============================================================
   PC-FORSÍÐAN: SALIRNIR (átt 5, Villi 3/10)
   Skjárinn er húsið: þrír salir hlið við hlið og borð og svíta í
   mjórri dálki. Valið opnast inni í salnum. Undir: Framundan og
   Hópatilboð í sama máli. Allt er inni í min-width: 861px, síminn
   (≤860px) er óbreyttur. Sjá design/boka-pc/5-salirnir-heild.html.
   ============================================================ */
@media (min-width: 861px) {
  /* Salirnir fylla fyrsta skjáinn og stökkhnapparnir sjást undir þeim.
     Hausinn er hærri á háum skjám, svo frádrátturinn fylgir hæðinni. */
  .bk-v5.bk-sal {
    --sal-h: clamp(400px, calc(100vh - 345px), 700px);
  }
  @media (max-height: 760px) {
    .bk-v5.bk-sal {
      --sal-h: clamp(400px, calc(100vh - 270px), 700px);
    }
  }
  /* Takkar erfa letur síðunnar, Poppins er sett sérstaklega þar sem það á við */
  :where(.bk-v5.bk-sal) button {
    font-family: inherit;
  }
  .bk-sal-salir {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 0.72fr;
    gap: 10px;
    height: var(--sal-h);
  }
  .bk-sal-salur {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    border-radius: 20px;
    background-color: #2b2924;
    box-shadow: inset 0 0 0 1px var(--hair);
  }
  .bk-sal-salur > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -2;
    transition: transform 0.6s var(--ease);
  }
  .bk-sal-salur::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(
      180deg,
      rgba(23, 19, 16, 0.12) 0%,
      rgba(23, 19, 16, 0.25) 35%,
      rgba(23, 19, 16, 0.92) 100%
    );
  }
  /* Hinir salirnir dofna þegar einn er opinn, músin lýsir þá aftur */
  .bk-sal-salur::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 3;
    background-color: rgba(23, 19, 16, 0.45);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.26s ease;
  }
  .bk-sal-salir.valid .bk-sal-salur:not(.opid)::after {
    opacity: 1;
  }
  @media (hover: hover) and (pointer: fine) {
    .bk-sal-salir.valid .bk-sal-salur:not(.opid):hover::after {
      opacity: 0.25;
    }
    .bk-sal-salur:hover > img {
      transform: scale(1.035);
    }
    .bk-sal-salur:hover .bk-sal-opna .sja {
      background-color: var(--gold);
      color: #302f2f;
    }
  }
  .bk-sal-opna {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 0.35rem;
    padding: 1.4rem;
    border: 0;
    border-radius: 20px;
    background: none;
    color: var(--cream);
    text-align: left;
    cursor: pointer;
    transition: opacity 0.2s ease;
  }
  .bk-sal-salur.opid .bk-sal-opna {
    opacity: 0;
    pointer-events: none;
  }
  .bk-sal-opna h4 {
    font-family: "Poppins", sans-serif;
    font-size: clamp(1.45rem, 1.9vw, 1.85rem);
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: -0.02em;
    margin: 0;
    color: var(--cream);
  }
  .bk-sal-opna .lyst {
    color: var(--muted);
    font-size: 1rem;
    line-height: 1.35;
    max-width: 30ch;
  }
  .bk-sal-opna .fra {
    margin-top: 0.4rem;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.2rem 0.55rem;
  }
  .bk-sal-opna .fra b {
    font-family: "Poppins", sans-serif;
    font-size: 1.45rem;
    font-weight: 700;
  }
  .bk-sal-opna .fra small {
    color: var(--muted);
    font-size: 0.92rem;
  }
  .bk-sal-opna .sja {
    margin-top: 0.75rem;
    display: inline-flex;
    gap: 0.5rem;
    padding: 0.7rem 1.1rem;
    border-radius: 999px;
    box-shadow: inset 0 0 0 1px var(--gold);
    color: var(--gold);
    font-family: "Poppins", sans-serif;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    transition:
      background-color 0.16s ease,
      color 0.16s ease;
  }
  .bk-sal-afsl {
    position: absolute;
    top: 1.1rem;
    left: 1.1rem;
    z-index: 2;
    font-family: "Poppins", sans-serif;
    font-size: 0.82rem;
    font-weight: 700;
    padding: 0.42rem 0.65rem;
    border-radius: 999px;
    color: #10241a;
    background-color: var(--spara, #4cd97b);
  }
  .bk-sal-samskeyti {
    position: absolute;
    top: 1.1rem;
    right: 1.1rem;
    z-index: 2;
    font-family: "Poppins", sans-serif;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 0.42rem 0.65rem;
    border-radius: 999px;
    color: var(--cream);
    background-color: rgba(23, 19, 16, 0.6);
  }

  /* Stillingarnar renna upp innan salarins (transform eitt og sér) */
  .bk-sal-stilla {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 4;
    padding: 1.15rem 1.3rem 1.3rem;
    background-color: var(--char);
    border-radius: 18px 18px 20px 20px;
    box-shadow: 0 -18px 40px rgba(0, 0, 0, 0.35);
    transform: translateY(102%);
    visibility: hidden;
    transition:
      transform 0.22s var(--ease),
      visibility 0s linear 0.22s;
  }
  .bk-sal-salur.opid .bk-sal-stilla,
  .bk-sal-auka-stilla.opid .bk-sal-stilla {
    transform: none;
    visibility: visible;
    transition:
      transform 0.32s var(--ease),
      visibility 0s;
  }
  .bk-sal-stilla-haus {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.6rem;
  }
  .bk-sal-stilla h3 {
    font-family: "Poppins", sans-serif;
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.1;
    margin: 0;
    color: var(--cream);
  }
  .bk-sal-stilla-haus p {
    color: var(--muted);
    font-size: 0.95rem;
    margin: 0.2rem 0 0;
  }
  .bk-sal-loka {
    flex: none;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 50%;
    border: 0;
    background-color: transparent;
    box-shadow: inset 0 0 0 1px var(--line);
    color: var(--muted);
    font-size: 1.3rem;
    line-height: 1;
    cursor: pointer;
  }
  .bk-sal-loka:hover {
    color: var(--cream);
  }
  .bk-sal-merki {
    margin: 0.85rem 0 0.45rem;
    font-family: "Poppins", sans-serif;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--gold);
  }
  .bk-sal-lengdir {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
  }
  .bk-sal-lengdir.tvaer {
    grid-template-columns: repeat(2, 1fr);
  }
  .bk-sal-lengdir button,
  .bk-sal-tolur button {
    border: 0;
    background-color: transparent;
    color: var(--cream);
    box-shadow: inset 0 0 0 1px var(--line);
    cursor: pointer;
    transition:
      background-color 0.14s ease,
      color 0.14s ease,
      transform 0.14s var(--ease);
  }
  .bk-sal-lengdir button {
    display: grid;
    justify-items: center;
    gap: 0.2rem;
    padding: 0.55rem 0.25rem;
    border-radius: 12px;
  }
  .bk-sal-lengdir button b {
    font-family: "Poppins", sans-serif;
    font-size: 1rem;
    font-weight: 700;
  }
  .bk-sal-lengdir button span {
    font-size: 0.9rem;
    color: var(--muted);
  }
  .bk-sal-tolur {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 6px;
  }
  .bk-sal-tolur-val {
    display: contents;
  }
  .bk-sal-tolur button {
    height: 2.5rem;
    border-radius: 12px;
    font-family: "Poppins", sans-serif;
    font-size: 1rem;
    font-weight: 700;
  }
  .bk-sal-lengdir button:active,
  .bk-sal-tolur button:active {
    transform: scale(0.96);
  }
  @media (hover: hover) and (pointer: fine) {
    .bk-sal-lengdir button:hover,
    .bk-sal-tolur button:hover {
      background-color: rgba(211, 195, 152, 0.1);
    }
  }
  .bk-sal-lengdir button[aria-pressed="true"],
  .bk-sal-tolur button[aria-checked="true"] {
    background-color: var(--gold);
    color: #302f2f;
    box-shadow: none;
  }
  .bk-sal-lengdir button[aria-pressed="true"] span {
    color: #4b4436;
  }
  .bk-sal-tolur button[aria-disabled="true"] {
    opacity: 0.4;
    cursor: not-allowed;
  }
  /* Fleiri en flýtitölurnar: plús og mínus í síðustu tveimur reitunum,
     telur upp að hámarki salarins (Villi 3/10) */
  .bk-sal-fleiri {
    grid-column: span 2;
    display: grid;
    grid-template-columns: 1.6rem 1fr 1.6rem;
    align-items: center;
    border-radius: 12px;
    box-shadow: inset 0 0 0 1px var(--line);
  }
  .bk-sal-fleiri.virkt {
    background-color: var(--gold);
    color: #302f2f;
    box-shadow: none;
  }
  .bk-sal-tolur .bk-sal-fleiri button {
    height: 100%;
    box-shadow: none;
    font-size: 1.15rem;
    color: inherit;
  }
  .bk-sal-fleiri output {
    text-align: center;
    font-family: "Poppins", sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--muted);
  }
  .bk-sal-fleiri.virkt output {
    color: #302f2f;
  }
  /* Mjói dálkurinn (borð og svíta): fimm reitir í röð, 1 til 8 og
     plúsinn í síðustu tveimur */
  .bk-sal-auka-stilla .bk-sal-tolur {
    grid-template-columns: repeat(5, 1fr);
  }
  .bk-sal-auka-stilla .bk-sal-fleiri {
    grid-template-columns: 1.4rem 1fr 1.4rem;
  }
  .bk-sal-heild {
    margin-top: 0.85rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
    gap: 0 0.5rem;
    min-height: 1.8rem;
  }
  .bk-sal-heild strong {
    white-space: nowrap;
    font-family: "Poppins", sans-serif;
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--cream);
  }
  .bk-sal-heild > span:not(.bk-sal-vantar) {
    color: var(--muted);
    font-size: 0.9rem;
    text-align: right;
  }
  .bk-sal-heild em {
    display: block;
    font-style: normal;
    font-weight: 600;
    color: var(--spara, #4cd97b);
  }
  .bk-sal-vantar {
    color: var(--gold);
    font-weight: 600;
    font-size: 0.98rem;
  }
  .bk-sal-naest {
    margin: 0.55rem 0 0;
    font-size: 0.9rem;
    line-height: 1.35;
    color: var(--muted);
  }
  .bk-sal-naest b {
    color: var(--cream);
    font-weight: 600;
  }
  .bk-sal-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    min-height: 3.3rem;
    margin-top: 0.75rem;
    padding: 0 1.6rem;
    border: 0;
    border-radius: 999px;
    background-color: #cebf95;
    color: #302f2f;
    font-family: "Poppins", sans-serif;
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    transition:
      background-color 0.16s ease,
      transform 0.16s var(--ease);
  }
  .bk-sal-cta:hover {
    background-color: #bfae7f;
  }
  .bk-sal-cta:active {
    transform: scale(0.97);
  }
  .bk-sal-cta[aria-disabled="true"] {
    background-color: rgba(211, 195, 152, 0.14);
    color: var(--gold);
    cursor: default;
  }
  .bk-sal-cta[aria-disabled="true"]:active {
    transform: none;
  }

  /* Borð og svíta: hálf hæð hvort, stillingarnar fylla allan dálkinn */
  .bk-sal-auka {
    position: relative;
    display: grid;
    grid-template-rows: 1fr 1fr;
    gap: 10px;
  }
  .bk-sal-auka .bk-sal-opna {
    padding: 1.1rem;
    gap: 0.25rem;
  }
  .bk-sal-auka .bk-sal-opna h4 {
    font-size: 1.3rem;
  }
  .bk-sal-auka .bk-sal-opna .lyst {
    font-size: 0.95rem;
  }
  .bk-sal-auka .bk-sal-opna .fra b {
    font-size: 1.2rem;
  }
  .bk-sal-auka .bk-sal-opna .sja {
    margin-top: 0.45rem;
    padding: 0.55rem 0.9rem;
  }
  .bk-sal-auka-stilla {
    position: absolute;
    inset: 0;
    z-index: 5;
    overflow: hidden;
    border-radius: 20px;
    pointer-events: none;
  }
  .bk-sal-auka-stilla .bk-sal-stilla {
    pointer-events: auto;
  }

  /* Stökkhnapparnir undir sölunum segja hvað bíður neðar */
  .bk-sal-stokk {
    display: flex;
    justify-content: center;
    gap: 0.8rem;
    margin: 0.75rem 0 0;
  }
  .bk-sal-stokk a {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 1rem;
    border-radius: 999px;
    box-shadow: inset 0 0 0 1px var(--line);
    color: var(--cream);
    font-family: "Poppins", sans-serif;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    transition: background-color 0.16s ease;
  }
  .bk-sal-stokk a:hover {
    background-color: rgba(211, 195, 152, 0.1);
  }
  .bk-sal-stokk em {
    font-style: normal;
    color: var(--gold);
  }

  /* ---------- Kaflarnir undir: Framundan og Hópatilboð ---------- */
  .bk-sal-kafli {
    margin-top: 3.2rem;
    padding-top: 1.4rem;
    border-top: 1px solid var(--hair);
    /* hausinn á síðunni er fastur efst, kaflinn má ekki lenda undir honum */
    scroll-margin-top: 7rem;
  }
  .bk-sal-kafli-haus {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.4rem 1.1rem;
    margin-bottom: 1.1rem;
  }
  .bk-sal-kafli-haus h2 {
    font-family: "Poppins", sans-serif;
    font-size: clamp(1.6rem, 2.3vw, 2.1rem);
    font-weight: 700;
    letter-spacing: -0.01em;
    text-transform: uppercase;
    color: var(--gold);
    margin: 0;
  }
  .bk-sal-kafli-haus p {
    color: var(--muted);
    font-size: 1.05rem;
    max-width: 62ch;
    margin: 0;
  }
  .bk-sal-kafli.bk-fr-framundan.kallad {
    border-radius: 20px;
    animation: bkFrKall 2.2s var(--ease) both;
  }

  .bk-sal-fr,
  .bk-sal-hopar {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.5fr);
    gap: 10px;
    align-items: start;
  }
  .bk-sal-fr.einn {
    grid-template-columns: 1fr;
  }
  .bk-sal-vidburdir {
    position: sticky;
    top: 1rem;
    display: grid;
    gap: 10px;
  }
  .bk-sal-vidb {
    display: grid;
    width: 100%;
    padding: 0;
    border: 0;
    border-radius: 20px;
    overflow: hidden;
    text-align: left;
    color: var(--cream);
    background-color: var(--char);
    box-shadow: inset 0 0 0 1px var(--hair);
    cursor: pointer;
    transition:
      box-shadow 0.18s ease,
      transform 0.16s var(--ease);
  }
  .bk-sal-vidb:active {
    transform: scale(0.99);
  }
  .bk-sal-vidb .plakat {
    position: relative;
    display: block;
    aspect-ratio: 16 / 9;
    overflow: hidden;
  }
  /* Plakatið er skorið að titlinum efst, dagsetningin á því sjálfu sést
     ekki (bingóplakatið segir 26. sept, kortið segir rétta daginn) */
  .bk-sal-vidb .plakat img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 0%;
    display: block;
    transition: transform 0.6s var(--ease);
  }
  .bk-sal-vidb .plakat::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 78%, var(--char));
  }
  .bk-sal-vidb .dags {
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 1;
    display: grid;
    place-items: center;
    width: 4rem;
    padding: 0.55rem 0 0.5rem;
    border-radius: 14px;
    background-color: var(--cream);
    color: #302f2f;
  }
  .bk-sal-vidb .dags b {
    font-family: "Poppins", sans-serif;
    font-size: 1.6rem;
    line-height: 1;
  }
  .bk-sal-vidb .dags span {
    font-family: "Poppins", sans-serif;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-top: 0.2rem;
  }
  .bk-sal-vidb .tegund {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 1;
    font-family: "Poppins", sans-serif;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 0.5rem 0.7rem;
    border-radius: 999px;
    background-color: rgba(23, 19, 16, 0.72);
    color: var(--cream);
  }
  .bk-sal-vidb .efni {
    display: grid;
    gap: 0.45rem;
    padding: 0.9rem 1.4rem 1.4rem;
  }
  .bk-sal-vidb .hvenaer {
    font-family: "Poppins", sans-serif;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--gold);
  }
  .bk-sal-vidb .nafn {
    font-family: "Poppins", sans-serif;
    font-size: 1.85rem;
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: -0.02em;
  }
  .bk-sal-vidb .lys {
    color: var(--muted);
    font-size: 1rem;
    line-height: 1.4;
  }
  .bk-sal-vidb .fotur {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    margin-top: 0.5rem;
  }
  .bk-sal-vidb .v b {
    display: block;
    font-family: "Poppins", sans-serif;
    font-size: 1.6rem;
    line-height: 1;
  }
  .bk-sal-vidb .v small {
    color: var(--muted);
    font-size: 0.92rem;
  }
  .bk-sal-vidb .sja,
  .bk-sal-pakki .sja {
    flex: none;
    display: inline-flex;
    gap: 0.5rem;
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    border-radius: 999px;
    transition:
      background-color 0.16s ease,
      color 0.16s ease;
  }
  .bk-sal-vidb .sja {
    padding: 0.85rem 1.35rem;
    font-size: 0.85rem;
    background-color: #cebf95;
    color: #302f2f;
  }
  @media (hover: hover) and (pointer: fine) {
    .bk-sal-vidb:hover {
      box-shadow: inset 0 0 0 1px var(--gold);
    }
    .bk-sal-vidb:hover .plakat img {
      transform: scale(1.03);
    }
    .bk-sal-vidb:hover .sja {
      background-color: #bfae7f;
    }
  }

  /* Boltinn: liðasían úr símanum og leikirnir eftir dögum */
  .bk-sal-bolti {
    border-radius: 20px;
    background-color: var(--char);
    box-shadow: inset 0 0 0 1px var(--hair);
    padding: 1.1rem 1.25rem 0.9rem;
  }
  .bk-sal-bolti-haus {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.8rem;
    margin-bottom: 0.75rem;
  }
  .bk-sal-bolti-haus h3 {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin: 0;
    font-family: "Poppins", sans-serif;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--gold);
  }
  .bk-sal-bolti-haus .punktur {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--spara, #4cd97b);
    box-shadow: 0 0 0 4px rgba(76, 217, 123, 0.16);
  }
  .bk-sal-bolti-haus p {
    margin: 0;
    color: var(--muted);
    font-size: 0.95rem;
  }
  .bk-sal-sia {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.4rem;
  }
  .bk-sal-sia button {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 2.75rem;
    padding: 0 0.9rem 0 0.65rem;
    border: 0;
    border-radius: 999px;
    background-color: transparent;
    box-shadow: inset 0 0 0 1px var(--line);
    color: var(--cream);
    font-family: "Poppins", sans-serif;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition:
      background-color 0.15s ease,
      color 0.15s ease,
      transform 0.14s var(--ease);
  }
  .bk-sal-sia button.allir {
    padding: 0 1.1rem;
  }
  .bk-sal-sia img {
    width: 1.5rem;
    height: 1.5rem;
    object-fit: contain;
  }
  .bk-sal-sia small {
    font-family: "Source Sans 3", sans-serif;
    font-size: 0.82rem;
    color: var(--muted);
  }
  .bk-sal-sia button:active {
    transform: scale(0.96);
  }
  @media (hover: hover) and (pointer: fine) {
    .bk-sal-sia button:hover {
      background-color: rgba(211, 195, 152, 0.1);
    }
  }
  .bk-sal-sia button[aria-checked="true"] {
    background-color: var(--gold);
    color: #302f2f;
    box-shadow: none;
  }
  .bk-sal-sia button[aria-checked="true"] small {
    color: #4b4436;
  }
  .bk-sal-leikir {
    min-height: 18rem;
    animation: bkSalInn 0.22s var(--ease) both;
  }
  @keyframes bkSalInn {
    from {
      opacity: 0;
      transform: translateY(6px);
    }
  }
  .bk-sal-dagur {
    margin: 0;
    padding: 0.85rem 0.25rem 0.35rem;
    font-family: "Poppins", sans-serif;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--muted);
  }
  .bk-sal-leikur {
    display: grid;
    grid-template-columns: 2.5rem minmax(0, 1fr) auto auto;
    gap: 1rem;
    align-items: center;
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 0;
    border-radius: 14px;
    background-color: transparent;
    color: var(--cream);
    text-align: left;
    cursor: pointer;
    transition: background-color 0.15s ease;
  }
  .bk-sal-leikur img {
    width: 2.25rem;
    height: 2.25rem;
    object-fit: contain;
  }
  .bk-sal-leikur .hvad b {
    display: block;
    font-family: "Poppins", sans-serif;
    font-size: 1.05rem;
    font-weight: 600;
    line-height: 1.2;
  }
  .bk-sal-leikur .hvad em {
    font-style: normal;
    color: var(--muted);
    font-size: 0.95rem;
  }
  .bk-sal-leikur .kl {
    display: grid;
    justify-items: end;
    gap: 0.1rem;
  }
  .bk-sal-leikur .kl b {
    font-family: "Poppins", sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
  }
  .bk-sal-leikur .kl small {
    color: var(--muted);
    font-size: 0.8rem;
  }
  .bk-sal-leikur .bord,
  .bk-sal-pakki .sja {
    padding: 0.6rem 0.9rem;
    font-size: 0.75rem;
    color: var(--gold);
    box-shadow: inset 0 0 0 1px var(--line);
  }
  .bk-sal-leikur .bord {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    border-radius: 999px;
    transition:
      background-color 0.15s ease,
      color 0.15s ease;
  }
  @media (hover: hover) and (pointer: fine) {
    .bk-sal-leikur:hover {
      background-color: rgba(211, 195, 152, 0.08);
    }
    .bk-sal-leikur:hover .bord {
      background-color: var(--gold);
      color: #302f2f;
    }
  }
  /* Beinagrindin: sex raðir í sömu hæð og leikjaraðirnar */
  .bk-sal-beid {
    display: block;
    height: 3.6rem;
    margin-top: 0.4rem;
    background-color: rgba(242, 236, 221, 0.05);
    cursor: default;
    animation: bkSalPuls 1.1s ease-in-out infinite alternate;
  }
  @keyframes bkSalPuls {
    from {
      opacity: 0.5;
    }
    to {
      opacity: 1;
    }
  }
  .bk-sal-tomt {
    color: var(--muted);
    padding: 1rem 0.25rem;
  }
  .bk-sal-bolti-fotur {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.8rem;
    margin-top: 0.5rem;
    padding-top: 0.7rem;
    border-top: 1px solid var(--hair);
    color: var(--muted);
    font-size: 0.95rem;
  }
  .bk-sal-bolti-fotur button {
    display: inline-flex;
    gap: 0.5rem;
    align-items: center;
    padding: 0.65rem 1.1rem;
    border: 0;
    border-radius: 999px;
    background-color: transparent;
    box-shadow: inset 0 0 0 1px var(--line);
    color: var(--gold);
    font-family: "Poppins", sans-serif;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
  }
  .bk-sal-bolti-fotur button:hover {
    background-color: rgba(211, 195, 152, 0.1);
  }
  .bk-sal-bolti-fotur .or {
    transition: transform 0.22s var(--ease);
  }
  .bk-sal-bolti-fotur button[aria-expanded="true"] .or {
    transform: rotate(180deg);
  }

  /* Hópatilboð: myndin með „Reikna verð" og pakkarnir fjórir */
  .bk-sal-hopar {
    align-items: stretch;
  }
  .bk-sal-hopmynd {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    min-height: 19rem;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    padding: 1.5rem;
    border-radius: 20px;
    box-shadow: inset 0 0 0 1px var(--hair);
  }
  .bk-sal-hopmynd img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -2;
  }
  .bk-sal-hopmynd::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(180deg, rgba(23, 19, 16, 0.1), rgba(23, 19, 16, 0.9) 80%);
  }
  .bk-sal-hopmynd h3 {
    font-family: "Poppins", sans-serif;
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.1;
    margin: 0;
    color: var(--cream);
  }
  .bk-sal-hopmynd p {
    color: var(--muted);
    font-size: 1rem;
    margin: 0.4rem 0 0;
    max-width: 36ch;
  }
  .bk-sal-hopmynd .bk-sal-cta {
    width: auto;
    margin-top: 1rem;
  }
  .bk-sal-pakkar {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .bk-sal-pakki {
    display: grid;
    align-content: space-between;
    gap: 0.9rem;
    padding: 1.2rem 1.35rem;
    border-radius: 20px;
    background-color: var(--char);
    box-shadow: inset 0 0 0 1px var(--hair);
    color: var(--cream);
    text-decoration: none;
    transition:
      box-shadow 0.18s ease,
      transform 0.16s var(--ease);
  }
  .bk-sal-pakki:active {
    transform: scale(0.985);
  }
  .bk-sal-pakki .nafn {
    display: block;
    font-family: "Poppins", sans-serif;
    font-size: 1.3rem;
    font-weight: 700;
  }
  .bk-sal-pakki .lys {
    display: block;
    color: var(--muted);
    font-size: 1rem;
    margin-top: 0.25rem;
  }
  .bk-sal-pakki .nedst {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.6rem;
  }
  .bk-sal-pakki .v b {
    display: block;
    font-family: "Poppins", sans-serif;
    font-size: 1.5rem;
  }
  .bk-sal-pakki .v small {
    color: var(--muted);
    font-size: 0.92rem;
  }
  @media (hover: hover) and (pointer: fine) {
    .bk-sal-pakki:hover {
      box-shadow: inset 0 0 0 1px var(--gold);
    }
    .bk-sal-pakki:hover .sja {
      background-color: var(--gold);
      color: #302f2f;
    }
  }
  .bk-sal-allt {
    text-align: center;
    margin: 1.4rem 0 0;
  }
  .bk-sal-allt a {
    color: var(--cream);
    font-family: "Poppins", sans-serif;
    font-size: 0.95rem;
    font-weight: 600;
    text-underline-offset: 5px;
    text-decoration-color: var(--line);
  }

  /* Lágir fartölvuskjáir (1366×657, 1280×720): salirnir fylla fyrsta
     skjáinn og stillingarnar komast fyrir án innra skruns */
  @media (max-height: 760px) {
    .bk-sal-opna .lyst {
      display: none;
    }
    .bk-sal-stilla {
      padding: 0.85rem 1rem 1rem;
    }
    .bk-sal-merki {
      margin: 0.45rem 0 0.3rem;
    }
    .bk-sal-tolur button {
      height: 2.1rem;
    }
    .bk-sal-lengdir button {
      padding: 0.4rem 0.25rem;
    }
    .bk-sal-naest {
      display: none;
    }
    .bk-sal-heild {
      margin-top: 0.4rem;
    }
    .bk-sal-auka-stilla h3 {
      font-size: 1.1rem;
    }
    .bk-sal-auka-stilla .bk-sal-loka {
      width: 2rem;
      height: 2rem;
    }
    .bk-sal-cta {
      min-height: 3rem;
      margin-top: 0.55rem;
    }
  }
}
/* Spjaldtölvubreidd (861 til 1180 px): salirnir þrír eru of mjóir fyrir
   stillingarnar hlið við hlið við fjórða dálkinn, svo borð og svíta fara
   í röð undir þeim og salirnir fá hæðina sem stillingarnar þurfa */
@media (min-width: 861px) and (max-width: 1180px) {
  .bk-sal-salir {
    height: auto;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 560px 480px;
  }
  .bk-sal-auka {
    grid-column: 1 / -1;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: none;
  }
}
@media (min-width: 861px) and (prefers-reduced-motion: reduce) {
  .bk-sal-salur > img,
  .bk-sal-stilla,
  .bk-sal-leikir,
  .bk-sal-vidb .plakat img {
    transition: none;
    animation: none;
  }
  .bk-sal-beid {
    animation: none;
  }
  .bk-sal-kafli.bk-fr-framundan.kallad {
    animation: none;
    box-shadow: inset 0 0 0 2px var(--gold);
  }
}