/* Scoped to Bilder. Theme integration supplies the article's available width. */
.lks-images {
  --lks-radius: 12px;
  --lks-gap: clamp(16px, 2vw, 28px);
  --lks-visible: var(--lks-slides, 3);
  --lks-content-width: 792px;
  --lks-wide-width: 1280px;
  box-sizing: border-box;
  width: min(calc(100% - 40px), var(--lks-content-width));
  max-width: none;
  margin: clamp(24px, 4vw, 48px) auto;
  color: inherit;
}
.lks-images--wide { width: min(calc(100% - 40px), var(--lks-wide-width)); }
.lks-images--full { width: 100%; }
.lks-images--full .lks-images__items { margin-inline: 0; }
.lks-images--full .lks-images__item:first-child:last-child .lks-images__image { border-radius: 0; }
.lks-images--full:not(.lks-images--masonry) .lks-images__items:has(> .lks-images__item:nth-child(2)) { margin-inline: 20px; }
.lks-images .lks-images__items { display: grid; grid-template-columns: repeat(var(--lks-columns, 2), minmax(0, 1fr)); gap: var(--lks-gap); }
.lks-images .lks-images__item { margin: 0; padding: 0; min-width: 0; width: auto; height: auto !important; min-height: 0; border: 0; background: transparent; align-self: start; }
.lks-images .lks-images__link { display: block; cursor: zoom-in; }
.lks-images .lks-images__zoom-hint { display: inline-flex; align-items: center; gap: 6px; position: absolute; right: 12px; top: 12px; padding: 7px 9px; color: #fff; background: rgb(0 0 0 / 68%); border-radius: 4px; font-size: 12px; line-height: 1; pointer-events: none; }
.lks-images .lks-images__zoom-hint svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.lks-images .lks-images__zoom-hint > span { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.lks-images .lks-images__item { position: relative; }
.lks-images .lks-images__image { display: block; width: 100%; height: auto !important; max-width: 100%; max-height: none; aspect-ratio: var(--lks-ratio, auto); object-fit: contain; border-radius: var(--lks-radius); }
.lks-images--crop:not(.lks-images--masonry) .lks-images__image { aspect-ratio: 4 / 3; object-fit: cover; }
/* Bildetekster følger tekstbredden, også under brede enkeltbilder. */
.lks-images .lks-images__caption { box-sizing: border-box; width: 100%; max-width: var(--lks-content-width); margin: 8px auto 0; padding: 0; font-size: .875em; line-height: 1.5; color: inherit; position: static; overflow-wrap: anywhere; }
.lks-images--full .lks-images__item:first-child:last-child .lks-images__caption,
.lks-images--full.lks-images--masonry .lks-images__caption { width: min(calc(100% - 40px), var(--lks-content-width)); }
.lks-images--masonry .lks-images__items { display: block; columns: var(--lks-columns, 2); column-gap: var(--lks-gap); }
.lks-images--masonry .lks-images__item { break-inside: avoid; margin: 0 0 var(--lks-gap); }
.lks-images--slider .lks-images__items { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; overscroll-behavior-x: contain; align-items: start; scrollbar-width: none; }
.lks-images--slider .lks-images__items::-webkit-scrollbar { display: none; }
.lks-images--slider .lks-images__item { flex: 0 0 calc((100% - (var(--lks-visible) - 1) * var(--lks-gap)) / var(--lks-visible)); scroll-snap-align: start; }
/* Match LKS image panels: equal height, natural widths, consistent real gaps. */
.lks-images--slider { container-type: inline-size; }
.lks-images--slider:not(.lks-images--crop) .lks-images__item { flex: 0 0 auto; width: calc(var(--lks-slide-height) * var(--lks-ratio, 1.3333)); --lks-slide-height: min(clamp(var(--lks-min-slide-height, 160px), calc((100cqw - (var(--lks-visible) - 1) * var(--lks-gap)) / var(--lks-visible) * .75), 640px), calc(100cqw / var(--lks-ratio, 1.3333))); }
.lks-images--slider:not(.lks-images--crop) .lks-images__image { height: var(--lks-slide-height) !important; width: 100%; aspect-ratio: auto; object-fit: contain; }
.lks-images .lks-images__controls { display: block; width: min(calc(100% - 40px), var(--lks-content-width)); margin: 16px auto 0; padding-inline: 0; font-size: 16px; }
.lks-images .lks-images__controls[hidden] { display: none; }
/* Controls span the gallery itself, so the arrows line up with the first and last image (Full bredde keeps the inset text column). */
.lks-images:not(.lks-images--full) .lks-images__controls { width: 100%; }
.lks-images__navigation { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.lks-images .lks-images__controls button { appearance: none; font: inherit; color: var(--color-5, #004758); background: transparent; border: 0; border-radius: 0; padding: 0; min-width: 44px; min-height: 44px; cursor: pointer; }
/* Arrows stay visible but faded when there is nowhere to go, so the controls never jump around. */
.lks-images .lks-images__controls button:disabled { opacity: .3; cursor: default; }
.lks-images__navigation > button { display: grid; place-items: center; }
/* Keep the 44px tap target, but put the arrows flush with the gallery's edges. */
.lks-images__navigation > [data-lks-prev] { justify-content: start; }
.lks-images__navigation > [data-lks-next] { justify-content: end; }
/* The arrow paths leave 9/32 of the icon empty on the pointing side; pull the tips out to the edge. */
.lks-images__navigation > [data-lks-prev] svg { margin-left: -6.75px; }
.lks-images__navigation > [data-lks-next] svg { margin-right: -6.75px; }
.lks-images__controls svg { width: 24px; height: 24px; stroke: currentColor; fill: none; stroke-width: 2; }
.lks-images__pages { display: flex; justify-content: center; align-items: center; gap: 12px; }
.lks-images .lks-images__pages button, .lks-images__pages .is-current { border: 1px solid var(--color-black, #111); color: var(--color-black, #111); border-radius: 50%; min-width: 36px; min-height: 36px; display: inline-grid; place-items: center; }
.lks-images .lks-images__pages button[aria-current="true"], .lks-images__pages .is-current { background: var(--color-1, #ffeb03); }
.lks-images__gallery-bar { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 8px; }
.lks-images .lks-images__open-gallery { display: inline-flex; align-items: center; gap: 8px; text-decoration: underline; text-underline-offset: 4px; }
.lks-images :focus-visible, .lks-lightbox :focus-visible { outline: 3px solid currentColor; outline-offset: 4px; }
.lks-images__empty { padding: 24px; border: 1px dashed #8b8b8b; border-radius: 6px; background: #f6f7f7; color: #343434; }
.lks-images__empty p { margin: 8px 0 0; font-size: 15px; }
/* Native dialog top layer escapes theme containers and their clipping. */
dialog.lks-lightbox {
  position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; height: 100dvh; max-height: none;
  margin: 0; padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
  border: 0; border-radius: 0; box-sizing: border-box; background: #111; color: #fff; overflow: hidden;
}
.lks-lightbox[open] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto auto; gap: 12px; }
.lks-lightbox::backdrop { background: #111; }
.lks-lightbox__toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.lks-lightbox button { appearance: none; color: #fff; background: #252525; border: 1px solid #777; border-radius: 4px; min-width: 48px; min-height: 48px; padding: 8px 16px; font: inherit; cursor: pointer; }
.lks-lightbox__stage { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 0; touch-action: pan-y; }
.lks-lightbox .lks-lightbox__image { display: block; width: 100% !important; height: 100% !important; min-height: 0; max-height: 100% !important; max-width: 100% !important; object-fit: contain !important; aspect-ratio: auto !important; border-radius: 0 !important; margin: 0 !important; padding: 0; }
.lks-lightbox__caption { text-align: center; margin: 0; font-size: 16px; line-height: 1.4; max-height: 20vh; overflow: auto; }
.lks-lightbox button[hidden] { display: none; }
.lks-lightbox__stage--single { grid-template-columns: minmax(0, 1fr); }
/* Thumbnail strip: one scrollable row, centred when it fits (auto margins instead of justify-content so the start never clips). */
.lks-lightbox__thumbs { position: relative; display: flex; gap: 8px; overflow-x: auto; overscroll-behavior-x: contain; padding: 4px 2px; scrollbar-width: thin; scrollbar-color: #555 transparent; }
.lks-lightbox__thumbs[hidden] { display: none; }
.lks-lightbox__thumbs > :first-child { margin-left: auto; }
.lks-lightbox__thumbs > :last-child { margin-right: auto; }
dialog.lks-lightbox .lks-lightbox__thumb { flex: 0 0 auto; width: 64px; height: 64px; min-width: 0; min-height: 0; padding: 0; overflow: hidden; background: #252525; border: 2px solid transparent; border-radius: 4px; opacity: .5; transition: opacity .15s; }
dialog.lks-lightbox .lks-lightbox__thumb img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; margin: 0; border-radius: 0; }
dialog.lks-lightbox .lks-lightbox__thumb:hover { opacity: .85; background: #252525; border-color: transparent; }
dialog.lks-lightbox .lks-lightbox__thumb[aria-current="true"] { opacity: 1; border-color: #fff; }
@media (prefers-reduced-motion: reduce) { dialog.lks-lightbox .lks-lightbox__thumb { transition: none; } }
@media (max-width: 1024px) {
  .lks-images { --lks-visible: var(--lks-tablet-slides, 2); }
}
@media (max-width: 600px) {
  .lks-images { --lks-visible: var(--lks-mobile-slides, 1); --lks-min-slide-height: calc(160px * (2 - var(--lks-visible))); }
  .lks-images .lks-images__items { grid-template-columns: repeat(var(--lks-mobile-columns, 1), minmax(0, 1fr)); }
  .lks-images--masonry .lks-images__items { columns: var(--lks-mobile-columns, 1); }
  .lks-images__navigation { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; gap: 8px; }
  .lks-images__pages { flex-wrap: nowrap; gap: 4px; min-width: 0; }
  .lks-images .lks-images__pages button { min-width: 30px; min-height: 30px; }
  .lks-images__open-gallery span { display: none; }
  .lks-lightbox__stage { gap: 6px; grid-template-columns: 36px minmax(0, 1fr) 36px; }
  .lks-lightbox__stage button { padding: 4px; min-width: 36px; }
  .lks-lightbox__stage--single { grid-template-columns: minmax(0, 1fr); }
  .lks-lightbox__thumbs { gap: 6px; }
  dialog.lks-lightbox .lks-lightbox__thumb { width: 48px; height: 48px; }
}
@media (prefers-reduced-motion: reduce) { .lks-images--slider .lks-images__items { scroll-behavior: auto; } }
/* Override the theme's generic white button hover in the dark viewer. */
dialog.lks-lightbox button:hover, dialog.lks-lightbox button:focus-visible { color: #fff; background: #404040; border-color: #fff; }
.lks-images .lks-images__controls button:hover:not(:disabled) { color: var(--color-black, #111); background: transparent; }
.lks-images .lks-images__pages button:hover:not(:disabled) { background: var(--color-1, #ffeb03); }
@media (min-width: 782px) { .lks-images { --lks-radius: 24px; } }

/* I en kolonne følger Bilder kolonnebredden uten ekstra sideinnrykk. */
.wp-block-column .lks-images { width: 100%; margin-block: 0; }

.wp-block-column .lks-images--full:not(.lks-images--masonry) .lks-images__items:has(> .lks-images__item:nth-child(2)) { margin-inline: 0; }
.wp-block-column .lks-images--full .lks-images__controls { width: 100%; }
.wp-block-column .lks-images--full .lks-images__item:first-child:last-child .lks-images__caption,
.wp-block-column .lks-images--full.lks-images--masonry .lks-images__caption { width: 100%; }

/* Navigasjonen følger galleriets bredde, også i smale kolonner på desktop. */
@container (max-width: 600px) {
  .lks-images__navigation { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; gap: 8px; }
  .lks-images__pages { flex-wrap: nowrap; gap: 4px; min-width: 0; }
  .lks-images .lks-images__pages button { min-width: 30px; min-height: 30px; }
}