/* Éditeur — BEM, mobile d'abord (les restaurateurs éditent surtout sur téléphone).
   Cibles tactiles ≥ 44px, aucune dépendance CSS externe. */

:root{
  --bg:#f6f4f1; --surface:#fff; --surface-2:#f0ece7; --text:#1f1a17; --muted:#6f655d; --line:#e3ddd6;
  --accent:#b5522e; --accent-dark:#973f20; --accent-soft:#f7e6dd; --danger:#b3261e; --success:#1e6b39;
  --radius:14px; --shadow:0 1px 2px rgb(0 0 0/.06),0 4px 16px rgb(0 0 0/.06);
  --topbar-h:60px; --switch-h:64px;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0}
h1,h2,p,ul,ol,fieldset{margin:0}
ul,ol{padding:0;list-style:none}
fieldset{border:0;padding:0;min-width:0}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
[hidden]{display:none !important}

.app-body{background:var(--bg);color:var(--text);font:15px/1.5 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.app{min-height:100dvh}
.loading{display:grid;place-items:center;min-height:60dvh;color:var(--muted)}
.ui-icon{display:inline-flex;flex:none}
.ui-icon svg{width:20px;height:20px}

/* ---------- Boutons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.45rem;
  min-height:44px;padding:.6rem 1.1rem;border:1.5px solid transparent;border-radius:12px;
  font-weight:600;text-decoration:none;background:none;transition:background-color .15s,border-color .15s,opacity .15s;
}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn:focus-visible,.icon-btn:focus-visible,.link:focus-visible,.block-card__main:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 45%,transparent);outline-offset:2px}
.btn--primary{background:var(--accent);color:#fff}
.btn--primary:not(:disabled):hover{background:var(--accent-dark)}
.btn--secondary{background:var(--surface);border-color:var(--line)}
.btn--secondary:hover{border-color:var(--text)}
.btn--ghost{color:var(--muted)}
.btn--ghost:hover{background:var(--surface-2);color:var(--text)}
.btn--dashed{border:1.5px dashed var(--line);color:var(--muted);background:transparent}
.btn--dashed:hover{border-color:var(--accent);color:var(--accent)}
.btn--block{width:100%}
.btn--small{min-height:36px;padding:.35rem .75rem;font-size:.875rem}
.btn--large{min-height:52px;font-size:1.05rem}

.icon-btn{
  display:inline-grid;place-items:center;width:44px;height:44px;flex:none;
  border:0;border-radius:10px;background:none;color:var(--muted);
}
.icon-btn:hover{background:var(--surface-2);color:var(--text)}
.icon-btn--active{background:var(--surface-2);color:var(--text)}
.icon-btn--danger:hover{color:var(--danger);background:#fbe9e7}

.link{border:0;background:none;padding:0;color:var(--accent);font-weight:600;text-decoration:underline;text-underline-offset:2px}

/* ---------- Champs ---------- */
.form{display:grid;gap:1.1rem}
.field{display:grid;gap:.35rem}
.field__label{font-weight:600;font-size:.9rem}
.field__hint{font-size:.8rem;color:var(--muted)}
.field__error{font-size:.85rem;color:var(--danger);min-height:0}
.field__error:empty{display:none}
.input{
  width:100%;min-height:46px;padding:.6rem .8rem;border:1.5px solid var(--line);border-radius:10px;
  background:var(--surface);font-size:16px; /* 16px : évite le zoom auto sur iOS */
}
.input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.input--area{min-height:88px;resize:vertical;line-height:1.45}
.input--select{appearance:none;padding-inline-end:2.2rem;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236f655d' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .7rem center;background-size:18px}
.input--time{width:auto;min-width:6.5rem;padding-inline:.5rem}

.switch{display:flex;align-items:center;gap:.7rem;cursor:pointer;min-height:44px}
.switch__input{position:absolute;opacity:0;width:1px;height:1px}
.switch__track{position:relative;flex:none;width:44px;height:26px;border-radius:999px;background:var(--line);transition:background-color .15s}
.switch__track::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgb(0 0 0/.25);transition:transform .15s}
.switch__input:checked + .switch__track{background:var(--accent)}
.switch__input:checked + .switch__track::after{transform:translateX(18px)}
.switch__input:focus-visible + .switch__track{outline:3px solid var(--accent-soft);outline-offset:2px}
.switch__label{font-weight:500}

.chips{display:flex;flex-wrap:wrap;gap:.4rem}
.chip{cursor:pointer}
.chip__input{position:absolute;opacity:0;width:1px;height:1px}
.chip__label{display:inline-block;padding:.4rem .8rem;border:1.5px solid var(--line);border-radius:999px;font-size:.85rem;font-weight:500;background:var(--surface)}
.chip__input:checked + .chip__label{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-dark)}
.chip__input:focus-visible + .chip__label{outline:3px solid var(--accent-soft)}

