/* « i Protection de vos données » under a form (slap_rgpd_bubble): the notice pops from the « i » in a bubble.
   Standalone: it takes the colour of the text around it, so it sits on a light card or a navy section alike. */
.slap-rgpd-tip:not(#\#) { position: relative; display: flex; justify-content: center; margin: 12px 0 0; padding: 0; }
.slap-rgpd-tip:not(#\#) .slap-rgpd-tip__btn {
    display: inline-flex; align-items: center; gap: 8px; min-height: 40px; margin: 0; padding: 4px 12px 4px 6px;
    border: 0; border-radius: 999px; background: none; box-shadow: none;
    font: inherit; font-size: 13px; font-weight: 400; line-height: 1.3; letter-spacing: 0; text-transform: none;
    color: inherit; opacity: .78; cursor: pointer; -webkit-tap-highlight-color: transparent; touch-action: manipulation;
    transition: background-color 150ms cubic-bezier(0.23, 1, 0.32, 1), opacity 150ms cubic-bezier(0.23, 1, 0.32, 1), transform 140ms cubic-bezier(0.23, 1, 0.32, 1);
}
.slap-rgpd-tip:not(#\#) .slap-rgpd-tip__btn:active { transform: scale(0.97); }
.slap-rgpd-tip:not(#\#) .slap-rgpd-tip__btn[aria-expanded="true"] { opacity: 1; }
.slap-rgpd-tip:not(#\#) .slap-rgpd-tip__btn:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.slap-rgpd-tip:not(#\#) .slap-rgpd-tip__i {
    display: inline-flex; flex: 0 0 22px; align-items: center; justify-content: center; width: 22px; height: 22px;
    border-radius: 50%; box-shadow: inset 0 0 0 1.25px currentColor;
    font-size: 12.5px; font-weight: 700; font-style: normal; line-height: 1;
    transition: background-color 150ms cubic-bezier(0.23, 1, 0.32, 1);
}
.slap-rgpd-tip:not(#\#) .slap-rgpd-tip__bubble {
    position: absolute; z-index: 60; left: 50%; bottom: calc(100% + 6px);
    width: min(440px, calc(100vw - 32px)); margin: 0; padding: 16px 18px;
    border-radius: 16px; background: #fff;
    box-shadow: 0 0 0 0.5px rgba(17, 26, 46, .08), 0 12px 32px -8px rgba(17, 26, 46, .22), 0 4px 12px -4px rgba(17, 26, 46, .12);
    font-size: 13px; font-weight: 400; line-height: 1.6; color: #4E5F80; text-align: left; text-transform: none; letter-spacing: 0;
    transform-origin: 50% 100%; transform: translateX(-50%) scale(0.96); opacity: 0;
    transition: transform 180ms cubic-bezier(0.23, 1, 0.32, 1), opacity 180ms cubic-bezier(0.23, 1, 0.32, 1);
}
.slap-rgpd-tip:not(#\#) .slap-rgpd-tip__bubble.is-open { transform: translateX(-50%); opacity: 1; }
.slap-rgpd-tip:not(#\#) .slap-rgpd-tip__bubble::after {
    content: ''; position: absolute; left: 50%; bottom: -6px; width: 12px; height: 12px; border-radius: 2px; background: #fff;
    transform: translateX(-50%) rotate(45deg); box-shadow: 3px 3px 6px -2px rgba(17, 26, 46, .12);
}
.slap-rgpd-tip:not(#\#) .slap-rgpd-tip__bubble p,
.slap-rgpd-tip:not(#\#) .slap-rgpd-tip__bubble div { margin: 0; padding: 0; border: 0; background: none; font: inherit; color: inherit; }
.slap-rgpd-tip:not(#\#) .slap-rgpd-tip__bubble a { color: #237AFC; text-decoration: underline; text-underline-offset: 2px; }
@media (hover: hover) and (pointer: fine) {
    .slap-rgpd-tip:not(#\#) .slap-rgpd-tip__btn:hover { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
    .slap-rgpd-tip:not(#\#) .slap-rgpd-tip__bubble,
    .slap-rgpd-tip:not(#\#) .slap-rgpd-tip__bubble.is-open { transform: translateX(-50%); transition: opacity 160ms ease; }
    .slap-rgpd-tip:not(#\#) .slap-rgpd-tip__btn:active { transform: none; }
}
@media (prefers-contrast: more) {
    .slap-rgpd-tip:not(#\#) .slap-rgpd-tip__btn { opacity: 1; }
    .slap-rgpd-tip:not(#\#) .slap-rgpd-tip__bubble { color: #1B2740; box-shadow: 0 0 0 1px rgba(17, 26, 46, .5), 0 12px 32px -8px rgba(17, 26, 46, .22); }
}