/* Websource Social Login : boutons « Continuer avec … ». Adapté au thème par variables CSS (avec repli). */
.jpsl {
  --jpsl-gap: .625rem;
  margin: 1rem 0;
  font-family: inherit;
  color: var(--color-ink, #1f2933);
  box-sizing: border-box;
}
.jpsl *, .jpsl *::before, .jpsl *::after { box-sizing: border-box; }

.jpsl__list { display: flex; flex-direction: column; gap: var(--jpsl-gap); }

.jpsl-btn {
  --b-bg: #fff;
  --b-fg: var(--color-ink, #1f2933);
  --b-bc: var(--color-line, #d0d5dd);
  --b-ic: currentColor;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .75rem;
  width: 100%;
  min-height: 2.75rem;
  padding: 0 1.25rem;
  font: inherit;
  font-size: .9375rem;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none !important;
  cursor: pointer;
  color: var(--jpsl-fg, var(--b-fg));
  background: var(--jpsl-bg, var(--b-bg));
  border: var(--jpsl-border-w, 1px) solid var(--jpsl-bc, var(--b-bc));
  border-radius: var(--jpsl-radius, var(--radius-xl, .75rem));
  transition: box-shadow .15s ease, transform .15s ease, border-color .15s ease, filter .15s ease;
  -webkit-tap-highlight-color: transparent;
}
.jpsl-btn:hover, .jpsl-btn:focus-visible {
  color: var(--jpsl-fg, var(--b-fg));
  box-shadow: 0 2px 10px rgba(16, 24, 40, .14);
  transform: translateY(-1px);
}
.jpsl-btn:focus-visible { outline: 3px solid var(--color-brand-500, #2563eb); outline-offset: 2px; }
.jpsl-btn:active { transform: none; box-shadow: none; filter: brightness(.95); }

.jpsl-btn__logo { display: inline-flex; flex: 0 0 auto; color: var(--b-ic); }
.jpsl-btn__logo svg { display: block; width: 1.25rem; height: 1.25rem; }
.jpsl-btn__label { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jpsl-btn__badge {
  position: absolute; right: .75rem; top: 50%; transform: translateY(-50%);
  padding: .1rem .5rem; font-size: .6875rem; font-weight: 600; border-radius: 999px;
  background: rgba(16, 24, 40, .08); color: inherit; white-space: nowrap;
}
.jpsl-btn__spinner { display: none; }

/* --- Style « contour » : fond blanc, bordure du thème, logo en couleur --- */
.jpsl--outline .jpsl-btn--facebook { --b-ic: #1877f2; }
.jpsl--outline .jpsl-btn--linkedin { --b-ic: #0a66c2; }
.jpsl--outline .jpsl-btn--x, .jpsl--outline .jpsl-btn--apple, .jpsl--outline .jpsl-btn--github { --b-ic: #000; }
.jpsl--outline .jpsl-btn:hover { border-color: var(--jpsl-bc, var(--color-brand-500, #98a2b3)); }

/* --- Style « plein couleur du réseau » (chartes de marque) --- */
.jpsl--brand .jpsl-btn--google { --b-bg: #fff; --b-fg: #1f1f1f; --b-bc: #747775; }
.jpsl--brand .jpsl-btn--facebook { --b-bg: #1877f2; --b-fg: #fff; --b-bc: #1877f2; }
.jpsl--brand .jpsl-btn--x { --b-bg: #000; --b-fg: #fff; --b-bc: #000; }
.jpsl--brand .jpsl-btn--linkedin { --b-bg: #0a66c2; --b-fg: #fff; --b-bc: #0a66c2; }
.jpsl--brand .jpsl-btn--microsoft { --b-bg: #2f2f2f; --b-fg: #fff; --b-bc: #2f2f2f; }
.jpsl--brand .jpsl-btn--apple { --b-bg: #000; --b-fg: #fff; --b-bc: #000; }
.jpsl--brand .jpsl-btn--github { --b-bg: #24292f; --b-fg: #fff; --b-bc: #24292f; }
.jpsl--brand .jpsl-btn:hover { filter: brightness(1.12); }
.jpsl--brand .jpsl-btn--google:hover { filter: none; background: #f8f9fa; }
.jpsl--brand .jpsl-btn--google { border-width: max(var(--jpsl-border-w, 1px), 1px); }
.jpsl--brand .jpsl-btn__badge { background: rgba(255, 255, 255, .22); }
.jpsl--brand .jpsl-btn--google .jpsl-btn__badge { background: rgba(16, 24, 40, .08); }

/* --- Style « neutre aux couleurs du thème » --- */
.jpsl--neutral .jpsl-btn {
  --b-bg: var(--color-brand-50, #f4f7f7);
  --b-fg: var(--color-brand-800, #1f2933);
  --b-bc: var(--color-brand-200, #d5dde0);
}
.jpsl--neutral .jpsl-btn:hover { --b-bg: var(--color-brand-100, #e8eeef); }

/* --- Dispositions --- */
.jpsl--icononly .jpsl__list, .jpsl--grid .jpsl__list { flex-direction: row; flex-wrap: wrap; justify-content: flex-start; }
.jpsl--icononly .jpsl-btn, .jpsl--grid .jpsl-btn { width: 2.75rem; min-width: 2.75rem; padding: 0; }
.jpsl--icononly .jpsl-btn__label, .jpsl--grid .jpsl-btn__label {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.jpsl--icononly .jpsl-btn__badge, .jpsl--grid .jpsl-btn__badge { display: none; }
.jpsl--icononly .jpsl-btn.is-last::after, .jpsl--grid .jpsl-btn.is-last::after {
  content: ""; position: absolute; top: -4px; right: -4px; width: .65rem; height: .65rem; border-radius: 50%;
  background: var(--color-accent-500, #16a34a); border: 2px solid #fff;
}
.jpsl--compact { margin: .5rem 0 0; }
.jpsl--compact .jpsl__list { justify-content: center; }
.jpsl--place-header { padding: .25rem .75rem .5rem; }

/* --- Chargement --- */
.jpsl-btn.is-loading { pointer-events: none; cursor: progress; }
.jpsl-btn.is-loading .jpsl-btn__spinner {
  display: block; position: absolute; right: 1rem; top: 50%; width: 1.1rem; height: 1.1rem; margin-top: -.55rem;
  border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: jpsl-spin .7s linear infinite;
}
.jpsl-btn.is-loading .jpsl-btn__badge { display: none; }
.jpsl--icononly .jpsl-btn.is-loading .jpsl-btn__logo, .jpsl--grid .jpsl-btn.is-loading .jpsl-btn__logo { opacity: 0; }
.jpsl--icononly .jpsl-btn.is-loading .jpsl-btn__spinner, .jpsl--grid .jpsl-btn.is-loading .jpsl-btn__spinner { right: 50%; margin-right: -.55rem; }
@keyframes jpsl-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .jpsl-btn { transition: none; }
  .jpsl-btn:hover, .jpsl-btn:focus-visible { transform: none; }
  .jpsl-btn.is-loading .jpsl-btn__spinner { animation-duration: 2s; }
}

/* --- Séparateur « ou » et mentions --- */
.jpsl__sep { display: flex; align-items: center; gap: 1rem; margin: 1.1rem 0; font-size: .8125rem; letter-spacing: .06em; text-transform: uppercase; color: var(--color-ink, #1f2933); opacity: .65; }
.jpsl__sep::before, .jpsl__sep::after { content: ""; flex: 1; height: 1px; background: var(--color-line, #d9dee3); }
.jpsl__legal { margin: .75rem 0 0; font-size: .75rem; line-height: 1.45; opacity: .75; }

/* --- Pages du module (Mon compte, confirmation) --- */
.jpsl-page { max-width: 40rem; }
.jpsl-page__form { margin: 1rem 0; }
.jpsl-page__note { font-size: .875rem; opacity: .75; }
.jpsl-rows { margin: 1rem 0; padding: 0; list-style: none; }
.jpsl-row { display: flex; align-items: center; gap: 1rem; padding: .875rem 1rem; margin-bottom: .5rem; background: var(--color-surface, #fff); border: 1px solid var(--color-line, #d9dee3); border-radius: var(--radius-xl, .75rem); }
.jpsl-row__logo svg { display: block; width: 1.5rem; height: 1.5rem; }
.jpsl-row__main { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.jpsl-row__main small { opacity: .7; overflow-wrap: anywhere; }
.jpsl-row__action { margin: 0; }

@media (max-width: 480px) {
  .jpsl-row { flex-wrap: wrap; }
  .jpsl-row__action { width: 100%; }
  .jpsl-row__action .btn { width: 100%; }
}

/* Intégration dans le bloc « Mon compte » de l'en-tête (visiteur) */
.wsab__social { display: inline-flex; align-items: center; }
.wsab__social .jpsl { margin: 0; padding: 0; }
.wsab__social .jpsl__list { flex-wrap: nowrap; gap: .25rem; }
.wsab__social .jpsl-btn { box-shadow: none; }
.wsab-list .wsab__social, .wsab-float__panel .wsab__social { display: block; padding: .25rem .5rem .5rem; }
@media (max-width: 767px) { .wsab--guest .wsab__social { display: none; } }

/* ======================================================================
 * Jetprint : ajustes ao tema jetprint (Open Sans, cantos retos, azul #2fb5d2, cinzentos #414141 / #ebebeb).
 * Tudo prefixado por .jpsl / .jpsl-page : não altera o tema nem outros módulos.
 * ====================================================================== */
.jpsl { --jpsl-gap: .5rem; color: #414141; max-width: 26rem; margin-left: auto; margin-right: auto; }
.jpsl-btn {
  --b-bc: #d6d4d4;
  min-height: 2.625rem;
  font-family: "Open Sans", sans-serif;
  font-size: .875rem;
  font-weight: 600;
  color: var(--jpsl-fg, #414141);
  border-radius: var(--jpsl-radius, 0);
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, .08);
}
.jpsl-btn:hover, .jpsl-btn:focus-visible { border-color: var(--jpsl-bc, #2fb5d2); box-shadow: 2px 2px 6px 0 rgba(0, 0, 0, .15); transform: none; }
.jpsl-btn:focus-visible { outline: 2px solid #2fb5d2; outline-offset: 2px; }
.jpsl--outline .jpsl-btn--amazon { --b-ic: #ff9900; }
.jpsl--brand .jpsl-btn--amazon { --b-bg: #ffd814; --b-fg: #0f1111; --b-bc: #fcd200; --b-ic: #0f1111; }
.jpsl__sep span { color: #7a7a7a; font-size: .8125rem; text-transform: lowercase; }
.jpsl__legal { font-size: .75rem; line-height: 1.45; color: #7a7a7a; margin: .625rem 0 0; text-align: center; }
.jpsl__legal a { color: #2fb5d2; text-decoration: underline; }
.jpsl--place-checkout { margin: 0 0 1.25rem; max-width: none; }
.jpsl--place-checkout .jpsl__list { flex-direction: row; flex-wrap: wrap; }
.jpsl--place-checkout .jpsl-btn { flex: 1 1 9.5rem; width: auto; padding: 0 .625rem; gap: .5rem; }

/* páginas intermédias (consentimento, palavra-passe, email) */
.jpsl-page { max-width: 36rem; background: #fff; padding: 1.25rem 1.5rem; box-shadow: 2px 2px 8px 0 rgba(0, 0, 0, .2); color: #414141; }
.jpsl-page__data { display: grid; grid-template-columns: max-content 1fr; gap: .25rem 1rem; margin: 0 0 1rem; padding: .75rem 1rem; background: #f6f6f6; }
.jpsl-page__data dt { font-weight: 600; }
.jpsl-page__data dd { margin: 0; word-break: break-word; }
.jpsl-check { display: flex; gap: .625rem; align-items: flex-start; margin: 0 0 .75rem; font-weight: 400; cursor: pointer; }
.jpsl-check input { margin-top: .2rem; flex: 0 0 auto; width: 1rem; height: 1rem; }
.jpsl-check a { color: #2fb5d2; text-decoration: underline; }
.jpsl-check__req { color: #ff4c4c; font-style: normal; }
.jpsl-page__note { font-size: .8125rem; color: #7a7a7a; }
.jpsl-page__actions { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin-top: 1rem; }
.jpsl-page__cancel { color: #7a7a7a; text-decoration: underline; }
@media (max-width: 575px) {
  .jpsl-page { padding: 1rem; }
  .jpsl-page__actions .btn { width: 100%; }
}

/* Selo « Usado da última vez » : pequena etiqueta no canto superior direito, por cima da borda,
 * para nunca tapar o texto do botão em ecrãs estreitos (PT/EN/ES). */
.jpsl .jpsl-btn__badge {
  position: absolute; top: 0; right: .5rem; left: auto; z-index: 1;
  transform: translateY(-50%);
  max-width: calc(100% - 1rem); overflow: hidden; text-overflow: ellipsis;
  padding: .0625rem .4375rem; font-size: .625rem; font-weight: 600; line-height: 1.35;
  color: #414141; background: #fff; border: 1px solid var(--jpsl-bc, var(--b-bc)); border-radius: 999px;
  pointer-events: none;
}
.jpsl--brand .jpsl-btn .jpsl-btn__badge { color: var(--b-fg); background: var(--b-bg); }
.jpsl__list .jpsl-btn.is-last:not(:first-child) { margin-top: .375rem; }
.jpsl--place-checkout .jpsl__list .jpsl-btn.is-last:not(:first-child) { margin-top: 0; }
.jpsl--place-checkout .jpsl__list:has(.is-last) { row-gap: .875rem; }