﻿/* body  *:not([class*="bouton"], [class*="btn-"],[class*="icone"]) */
body  *:not([class*="icone"])
	{
    font-family: 'UnifrakturMaguntia', cursive, serif !important;
    font-weight: 400;
    letter-spacing: 0.5px; /* Un léger espacement améliore encore la lisibilité */
	}

:root {
  --couleur-texte: #E0E0E0;
  --couleur-texte-opposee: #8B0000;
  --couleur-fond: #121212;
  --couleur-cadres: rgba(139, 0, 0, 0.5);
  --couleur-bordure: #2A2A2A;
  --couleur-ombre: #BBF451;
}

/* --------------------- */
/*   Couleur de fond    */
/* --------------------- */
body , nav , 
#bottom, 
#conteneur-modif,
div#Articles,
#imgIcone, 
ul.dropdown-menu, 
.fonctions,
.previsualisationConteneur,
.enteteBlogue,
.text-warning, 
.piedDePage, 
.lienArticle 
	{
	background-color: var(--couleur-fond);
	}
	
.enteteArticle 
	{
	background-color: var(--couleur-fond) !important;
	}
	
/* conserve les couleurs d'origine */
span ( .publiee, .publie, .nonPublie, [class^="icone"] ) 
	{
	background-color: inherit;
	}

/* --------------------- */
/*   Couleur de texte    */
/* --------------------- */
*, 
[class]:not(
.titreEntete, .description, .slogan, 
.assistance, 
.texteExifs, 
.notifications, 
.bulle-aide, div .aide, div .aideCache, 
.textBlogue  )
	{
	color: var(--couleur-texte);
	}
	
*:not( [class], select, option, input, textarea, h4, h2,
.publiee, 
.bulle-aide, div .aide, div .aideCache ),
 #imgIcone, 
/* .recipient, .emetteur, */
.textArticle,
.legendeMiniature,
.icone, 
.text-warning
	{
	color: var(--couleur-texte)  !important;
	}		
	
.pswp-caption-title,
.recipient, .emetteur ,
.lienArticle:hover a, 
.consigneAuto
	{
	color: var(--couleur-texte-opposee)  !important;
	}

/* --------------------------------- */
/*   Change la couleur des titres    */
/* --------------------------------- */		
h1, h2, h3, h4, h5
	{
	color: var(--couleur-texte-opposee)  !important;
	-webkit-text-stroke: 1px var(--couleur-texte);
	text-stroke: 1px var(--couleur-texte);
    /* Empêche le contour d'épaissir ou d'empiéter sur le texte */
    paint-order: stroke fill;
	font-weight: bold !important;
	text-shadow: 0 0 1px rgba(255, 255, 255, 0.8);
  }	
.texte-editeur  div, textarea
	{
	font-size: 1.3rem !important;
	}
	
.ordinateur h1 { font-size: 4rem !important; }  /* ~56px */
.ordinateur h2 { font-size: 2.8rem !important; }  /* ~45px */
.ordinateur h3 { font-size: 2.2rem !important; }  /* ~35px */
.ordinateur h4 { font-size: 1.7rem !important; }  /* ~27px */
.mobile h1 { font-size: 2.8rem !important; }  /* ~56px */
.mobile h2 { font-size: 1.8rem !important; }  /* ~45px */
.mobile h3 { font-size: 1.5rem !important; }  /* ~35px */
.mobile h4 { font-size: 1.2rem !important; }  /* ~27px */

/* ------------------ */
/*   Image de fond    */
/* ------------------ */	
body.ordinateur
	{
background: 
	linear-gradient(rgba(6, 6, 15, 0.8) 10%, rgba(6, 6, 15, 0.4)),
	url('../images/gothique.webp') no-repeat center / 100% 100%;
	background-attachment: fixed;
	min-height: 100vh;
	margin: 0;
	}
body.mobile
	{
background: 
	linear-gradient(rgba(6, 6, 15, 0.8) 10%, rgba(6, 6, 15, 0.4)),
	url('../images/gothique.webp') no-repeat center / auto 100%;
	background-attachment: fixed;
	min-height: 100vh;
	margin: 0;
	}
	
