@font-face{font-family:Playfair Display;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/playfair-normal-400.woff2)format("woff2")}@font-face{font-family:Playfair Display;font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/playfair-normal-600.woff2)format("woff2")}@font-face{font-family:Playfair Display;font-style:italic;font-weight:500;font-display:swap;src:url(/fonts/playfair-italic-500.woff2)format("woff2")}:root{color:#2f2927;background:#faf7f3;font-family:Arial,sans-serif}*{box-sizing:border-box}body{margin:0}main{max-width:800px;margin:auto;padding:20px}header{margin:28px 0;font-size:18px}.notice{text-align:center;background:#efe7df;border-radius:9px;padding:12px;font-size:12px}.eyebrow{text-transform:uppercase;letter-spacing:.04em;color:#7c5140;font-size:12px}h1{max-width:390px;margin:30px 0 24px;font:400 34px/1.12 Georgia,serif}h2{font:400 28px Georgia,serif}button:not(.cl-button){color:#7e3d29;cursor:pointer;background:#fffaf5;border:1px solid #b4765b;border-radius:9px;min-height:44px;margin:8px 8px 8px 0;padding:12px 18px;font:600 14px Arial}button:not(.cl-button):disabled{opacity:.6;cursor:wait}button:not(.cl-button):focus-visible{outline-offset:3px;outline:3px solid #91533d}.sub{color:#6f625d;font-size:13px;line-height:1.5}.grid{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;display:grid}.tile{background:#fff;border:1px solid #ded0c6;border-radius:16px;padding:20px}.loyalty:after{content:"";pointer-events:none;border:1px solid #b3a27380;border-radius:16px;position:absolute;inset:10px}.loyalty{touch-action:pan-y;-webkit-user-select:none;user-select:none;border-radius:24px;width:min(100%,390px);min-height:530px;margin:25px 0;padding:26px;position:relative;box-shadow:0 18px 40px #161a1e38}.front{color:#23282d;background:#f4f2ee 50%/cover;border:1px solid #d8d3c9;flex-direction:column;justify-content:center;padding-bottom:92px;display:flex}.front.has-photo{color:#fff;border:none}.front .eyebrow{letter-spacing:.24em;text-transform:uppercase;color:#8a8478;margin:0 0 14px;font:600 11px Arial}.front.has-photo .eyebrow{color:#ffffffd9}.front h2{letter-spacing:.07em;text-transform:uppercase;color:#23282d;margin:0;font:600 30px/1.3 Playfair Display,Georgia,serif}.front h2:after{content:"";background:#b3a273;width:56px;height:1px;margin-top:16px;display:block}.front.has-photo h2{color:#fff;text-shadow:0 2px 16px #0006}.front .sub{letter-spacing:.18em;text-transform:uppercase;color:#7a7468;margin:14px 0 0;font:600 11px Arial}.front.has-photo .sub{color:#ffffffeb}.credit{opacity:.85;font-size:11px;position:absolute;top:15px;right:16px}.reverse{background:#f4f2ee;border:1px solid #d8d3c9;flex-direction:column;justify-content:flex-start;padding-bottom:92px;display:flex}.reverse h2{color:#23282d;margin:4px 0 2px;font:600 38px Playfair Display,Georgia,serif}.reverse .eyebrow{color:#5f666d;letter-spacing:.12em}.reverse>.eyebrow:first-child{margin:0 0 4px}.reverse h3{color:#2b3036;margin:10px 0 0;font:italic 500 24px/1.3 Playfair Display,Georgia,serif}.stamps{flex-wrap:wrap;gap:10px;margin:22px 0;display:flex}.stamps span{color:#57534c;font-variant-numeric:lining-nums;background:#fff;border:1px solid #c6c0b2;border-radius:50%;place-items:center;width:46px;height:46px;font:600 16px/1 Playfair Display,Georgia,serif;display:grid}.stamps .done{color:#fff;background:#b3a273;border-color:#b3a273;box-shadow:0 3px 8px #b3a27359}.loyalty button.flip-hint:not(.cl-button){color:#57534c;letter-spacing:.04em;background:#ffffff8c;border:1px solid #c9c2b2;border-radius:999px;min-height:36px;padding:7px 18px;font:600 12px Arial}.loyalty>button.flip-hint{z-index:2;margin:0;position:absolute;bottom:26px}.front>button.flip-hint,.reverse>button.flip-hint{right:26px}.loyalty.has-photo button.flip-hint{color:#fff;background:#ffffff14;border-color:#ffffff80}.reward-eyebrow{border-top:1px solid #ddd6c9;margin:22px 0 0;padding-top:16px}canvas{max-width:100%;margin:16px auto;display:block;height:auto!important}.error{background:#fff0ec;border:1px solid #c47a65;border-radius:8px;padding:16px;line-height:1.4}@media (width<=400px){h1{font-size:30px}main{padding:16px}.loyalty{min-height:510px;padding:22px}.front,.reverse{padding-bottom:80px}.loyalty>button.flip-hint{bottom:22px}.front>button.flip-hint,.reverse>button.flip-hint{right:22px}}@media (prefers-reduced-motion:no-preference){.loyalty{animation:.25s ease-out show}@keyframes show{0%{opacity:.5;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}}form.app-form{max-width:560px}form.app-form label{margin:18px 0;font-size:14px;line-height:1.5;display:block}form.app-form input:not([type=checkbox]){width:100%;font:inherit;background:#fff;border:1px solid #aa9486;border-radius:8px;margin-top:6px;padding:13px;display:block}form.app-form input:focus-visible{outline-offset:2px;outline:3px solid #91533d}form.app-form input[type=checkbox]{vertical-align:middle;width:20px;height:20px;margin-right:8px}form.app-form button:not(.cl-button){width:100%}.mail-preview{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6}.tile code,.tile p{overflow-wrap:anywhere}form.app-form .pwd-wrap{margin-top:6px;position:relative}form.app-form .pwd-wrap input{margin-top:0;padding-right:52px}form.app-form button.pwd-toggle{color:#7c5140;background:0 0;border:none;align-items:center;width:auto;min-height:36px;margin:0;padding:6px 8px;display:flex;position:absolute;top:50%;right:6px;transform:translateY(-50%)}form.app-form button.pwd-toggle svg{width:20px;height:20px;display:block}
input.search-clientes{width:100%;display:block;font:inherit;background:#fff;border:1px solid #aa9486;border-radius:8px;margin:6px 0 14px;padding:13px}p.qr-note{font-size:11px;color:#6f625d;margin:14px 0 6px;opacity:.85}

/* 2026-10-25 : QR de secours tout petit dans le coin droit de la carte (au lieu du centre) */
.loyalty.reverse canvas{width:64px!important;height:64px!important;flex:none;align-self:flex-end;margin:6px 2px 6px 0}

.loyalty .site-link{color:#7e3d29;letter-spacing:.04em;text-decoration:none;background:#ffffff8c;border:1px solid #c9c2b2;border-radius:999px;padding:7px 18px;font:600 12px Arial;position:absolute;left:26px;bottom:26px;z-index:2}
.loyalty.has-photo .site-link{color:#fff;background:#ffffff14;border-color:#ffffff80}

/* 2026-10-25 : verso carte - retour = cercle fleche droite ; Voir le site = fonce lisible, meme hauteur */
.loyalty.reverse>button.flip-hint:not(.cl-button){box-sizing:border-box;width:44px;height:44px;min-height:44px;padding:0;border-radius:50%;background:rgba(35,40,45,.88);border:1px solid rgba(35,40,45,.9);font-size:0}
.loyalty.reverse>button.flip-hint:not(.cl-button)::before{content:"";position:absolute;left:50%;top:50%;margin:-1px 0 0 -10px;width:12px;height:2px;background:#fff}
.loyalty.reverse>button.flip-hint:not(.cl-button)::after{content:"";position:absolute;left:50%;top:50%;margin:-5px 0 0 2px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:7px solid #fff}
.loyalty.reverse .site-link{box-sizing:border-box;display:inline-flex;align-items:center;height:44px;background:rgba(35,40,45,.88);color:#fff;border:1px solid rgba(35,40,45,.9)}
.loyalty.has-photo.reverse .site-link{background:rgba(35,40,45,.88);color:#fff;border-color:rgba(35,40,45,.9)}

/* 2026-10-25 : habillage espace salon validé par Alima (vocal 18:45) - couleurs/surfaces seulement, positions et formes inchangées */
body:has(main>section.tile){background:linear-gradient(180deg,#faf7f2 0%,#f7f1e9 100%)}
main:has(>section.tile)>p.notice{color:#7c6a5c;background:#f2ebdf;border:1px solid #e7dcc9}
main:has(>section.tile)>header+button{color:#7c5140;background:#fff;border:1px solid #d9c3b5}
main:has(>section.tile)>p+button{color:#fff;background:linear-gradient(180deg,#86583f 0%,#7c5140 100%);border:1px solid #7c5140;box-shadow:0 6px 16px rgba(124,81,64,.30)}
main:has(>section.tile)>p+button+button{color:#7c5140;background:#fff;border:1.5px solid #c9a892;box-shadow:none}
main:has(>section.tile)>section.tile{border:1px solid #e3d9cb;box-shadow:0 6px 18px rgba(61,43,35,.05)}
main:has(>section.tile)>section.tile+section.tile{box-shadow:0 10px 24px rgba(61,43,35,.07)}
main:has(>section.tile)>section.tile>button{color:#7c5140;background:#fff;border:1.5px solid #c9a892;box-shadow:none}
main:has(>section.tile)>section.tile>button~button{color:#a59085;background:transparent;border:1px solid #e2d6c9;box-shadow:none}
main:has(>section.tile)>div>button{color:#7c5140;background:#fff;border:1.5px solid #c9a892}
main:has(>section.tile)>input.search-clientes{border:1px solid #d9cbbd}
p.notice.flottante,main:has(>section.tile)>p.notice.flottante{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:60;margin:0;width:min(92vw,520px);min-height:84px;display:flex;align-items:center;justify-content:center;padding:0 20px;background:linear-gradient(#86583f 0%,#7c5140 100%);border:1px solid #7c5140;border-radius:9px;box-shadow:0 10px 30px rgba(60,35,20,.35);font-size:14px;font-weight:600;color:#fff;text-align:center}

button.danger,main:has(>section.tile) button.danger{background:#8b2e22;background-image:none;border-color:#8b2e22;color:#fff;min-width:208px;text-align:center}

.btn-resiliation{display:inline-block;background:#7f1d1d;color:#fff;padding:.75rem 1.25rem;border-radius:.5rem;text-decoration:none;font-weight:600;margin-top:.5rem}

/* redeploiement v132 : types MIME corriges, contenu inchange */

/* v133 */
