/*
 * LIN-4681 : habillage Linvosges de la popin de consentement push Actito.
 *
 * Le SDK ( actito-push.css ) n'expose aucun réglage d'apparence côté dashboard Actito :
 * couleurs, largeur et ordre des boutons ne se surchargent que par CSS, via les variables
 * --actito-* et les classes du bundle. Le contenu ( message, libellés des boutons, délai
 * d'affichage, réapparition ) reste lui piloté à distance par websitePushConfig.launchConfig,
 * donc côté Actito : ne rien tenter d'écrire ici pour les textes.
 *
 * Chargé après les 3 feuilles du CDN par theme/resources/css/vue.php, et uniquement
 * quand BusinessModule::useActitoPush() est vrai ( variation ?variation=actito-push ).
 *
 * Structure du DOM générée par le SDK, pour mémoire :
 *   div.actito.actito-push-onboarding
 *     div.actito__backdrop
 *     div.actito__modal.actito__modal--top.actito__onboarding-modal
 *       div.actito__modal-content.actito__onboarding-content
 *         img.actito__onboarding-icon
 *         div.actito__onboarding-text-content
 *           p.actito__onboarding-title
 *           p.actito__onboarding-text
 *       div.actito__modal-footer.actito__onboarding-footer
 *         div.actito__onboarding-actions
 *           button.actito__button.actito__button--destructive.actito__onboarding-cancel-button
 *           button.actito__button.actito__button--primary.actito__onboarding-accept-button
 *
 * Les sélecteurs doublent volontairement la classe racine ( .actito.actito-push-onboarding )
 * pour dépasser la spécificité des règles du bundle, qui déclare ses variables à la fois sur
 * .actito, sur [data-actito-theme=…] et dans un @media (prefers-color-scheme:dark).
 */

.actito.actito-push-onboarding {
    /*
     * Le bundle bascule sa surface en gris anthracite sous @media (prefers-color-scheme: dark),
     * la popin sortait donc en fond sombre chez un visiteur au navigateur en thème sombre. Le site
     * n'a aucune gestion du thème sombre par ailleurs ( zéro prefers-color-scheme dans tout le CSS
     * v3 ) : on fige la popin sur la palette claire pour qu'elle reste cohérente avec la page
     * derrière elle, quel que soit le réglage système.
     */
    --actito-surface: #FFFFFF;
    --actito-surface-hover: #F6F4EF;
    --actito-on-surface: #2D2D2D;

    /* Point 4 : « Oui » blanc sur vert Linvosges, aux valeurs de .cta-green du site. */
    --actito-primary: #2C4542;
    --actito-primary-hover: #2C454275;
    --actito-on-primary: #FFFFFF;

    /* Point 8 : repasser sous la bannière cookies OneTrust, qui se place dans les valeurs
       hautes de l'int32. Le SDK monte par défaut à 2147483647 ( maximum absolu ) pour la
       modale et 1073741824 pour le voile. 1000000 reste très au-dessus du z-index le plus
       haut du site ( 100000 ) tout en laissant OneTrust devant. */
    --actito-layer-high: 999999;
    --actito-layer-highest: 1000000;
}

/* Point 8 : le voile plein écran assombrit tout le site pour une simple demande d'opt-in
   et masquerait la bannière cookies même une fois le z-index baissé. Son seul gestionnaire
   de clic est un no-op côté SDK, le retirer ne coûte aucun comportement. */
.actito.actito-push-onboarding .actito__backdrop {
    display: none;
}

/* Point 6 : le bundle impose min-width:360px, supérieur au max-width:calc(100vw - 64px) de
   la modale : d'où une popin qui débordait sur mobile. On lève le plancher et on cale une
   largeur prévisible, bornée par la marge de viewport du SDK. */
.actito.actito-push-onboarding .actito__onboarding-modal {
    width: 100%;
    min-width: 0;
    max-width: min(400px, calc(100vw - var(--actito-modal-margin)));
}

/* Point 5 : le DOM place toujours « Non, merci » avant « Oui ». On inverse l'axe pour
   afficher « Oui » à gauche, en repassant justify-content sur flex-start puisque le début
   de l'axe est désormais le bord droit : le groupe reste aligné à droite. */
.actito.actito-push-onboarding .actito__onboarding-actions {
    flex-direction: row-reverse;
    justify-content: flex-start;
}

/* Point 3 : « Non, merci » en gris. Le SDK applique la variante « destructive », donc du
   rouge ( --actito-error ) ; on surcharge les variables locales du bouton plutôt que
   --actito-error, qui sert aussi ailleurs dans le bundle. */
.actito.actito-push-onboarding .actito__onboarding-cancel-button {
    --actito-button-background-color: transparent;
    --actito-button-text-color: #666666;
    --actito-button-background-color--hover: #F6F4EF;
    --actito-button-text-color--hover: #2D2D2D;
}

@media screen and (max-width: 767px) {
    .actito.actito-push-onboarding {
        /* Marge de viewport ramenée de 64px à 32px : sur un écran de 375px, la modale gagne
           les 32px qui lui manquaient pour respirer. */
        --actito-modal-margin: 32px;
    }
}