/* LATERRIA - shared photo carousel, dish thumbnails and lightbox (js/gallery.js). Uses the page's color tokens. */
.gal { margin-top: 24px; }
.gal[hidden] { display: none; }
.gal .kicker { text-align: center; }
.gal-wrap { position: relative; }
.gal-track { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
.gal-track::-webkit-scrollbar { display: none; }
.gal-slide { position: relative; flex: 0 0 calc((100% - 24px) / 2.3); aspect-ratio: 4 / 3; scroll-snap-align: start; border-radius: 4px; overflow: hidden; background: var(--sand); padding: 0; }
.gal-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gal-slide .cap { position: absolute; inset-inline: 0; bottom: 0; padding: 28px 12px 10px; text-align: start; font-size: 14px; line-height: 1.3; color: #fff; background: linear-gradient(to top, rgba(31,27,23,.7), rgba(31,27,23,0)); }
.gal-nav { position: absolute; top: 50%; width: 40px; height: 40px; margin-top: -20px; border-radius: 50%; background: rgba(253,251,247,.94); border: 1px solid var(--line); display: none; align-items: center; justify-content: center; z-index: 2; transition: opacity .2s; }
.gal-nav::before { content: ""; width: 9px; height: 9px; border-top: 1.5px solid var(--ink); border-right: 1.5px solid var(--ink); }
.gal-nav.prev { inset-inline-start: 8px; } .gal-nav.prev::before { transform: translateX(-2px) rotate(45deg); }
.gal-nav.next { inset-inline-end: 8px; } .gal-nav.next::before { transform: translateX(2px) rotate(-135deg); }
.gal-nav:disabled { opacity: 0; pointer-events: none; }
.gal-dots { display: flex; flex-wrap: wrap; justify-content: center; margin-top: 6px; }
.gal-dots .dot { position: relative; width: 24px; height: 24px; }
.gal-dots .dot::before { content: ""; position: absolute; inset: 8px; border-radius: 50%; background: var(--sand-2); transition: background .2s; }
.gal-dots .dot.on::before { background: var(--ink); }
@media (min-width: 641px) { .gal-nav { display: flex; } }
@media (max-width: 640px) { .gal-slide { flex-basis: calc((100% - 12px) / 1.15); } .gal-dots .dot { width: 20px; } .gal-dots .dot::before { inset: 8px 6px; } }

.thumb { flex: 0 0 44px; width: 44px; height: 44px; padding: 0; border-radius: 6px; overflow: hidden; border: 1px solid var(--line); background: var(--sand); }
.thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nm { display: flex; align-items: center; gap: 10px; min-width: 0; }
.chipw { display: inline-flex; align-items: center; gap: 6px; }
@media (max-width: 640px) { .up .opt.has-thumb { flex-wrap: wrap; } .up .opt.has-thumb .nm { flex: 1 1 100%; } .up .opt.has-thumb .pr { margin-inline-end: auto; } }

.lb { position: fixed; inset: 0; z-index: 80; display: flex; align-items: center; justify-content: center; padding: 56px 16px 40px; background: rgba(31,27,23,.92); }
.lb[hidden] { display: none; }
.lb-fig { max-width: min(92vw, 900px); text-align: center; color: #fff; }
.lb-fig img { display: block; max-width: 100%; max-height: 74vh; margin: 0 auto; border-radius: 4px; object-fit: contain; }
.lb-fig figcaption { margin-top: 12px; font-size: 15px; }
.lb-x { position: absolute; top: 10px; inset-inline-start: 10px; width: 44px; height: 44px; font-size: 28px; color: #fff; }
.lb-nav { position: absolute; top: 50%; width: 44px; height: 44px; margin-top: -22px; border-radius: 50%; background: rgba(253,251,247,.16); display: flex; align-items: center; justify-content: center; }
.lb-nav[hidden] { display: none; }
.lb-nav::before { content: ""; width: 10px; height: 10px; border-top: 1.5px solid #fff; border-right: 1.5px solid #fff; }
.lb-nav.prev { inset-inline-start: 10px; } .lb-nav.prev::before { transform: translateX(-2px) rotate(45deg); }
.lb-nav.next { inset-inline-end: 10px; } .lb-nav.next::before { transform: translateX(2px) rotate(-135deg); }
.lb-count { position: absolute; bottom: 14px; inset-inline: 0; text-align: center; font-size: 13px; color: rgba(255,255,255,.7); font-variant-numeric: tabular-nums; }