/* --------------- */
/*   Couverture    */
/* --------------- */	
.couverture {
	background: linear-gradient(-8deg, #162456 40%, #03071e );
}

/* ------------------ */
/*   logo attente    */
/* ------------------ */
.attente {
	box-shadow: 6px 8px 8px black;
	background: #DCFCE7 !important;
}
.attente span{
	background: #DCFCE7 !important;
	color: black !important;
}

/* ----- */
/* Menus */
/* ----- */
.icone:hover {
  /* color: var(--couleur-texte-opposee); */
}

a.dropdown-item:hover 
	{
	border-radius: 20px;
	box-shadow: 1px 1px 3px var(--couleur-ombre) !important ;
	}
a.text-warning:hover
	{
	color: var(--couleur-texte) !important;
	box-shadow: 1px 1px 3px var(--couleur-cadres) !important ;
	background-color: var(--couleur-fond) !important;
	border: 1px solid var(--couleur-bordure);
	}
	
/* --------*/
/* éditeur */
/* ------- */
a[target="blank"] {
  color: #34A6F4 !important;
  text-decoration: underline !important;
}

/* ----------------- */
/* index des blogues */
/* ----------------- */
.indexCache  
	{
	color: var(--couleur-texte) !important;
	}
.enteteBlogue:hover
	{
	box-shadow: 0px 0px 15px var(--couleur-ombre);
	}	
.blocBlogue  
	{
	border: 1px solid rgba( 143, 143, 143, 0.2 );
	}
	
/* ---------------------- */
/* commentaire du message */
/* ---------------------- */
.encre  
	{
	color: #53EAFD !important;
	}
	
/* -------------- */
/* galerie photos */
/* -------------- */
.numeroPhoto 
	{
	color: #525252 !important;
	}
	
img.img-fluid  
	{
	border: 0.5px solid var(--couleur-bordure) !important;
	}
	
.gallery .gallery-item:hover img.grille 
{
  box-shadow: 0px 0px 25px  var(--couleur-ombre) !important;
}  

.conteneurDateArticle
	{
	border-top: 1px solid rgba(183, 255, 140, 0.2 );
	background: linear-gradient(45deg, rgba( 9, 9, 41, 0.5 ), rgba( 158, 11, 11, 0.3 ) );
	box-shadow: 0 8px 15px -10px  var(--couleur-ombre) !important;
	margin-top: 15px;
	}
.dateArticle
	{
	font-family: 'Rubik', sans-serif;
	font-weight: 300;
	}	
.transparent {
	background: linear-gradient( var(--couleur-texte) 40%, transparent ) !important;
	color: var(--couleur-texte) !important;
	-webkit-background-clip: text !important;
	-webkit-text-fill-color: transparent !important;
	}
	
/* ------------ */
/* encadrements */
/* ------------ */
form, div.encadre, div.fonction, div.sauvegarde
	{
	background-color: var(--couleur-cadres);
	border: 1px solid var(--couleur-bordure);
	box-shadow: 2px 2px 6px var(--couleur-ombre) ;
	}

/* ----------- */
/* formulaires */
/* ----------- */

input:not([type="file"]):not(:disabled) , textarea, select, option 
	{
	background-color: var(--couleur-texte) !important;
	color: var(--couleur-fond) !important;
	border: 1px solid var(--couleur-texte-opposee) !important;
	font-size: 1.3rem !important;
	}
input[type="file"] {
  /* background: transparent !important; */
}

textarea:focus, textarea:focus-visible,  input:focus {
	box-shadow: 0px 0px 10px var(--couleur-texte);
	border: 0.5px solid var(--couleur-bordure);
	outline: none;
}
label, .titre
	{
	border-top: 2px solid rgb( 150, 150, 150 , 0.1 );
	}

/* page tarifs */
.container-table th, .container-table td  
	{
	color: black !important;
	}
	
/* -------------------- */
/* Couleurs des entités */
/* blogues et articles */
/* -------------------- */

.blogue, .boutonBlogCourant 
	{
	background-color: #1E2939;
	border: 1px solid var(--couleur-bordure);
	border-radius: 8px;
	box-shadow: 2px 2px 8px var(--couleur-ombre) ;
	}
	
/* Publie */
.titreArticle, .lienPublie
	{
	background-color: #4A5565;
	}
	
/* Non publié	 */
.lienEnvironnement	 
	{
	background-color: #10598A;
	}
	
.boutonBlogPrive {
	background-color: #FFA2A2 !important;
	color: white !important;
	border-color: transparent !important;
  }
  
.lienPublie:hover, .lienEnvironnement:hover, .publie, .nonPublie
	{
	color: black !important;
	}
		
/* ------------------ */
/* Liste des articles */
/* ------------------ */
.ArticlesDeplier,
.enteteArticle:hover
	{
	box-shadow: 0px 0px 10px var(--couleur-ombre);
	}

.limite  
	{
	background-color: grey;
	}

/* Messages et notes */
.note-bouton, .totalCptPhoto, .cptPhoto
	{
	color: black !important;
	}
	
/* Texte de dépilement */
.suite  
	{
	color: green !important;
	background-color: transparent !important;
	}

/* ----------- */
/* Les boutons */
/* ----------- */

/* Plus d'info boutons */
.titreBouton  
	{
	background: var(--couleur-cadres) !important;
	border-color: var(--couleur-fond) !important;
	color: var(--couleur-texte) !important;
	border-width: 1px !important;
	}
	
.bouton-action, .bouton 
	{
	background: #A91B0D;
	border-color: var(--couleur-texte) !important;
	color: var(--couleur-texte) !important;
	border: 1px solid var(--couleur-texte) !important;
	}
.bouton-action:hover, .bouton:hover, .boutonContact:hover
	{
	color: var(--couleur-texte) !important;
	background: #FF692A;
	border: 1px solid var(--couleur-texte) !important;
	box-shadow: 1px 2px 3px var(--couleur-ombre); 
	transform: scale(1.1);
	}
.bouton-envoyes , .boutonBlanc 
	{
	color: black !important;
	}
/* icone bouton */
.bouton-action span:not(.bulle-aide)
	{
	color: var(--couleur-texte) !important;
	}

	
/* -------- */
/* triPhoto */
/* -------- */
.dragLigne, .drag {
	background-color: var(--couleur-cadres) !important;
	border: 1px solid var(--couleur-bordure);
}	
.dragLigne:hover, .drag:hover {
	background-color: var(--couleur-cadres) !important;
	box-shadow: 2px 2px 10px var(--couleur-ombre);
}	
	
/* -------- */
/* légendes */
/* -------- */
.blocPhoto:focus-within {
	border: 3px solid var(--couleur-bordure);
	box-shadow: 0px 0px 25px var(--couleur-ombre);
 }