/* Selectieknop op elke foto */
.fg-item .fs-pick {
  position: absolute; top: 6px; right: 6px; z-index: 50;
  width: 44px; height: 44px; padding: 0; margin: 0;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%; border: 2px solid #fff;
  background: rgba(0, 0, 0, .45); color: transparent;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .4);
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  transition: background .15s, color .15s, transform .1s;
}
.fg-item .fs-pick svg { width: 26px; height: 26px; }
.fg-item .fs-pick:active { transform: scale(.92); }
.fg-item .fs-pick.is-on { background: #1a7f37; color: #fff; }
.fg-item.fs-selected .fg-image-wrap { outline: 4px solid #1a7f37; outline-offset: -4px; }
@media (hover: hover) {
  .fg-item .fs-pick:hover { background: rgba(0, 0, 0, .7); color: rgba(255, 255, 255, .8); }
  .fg-item .fs-pick.is-on:hover { background: #166b2e; color: #fff; }
}

/* Overzicht bij het formulier */
.fs-hidden-options { display: none !important; }
.fs-summary { margin: 1em 0; padding: 14px; border: 1px solid #ccc; border-radius: 8px; background: #fafafa; scroll-margin-top: 16px; }
.fs-summary.is-invalid { border-color: #b32d2e; box-shadow: 0 0 0 2px rgba(179, 45, 46, .25); }
.fs-summary-title { margin: 0 0 .5em; font-size: 1.1em; }
.fs-empty { margin: 0; color: #555; }
.fs-summary.is-invalid .fs-empty { color: #b32d2e; font-weight: 600; }
.fs-thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 8px; margin-bottom: 10px; }
.fs-thumbs:empty { display: none; }
.fs-thumb { position: relative; margin: 0; }
.fs-thumb img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 4px; }
.fs-thumb figcaption { font-size: 11px; text-align: center; color: #555; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fs-x { position: absolute; top: 2px; right: 2px; width: 28px; height: 28px; padding: 0; border-radius: 50%; border: 0; background: rgba(0, 0, 0, .65); color: #fff; font-size: 18px; line-height: 1; cursor: pointer; }
.fs-lines { padding-top: 8px; border-top: 1px solid #ddd; }
.fs-row { display: flex; justify-content: space-between; gap: 12px; padding: 2px 0; }
.fs-row span:last-child { white-space: nowrap; }
.fs-row.fs-discount { color: #1a7f37; }
.fs-row.fs-total { margin-top: 4px; padding-top: 6px; border-top: 1px solid #ddd; font-size: 1.1em; font-weight: 700; }
.fs-summary:not(.has-items) .fs-lines { display: none; }
.fs-note { margin: 8px 0; font-size: .85em; color: #555; }
.fs-note a { color: inherit; text-decoration: underline; }
.fs-clear { background: none; border: 0; padding: 4px 0; color: #b32d2e; text-decoration: underline; cursor: pointer; font-size: .9em; }

/* Vaste balk onderaan */
.fs-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
  background: #1d2327; color: #fff; box-shadow: 0 -2px 10px rgba(0, 0, 0, .3);
}
.fs-bar[hidden] { display: none; }
.fs-bar-text { font-size: 1.05em; }
.fs-bar-btn { padding: 12px 18px; min-height: 44px; border: 0; border-radius: 6px; background: #1a7f37; color: #fff; font-weight: 600; font-size: 1em; cursor: pointer; }
.fs-has-bar body { padding-bottom: 70px; }

/* Knop in de lightbox */
.fs-lb {
  position: absolute; z-index: 100; left: 50%; transform: translateX(-50%);
  bottom: 120px; /* wordt door foto-selectie.js boven de onderste balk gezet */
  display: flex; align-items: center; gap: 8px;
  padding: 12px 22px; min-height: 48px; border-radius: 28px; border: 2px solid #fff;
  background: rgba(0, 0, 0, .7); color: #fff; font-size: 16px; font-weight: 600; cursor: pointer;
}
.fs-lb[hidden] { display: none; }
.fs-lb svg { width: 24px; height: 24px; }
.fs-lb.is-on { background: #1a7f37; }