.pdi-venue-story{width:100%;position:relative;z-index:3;background:transparent}
.pdi-venue-story picture,.pdi-venue-story img{display:block;width:100%;height:auto}
.pdi-venue-story img{aspect-ratio:auto var(--pdi-v2-venue-d-ar,2560/2880);object-fit:contain}
@media(max-width:767px){.pdi-venue-story img{aspect-ratio:auto var(--pdi-v2-venue-m-ar,1/3)}}

/* Téléphone : #reservation remonte de 30 px (typography.css, « 30px fantomes entre #menu et
   #reservation » : html.pdi-v2 #reservation{margin-top:-30px!important}) et, au-dessus (z-index 4
   contre 3), mangeait le bas de l'affiche du lieu posée juste avant elle. Juste après l'affiche, elle
   ne remonte plus : bord à bord. Réservation masquée (reservation.enabled false, html.pdi-v2-sans-resa-m) :
   la règle ne s'applique pas, aucune bande. Sans affiche du lieu, rien ne change. (1,2,1) bat (1,1,1). (29/09) */
@media(max-width:768px){html.pdi-v2 .pdi-venue-story+#reservation,html.resto-redrooster .pdi-venue-story+#reservation{margin-top:0!important}}

/* ------------------------------------------------------------------ annonces
   Bannieres et popups du restaurateur. Les couleurs, la police et l'arrondi
   arrivent en variables posees par site-extras.js (--pdi-ann-*) : le meme
   habillage sert a l'apercu du logiciel, qui lit les memes valeurs. */
.pdi-ann-stack{position:relative;z-index:10001;display:grid;font:500 15px/1.4 var(--pdi-ann-font,system-ui,sans-serif)}
.pdi-ann-stack:empty{display:none}
.pdi-ann-stack--bottom{position:fixed;left:0;right:0;bottom:0}
.pdi-ann-banner{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 16px;
  background:var(--pdi-ann-bg,#181713);color:var(--pdi-ann-fg,#fff);padding:11px 46px;text-align:center;text-decoration:none;
  border-bottom:1px solid #ffffff26;font-family:var(--pdi-ann-font,system-ui,sans-serif);overflow-wrap:anywhere}
.pdi-ann-stack--bottom .pdi-ann-banner{border-bottom:0;border-top:1px solid #ffffff26}
a.pdi-ann-banner:hover{filter:brightness(1.12)}
.pdi-ann-banner-text{font-weight:500}

.pdi-ann-popup,.pdi-ann-float{box-sizing:border-box;border:0;padding:24px;background:var(--pdi-ann-bg,#fff);color:var(--pdi-ann-fg,#191919);
  border-radius:var(--pdi-ann-radius,18px);font:400 16px/1.5 var(--pdi-ann-font,system-ui,sans-serif)}
.pdi-ann-popup{width:min(540px,calc(100vw - 28px));max-height:calc(100dvh - 32px);overflow:auto;z-index:2147483646}
.pdi-ann-popup::backdrop{background:#0009}
.pdi-ann-popup.pdi-ann-pos-full{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}
.pdi-ann-pos-full>*{max-width:560px;width:100%}

.pdi-ann-float{position:fixed;z-index:2147483645;width:min(380px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;
  box-shadow:0 18px 50px #0000002e}
.pdi-ann-pos-bottom-right{right:12px;bottom:12px}
.pdi-ann-pos-bottom-left{left:12px;bottom:12px}
.pdi-ann-pos-top-right{right:12px;top:12px}
.pdi-ann-pos-top-left{left:12px;top:12px}
.pdi-ann-float.pdi-ann-pos-bottom-bar{left:0;right:0;bottom:0;width:100%;max-width:100%;border-radius:0;padding:16px 46px;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 20px;text-align:center}
.pdi-ann-pos-bottom-bar .pdi-ann-btn{width:auto;min-width:180px}
.pdi-ann-pos-bottom-bar img{max-width:90px;margin:0}

.pdi-ann-title{font:600 22px/1.3 var(--pdi-ann-font-titre,system-ui,sans-serif)!important;color:inherit;margin:16px 0 0;overflow-wrap:anywhere}
.pdi-ann-text{margin:12px 0 0;color:inherit;overflow-wrap:anywhere;white-space:pre-line}
.pdi-ann-popup img,.pdi-ann-float img{display:block;width:100%;height:auto;margin-top:4px;border-radius:calc(var(--pdi-ann-radius,18px) - 8px)}
.pdi-ann-label{display:block;margin-top:16px;font-size:14px}
.pdi-ann-popup input,.pdi-ann-float input{box-sizing:border-box;display:block;width:100%;padding:12px;border:1px solid #00000038;border-radius:8px;margin:8px 0 0;font:inherit;background:#fff;color:#191919}
.pdi-ann-btn{display:block;box-sizing:border-box;width:100%;margin-top:16px;border:0;border-radius:calc(var(--pdi-ann-radius,18px) - 8px);
  padding:12px 18px;background:var(--pdi-ann-btn-bg,#191919);color:var(--pdi-ann-btn-fg,#fff);text-align:center;text-decoration:none;
  font:600 15px/1.3 var(--pdi-ann-font,system-ui,sans-serif);cursor:pointer}
.pdi-ann-btn--mince{width:auto;margin:0;padding:7px 16px;border-radius:999px;font-size:14px}
.pdi-ann-btn:hover{filter:brightness(1.15)}
.pdi-ann-close{position:absolute;top:6px;right:8px;background:transparent;color:inherit;border:0;font:26px/1 system-ui;cursor:pointer;padding:4px 10px;opacity:.65}
.pdi-ann-close:hover{opacity:1}

/* Les effets d'entree : UNE animation, sept variantes, chacune ne posant que
   son point de depart (--pdi-dx/--pdi-dy/--pdi-sc). */
/* Pas de `both` sur ces animations : le remplissage arriere garderait
   l'opacite 0 tant que la ligne de temps n'a pas demarre — et elle ne demarre
   pas dans un onglet d'arriere-plan (vu au banc, 16/09 : encart invisible). */
@keyframes pdi-ann-in{from{opacity:0;transform:translate(var(--pdi-dx,0),var(--pdi-dy,0)) scale(var(--pdi-sc,1))}to{opacity:1;transform:none}}
@keyframes pdi-ann-bounce{0%{opacity:0;transform:scale(.8)}55%{opacity:1;transform:scale(1.06)}75%{transform:scale(.97)}100%{transform:none}}
.pdi-ann-e-fade,.pdi-ann-e-slide-right,.pdi-ann-e-slide-left,.pdi-ann-e-slide-up,.pdi-ann-e-slide-down,.pdi-ann-e-zoom{animation:pdi-ann-in .42s cubic-bezier(.22,.9,.28,1)}
.pdi-ann-e-bounce{animation:pdi-ann-bounce .6s cubic-bezier(.22,.9,.28,1)}
.pdi-ann-e-slide-right{--pdi-dx:48px}
.pdi-ann-e-slide-left{--pdi-dx:-48px}
.pdi-ann-e-slide-up{--pdi-dy:48px}
.pdi-ann-e-slide-down{--pdi-dy:-48px}
.pdi-ann-e-zoom{--pdi-sc:.88}
.pdi-ann-float.pdi-ann-e-slide-right{--pdi-dx:120%}
.pdi-ann-float.pdi-ann-e-slide-left{--pdi-dx:-120%}
.pdi-ann-float.pdi-ann-e-slide-up{--pdi-dy:120%}
.pdi-ann-float.pdi-ann-e-slide-down{--pdi-dy:-120%}
@media(prefers-reduced-motion:reduce){.pdi-ann-e-fade,.pdi-ann-e-slide-right,.pdi-ann-e-slide-left,.pdi-ann-e-slide-up,.pdi-ann-e-slide-down,.pdi-ann-e-zoom,.pdi-ann-e-bounce{animation-duration:.01ms}}
@media(max-width:520px){
  .pdi-ann-float{left:8px;right:8px;width:auto;max-width:none}
  .pdi-ann-banner,.pdi-ann-float.pdi-ann-pos-bottom-bar{padding-left:40px;padding-right:40px}
}

/* 20/10 (fondateur, sur la fenêtre « One last craving? » de Mr. Chicken : « la croix n'est pas centrée ici, règle cela sur tous les
   gabarits ») : les croix de fermeture RONDES sont dessinées — deux traits centrés au pixel dans le rond — et non plus le caractère
   « × », dont la place dans sa boîte change d'une police à l'autre (il tombait de côté). Fenêtre de commande (.pdi-pay-x, toutes ses
   mises en page et tous ses thèmes : la couleur reste la sienne), rappel du panier, réservation des gabarits 2 (.pdi-sc-close) et
   3 (.pdi-pd-close). Le nom du bouton (aria-label) ne change pas. */
.pdi-pay-x,.pdi-upsell-rappel-x,.pdi-sc-close,.pdi-pd-close{padding:0!important;font-size:0!important;line-height:0!important;text-indent:0!important;overflow:hidden}
.pdi-upsell-rappel-x{position:relative}
.pdi-pay-x::before,.pdi-pay-x::after,.pdi-upsell-rappel-x::before,.pdi-upsell-rappel-x::after,
.pdi-sc-close::before,.pdi-sc-close::after,.pdi-pd-close::before,.pdi-pd-close::after{content:"";position:absolute;left:50%;top:50%;width:42%;height:2px;margin:-1px 0 0 -21%;border-radius:2px;background:currentColor;pointer-events:none}
.pdi-pay-x::before,.pdi-upsell-rappel-x::before,.pdi-sc-close::before,.pdi-pd-close::before{transform:rotate(45deg)}
.pdi-pay-x::after,.pdi-upsell-rappel-x::after,.pdi-sc-close::after,.pdi-pd-close::after{transform:rotate(-45deg)}
