/* Pixidia, toast unique du site : « verre signature » (canevas Toasts Pixidia, choix du 26/10/2026).
   Préfixe unique .pxdt ; aucune règle hors de ce préfixe. Une chaîne CSS sur plusieurs lignes casserait
   la feuille combinée par LiteSpeed : tout tient sur une ligne. */

.pxdt-host {
  --pxdt-ink: #0b2b28;
  --pxdt-muted: #586e6b;
  --pxdt-ok: #16a05a;
  --pxdt-err: #d32f2f;
  --pxdt-spring: cubic-bezier(.34, 1.56, .64, 1);
  --pxdt-out: cubic-bezier(.16, 1, .3, 1);
  --pxdt-ease: cubic-bezier(.4, 0, .2, 1);
  --pxdt-bottom: 24px;
  position: fixed;
  z-index: 2147483000;
  left: 50%;
  bottom: calc(var(--pxdt-bottom) + var(--pxdt-lift, 0px) + env(safe-area-inset-bottom, 0px));
  width: min(440px, calc(100vw - 24px));
  height: var(--pxdt-h, 0px);
  transform: translateX(-50%);
  pointer-events: none;
  transition: height .35s var(--pxdt-ease), bottom .35s var(--pxdt-ease);
}
.pxdt-host, .pxdt-host * { box-sizing: border-box; }
.pxdt-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; margin: -1px; padding: 0; border: 0; }

/* Couche de pile : position et repli (transform), sans toucher à l'animation de la carte. */
.pxdt {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: auto;
  transform-origin: 50% 100%;
  transform: translateY(var(--pxdt-y, 0px)) scale(var(--pxdt-s, 1));
  opacity: var(--pxdt-o, 1);
  transition: transform .45s var(--pxdt-spring), opacity .3s var(--pxdt-ease);
}
.pxdt.is-hidden { pointer-events: none; }
/* Repliée derrière : même hauteur que la carte de devant, contenu effacé. */
.pxdt__in { max-height: 240px; transition: max-height .35s var(--pxdt-ease); }
.pxdt.is-hidden .pxdt__in { max-height: var(--pxdt-fh, 62px); }
.pxdt__in > * { transition: opacity .2s var(--pxdt-ease); }
.pxdt.is-hidden .pxdt__in > * { opacity: 0; }

/* La carte en verre. */
.pxdt__in {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 62px;
  padding: 12px 10px 12px 12px;
  border-radius: 20px;
  overflow: hidden;
  background: linear-gradient(140deg, rgba(255, 255, 255, .92), rgba(255, 255, 255, .66));
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  backdrop-filter: blur(20px) saturate(180%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .95), inset 0 -1px 0 rgba(13, 82, 74, .06), 0 24px 48px -22px rgba(13, 82, 74, .5), 0 2px 6px rgba(13, 82, 74, .06);
  color: var(--pxdt-ink);
  font-family: Urbanist, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 500;
  text-align: left;
  -webkit-font-smoothing: antialiased;
}
.pxdt__in::before { content: ""; position: absolute; z-index: -1; left: -56px; top: -60px; width: 180px; height: 180px; border-radius: 50%; filter: blur(26px); opacity: .5; pointer-events: none; }
.pxdt--success .pxdt__in::before { background: radial-gradient(circle, rgba(110, 231, 183, .95), rgba(94, 234, 212, 0) 70%); }
.pxdt--error .pxdt__in::before { background: radial-gradient(circle, rgba(255, 138, 128, .85), rgba(253, 186, 116, 0) 70%); }
.pxdt__in::after { content: ""; position: absolute; z-index: -1; inset: 0; border-radius: inherit; background: linear-gradient(135deg, rgba(255, 255, 255, .55), rgba(255, 255, 255, 0) 42%); pointer-events: none; }

.pxdt svg { display: block; flex: none; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }

