/* il Boccone – pop-up (plugin ilboccone-popup). Fonts, colours and .btn come from the theme (site.css).
   Width follows the picture (--ar = width / height), so picture and buttons fit the screen without scrolling.
   The theme has tokens only for fonts and brand colours; site.css writes sizes and black/white literally
   (.btn, .lightbox, .resmodal), and this file follows it. */
/* ds-allow-hardcode:start */
.ilb-popup { box-sizing: border-box; width: min(440px, calc(100vw - 32px), calc((100dvh - 200px) * var(--ar, 10))); max-width: none;
  max-height: calc(100dvh - 32px); padding: 0; border: 0; background: #000; color: #fff; overflow: auto; }
.ilb-popup::backdrop { background: rgba(0, 0, 0, .8); }
html:has(.ilb-popup[open]) { overflow: hidden; }
.ilb-popup__close { position: absolute; top: 0; right: 0; z-index: 1; width: 44px; height: 44px; padding: 0; border: 0;
  background: rgba(0, 0, 0, .55); color: #fff; font: var(--w-light) 36px/44px var(--f-light); cursor: pointer; }
.ilb-popup__close:hover, .ilb-popup__close:focus-visible { color: var(--c-nav-hover); }
.ilb-popup__img { display: block; width: 100%; height: auto; }
.ilb-popup__body { padding: 16px; text-align: center; }
.ilb-popup__title { margin: 0 0 8px; font: var(--w-heavy) 20px/var(--lh-normal) var(--f-heavy); letter-spacing: 2px; text-transform: uppercase; }
.ilb-popup__text { margin: 0 0 4px; font: var(--w-light) 16px/1.4 var(--f-light); }
/* Buttons: two equal columns, the same gap both ways; an odd last button takes the whole row. Two classes, because
   this file may load before site.css (.btns there: flex, gap 0 18px). */
.ilb-popup .ilb-popup__btns { display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 1fr; gap: 10px; margin: 14px 0 0; }
.ilb-popup .ilb-popup__btns:first-child { margin-top: 0; }
.ilb-popup .ilb-popup__btns > :last-child:nth-child(odd) { grid-column: 1 / -1; }
.ilb-popup .btn { display: flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: 0; padding: 10px 6px;
  background: #fff; color: #000; font-size: 13px; line-height: 18px; letter-spacing: 1px; text-wrap: balance; }
.ilb-popup .btn.is-pending { background: none; color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .6); cursor: default; }
.ilb-popup .btn.is-pending:hover { opacity: 1; }
/* ds-allow-hardcode:end */