.image-field{display:flex;gap:.8rem;align-items:center;padding:.6rem;border:1.5px solid var(--line);border-radius:12px;background:var(--surface)}
.image-field__thumb,.image-field__empty{width:84px;height:64px;border-radius:8px;object-fit:cover;flex:none}
.image-field__empty{display:grid;place-items:center;background:var(--surface-2);color:var(--muted)}
.image-field__actions{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.image-field__status{color:var(--muted);font-size:.9rem}
.image-field__error{flex-basis:100%;color:var(--danger);font-size:.85rem}

/* Listes imbriquées (catégories, plats, photos, avis…) */
.list{display:grid;gap:.5rem}
.list__item{border:1.5px solid var(--line);border-radius:12px;background:var(--surface)}
.list__item.sortable-ghost{opacity:.4}
.list__summary{display:flex;align-items:center;gap:.25rem;min-height:52px;padding-inline:.25rem .25rem;list-style:none;cursor:pointer;font-weight:600}
.list__summary::-webkit-details-marker{display:none}
.list__title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.list__chevron{color:var(--muted);transition:transform .15s}
.list__details[open] > .list__summary .list__chevron{transform:rotate(180deg)}
.list__body{padding:.25rem .9rem 1rem;border-top:1px solid var(--line)}
.list__body .list__item{background:var(--bg)}
.drag-handle{display:grid;place-items:center;width:40px;height:44px;flex:none;color:var(--muted);cursor:grab;touch-action:none}
.drag-handle:active{cursor:grabbing}

/* Horaires */
.hours-editor{display:grid;gap:.25rem;border:1.5px solid var(--line);border-radius:12px;background:var(--surface);padding:.25rem .75rem}
.hours-editor__day{display:grid;gap:.25rem;padding-block:.5rem;border-bottom:1px solid var(--line)}
.hours-editor__day:last-child{border-bottom:0}
.hours-editor__slots{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;padding-inline-start:3.2rem}
.hours-editor__slot{display:flex;align-items:center;gap:.35rem}
.hours-editor__closed{color:var(--muted);font-size:.9rem}
.hours-editor__day--closed .switch__label{color:var(--muted)}
@media (min-width:30em){.hours-editor__day{grid-template-columns:9rem 1fr;align-items:start}.hours-editor__slots{padding-inline-start:0;padding-top:.3rem}}

/* ---------- Connexion ---------- */
.auth{display:grid;place-items:center;min-height:100dvh;padding:1.25rem}
.auth__card{width:min(100%,26rem);padding:2rem 1.5rem;background:var(--surface);border-radius:20px;box-shadow:var(--shadow)}
.auth__brand{font-weight:700;color:var(--accent);letter-spacing:.02em;margin-bottom:1.25rem}
.auth__title{font-size:1.5rem;line-height:1.2}
.auth__subtitle{margin-top:.4rem;color:var(--muted)}
.auth__form{display:grid;gap:1rem;margin-top:1.5rem}
.auth__message:empty{display:none}
.auth__message{padding:.7rem .9rem;border-radius:10px;font-size:.9rem}
.auth__message--error{background:#fbe9e7;color:var(--danger)}
.auth__message--success{background:#e4f3e8;color:var(--success)}
.auth__links{margin-top:1.25rem;text-align:center;font-size:.9rem;color:var(--muted)}

/* ---------- Création du restaurant ---------- */
.onboarding{width:min(100% - 2rem,64rem);margin:0 auto;padding-block:2rem 4rem}
.onboarding__header,.onboarding__step:not(.onboarding__step--wide),.onboarding .form-error,.onboarding__form > .btn{width:min(100%,40rem);margin-inline:auto}
.onboarding__chosen{font-weight:700;color:var(--accent-dark)}
.onboarding__header{margin-bottom:1.5rem}
.onboarding__title{font-size:1.75rem;line-height:1.15}
.onboarding__subtitle{margin-top:.4rem;color:var(--muted)}
.onboarding__form{display:grid;gap:1.25rem}
.onboarding__step{display:grid;gap:1rem;padding:1.25rem;background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow)}
.onboarding__legend{float:left;width:100%;font-size:1.1rem;font-weight:700;margin-bottom:.25rem}
.onboarding__note{color:var(--muted);font-size:.9rem;clear:both}
.form-error:empty{display:none}
.form-error{padding:.7rem .9rem;border-radius:10px;background:#fbe9e7;color:var(--danger)}

.slug-field{display:flex;align-items:stretch;border:1.5px solid var(--line);border-radius:10px;background:var(--surface);overflow:hidden}
.slug-field:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.slug-field__input{border:0;border-radius:0;min-width:0;flex:1}
.slug-field__input:focus{box-shadow:none}
.slug-field__suffix{display:flex;align-items:center;padding-inline:.6rem .8rem;background:var(--surface-2);color:var(--muted);font-size:.85rem;white-space:nowrap}
.slug-field__status{font-size:.85rem;color:var(--muted);min-height:1.2em}
.slug-field__status--ok{color:var(--success)}
.slug-field__status--error{color:var(--danger)}

.choice-grid{display:grid;gap:.75rem}
@media (min-width:36em){.choice-grid{grid-template-columns:1fr 1fr}}
.choice{position:relative;display:grid;gap:.3rem;padding:1rem;border:2px solid var(--line);border-radius:12px;cursor:pointer;background:var(--surface)}
.choice--selected{border-color:var(--accent);background:var(--accent-soft)}
.choice--locked{cursor:not-allowed;opacity:.6}
.choice__input{position:absolute;opacity:0}
.choice__input:focus-visible ~ .choice__title{text-decoration:underline}
.choice__title{display:flex;align-items:center;gap:.4rem;font-weight:700}
.choice__price{font-size:.85rem;color:var(--accent-dark);font-weight:600}
.choice__desc{font-size:.9rem;color:var(--muted)}
.choice__features{display:grid;gap:.2rem;margin-top:.25rem;font-size:.85rem;color:var(--muted)}
.choice__features li::before{content:"✓ ";color:var(--success);font-weight:700}

/* ---------- Barre de l'éditeur ---------- */
.topbar-editor{
  position:relative;z-index:20;flex:none;display:flex;align-items:center;gap:.5rem;
  height:var(--topbar-h);padding-inline:1rem .5rem;background:var(--text);color:#fff;
}
.topbar-editor__brand{display:grid;flex:1;min-width:0;line-height:1.25}
.topbar-editor__name{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.topbar-editor__url{display:inline-flex;align-items:center;gap:.25rem;color:#d8cfc6;font-size:.78rem;text-decoration:none;overflow:hidden;white-space:nowrap}
.topbar-editor__url .ui-icon svg{width:14px;height:14px}
.topbar-editor__url:hover{color:#fff}
.topbar-editor__save{display:none;font-size:.8rem;color:#d8cfc6;white-space:nowrap}
.topbar-editor__save--error{color:#ffb4a8}
.topbar-editor .icon-btn{color:#d8cfc6}
.topbar-editor .icon-btn:hover{background:rgb(255 255 255/.1);color:#fff}
@media (min-width:40em){.topbar-editor__save{display:inline}}

.trial-banner{padding:.5rem 1rem;background:var(--accent-soft);color:var(--accent-dark);font-size:.85rem;font-weight:500;text-align:center}

/* ---------- Mise en page éditeur / aperçu ---------- */
.app--editor{display:flex;flex-direction:column;height:100dvh}
.editor-wrap{flex:1;min-height:0;padding-bottom:var(--switch-h)}
.editor{height:100%}
.panel,.preview{height:100%}
.editor--show-panel .preview,.editor--show-preview .panel{display:none}
.panel{display:flex;flex-direction:column;background:var(--bg);min-height:0}
.panel__content{flex:1;overflow-y:auto;padding:1rem 1rem 2rem;overscroll-behavior:contain}
.panel__intro{color:var(--muted);font-size:.9rem;margin-bottom:.9rem}
.panel__title{font-size:1.2rem;margin:.25rem 0 1rem}
.panel__content > .panel__title ~ .panel__title{margin-top:1.75rem}

.tabs{display:flex;gap:.25rem;padding:.5rem 1rem 0;border-bottom:1px solid var(--line);background:var(--bg)}
.tabs__tab{min-height:44px;padding:.5rem .9rem;border:0;border-bottom:3px solid transparent;background:none;font-weight:600;color:var(--muted)}
.tabs__tab--active{color:var(--text);border-bottom-color:var(--accent)}

.back-btn{display:inline-flex;align-items:center;gap:.2rem;min-height:44px;margin:-.25rem 0 .25rem -.4rem;padding:.25rem .4rem;border:0;background:none;color:var(--muted);font-weight:600}
.back-btn:hover{color:var(--text)}

.blocks{display:grid;gap:.55rem}
.block-card{display:flex;align-items:center;gap:.1rem;min-height:64px;padding-inline:.15rem .25rem;background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow)}
.block-card--hidden .block-card__name,.block-card--hidden .block-card__summary{opacity:.5}
.block-card--ghost{opacity:.35;background:var(--accent-soft)}
.block-card.sortable-chosen{box-shadow:0 8px 24px rgb(0 0 0/.15)}
.block-card__handle--off{width:12px}
.block-card__main{flex:1;min-width:0;display:grid;gap:.1rem;min-height:64px;padding:.6rem .3rem;border:0;background:none;text-align:start}
.block-card__name{font-weight:700}
.block-card__summary{font-size:.83rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.add-list{display:grid;gap:.5rem}
.add-list__item{display:grid;gap:.15rem;width:100%;padding:.9rem 1rem;border:1.5px solid var(--line);border-radius:12px;background:var(--surface);text-align:start}
.add-list__item:hover{border-color:var(--accent)}
.add-list__name{font-weight:700}
.add-list__desc{font-size:.85rem;color:var(--muted)}

.panel__content > .btn--dashed{margin-top:.9rem}
.upsell{display:flex;gap:.5rem;align-items:flex-start;margin-top:1rem;padding:.8rem .9rem;border-radius:12px;background:var(--surface-2);color:var(--muted);font-size:.85rem}

.swatches{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem}
.swatch,.font-choice{display:grid;gap:.5rem;padding:.7rem;border:2px solid var(--line);border-radius:12px;background:var(--surface);text-align:start}
.swatch--selected,.font-choice--selected{border-color:var(--accent);background:var(--accent-soft)}
.swatch__colors{height:40px;border-radius:8px;background:linear-gradient(90deg,var(--c1) 0 45%,var(--c2) 45% 80%,var(--c3) 80%);border:1px solid var(--line)}
.swatch__label,.font-choice__label{font-weight:600;font-size:.9rem}
.font-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}
.font-choice{justify-items:center;text-align:center}
.font-choice__sample{font-size:2rem;line-height:1}

.preview{display:flex;flex-direction:column;background:#e7e2dc}
.preview__toolbar{display:none;justify-content:center;gap:.25rem;padding:.4rem}
.preview__frame{flex:1;min-height:0;margin:0 auto;width:100%;background:#fff}
.preview__iframe{display:block;width:100%;height:100%;border:0}

.mobile-switch{position:fixed;inset:auto 0 0;z-index:20;display:grid;grid-template-columns:1fr 1fr;height:var(--switch-h);
  padding-bottom:env(safe-area-inset-bottom);background:var(--surface);border-top:1px solid var(--line)}
.mobile-switch__btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.1rem;border:0;background:none;color:var(--muted);font-size:.78rem;font-weight:600}
.mobile-switch__btn--active{color:var(--accent)}

@media (min-width:60em){
  .editor-wrap{padding-bottom:0}
  .editor,.editor--show-panel,.editor--show-preview{display:grid;grid-template-columns:minmax(380px,440px) 1fr}
  .editor--show-panel .preview,.editor--show-preview .panel{display:flex}
  .panel{border-right:1px solid var(--line)}
  .preview__toolbar{display:flex}
  .preview__frame{margin-bottom:1rem;border-radius:12px;overflow:hidden;box-shadow:var(--shadow)}
  .preview__frame--mobile{width:390px;max-height:844px}
  .preview__frame--desktop{width:calc(100% - 2rem)}
  .mobile-switch{display:none}
}

/* ---------- Toast ---------- */
.toast{position:fixed;left:50%;bottom:calc(var(--switch-h) + 1rem);z-index:50;max-width:calc(100% - 2rem);padding:.75rem 1.1rem;border-radius:12px;
  background:var(--text);color:#fff;font-weight:500;box-shadow:0 8px 24px rgb(0 0 0/.2);
  transform:translate(-50%,1rem);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}
.toast--visible{opacity:1;transform:translate(-50%,0)}
.toast--success{background:var(--success)}
.toast--error{background:var(--danger)}
@media (min-width:60em){.toast{bottom:1.5rem}}

/* ---------- Style du bloc ---------- */
.block-style{margin-bottom:1.25rem;border:1.5px solid var(--line);border-radius:12px;background:var(--surface)}
.block-style__summary{display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:0 .9rem;font-weight:700;cursor:pointer;list-style:none}
.block-style__summary::-webkit-details-marker{display:none}
.block-style__chevron{color:var(--muted);transition:transform .15s}
.block-style[open] .block-style__chevron{transform:rotate(180deg)}
.block-style__body{display:grid;gap:1rem;padding:.25rem .9rem 1rem;border-top:1px solid var(--line)}
.block-style .upsell{margin:0 .9rem .9rem}

.segmented{display:flex;flex-wrap:wrap;gap:.35rem}
.segmented__btn{min-height:40px;padding:.45rem .8rem;border:1.5px solid var(--line);border-radius:10px;background:var(--surface);font-size:.87rem;font-weight:600;color:var(--muted)}
.segmented__btn:hover{border-color:var(--text);color:var(--text)}
.segmented__btn--active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-dark)}

/* ---------- Apparence ---------- */
.swatches{grid-template-columns:repeat(auto-fill,minmax(7.5rem,1fr))}
.font-choices{grid-template-columns:repeat(auto-fill,minmax(6.5rem,1fr))}
.color-input{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-top:.75rem;padding:.6rem .8rem;border:1.5px solid var(--line);border-radius:12px;background:var(--surface)}
.color-input__label{display:flex;align-items:center;gap:.7rem;font-weight:600;font-size:.9rem;cursor:pointer}
.color-input__swatch{width:44px;height:44px;padding:0;border:0;border-radius:10px;background:none;cursor:pointer}
.color-input__swatch::-webkit-color-swatch-wrapper{padding:0}
.color-input__swatch::-webkit-color-swatch{border:1px solid var(--line);border-radius:10px}
.template-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));gap:.6rem;margin-bottom:.5rem}
.template-card{display:grid;gap:.25rem;width:100%;height:100%;padding:.6rem;border:2px solid var(--line);border-radius:12px;background:var(--surface);text-align:start}
.template-card:hover{border-color:var(--accent)}
.template-card__swatch{height:34px;border-radius:8px;border:1px solid var(--line);background:linear-gradient(90deg,var(--c1) 0 50%,var(--c2) 50% 80%,var(--c3) 80%)}
.template-card__name{font-weight:700;font-size:.88rem;line-height:1.2}
.template-card__cuisine{font-size:.75rem;color:var(--muted)}

/* Astuce d'édition directe */
.panel__tip{display:flex;gap:.5rem;align-items:flex-start;margin-bottom:1rem;padding:.7rem .9rem;border-radius:12px;background:#e8f0ff;color:#1d4fa8;font-size:.85rem}

/* ---------- Galerie des modèles ---------- */
.tpl-gallery{display:grid;grid-template-columns:minmax(0,1fr);gap:1rem}
.tpl-gallery__filters{display:flex;gap:.25rem;width:max-content;max-width:100%;padding:.3rem;border-radius:999px;background:var(--surface-2);overflow-x:auto;scrollbar-width:none}
.tpl-gallery__filters::-webkit-scrollbar{display:none}
.tpl-gallery__filter{flex:none;white-space:nowrap;min-height:38px;padding:0 1rem;border:0;border-radius:999px;background:none;font-weight:600;font-size:.88rem;color:var(--muted)}
.tpl-gallery__filter--active{background:var(--surface);color:var(--text);box-shadow:0 1px 3px rgb(0 0 0/.12)}
.tpl-gallery__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));gap:1.25rem 1rem}
.panel .tpl-gallery__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.1rem .75rem}
.panel .tpl-card__meta{flex-direction:column;gap:0}
.panel .tpl-card__pick{width:100%}
.tpl-preview .tpl-preview__secondary{color:#d8cfc6;display:none}
.tpl-preview .tpl-preview__secondary:hover{background:rgb(255 255 255/.1);color:#fff}
@media (min-width:45em){.tpl-preview .tpl-preview__secondary{display:inline-flex}}
.switch-undo{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:1rem;padding:.75rem .9rem;border-radius:12px;background:#e4f3e8;color:var(--success);font-size:.88rem;font-weight:600}
.tpl-card{display:grid;gap:.45rem;align-content:start}
.tpl-card__preview{position:relative;display:block;padding:0;overflow:hidden;border:2px solid var(--line);border-radius:12px;background:var(--surface-2);aspect-ratio:16/10;cursor:zoom-in}
.tpl-card--selected .tpl-card__preview{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.tpl-card__img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .4s ease}
.tpl-card__hover{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:.4rem;background:rgb(22 20 18/.5);color:#fff;font-weight:600;font-size:.9rem;opacity:0;transition:opacity .2s}
.tpl-card__preview:hover .tpl-card__img,.tpl-card__preview:focus-visible .tpl-card__img{transform:scale(1.04)}
.tpl-card__preview:hover .tpl-card__hover,.tpl-card__preview:focus-visible .tpl-card__hover{opacity:1}
.tpl-card__check{position:absolute;inset-block-start:.5rem;inset-inline-end:.5rem;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--accent);color:#fff}
.tpl-card__meta{display:flex;justify-content:space-between;gap:.5rem;align-items:baseline}
.tpl-card__name{font-weight:700;font-size:.92rem;line-height:1.25}
.tpl-card__cuisine{font-size:.78rem;color:var(--muted);white-space:nowrap}
.tpl-card__pick{justify-self:start}

/* Aperçu plein écran d'un modèle */
.tpl-preview{width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#2a2622;color:#fff}
.tpl-preview::backdrop{background:rgb(0 0 0/.6)}
.tpl-preview[open]{display:flex;flex-direction:column}
.tpl-preview__bar{display:flex;align-items:center;gap:.5rem;min-height:60px;padding:.4rem .75rem .4rem 1rem;background:#161412}
.tpl-preview__title{display:grid;flex:1;min-width:0;line-height:1.3}
.tpl-preview__title span{font-size:.8rem;color:#bdb4ab;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tpl-preview .icon-btn{color:#d8cfc6}
.tpl-preview .icon-btn:hover{background:rgb(255 255 255/.1);color:#fff}
.tpl-preview__devices{display:none}
@media (min-width:45em){.tpl-preview__devices{display:flex}}
.tpl-preview__stage{flex:1;min-height:0;display:flex;justify-content:center;padding:1rem}
.tpl-preview__stage[data-device="mobile"]{padding:.5rem}
.tpl-preview__frame{width:100%;height:100%;border:0;border-radius:10px;background:#fff}
.tpl-preview__stage[data-device="mobile"] .tpl-preview__frame{width:min(100%,400px)}