.pxdt__ic { position: relative; width: 38px; height: 38px; flex: none; border-radius: 50%; display: grid; place-items: center; color: #fff; }
.pxdt--success .pxdt__ic { background: linear-gradient(115deg, #128f50, #16a05a 42%, #0e9784); box-shadow: 0 0 0 3px rgba(255, 255, 255, .92), 0 8px 16px -6px rgba(14, 151, 132, .6); }
.pxdt--error .pxdt__ic { background: linear-gradient(135deg, #c62828, #d32f2f 55%, #e04a3f); box-shadow: 0 0 0 3px rgba(255, 255, 255, .92), 0 8px 16px -6px rgba(211, 47, 47, .55); }
.pxdt__halo { position: absolute; inset: 0; border-radius: 50%; opacity: 0; pointer-events: none; }
.pxdt--success .pxdt__halo { box-shadow: 0 0 0 2px rgba(22, 160, 90, .45); }
.pxdt--error .pxdt__halo { box-shadow: 0 0 0 2px rgba(211, 47, 47, .4); }

.pxdt__txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pxdt__t { margin: 0; font-size: 15px; font-weight: 700; line-height: 1.25; letter-spacing: -.012em; color: var(--pxdt-ink); overflow-wrap: anywhere; }
.pxdt__d { margin: 0; font-size: 13.5px; font-weight: 500; line-height: 1.4; color: var(--pxdt-muted); overflow-wrap: anywhere; }

.pxdt-host .pxdt button.pxdt__act { flex: none; height: 34px; margin: 0; padding: 0 14px; border: 0; border-radius: 999px; font: inherit; font-size: 13.5px; font-weight: 700; line-height: 1; letter-spacing: 0; text-transform: none; cursor: pointer; box-shadow: none; transition: transform .35s var(--pxdt-spring), background-color .2s var(--pxdt-ease); }
.pxdt-host .pxdt--success button.pxdt__act { color: #0b6f60; background: rgba(14, 151, 132, .11); }
.pxdt-host .pxdt--error button.pxdt__act { color: #b71c1c; background: rgba(211, 47, 47, .09); }
.pxdt-host .pxdt button.pxdt__act:hover { transform: translateY(-1px); }
.pxdt-host .pxdt--success button.pxdt__act:hover { color: #0b6f60; background: rgba(14, 151, 132, .18); }
.pxdt-host .pxdt--error button.pxdt__act:hover { color: #b71c1c; background: rgba(211, 47, 47, .15); }
.pxdt-host .pxdt button.pxdt__act:active { transform: scale(.97); }

.pxdt-host .pxdt button.pxdt__x { position: relative; flex: none; width: 34px; height: 34px; min-width: 0; margin: 0; padding: 0; border: 0; border-radius: 50%; background: none; color: var(--pxdt-muted); display: grid; place-items: center; cursor: pointer; box-shadow: none; transition: background-color .2s var(--pxdt-ease), color .2s var(--pxdt-ease); }
.pxdt-host .pxdt button.pxdt__x:hover { background: rgba(11, 43, 40, .06); color: var(--pxdt-ink); }
.pxdt-host .pxdt button.pxdt__x:active { transform: scale(.96); }
.pxdt__ring { position: absolute; inset: 0; transform: rotate(-90deg); pointer-events: none; }
.pxdt__ring circle { fill: none; stroke-width: 2; stroke-linecap: round; }
.pxdt__track { stroke: rgba(11, 43, 40, .08); }
.pxdt__prog { stroke-dasharray: 94.25; stroke-dashoffset: 0; }
.pxdt--success .pxdt__prog { stroke: var(--pxdt-ok); }
.pxdt--error .pxdt__prog { stroke: var(--pxdt-err); }
.pxdt--sticky .pxdt__ring { display: none; }

.pxdt-host .pxdt button.pxdt__act:focus-visible, .pxdt-host .pxdt button.pxdt__x:focus-visible { outline: 2px solid #1E9B52; outline-offset: 2px; }

/* Entrée : la carte monte et passe du flou au net, puis l'icône, l'onde, la coche, le titre et le texte. */
.pxdt.is-in .pxdt__in { animation: pxdt-in .62s var(--pxdt-spring) backwards; }
.pxdt.is-in .pxdt__in::before { animation: pxdt-glow 1.1s ease-out backwards; }
.pxdt.is-in .pxdt__ic { animation: pxdt-pop .5s .08s var(--pxdt-spring) backwards; }
.pxdt.is-in .pxdt__halo { animation: pxdt-halo .9s .25s ease-out backwards; }
.pxdt.is-in .pxdt__t { animation: pxdt-up .4s .12s var(--pxdt-out) backwards; }
.pxdt-host .pxdt.is-in .pxdt__d, .pxdt-host .pxdt.is-in button.pxdt__act { animation: pxdt-up .4s .18s var(--pxdt-out) backwards; }
.pxdt.is-in .pxdt__draw { stroke-dasharray: 24; stroke-dashoffset: 24; animation: pxdt-draw .4s .22s var(--pxdt-out) forwards; }
.pxdt .pxdt__prog { animation: pxdt-count var(--pxdt-dur, 4500ms) linear forwards; }
.pxdt.is-paused .pxdt__prog { animation-play-state: paused; }
.pxdt.is-bump .pxdt__in { animation: pxdt-bump .4s var(--pxdt-spring); }
.pxdt.is-out .pxdt__in { animation: pxdt-out .26s var(--pxdt-ease) both; }

@keyframes pxdt-in { from { opacity: 0; transform: translateY(18px) scale(.96); filter: blur(6px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes pxdt-out { from { opacity: 1; transform: none; filter: none; } to { opacity: 0; transform: translateY(10px) scale(.97); filter: blur(4px); } }
@keyframes pxdt-pop { from { transform: scale(.3) rotate(-25deg); } to { transform: none; } }
@keyframes pxdt-halo { 0% { opacity: 1; transform: scale(1); } 100% { opacity: 0; transform: scale(1.9); } }
@keyframes pxdt-up { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes pxdt-draw { to { stroke-dashoffset: 0; } }
@keyframes pxdt-count { from { stroke-dashoffset: 0; } to { stroke-dashoffset: 94.25; } }
@keyframes pxdt-glow { from { opacity: 0; transform: scale(.4); } 60% { opacity: .75; } to { opacity: .5; transform: none; } }
@keyframes pxdt-bump { 0% { transform: none; } 40% { transform: scale(1.025); } 100% { transform: none; } }

/* Téléphone : pleine largeur en bas, au-dessus de la zone du geste d'accueil. */
@media (max-width: 640px) {
  .pxdt-host { --pxdt-bottom: 12px; width: calc(100vw - 24px); }
  .pxdt__in { padding: 11px 8px 11px 11px; }
  .pxdt__t { font-size: 14.5px; }
  .pxdt__d { font-size: 13px; }
}

@media (prefers-reduced-motion: reduce) {
  .pxdt { transition: opacity .15s linear; }
  .pxdt.is-in .pxdt__in, .pxdt.is-in .pxdt__in::before, .pxdt.is-in .pxdt__ic, .pxdt.is-in .pxdt__halo, .pxdt.is-in .pxdt__t, .pxdt.is-in .pxdt__d, .pxdt-host .pxdt.is-in button.pxdt__act, .pxdt.is-bump .pxdt__in { animation: pxdt-fade .15s linear both; }
  .pxdt.is-in .pxdt__draw { animation: none; stroke-dashoffset: 0; }
  .pxdt.is-out .pxdt__in { animation: pxdt-fade .15s linear reverse both; }
  .pxdt__halo { display: none; }
}
@keyframes pxdt-fade { from { opacity: 0; } to { opacity: 1; } }

@media print { .pxdt-host { display: none !important; } }