/* Astuces contextuelles (public/v2/js/tips.js) : bulle légère, sans fond sombre ni blocage de la page. */
.v2-tip { position: fixed; z-index: 35; max-width: min(22rem, calc(100vw - 16px)); padding: var(--space-3) var(--space-4); border-radius: var(--radius-lg); background: var(--color-inverse-surface); color: var(--color-inverse-text); box-shadow: var(--shadow-md); font-size: var(--font-size-sm); line-height: 1.45; animation: v2-tip-in 0.25s ease-out both; }
.v2-tip__text { margin: 0; }
.v2-tip__label { color: var(--color-inverse-link); }
.v2-tip__actions { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); margin-top: var(--space-2); }
.v2-tip__off, .v2-tip__close { min-height: 32px; border: 0; background: transparent; color: var(--color-inverse-text-muted); font: inherit; cursor: pointer; }
.v2-tip__off { padding: 0; font-size: var(--font-size-xs); text-decoration: underline; text-underline-offset: 2px; }
.v2-tip__close { min-width: 32px; font-size: 1.25rem; line-height: 1; border-radius: 50%; }
.v2-tip__off:hover, .v2-tip__close:hover { color: var(--color-inverse-text); }
.v2-tip :focus-visible { outline: 2px solid var(--color-inverse-focus); outline-offset: 2px; }
@keyframes v2-tip-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .v2-tip { animation: none; } }
/* Ne pas recouvrir la bulle de discussion ni le bandeau cookies. */
body:has(.v2-cookie:not([hidden])) .v2-tip { display: none; }
@media print { .v2-tip { display: none; } }
/* Lien du pied de page : activer/désactiver les astuces sans compte. */
.v2-footer__tips { padding: 0; border: 0; background: transparent; color: inherit; font: inherit; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; min-height: 32px; }
.v2-tip--notice { right: auto; max-width: min(24rem, calc(100vw - 16px)); }
/* Mobile : cibles tactiles de 44 px, bulle pleine largeur utile, au-dessus de la barre du bas. */
@media (max-width: 48rem) {
  .v2-tip { max-width: calc(100vw - 16px); padding: var(--space-3) var(--space-4); font-size: var(--font-size-base); }
  .v2-tip__off, .v2-tip__close { min-height: 44px; }
  .v2-tip__close { min-width: 44px; }
  .v2-tip__off { font-size: var(--font-size-sm); }
}