/* ========================================================================== CSS CUSTOM - SKI-CLUB CHOËX Feuille de style de personnalisation générale (Pour les futurs repreneurs !) ========================================================================== */ /* ========================================================================== 0. POLICES ET RÉINITIALISATIONS DE BASE ========================================================================== */ /* Importation des polices depuis les serveurs sécurisés de Google Fonts : - Kanit (Poids 700 - Gras) : Destinée aux titres sportifs et structurés. - Montserrat (Poids 700, 800) : Destinée aux textes d'impact de la Hero Banner. - Lato (Poids 400 - Normal, et 700 - Gras) : Destinée aux textes de lecture. */ @import url('https://fonts.googleapis.com/css2?family=Kanit:wght@700&family=Montserrat:wght@700;800&family=Lato:wght@400;700&display=swap'); /* Configuration par défaut pour les éléments de texte textuels du site */ body, p, span, li, a { font-family: 'Lato', sans-serif; /* Force l'usage de la police chaleureuse Lato */ color: #333333; /* Couleur gris anthracite doux visuellement */ } /* Configuration par défaut pour les grands titres de sections du CMS (Niveaux 1 à 4) */ h1, h2, h3, h4 { font-family: 'Kanit', sans-serif; /* Force l'usage de la police géométrique Kanit */ font-weight: 700; /* Écrit les titres nativement en lettres épaisses */ color: #1A365D; /* Applique la couleur Bleu Nuit officielle du club */ } /* ========================================================================== 1. CLASSES UTILITAIRES ET COMPOSANTS GLOBAUX ========================================================================== */ /* Couleurs utilitaires prêtes à l'emploi (Classes d'appoint à lier dans les blocs HTML) */ .text-sc-red { color: #E11D48 !important; /* Force la couleur en Rouge Vif de la charte */ font-weight: bold !important; /* Force le texte en gras */ } .text-sc-blue { color: #1A365D !important; /* Force la couleur en Bleu Nuit du club */ font-weight: bold !important; /* Force le texte en gras */ } /* Composant : Titre global des sponsors (Faux H2 pour préserver le SEO) */ .global-sponsor-title { text-align: center; color: #FFFFFF !important; font-size: 1.6rem; font-family: 'Kanit', sans-serif; /* Pour conserver le look visuel des titres */ font-weight: 700; } /* Composant : Faux titre pour les sponsors de manifestations (Préserve le SEO) */ .manifestation-sponsor-title { text-align: center; /* Centre le texte horizontalement dans son bloc */ color: #1A365D; /* Applique le Bleu Nuit officiel de la charte */ font-family: 'Kanit', sans-serif; /* Force la police géométrique dédiée aux titres */ font-weight: 700; /* Applique le style gras pour l'impact visuel */ font-size: 1.8rem; /* Définit une taille généreuse simulant un H3 */ margin: 30px 0 20px 0; /* Gère les espaces de respiration (haut et bas) */ } /* PROTECTION GLOBALE DES ICÔNES PHOSPHOR */ /* Cible ABSOLUMENT TOUS les éléments contenant des classes d'icônes Phosphor sur le site */ [class^="ph-"], [class*=" ph-"], [class^="ph "], [class*=" ph "], .ph, .ph-fill, .ph-thin, .ph-light, .ph-bold, .ph-duotone, .ph-regular { font-family: "Phosphor" !important; /* Sécurité absolue : interdit l'héritage d'autres polices (ex: Lato) */ font-style: normal !important; /* Supprime l'italique forcé par défaut de certains navigateurs */ font-weight: normal !important; /* Neutralise les surcharges de graisse (bold) héritées des parents */ display: inline-block !important; /* Permet un affichage et un alignement vectoriel optimal */ vertical-align: middle !important; /* Aligne géométriquement l'icône au centre de la ligne de texte */ } /* Boutons d'action standards du CMS */ .cd-button { transition: transform 0.3s ease; /* Animation fluide d'une durée de 0.3 seconde lors du survol */ } .cd-button:hover { transform: scale(1.05); /* Grossit très légèrement le bouton de 5% pour simuler un relief */ } /* --- COUPE-CIRCUIT : FORÇAGE DU TEXTE EN BLANC SUR FOND SOMBRE (BLOC FÊTE) --- */ .fete-programme-clean, .fete-programme-clean p, .fete-programme-clean ul, .fete-programme-clean li, .fete-programme-clean strong { color: #FFFFFF !important; /* Force le texte en blanc pur sur le fond bleu nuit */ } /* ========================================================================== 2. EN-TÊTE ET BANNIÈRE PRINCIPALE (HERO) ========================================================================== */ /* --- FILTRE COLORÉ SUR L'IMAGE DU HERO --- */ .header-wrapper .cd-backgroundPane { position: absolute !important; /* Force le conteneur à rester stable sous le texte */ overflow: hidden !important; /* Empêche le filtre bleu de déborder de la bannière */ } .header-wrapper .cd-backgroundPane::after { content: "" !important; /* Obligatoire pour que le navigateur génère le calque virtuel */ position: absolute !important; /* Positionne le calque par-dessus la photo de la bannière */ top: 0; left: 0; right: 0; bottom: 0; /* Étire le calque aux 4 coins du bloc de tête */ width: 100%; height: 100%; /* S'assure de couvrir 100% de la zone de la photo */ background-color: rgba(26, 54, 93, 0.45) !important; /* Applique ton voile bleu nuit translucide officiel à 45% */ z-index: 1 !important; /* Place le filtre au-dessus de la photo mais sous tes textes blancs */ pointer-events: none !important; /* Rend le calque invisible aux clics pour ne pas bloquer les boutons */ } /* --- TITRES DE LA BANNIÈRE PRINCIPALE --- */ .header-wrapper h1 { font-family: 'Montserrat', sans-serif !important; /* Force Montserrat */ font-size: 120px !important; /* Taille massive */ font-weight: 800 !important; /* Lettres très épaisses */ text-transform: uppercase !important; /* Toujours en majuscule */ color: #FFFFFF !important; /* Texte blanc pur */ text-align: center !important; /* Centrage horizontal */ line-height: 1.1 !important; /* Espacement de ligne serré */ text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4) !important; /* Ombre portée */ margin: 0 0 10px 0 !important; /* Marge basse légère */ } /* Sous-titre dans le Hero Banner */ .header-wrapper h1 .header-subtitle { display: block !important; /* Force le retour à la ligne */ font-family: 'Montserrat', sans-serif !important; /* Force Montserrat */ font-size: 70px !important; /* Taille intermédiaire */ font-weight: 700 !important; /* Lettres épaisses */ text-transform: uppercase !important; /* Toujours en majuscule */ color: #E11D48 !important; /* Le rouge d'action du club */ text-align: center !important; /* Centrage horizontal */ line-height: normal !important; /* Neutralise le line-height serré du H1 parent */ text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4) !important; /* Ombre portée spécifique */ margin: 10px 0 0 0 !important; /* Éloignement du haut */ } /* RESPONSIVE MOBILE DE LA BANNIÈRE (≤ 768px) */ @media (max-width: 768px) { .header-wrapper h1 { font-size: 9vw !important; /* Devient fluide et s'adapte à la largeur du téléphone */ line-height: 1.2 !important; /* Donne un peu d'air pour les sauts de lignes inévitables */ margin-bottom: 5px !important; } .header-wrapper h1 .header-subtitle { font-size: 6vw !important; /* S'adapte proportionnellement en restant plus petit que le H1 */ margin-top: 5px !important; } } /* ========================================================================== 3. COMPOSANTS DE NAVIGATION ET ACCÈS RAPIDE (QUICK CARDS) ========================================================================== */ /* Grille principale invisible servant de conteneur global aux cartes */ .quick-access-grid { display: grid; /* Active la technologie CSS Grid Layout */ grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); /* Crée des colonnes automatiques de 280px minimum. */ gap: 24px; /* Espace de 24 pixels entre chaque bloc de carte */ max-width: 1140px; /* Aligne la grille sur la largeur maximale du site internet */ margin: 40px auto; /* Crée une marge verticale de 40px haut/bas et centre horizontalement */ padding: 0 20px; /* Marge de sécurité interne à gauche et droite pour les mobiles */ } /* Style de structure d'une carte d'accès rapide (Pavé blanc) */ .qa-card { background: #FFFFFF; /* Couleur de fond de la carte : Blanc pur */ border-radius: 15px; /* Arrondit proprement les 4 angles du pavé */ padding: 35px 20px; /* Marges internes : 35px en haut/bas et 20px sur les côtés */ box-shadow: 0 10px 30px rgba(0,0,0,0.06); /* Applique une ombre très subtile pour décoller la carte du fond */ text-decoration: none; /* Enlève le soulignement bleu internet par défaut (lien) */ border-bottom: 6px solid #1A365D; /* Ajoute une bordure inférieure épaisse colorée avec le Bleu Nuit */ transition: all 0.3s ease; /* Fluidifie toutes les transformations visuelles sur 0.3s */ color: #333333; /* Force la couleur d'écriture des textes à l'intérieur */ display: flex; /* Active l'outil Flexbox pour ranger le contenu de la carte */ flex-direction: column; /* Aligne les éléments verticalement (Du haut vers le bas) */ align-items: center; /* Centre horizontalement l'icône, le titre et le texte au milieu */ } .qa-card:hover { transform: translateY(-8px); /* Fait monter virtuellement le pavé de 8 pixels vers le haut */ box-shadow: 0 20px 40px rgba(0,0,0,0.12); /* Accentue l'ombre portée pour donner un effet d'élévation 3D */ color: #333333; /* Empêche le texte de virer au bleu lien standard lors du survol */ } .qa-card-red { border-bottom-color: #E11D48; /* Remplace le bleu du bas par le Rouge Vif de la charte */ } .qa-card h3 { color: #1A365D; /* Écrit le titre de la carte en Bleu Nuit */ margin: 10px 0; /* Crée un espace d'aération de 10px au-dessus et en dessous */ font-size: 1.25rem; /* Taille du texte intermédiaire adaptée */ text-transform: uppercase; /* Transforme automatiquement les lettres minuscules en MAJUSCULES */ text-align: center; /* Centre le bloc de texte horizontalement */ } /* Macarons circulaires pour les cartes d'accès rapide */ .qa-icon-circle { width: 65px; height: 65px; /* Dimensions du cercle */ border-radius: 50%; /* Transforme le carré en rond parfait */ display: flex; /* Flexbox pour le centrage interne */ align-items: center; justify-content: center; /* Centrage parfait de l'icône */ margin-bottom: 15px; /* Espace de 15px sous le rond avant le titre textuel */ } .qa-icon-blue { background: #F0F4F8; color: #1A365D; } .qa-icon-red { background: #FFF1F2; color: #E11D48; } /* Surcharge Phosphor spécifique pour nos cercles de la grille d'accès rapide */ .qa-icon-circle [class^="ph-"], .qa-icon-circle [class*=" ph-"] { font-size: 28px; /* Définit la taille de l'icône */ line-height: 1; /* Centrage parfait */ } /* ========================================================================== COMPOSANT EXCLUSIF : BARRE DE STATIONS METEO (LIGNE DÉDIÉE) ========================================================================== */ /* FORCE LA LIGNE DÉDIÉE DU CMS A PRENDRE TOUTE LA LARGEUR ET ÊTRE VISIBLE */ .sc-navigation-meteo-bar { width: 100% !important; max-width: 100vw !important; background-color: #1A365D !important; /* Bleu Nuit officiel du club */ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important; /* Ombre portée pour décoller la barre du fond */ border-bottom: 3px solid #E11D48 !important; /* Liseré décoratif bas Rouge Vif */ z-index: 999999 !important; /* Priorité maximale pour passer AU-DESSUS du menu */ overflow: visible !important; /* Sécurité anti-coupure : laisse respirer les boutons */ } /* ÉTAT FIXÉ AU SOMMET AU SCROLL (GÉRÉ PAR CUSTOM.JS) */ .sc-navigation-meteo-bar.is-fixed-top { position: fixed !important; /* Ancre solidement la barre à l'écran lors du scroll */ top: 89px !important; /*PC : Se cale pile sous le grand menu du club */ left: 0 !important; right: 0 !important; } /* RESPONSIVE MOBILE : Ajustement de la hauteur de blocage sur smartphone */ @media (max-width: 768px) { .sc-navigation-meteo-bar.is-fixed-top { top: 59px !important; /* Mobile : Se cale sous la barre réduite du CMS */ } } /* LE CONTENEUR DE DEFILEMENT (SCROLL HORIZONTAL) */ .sc-meteo-scroll-container { display: flex !important; /* Aligne les stations sur un axe horizontal */ flex-direction: row !important; flex-wrap: nowrap !important; /* Interdiction stricte de sauter à la ligne */ overflow-x: auto !important; /* Force l'apparition de la glisse au doigt sur mobile */ overflow-y: hidden !important; /* Bloque les secousses verticales */ width: 100% !important; max-width: 100% !important; padding: 14px 20px !important; /* Enrobage interne de confort */ gap: 15px !important; /* Espace constant et rigoureux entre chaque bouton */ -webkit-overflow-scrolling: touch !important; /* Active l'inertie fluide native sur iPhone/Android */ } /* COUPE-CIRCUIT : Empêche ClubDesk d'écraser la taille ou de masquer les stations de droite */ .sc-meteo-scroll-container a.sc-meteo-btn { flex-shrink: 0 !important; /* Force chaque bouton à garder sa vraie largeur */ display: inline-block !important; color: #F8FAFC !important; /* Écrit les stations en Gris Givré par défaut */ font-family: 'Lato', sans-serif !important; /* Notre police de lecture officielle */ font-weight: 700 !important; text-decoration: none !important; /* Supprime le soulignement bleu natif du CMS */ font-size: 0.85rem !important; text-transform: uppercase !important; /* Passage forcé en majuscules */ padding: 8px 16px !important; /* Zone de clic généreuse */ border-radius: 20px !important; /* Forme de capsule élégante */ background: transparent !important; transition: all 0.2s ease-in-out !important; } /* ÉTAT SURVOL ET ACTIVATION SÉLECTIONNÉE */ .sc-meteo-scroll-container a.sc-meteo-btn:hover, .sc-meteo-scroll-container a.sc-meteo-btn.active { background-color: #E11D48 !important; /* Devient Rouge Vif de la charte */ color: #FFFFFF !important; /* Texte blanc pur */ box-shadow: 0 2px 8px rgba(225, 29, 72, 0.3) !important; /* Halo lumineux rouge */ } /* Masquage esthétique de la scrollbar pour garder l'effet appli mobile */ .sc-meteo-scroll-container::-webkit-scrollbar { display: none !important; height: 0 !important; } /* ========================================================================== 4. COMPOSANTS DÉDIÉS AUX MANIFESTATIONS (CROSS / LOTO / ETC.) ========================================================================== */ /* --- BOUTON D'APPEL À L'ACTION PULSANT --- */ .bouton-date { display: block; /* Force le passage à la ligne */ font-size: 0.85em; /* Réduit la taille par rapport au texte principal du bouton */ font-weight: 400; /* Retire le gras pour créer un contraste hiérarchique */ margin-top: 5px; /* Décolle légèrement la date de l'appel à l'action */ } .bouton-qui-clignote { display: inline-block; background-color: #E11D48; color: #FFFFFF !important; padding: 15px 35px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; border-radius: 50px; /* Forme pilule */ text-decoration: none; box-shadow: 0 4px 15px rgba(225, 29, 72, 0.4); animation: pulseBouton 2s infinite; /* Animation 'pulseBouton' en boucle infinie toutes les 2s */ transition: all 0.3s ease; } .bouton-qui-clignote:hover { background-color: #BE123C; /* Rouge foncé au survol */ transform: translateY(-2px); /* Surélève le bouton de 2 pixels */ } @keyframes pulseBouton { 0% { transform: scale(1); box-shadow: 0 4px 15px rgba(225, 29, 72, 0.4); } 50% { transform: scale(1.03); box-shadow: 0 4px 25px rgba(225, 29, 72, 0.7); } 100% { transform: scale(1); box-shadow: 0 4px 15px rgba(225, 29, 72, 0.4); } } /* --- ENCADRÉ VISUEL D'ALERTE (Ex: PLACES LIMITÉES) --- */ .cross-alerte-box { background-color: #FFF1F2; /* Fond rose/rouge pastel très discret */ border-left: 5px solid #E11D48; /* Épaisse barre rouge d'avertissement à gauche */ padding: 20px; /* Marge d'isolement interne */ border-radius: 0 12px 12px 0; /* Arrondit uniquement les angles droits */ margin: 25px 0; /* Décolle le bloc des paragraphes */ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03); /* Ombre diffuse d'une extrême légèreté */ } .cross-alerte-header { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; } .cross-alerte-box .cross-alerte-header h4.cross-alerte-title { color: #E11D48 !important; /* Force Rouge Vif officiel du club */ margin: 0 !important; /* Supprime toutes les marges parasites */ font-size: 1.2rem !important; text-transform: none !important; } /* --- GRILLE DES CATÉGORIES RECYCLABLE (sc-categories-list) --- */ .sc-categories-list { display: block; max-width: 900px; margin: 20px auto; padding: 0 10px; font-family: 'Lato', sans-serif; } .sc-categories-list .sc-cat-group { background: #FFFFFF; border-radius: 12px; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04); margin-bottom: 25px; overflow: hidden; transition: transform 0.2s ease; } .sc-categories-list .sc-group-blue { border-left: 5px solid #1A365D; } .sc-categories-list .sc-group-red { border-left: 5px solid #E11D48; } .sc-categories-list .sc-cat-group-header { padding: 15px 20px; border-bottom: 1px solid #E2E8F0; } .sc-categories-list .sc-group-blue .sc-cat-group-header { background-color: #F8FAFC; } .sc-categories-list .sc-group-red .sc-cat-group-header { background-color: #FFF1F2; border-bottom-color: #FFE4E6; } .sc-categories-list .sc-cat-group-header h4 { margin: 0 !important; font-family: 'Kanit', sans-serif !important; text-transform: uppercase; font-weight: bold; } .sc-categories-list .sc-group-blue .sc-cat-group-header h4 { color: #1A365D; } .sc-categories-list .sc-group-red .sc-cat-group-header h4 { color: #E11D48; } .sc-categories-list .sc-cat-row { display: flex; justify-content: space-between; align-items: center; padding: 15px 20px; border-bottom: 1px solid #F1F5F9; } .sc-categories-list .sc-cat-row:last-child { border-bottom: none; } .sc-categories-list .sc-badge-tours { padding: 6px 14px; border-radius: 50px; font-weight: bold; font-size: 0.85rem; white-space: nowrap; } .sc-categories-list .badge-blue { background-color: #F0F4F8; color: #1A365D; } .sc-categories-list .badge-red { background-color: #FFF1F2; color: #E11D48; text-transform: uppercase; font-size: 0.8rem; } /* ========================================================================== 5. MISE EN PAGE SPÉCIFIQUE : DOUBLE PANNEAU (SPLIT CONTAINER) & LIENS ========================================================================== */ .cross-split-container { display: flex; flex-wrap: wrap; background: #FFFFFF; border-radius: 20px; overflow: hidden; box-shadow: 0 15px 40px rgba(0, 0, 0, 0.08); margin: 40px 0; } /* --- PANNEAU GAUCHE : ZONE BLEU NUIT (#1A365D) --- */ .cross-split-cta { flex: 1; min-width: 280px; background-color: #1A365D !important; padding: 40px; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; } .cross-split-cta h2 { color: #FFFFFF !important; font-family: 'Kanit', sans-serif; font-weight: 700; margin-top: 0; margin-bottom: 15px; font-size: 1.8rem; } .cross-split-cta h3 { color: #93C5FD !important; font-family: 'Lato', sans-serif; font-weight: 300; font-size: 1.1rem; line-height: 1.5; text-transform: none !important; margin-bottom: 30px; } .cross-split-cta ul { list-style: none !important; padding: 0 !important; margin: 0 0 30px 0 !important; } .cross-split-cta ul li, .cross-split-cta ul li span { color: #FFFFFF !important; font-family: 'Lato', sans-serif; font-size: 1rem !important; display: flex !important; align-items: center !important; margin-bottom: 15px !important; } .cross-split-cta ul li i { color: #FFFFFF !important; margin-right: 12px !important; font-size: 1.3rem !important; line-height: 1 !important; } .cross-split-cta .btn-formulaire-cross { display: block !important; width: 100%; max-width: 320px; background-color: #E11D48 !important; color: #FFFFFF !important; text-align: center !important; padding: 15px 20px !important; border-radius: 50px !important; font-weight: 700 !important; text-transform: uppercase !important; text-decoration: none !important; letter-spacing: 1px !important; box-shadow: 0 4px 12px rgba(225, 29, 72, 0.3); transition: all 0.3s ease !important; } .cross-split-cta .btn-formulaire-cross:hover { background-color: #BE123C !important; transform: translateY(-3px) !important; box-shadow: 0 6px 20px rgba(225, 29, 72, 0.5); } .cross-split-cta .support-link { font-size: 0.8rem !important; color: #94A3B8 !important; margin-top: 15px !important; text-align: center !important; font-family: 'Lato', sans-serif; } .cross-split-cta .support-link a { color: #FFFFFF !important; text-decoration: underline !important; } /* --- PANNEAU DROIT : EXTRAIT DU RÈGLEMENT (GRIS GIVRÉ) --- */ .cross-split-info { flex: 1; min-width: 280px; background-color: #F8FAFC !important; padding: 40px; display: flex; flex-direction: column; justify-content: space-between; } .cross-split-info h3 { color: #1A365D !important; font-family: 'Kanit', sans-serif; font-weight: 700; margin-top: 0; margin-bottom: 20px; font-size: 1.5rem; } .cross-split-info ul { padding-left: 20px !important; margin: 0 0 30px 0; font-family: 'Lato', sans-serif; } .cross-split-info ul li { margin-bottom: 12px; color: #333333 !important; font-size: 0.95rem; line-height: 1.6; } /* --- ZONE TECHNIQUE DES LIENS ET TÉLÉCHARGEMENTS --- */ .cross-downloads-zone { border-top: 1px solid #E2E8F0; /* Fine ligne de séparation au-dessus des fichiers (utile si utilisée dans le split info) */ padding-top: 20px; /* Crée un espace pour éloigner les liens de la ligne */ display: flex !important; /* Active Flexbox pour forcer l'alignement des liens */ flex-direction: column; /* Aligne les fichiers verticalement l'un sous l'autre */ gap: 12px; /* Espace régulier entre les liens */ } .cross-downloads-zone .cross-link-download { display: inline-flex !important; /* Aligne horizontalement l'icône et le texte cliquable */ align-items: center !important; /* Aligne l'icône au milieu horizontal de la ligne d'écriture */ color: #1A365D !important; /* Écrit par défaut les liens avec le Bleu Nuit du club */ font-weight: 600 !important; /* Utilise la variante semi-épaisse pour faire ressortir l'action */ text-decoration: none !important; /* Supprime le soulignement générique d'internet */ font-size: 0.95rem; /* Taille de police standardisée */ transition: color 0.2s ease !important; /* Fluidifie le changement de couleur au survol */ } /* Force le passage en rouge vif au survol de la souris */ .cross-downloads-zone .cross-link-download:hover, .cross-downloads-zone .cross-link-download:hover span { color: #E11D48 !important; /* Le lien bascule au Rouge Vif de la charte lors du survol */ } .cross-downloads-zone .cross-link-download i { font-size: 22px !important; /* Taille uniforme pour les icônes de fichiers */ margin-right: 10px !important; /* Espace à droite de l'icône avant l'intitulé */ line-height: 1 !important; /* Force la boîte de l'icône à ne pas déborder */ } /* ========================================================================== SURCHARGES CHIRURGICALES - PAGE GRAND LOTO ========================================================================== */ /* COUPE-CIRCUIT : Forçage des éléments textuels dans le CTA bleu nuit */ .cross-split-cta h4{ color: #93C5FD !important; /* Force les sous-titres en bleu clair de contraste */ font-family: 'Lato', sans-serif !important; /* Utilise la police de lecture Lato */ font-size: 1rem !important; /* Taille ajustée pour la hiérarchie */ text-transform: uppercase !important; /* Met nativement en majuscules pour le style */ margin: 20px 0 10px 0 !important; /* Gère les marges de respiration haute et basse */ } .cross-split-cta ul li span{ color: #FFFFFF !important; /* Force le texte des puces en blanc pur */ } /* ÉLÉMENTS DE BADGES DANS LES LISTES DE TARIFS */ .cross-split-cta .badge-discount{ font-size: 0.8rem !important; /* Réduit la taille pour la note de réduction */ color: #93C5FD !important; /* Applique le bleu de contraste clair */ margin-left: 5px !important; /* Décale légèrement de l'élément de prix parent */ } .cross-split-cta .badge-highlight{ font-size: 0.8rem !important; /* Réduit la taille pour la note informative */ color: #CBD5E1 !important; /* Applique un gris doux pour ne pas surcharger */ margin-left: 5px !important; /* Décale légèrement du texte principal */ } /* ========================================================================== SURCHARGES CHIRURGICALES - PAGE LOTO DES ENFANTS ========================================================================== */ /* THÉMATIQUE ENFANTS : Inversion des rôles colorés du Split Container */ .cross-split-container.children-theme .cross-split-cta { background-color: #E11D48 !important; /* Force le fond du panneau CTA en Rouge Vif officiel */ } .cross-split-container.children-theme .cross-split-cta h4 { color: #FFF1F2 !important; /* Force les sous-titres en rose/blanc de contraste */ font-family: 'Lato', sans-serif !important; /* Aligne sur la police de corps Lato */ font-size: 1.1rem !important; /* Taille uniforme pour la hiérarchie */ text-transform: uppercase !important; /* Passage natif en majuscules */ font-weight: bold !important; /* Graisse accentuée pour la lisibilité */ margin: 20px 0 5px 0 !important; /* Marge externe standardisée */ } .cross-split-container.children-theme .cross-split-cta p { color: #FFE4E6 !important; /* Force le texte descriptif en rose givré clair */ font-size: 0.95rem !important; /* Taille de lecture adaptée */ line-height: 1.5 !important; /* Hauteur de ligne aérée */ margin: 0 !important; /* Annulation des marges parasites */ } .cross-split-container.children-theme .cross-split-cta ul li span { color: #FFFFFF !important; /* Force le texte des puces en blanc pur */ } /* BOUTON DU CTA DE LA SÉRIE ENFANTS */ .cross-split-container.children-theme .btn-formulaire-cross { background-color: #1A365D !important; /* Le bouton d'action passe en Bleu Nuit (Inversion) */ box-shadow: 0 4px 12px rgba(26, 54, 93, 0.3) !important; /* Ombre portée subtile aux couleurs du club */ text-decoration: none !important; /* Sécurité : supprime le soulignement natif */ } .cross-split-container.children-theme .btn-formulaire-cross:hover { background-color: #112542 !important; /* Teinte assombrie au survol de la souris */ transform: translateY(-3px) !important; /* Effet de surélévation mécanique de 3 pixels */ } /* STRUCTURE DE L'ENCADRÉ D'ALERTE DES ENFANTS */ .cross-alerte-box .ph-cookie { font-size: 32px !important; /* Taille massive pour l'icône gourmande */ vertical-align: middle !important; /* Centrage sur l'axe vertical du texte */ } .cross-alerte-box h3.cross-alerte-title { margin-left: 5px !important; /* Espace de sécurité à droite du picto */ display: inline-block !important; /* Aligne sur la même ligne que l'icône */ } /* ENCADRÉ INTERNE DE FIN DE PAGE (NOTE DE DISTRIBUTION) */ .sc-inline-note { background: #F0F4F8 !important; /* Fond gris/bleu givré discret */ border: 1px dashed #1A365D !important; /* Bordure pointillée Bleu Nuit pour le rappel */ padding: 15px !important; /* Zone d'isolation interne */ border-radius: 10px !important; /* Arrondi des angles du bloc */ margin-top: 20px !important; /* Respiration par rapport à la liste du haut */ } .sc-inline-note h4 { color: #1A365D !important; /* Titre de la note en Bleu Nuit */ margin: 0 0 5px 0 !important; /* Marge basse légère */ font-size: 1rem !important; /* Taille de texte intermédiaire */ font-weight: bold !important; /* Graisse forte */ text-transform: uppercase !important; /* Titre en majuscules */ } .sc-inline-note p { font-size: 0.9rem !important; /* Taille de lecture secondaire */ margin: 0 !important; /* Nettoyage des espacements natifs */ color: #334155 !important; } /* ========================================================================== 6. NAVIGATION : ÉPUREMENT DE L'EN-TÊTE (DESKTOP) Masque le texte du nom du club à côté du logo pour épurer la barre ========================================================================== */ /* Cible le lien du nom du club uniquement sur les versions ordinateurs */ .cd-logo-and-name-desktop .cd-club-name { display: none; /* Masque proprement le texte et libère l'espace horizontal */ }