/* GPAT — Bannière d'annonce site-wide * * Affichée juste après via le hook wp_body_open (priorité 5). * Styles scopés sous `.gpat-banner` pour ne pas leaker dans le thème. * * Variables CSS pilotées par style inline (couleurs configurables admin) : * --gpat-banner-bg (couleur de fond) * --gpat-banner-color (couleur du texte) */ .gpat-banner { --gpat-banner-bg: #dc2626; --gpat-banner-color: #ffffff; box-sizing: border-box; width: 100%; background: var(--gpat-banner-bg); color: var(--gpat-banner-color); font-family: "Barlow", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; font-size: 15px; font-weight: 500; line-height: 1.45; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; /* Reste au-dessus du contenu Elementor qui remonte via une marge négative * (ex. section hero avec margin-top négatif) et ne se fait pas masquer. */ position: relative; z-index: 9999; } .gpat-banner *, .gpat-banner *::before, .gpat-banner *::after { box-sizing: inherit; } .gpat-banner.is-hidden { display: none; } /* Layout interne : icône à gauche, message aligné à gauche, X à droite. */ .gpat-banner__inner { display: grid; grid-template-columns: 24px 1fr 30px; column-gap: 14px; align-items: center; max-width: 1280px; margin: 0 auto; padding: 12px 20px; } /* Si pas de bouton ×, on retire la 3e colonne. */ .gpat-banner.is-not-dismissible .gpat-banner__inner { grid-template-columns: 24px 1fr; } /* Icône d'alerte (SVG inline, color via currentColor) */ .gpat-banner__icon { width: 22px; height: 22px; color: var(--gpat-banner-color); opacity: 0.95; display: block; } /* Zone message — alignée à gauche, HTML inline autorisé */ .gpat-banner__message { text-align: left; color: inherit; } .gpat-banner__message > :first-child { margin-top: 0; } .gpat-banner__message > :last-child { margin-bottom: 0; } /* Liens dans le message : héritage couleur + sublignement subtil */ .gpat-banner__message a, .gpat-banner__message a:link, .gpat-banner__message a:visited, .gpat-banner__message a:hover, .gpat-banner__message a:focus { color: inherit !important; text-decoration: underline !important; } .gpat-banner__message strong, .gpat-banner__message b { font-weight: 700; color: inherit; } /* Bouton de fermeture — uniquement l'icône X, sans fond ni cadre */ .gpat-banner__close { display: inline-flex; align-items: center; justify-content: center; background: transparent; border: 0; color: #111111; /* X noir, indépendant de la couleur du texte */ padding: 4px; line-height: 0; cursor: pointer; transition: opacity 0.15s ease; justify-self: end; } .gpat-banner__close-icon { display: block; width: 22px; height: 22px; } /* Feedback hover/focus sans carré : on joue uniquement sur l'opacité de l'icône. */ .gpat-banner__close:hover, .gpat-banner__close:focus, .gpat-banner__close:focus-visible { opacity: 0.6; outline: none; } /* Responsive : compaction sur mobile */ @media (max-width: 640px) { .gpat-banner { font-size: 13.5px; } .gpat-banner__inner { grid-template-columns: 20px 1fr 26px; column-gap: 10px; padding: 10px 14px; } .gpat-banner.is-not-dismissible .gpat-banner__inner { grid-template-columns: 20px 1fr; } .gpat-banner__icon { width: 20px; height: 20px; } .gpat-banner__close { padding: 3px; } .gpat-banner__close-icon { width: 20px; height: 20px; } }