/*
Theme Name: CCVA - portail de l'urbanisme
Theme URI: https://www.urba.cc-valdeaisne.fr/
Author: Cédric DUPONT
Author URI: https://www.urba.cc-valdeaisne.fr/
Description: Thème Wordpress du Portail de l'urbanisme et du droit des sols de la communauté de communes du Val de l'Aisne (CCVA). Ce thème incorpore Bootstrap 5, les icônes Bootstrap, les polices de caractère de la charte graphique de la CCVA (Outfit, Coyote). Ce thème nécessite des plugins développés par la CCVA pour activer toutes ses fonctionnalités. Une FAQ sur l'utilisation du thème est disponible en accès réservé pour les administrateurs.
Version: 2.1
License: Licence propriétaire
License URI: https://www.urba.cc-valdeaisne.fr/
Text Domain: ccva
Screenshot: url(../wp-content/themes/ccva/screenshot.png)
*/


/* Réinitialisation des styles */
html,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
background: transparent;
}
/************ Incorporation des polices de caractère de la communauté de communes du Val de l'Aisne */
@font-face {
    font-family: 'Outfit';
    src: url("fonts/Outfit-VariableFont_wght.ttf") format("truetype");
	font-weight: normal;
	font-display: swap;
}
@font-face {
    font-family: 'Coyote';
 	src: url("fonts/Coyote-SemiBoldDEMO.ttf") format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}
/************ Définition des styles globaux */
body {
font-family: "Outfit", Arial, Helvetica, sans-serif !important;
background-image: url("img/logo_ccva_fond.png");
background-repeat: no-repeat;
background-position: right center;
padding: 0;
display: flex;
flex-direction: column;
min-height: 100vh;
transition: font-size 0.5s ease;
}


body a {
color: #009592;
}

a {
color: #009592;

}
body a:hover {
color: #13493F;
text-decoration: underline;
}

a:hover {
color: #13493F;
text-decoration: underline;
}
h1 /* Permet de faire l'effet d'apparition des titres en h1*/ {
opacity: 0;
animation: appear 1s ease-out forwards;
}
@keyframes h1 {
from {
opacity: 0;
transform: translateY(50%);
}
to {
opacity: 1;
transform: translateY(0);
}
}

/************ Listes et numéros */
ul {
list-style: none;
}
/* Les puces font intervenir une icone bootstrap */
#post-content ul li::before {
content: "\F287";
font-family: "bootstrap-icons";
color: #009592;
font-weight: bold;
display: inline-block;
margin-right: 1em;
margin-left: 0.4em;
font-size: 0.4em;
line-height: 3.2em;
}
/* Modification des couleurs des numéros de liste */
#post-content ol li::marker {
color: #009592;
font-weight: bold;
font-size: 1.2em;
}

#post-content ol li {
margin-right: 1em;
}
#post-content li {margin-top:1em;margin-bottom:1em;}

.no-bullet-icons li::before {
    content: none!important;  /* Supprime le contenu généré avant les éléments li */
}


/************ Page d'accueil */
/**** L'identifiant presentation correspond à l'encart dans lequel est placé le titre du site, sur une image en arrière-plan en dégradé de couleurs */
#presentation {
    z-index: 1;
    background-image: url("img/image_fond_accueil.jpg");
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    position: relative;
    background-attachment: fixed;
    padding-left: 50px;
	 padding-right: 50px;
	  padding-bottom: 50px;
	
}

#presentation:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to top, #0c2a22, #00484a, #65831c, #d8ab14);
    opacity: 0.7;
    z-index: 0;
}

#presentation h1 {
    font-family: Outfit, Arial, sans-serif;
    color: white;
    text-align: center;
    font-size: 2.4em; /* Augmentation de la taille */
	text-shadow: 0 2px 2px rgba(0, 0, 0, 0.5);
    font-weight: 400;
    line-height: 1.5em;
	margin-top:3.2em;
}
#presentation h3 {
font-size: 1.3em;
}
#presentation p {
font-size: 1.2em;
color: white;
}
#presentation img:hover {
    opacity: 0.8;
    transition: opacity 0.3s ease;
}
.gradient-text {
    background-image: linear-gradient(to right, #13493F, #009592, #89BE2B, #FBD22B);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-family: Coyote, Arial, sans-serif;
    padding: 5px 10px;  
    border-radius: 5px;
	text-shadow:0 2px 2px rgba(0, 0, 0, 0.1);
}
.text-coyote {
    font-family: Coyote, Arial, sans-serif;

}
.img-front-page {
    max-width: 30%;
    display: block;
    margin: 0 auto;
}
.front-page-image:hover {
  opacity: 0.8;
  transition: opacity 0.5s ease;
}

.front-page-image
{
max-width: 1000px;
margin: auto;
}


/**** L'identifiant front-page-category correspond à la liste des catégories affichées en page d'accueil */
#front-page-category h1 {
font-size:0.8em;
color:#6c757d;
margin:0;
padding:0;
}
#front-page-category h2 {
font-size:2.5em;
color:#13493F;
padding:0;
}
@media (max-width: 991.98px) {
    #front-page-category h2 {
        position: static;
        margin-left: 0;
    }
}
#front-page-category .card {overflow:hidden;}
#front-page-category  .card:hover {
    transform: scale(1.02);
}
#front-page-category h3 {
font-size: 1.35em !important;
color: #13493F;
padding: 0;
}
#front-page-category h3 a {font-size:0.85em; text-decoration:none;}
#front-page-category a {color:#0c2a22;}
/* Front-page-elements : concerne les autres sections du front-page */

#front-page-elements h2 {
    color: #13493f;
    position: relative;
    display: inline-block; /* Cette propriété permet de définir la largeur de la div en fonction du contenu */
	margin-bottom:1.5em;
   
}
.front-page-elements-p {font-size:1.25em; color:#13493F;}
body.front-page {
background:none;
}
#logo-presentation img {width:310px;}


/**** L'identifiant front-page-description correspond à l'encart en-dessous des éléments. La description est modifiable par un widget intégré au functions.php */
#front-page-description {
display: flex;
justify-content: center;
align-items: center;
line-height: 1.8em;
color: #6c757d;
}
#front-page-description .bi-chat-left-quote {
font-size: 4em;
float: right;
padding:1em;
}
.wp-image-101 {filter: drop-shadow(0px 3px 0px #FFFFFF);}
/* Cette classe permet de faire un effet d'apparition. Elle est utilisée pour le logo en page d'accueil */
.appear {
opacity: 0;
animation: appear 1s ease-out forwards;
}
@keyframes appear {
from {
opacity: 0;
transform: translateY(50%);
}
to {
opacity: 1;
transform: translateY(0);
}
}

/**** L'identifient front-page-articles correspond à la section du carroussel qui appelle les articles PLUiH en page d'accueil */
#front-page-articles {
    position: relative;
   background-image: linear-gradient(rgba(0, 149, 146, 0.8), rgba(2, 89, 88, 0.8)), url("img/image_fond_articles.jpg");

	

    background-repeat: no-repeat;
    background-size: cover;
}



/************ Barre de navigation - attention, wpnavwalker.php est intégré dans functions.php et dans navbar.php */
/*** Personnalisation du logo pour l'adapter aux petits écrans */
/* Par défaut, on cache le petit logo */
/* Cache les logos du mode sombre par défaut */
.logo {
  display: none;
}
.logo-large-light{
   width: 225px;
   height: 57.75px;
}
.logo-large-dark {max-width:57px;}

.logo-small-light {
  max-width: 50px;
  max-height: auto;
}
/* Par défaut, on affiche le grand logo en mode clair */
.logo-large-light {
  display: block;
}
body.dark-mode .logo-large-light,
.logo-small-light {
  display: none;
}
body.dark-mode .logo-large-dark {
  display: block;
}
@media screen and (max-width: 768px) {
  .logo-large-light,
  .logo-large-dark {
    display: none;
  }

  .logo-small-light {
    display: block;
  }
  body.dark-mode .logo-small-light,
  .logo-large-dark {
   display: none!important;
  }
  body.dark-mode .logo-small-dark {
    display: block;
	max-width:50px;
  }
}
/*** Personnalisation de la navbar */
.upper-navbar {  
	background-color:white;
	 z-index: 1051!important;
}

.navbar-toggler {
    position: absolute;
    top: 1.20rem;
    right: 1rem;
}
.navbar-nav  {padding-right:1em;}
.navbar-brand {
margin-right:2em!important;
}
.navbar-brand img:hover {opacity: 0.8;
transition: opacity 0.3s ease;}
/* Nous définissons une animation appelée gradient-wipe */
@keyframes gradient-wipe {
    0% {
        width: 0%;
    }
    100% {
        width: 100%;
    }
}

.menu-item:hover a {text-decoration:none;}
/* Nous ajoutons un pseudo-élément after pour chaque élément de menu */
.menu-item::after {

	
}
/* Lors du survol, nous changeons la transformation pour simuler un "défilement" */
.menu-item:hover::after {
    transform: scaleX(1);
}
.navbar-brand,  .navbar-nav .nav-link {padding-left:1em;}
nav {
font-family: "Outfit", Arial, Helvetica, sans-serif;
list-style-type: none;
font-weight:400;

}

.navbar .navbar-nav .menu-item-114 > a {
background-color: #dc3545;
border-color: #dc3545;
color: #fff;
}
.navbar {
font-size:1.1em;
padding-right:2em;
}
.navbar-brand,
.navbar-nav .nav-link {
color: #009592;
}
.navbar-brand:hover,
 .navbar-nav .nav-link:hover {
color: #13493f;
}
.navbar-brand:focus,
.navbar-nav .nav-link:focus {
color: #13493f!important;
}
/* Personnalisation du bouton accès communes en navbar */
.menu-item-124::after {background: none}
.menu-item-124 a {
	margin-left:0.5em;
	margin-right:0.7em;
    display: inline-block;
    font-weight: 400;
    color: #fff!important;
	text-decoration:none!important;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background-color: #dc3545;
    border: 1px solid transparent;
    padding: .375rem .75rem;   
    line-height: 1.5;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.menu-item-124 a:hover {
    color: #fff;
    background-color: #c82333;
    border-color: #bd2130;
}
.menu-item-124 a:focus, .menu-item-124 a.focus {
    box-shadow: 0 0 0 0.2rem rgba(225, 83, 97, 0.5);
}

nav .bi-person-circle {color:#dc3545;}
.nav-item.active.admin, .nav-item.active.subscriber {
    padding: 0;
    margin-right: 1.5em;
    text-align: center;
}

/* Style de la barre de recherche */
.search-form .form-control {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0; 
	line-height:2.5em;

}

.search-form .btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0; 
		line-height:2.5em;
}

.input-group .form-control {
    margin-bottom: 0;
}

.input-group .input-group-append {
    margin-left: -1px;
}

/* Personnalisation des sous-menus */
.dropdown-menu {
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Ombre portée légère */
    padding: 1.5em; /* Espace autour du contenu */
}

/* Styliser les éléments de menu */
.dropdown-menu .dropdown-item {
    color: #009592; /* Couleur de texte plus foncée pour un meilleur contraste */
    padding: 0.5em 1em; /* Espace vertical et horizontal */
    margin: 0.5em 0; /* Espacement entre les éléments */
    font-size: 1rem; /* Taille de police standard */
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7); /* Ombre de texte pour améliorer le contraste */
}

/* Ajouter un hover pour les éléments de menu */
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus {
    color: #13493f; /* Couleur de texte au survol */
}
.dropdown-menu .dropdown-item:focus  {
	background-color:inherit!important;
}


/************ La classe page-header correspond à la zone en degradé dans laquelle apparait l'image en vedette en arrière-plan et le titre en avant-plan. Il s'agit de la section qui apparait avant le contenu */
.page-header {
position: relative;
background-size: cover;
background-position: center;
background-size: cover;
padding-bottom: 4em;
padding-top: 8em;
}
/* L'overlay permet de faire l'effet de couleur transparente en dégradé */
.page-header .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        to left,
        rgba(2, 22, 18, 0.8),
        rgba(0, 79, 75, 0.8),
        rgba(20, 90, 5, 0.8),
        rgba(168, 142, 2, 0.8)
    );
}
/* Ici, on modifie la taille du h1 uniquement dans la classe page-header */
.page-header h1 {
position: relative;
z-index: 999;
color: #fff;
font-weight: 700;
margin: 0;
text-shadow: 0 2px 2px rgba(0, 0, 0, 0.5);
margin-top:0.9em;
}
#category {flex: 1;}


/************ Définition des styles pour le contenu */
/*Fil d'ariane */
.breadcrumb-item {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 500px;
}

/* Styles généraux du fil d'Ariane */
.breadcrumb {
    padding: 10px 15px;
    background: #f8f9fa;
    border-radius: 5px; 
    list-style: none;
    display: flex;
    align-items: center; 
}
/* Style des éléments individuels du fil d'Ariane */
.breadcrumb-item {   
    color: #6c757d; /* Couleur de police */
}

/* Effet de survol pour les éléments cliquables du fil d'Ariane */
.breadcrumb-item a:hover {
    text-decoration: underline;
    color: #13493f;
}


.breadcrumb-container {
    width:100%
}

/* Mise en forme de la section de contenu */
#post-content {
background-color: white;
box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.1);
border-radius: 0.1em;
margin-bottom: 2em;
padding-left: 2.5em;
padding-right: 2.5em;
padding-bottom: 5em;
padding-top: 2em;
font-size:1.1em;
flex: 1;
}

.bords-longs
{
padding-left: 10em;
padding-right: 10em;
padding-bottom: 15em;
padding-top: 4em;
flex: 1;
}

/* Mise en forme des titres du contenu */
#post-content h1,
h3,
h4,
h5,
h6 {
line-height: 1.2em;
color: #009592;
font-family: "Outfit", Arial, Helvetica, sans-serif;
margin-top:0.85em!important;
margin-bottom:0.85em!important;
}
#post-content h2 {
line-height: 1.2em;
color: #009592;
margin-top:0.5em!important;
margin-bottom:1em!important;
}
#post-content h2:after {
content: "";
background: #fbd22b;
height: 0.1em;
position: relative;
width: 1em;
margin-left: 0.8em;
display: inline-block;
}
#post-content h5 {
font-style:italic;
}
#post-content h6 {
font-style:italic;
}
/************ Style pour l'accès réservé,  pour la page de confirmation d'envoi du message et pour les barres d'outils Wordpress - voir dans functions.php */
.login {
background-color: white;
background-image: none;
margin-top:0!important;
font-size:1.1em;
padding:0;
overflow:hidden;
}
.login h2 {
font-size: 1.8em;
margin-bottom:1.5em!important;
padding:0;
color:#009592;
}
.login a {font-size:0.9em;}
.admin {
}
.editor-author-contributor {
}
.img-wrapper {
  position: relative;
}
.private-label {
  position: absolute;
  top: 10px;
  left: 10px;
  background-color: red;
  color: white;
}
.label-espace-commune {
    background-color: #dc3545;
    color: #fff;
    padding: 0.1em 0.24em;
    border-radius: 0.25rem;
	font-size:0.7em;
	margin-right:0.5em;
}
/** Indicateur de téléversement des fichiers */
.loader {
    display: none; /* Cela masque le spinner par défaut */
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
}
.loader.show {
    display: flex; /* Cela affiche le spinner lorsque la classe "show" est ajoutée */
}
 .bg-custom1 {
        background-color: #13493F;
    }
    .bg-custom2 {
        background-color: #009592;
    }
    .bg-custom3 {
        background-color: #89BE2B;
    }
    .bg-custom4 {
        background-color: #FBD22B;
    }
   .bg-custom5 {
        background-color: #004a49;
    }	
	
	
/************ Pied de page */
/* Styles de base */
#footer {
    padding: 1.8em 0;
	background-color:#009592;
    color:#FFFFFF;
}
#footer h3 {
	color:#FFFFFF;
	margin: 0 0 1em 0;
 }
#footer a {
 color:#FFFFFF;
    text-decoration: none;
    transition: color 0.3s ease;
	font-size:0.9em;
}
#footer a:hover {
   text-decoration: underline;
}
#footer p, #footer ul {
    margin: 0 0 0.5em 0;
   }
#widget-area-1{border-right:1px solid #FFFFFF;}
/* Suppression des styles d'image spécifiques */
#footer .wp-block-image,
#footer .wp-block-image img {
    border: none;
    box-shadow: none;
	margin-bottom:0.5em;

}
/* Styles pour les widgets */
#footer .widget-area {
    margin-bottom: 1em; 
}
#footer img:hover {
    opacity: 0.8;
    transition: opacity 0.3s ease;
}
.border-left {border-left:1px solid white;}

/************ Personalisation des formulaires */
input[type="submit"] {
background-color: #009592;
color: #fff;
border: none;
border-radius: 4px;
padding: 10px;
cursor: pointer;
}
input[type="submit"]:hover {
background-color: #007d75;
}
input[type="checkbox"] {
transform: scale(1.5); /* aggrandir la case à cocher */
margin-right: 1em;
margin-left: 1em;
}
input[type="file"] {
font-size: 0.85em; /* ajuster la taille du texte dans le bouton */
}
.form-control {font-size:0.9em!important;}

/************ Personalisation des styles Wordpress par défaut */
/**** Personnalisation de l'affichage des images */
.wp-block-image {
border-radius: 0.2em;

text-align: center;
}
.wp-block-image img {
border-radius: 0.1em;
}
.wp-block-image figcaption {
text-align: center;
padding: 0.2em;
border-radius: 0.1em;
color: #13493f;
font-weight: 200;
font-style: italic;
} 
.wp-block-media-text__media img, .wp-block-media-text__media video {margin-bottom:2em;}

/* Correspond aux légendes */
.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
color: #13493f;
background: #dee2e6;
font-size: 1em;
}
/* Correspond aux extraits d'articles */
.wp-block-post-excerpt { 
  background-color: #fafafa;
 color:#009592;
  line-height:2em;
  margin-bottom : 2em;
  margin-top:2em; } 
  
.wp-block-post-excerpt  hr {
  border-top-color: #a6e1ec;
}

.wp-block-post-excerpt  a {
  color: #245269;
}
.wp-block-file .wp-block-file__button {
  display: inline-block;
  padding: .375rem .75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #fff;
  background-color: #007bff;
  border: 1px solid #007bff;
  border-radius: .25rem;
  transition: color .15s ease-in-out,
              background-color .15s ease-in-out,
              border-color .15s ease-in-out,
              box-shadow .15s ease-in-out;
}
.wp-block-file .wp-block-file__button:hover {
  color: #fff;
  background-color: #0069d9;
  border-color: #0062cc;
}
.wp-block-file .wp-block-file__button:focus,
.wp-block-file .wp-block-file__button.focus {
  color: #fff;
  background-color: #0062cc;
  border-color: #255784;
  box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .5);
}
.wp-block-file .wp-block-file__button.disabled,
.wp-block-file .wp-block-file__button:disabled {
  color: #fff;
  background-color: #007bff;
  border-color: #007bff;
}
.wp-block-file__button a,
.wp-block-file__textlink a {
  display: inline-block;
  padding: .375rem .75rem;
  font-size: 1rem!important;
  font-weight: 400;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: #007bff;
  border: 1px solid #007bff;
  color: #fff;
  border-radius: .25rem;
}

.wp-block-file__button a:hover,
.wp-block-file__textlink a:hover {
  background-color: #0069d9;
  border-color: #0062cc;
}

.wp-block-button {  
display: inline-block;
margin-bottom:2em!important;
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
color: #fff;
background-color: #009592 !important;
border-color: #009592 !important;
border: 1px solid #007bff;
 border-radius: .25rem;
transition: color .15s ease-in-out,
              background-color .15s ease-in-out,
              border-color .15s ease-in-out,
              box-shadow .15s ease-in-out;		  
}

.wp-block-button__link {background:none;}

.wp-block-button:hover {
background-color: #007d75 !important;
border-color: #007d75 !important;
color: #fff !important;
}

.wp-block-button a:hover {color: #fff !important;  text-decoration: none; }

.wp-block-button:active {
background-color: #009592 !important;
border-color: #009592 !important;
color: #fff !important;
}

.wp-block-button a::after {
content: "\F134"; 
font-family: "bootstrap-icons";
margin-left:1em;
}

/* Légendes cliquables en forme de bouton*/
.wp-element-caption {color: #009592;font-size: 0.95em;font-style:italic;}
.wp-element-caption a {
  display: inline-block;
  text-decoration: none;
  background-color: #009592 !important;
border-color: #009592 !important;
  color: #fff; 
  padding: .375rem .75rem; 
  border-radius: .25rem; 
  font-weight: 400; 
  text-align: center; 
  vertical-align: middle; 
  cursor: pointer; 
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.wp-element-caption a:hover {
  background-color: #0069d9; 
  border-color: #0062cc;
  text-decoration: none; 
  color: #fff;
}
.wp-block-image .wp-element-caption a::before {
display:none;}

.wp-block-image .wp-element-caption a::after {
content: "\F134";
font-family: "bootstrap-icons";
margin-left:1em;}


/* =========================
   Styles généraux des commentaires
   ========================= */

/* Conteneur général des commentaires */
.comment-item {
    display: block;
    margin-bottom: 25px; /* Espacement entre les commentaires */
}

/* Titre de la section des commentaires */
.comments-title {
    color: #009592;
}

/* Avatar du commentaire */
.comment-avatar img {
    border-radius: 50%;
    width: 48px; /* Taille de l'avatar */
    height: 48px;
}

/* Corps du commentaire */
.comment-body {
    background-color: #f8f9fa; /* Couleur de fond gris clair */
    padding: 20px;
    width: 100%;
    border-radius: 0.5em;
}

/* Métadonnées du commentaire (auteur et date) */
.comment-meta {
    display: flex;
    flex-direction: column; /* Empile l'auteur et la date */
    align-items: flex-start;
    margin-bottom: 10px;
}

/* Auteur du commentaire */
.comment-author {
    font-weight: bold;
    font-size: 1.4rem;
    color: #333;
    font-style: normal !important;
}

/* Date du commentaire */
.comment-meta span {
    color: #6c757d; /* Texte gris pour la date */
    font-size: 0.9rem;
}

/* Contenu du commentaire */
.comment-content {
    line-height: 1.5;
    margin-top: 10px;
}

/* Bouton pour répondre */
.reply a {
    display: inline-block;
    padding: 5px 10px;
    font-size: 0.9rem;
    color: #6c757d;
    border: 1px solid #6c757d;
    border-radius: 0.25rem;
    text-decoration: none;
}

.reply a:hover {
    background-color: #6c757d;
    color: #fff; /* Texte blanc sur fond gris au survol */
}

/* =========================
   Styles spécifiques pour les commentaires de l'administrateur
   ========================= */

/* Style pour le commentaire de l'admin */
.admin-comment {
    background-color: #3574680d;
    color: #13493F;
    border-radius: 0.25em;
}

/* Ajuster les couleurs du texte pour l'admin */
.admin-comment .comment-author {
    color: #13493F;
}

/* Styles supplémentaires pour l'admin (à personnaliser si nécessaire) */
.admin-comment .text-muted {
    /* Ajouter des styles spécifiques si nécessaire */
}

.admin-comment .reply a {
    /* Ajouter des styles spécifiques si nécessaire */
}

.admin-comment .reply a:hover {
    /* Ajouter des styles spécifiques si nécessaire */
}

/* =========================
   Styles pour le formulaire de commentaire
   ========================= */

/* Style du conteneur du formulaire de commentaire */
#respond {
    background-color: #f8f8f8; /* Même couleur de fond que le corps du commentaire */
    padding: 35px;
    margin-top: 4em;
    border-radius: 0.5em;
}

/* Titre de la section "Participer" */
#respond .comment-reply-title {
    color: #009592; /* Même couleur que les titres de commentaires */
    font-size: 1.5rem;
    font-weight: bold;
    margin-bottom: 15px;
}

/* Style du champ de texte pour le commentaire */
#respond textarea {
    background-color: #ffffff;
    border: 1px solid #dee2e6;
    border-radius: 0.25em;
    padding: 15px;
    width: 100%;
    height: auto;
    font-size: 1rem;
    line-height: 1.5;
    margin-bottom: 15px;
}

/* Style des champs Nom et Email */
#respond input[type="text"],
#respond input[type="email"] {
    background-color: #ffffff;
    border: 1px solid #dee2e6;
    border-radius: 0.25em;
    padding: 10px;
    width: 100%;
    font-size: 1rem;
    line-height: 1.5;
    margin-bottom: 15px;
    margin-top: 10px;
}

/* Bouton de soumission */
#respond .form-submit .btn {
    background-color: #009592;
    border-color: #009592;
    color: white;
    padding: 10px 20px;
    border-radius: 0.25em;
    font-size: 1rem;
}

#respond .form-submit .btn:hover {
    background-color: #007f7a;
    border-color: #007f7a;
    color: white;
}

/* Icônes avant les labels */
#respond label i {
    margin-right: 5px;
    color: #009592; /* Même couleur que les autres icônes */
}

/* Style personnalisé pour le titre de réponse */
.comment-reply-title {
    font-weight: bold; /* Mettre en gras */
    color: #009592; /* Couleur personnalisée */
    margin-bottom: 1rem; /* Espacement en dessous */
    padding-bottom: 0.5rem; /* Espacement interne */
}

/* Lien pour annuler la réponse */
#cancel-comment-reply-link {
    font-size: 0.8em;
    display: block; /* Affiche le lien en dessous du champ commentaire */
    margin-top: 15px; /* Espace au-dessus du lien */
    color: #6c757d; /* Couleur gris pour correspondre au style Bootstrap */
}

#cancel-comment-reply-link:hover {
    text-decoration: underline;
}

/* =========================
   Styles pour la pagination
   ========================= */

/* Exclusion des icônes pour la pagination */
.pagination-nav ul.pagination li::before {
    content: none !important; /* Empêche l'apparition des icônes dans les éléments li de la pagination */
}

/* Suppression du pseudo-élément ::after pour le titre des commentaires */
#comments h2::after {
    content: none !important;
}

/**** Personnalisation des tableaux */
#post-content table th,
table {
border-collapse: collapse;
margin-bottom:0.75em;
}
table th,
table td {
border: 1px solid #dee2e6!important;
padding:0.5em!important;
}
thead {
background-color: #009592!important;
color: white;
text-align:center;
}
thead:hover {
color: black;
}
table tr:nth-child(even) {
background-color: #f2f2f2;
}
table tr:hover {
background-color: #ddd;
}
.wp-block-table thead {border:none!important;}
.table>thead {
vertical-align: middle!important;}
@media screen and (max-width: 767px) {
  table {
    display: block;
    position: relative;
    width: 100%;
    overflow-x: scroll;
}
  table thead {
    display: none;
  }
  table tr {
    display: flex;
    flex-direction: column;
    margin-bottom: 10px;
    border-bottom: 1px solid #dee2e6;
  }
  table td,
  table th {
    display: block;
    text-align: left;
  }
  table td::before,
  table th::before {
    content: attr(data-label);
    font-weight: bold;
    display: inline-block;
    width: 100%;
    margin-right: 10px;
    text-transform: capitalize;
  }
}
.checkbox-col {width: 20%!important; vertical-align:middle;}

/* Personnalisation de certaines icônes */
.bi-filetype-pdf {
  font-size: 1.5em;
  color: red; 
}
.bi-filetype-doc {
  font-size: 1.5em;
  color: blue; 
}
.bi-filetype-xls {
  font-size: 1.5em;
  color: green;
}
.bi-file-image {
  font-size: 1.5em;
  color: orange;
}
.bi-file-earmark {
  font-size: 1.5em;
  color: gray; 
}
/* Responsive tables (Bootstrap 5) */
.table-responsive {
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.table-responsive > table {
  width: 100%;
  margin-bottom: 2em;
}
/***** Opacité au survol des images cliquables */
.wp-block-image a {
position: relative;
display: inline-block;
font-style:normal;
}

.wp-block-image a img {
display: block;
}

.wp-block-image a::before {
content: "\F132";
font-family: "bootstrap-icons";
font-weight: 600;
font-size: 2rem;
color: #13493f;
opacity: 0;
transition: opacity 0.3s ease-in-out;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

.wp-block-image a:hover::before {
opacity: 1;
}

.wp-block-image a:hover {
opacity: 0.7;
}

/**** Personnalisation des citations */
.wp-block-quote {
font-style: italic;
font-size: 1.25rem;
line-height: 1.5;
color: #333;
border-left: 4px solid #fbd22b;
padding-left: 1rem;
margin-left: 0;
margin-top: 2em;
margin-bottom: 2em;
}

cite {
font-size: 0.8em;
color: black;
margin-bottom:0.8em;
}
/**** Personnalisation du calendrier */
#wp-calendar {
border-collapse: collapse;
margin: 1rem 0;
}

#wp-calendar th {
font-weight: bold;
text-align: center;
color: #fff;
background-color: #13493f;
padding: 0.5rem;
border: 1px solid #13493f;
}

#wp-calendar td {
text-align: center;
vertical-align: middle;
padding: 0.25rem;
border: 1px solid #13493f;
}

#wp-calendar td a {
display: block;
color: #13493f;
text-decoration: none;
}

#wp-calendar td a:hover {
color: #009592;
}

#wp-calendar td.today {
background-color: #009592;
}

#wp-calendar td.has-events a {
color: #fff;
background-color: #fbd22b;
}
/* Correspond à la barre de séparation */
.wp-block-separator {
border-image: linear-gradient(
to left,
rgba(76, 140, 74, 1),
rgba(27, 106, 165, 0.8),
rgba(75, 157, 76, 1),
rgba(245, 199, 26, 1)
)
1;margin-top:2em; margin-bottom:2em;
} 
/********** Personnalisation de la page plan du site*/
#page-sitemap-custom a{color:#212529!important;text-decoration:underline;}
#page-sitemap-custom a:hover{text-decoration:none;}
#page-sitemap-custom h3 {
    font-style: normal;
    margin-top: 1em;
    background-color: #F5F5F5;
    padding: 10px;
    border-radius: 5px;}
#page-sitemap-custom h4
 {font-style:normal;
 margin-top:1em;
 font-size:1em;
}
#s {
    padding: 0.5em;
}
.page-sitemap-custom-articles {margin-left:5em;}


/************ Personnalisation de Bootstrap */
/* La classe card correspond aux encarts sous forme de cadre. Cette classe provient de Bootstrap */
.card {
transition: transform 0.1s ease-in-out, background-color 0.1s ease-in-out;
-webkit-box-shadow: -2px 5px 13px -9px #000000;
box-shadow: -2px 5px 13px -9px #000000;
border:0!important;
border-radius:0!important;
}
#category .card-link p {
    color: #212529; /* le !important peut être nécessaire si d'autres styles CSS sont en conflit */
}
.card-header-custom:hover {
    opacity: 0.7;
}
.card-header-custom {
   height: 170px;
    display: flex;
    flex-direction: column;
    justify-content: center; /* Centre les éléments verticalement */
	padding:1em;
	  border-top-left-radius: 0.2em;
  border-top-right-radius: 0.2em;
}
.card-header-custom h3, .card-header-custom i {
    margin: 0;
    padding: 0;
}
.card-body a {text-decoration:none;}
.card-body-category {display: flex; font-size:1.2em; flex-direction: column;justify-content: center;}
.card-img-top {}
.card-title {
font-weight: bold;
font-size: 1.2em;
padding:0;
}
#post-content h5.card-title {font-size:0.8em;font-style:normal;}
.card-img-top:hover {
opacity: 0.7;
}
#category .card:hover {
    transform: scale(1.02);
}
.card:hover .bi {

    opacity: 0.7;
}
.card-img-top:active {
}
.img-fluid {height:10em!important;}

.nav-link {color:#009592!important}
.btn-link {color:#009592!important}

/* Personalisation des tooltips dans les tableaux */
thead th .bi-info-circle-fill {
    color: white; 
    font-size: 0.85em;
    margin-left: 5px;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); /* effet d'ombre */
}
/* Personnalisation des accordéons, en lien avec le plugin Bootstrap Functions */
.accordion .accordion-item:first-child .accordion-button.no-highlight.collapsed {
    background-color: white!important; 
	color:#202327!important;
}
/* La i est utilisée pour les icônes de Bootstrap */
i {

}
/* La classe btn-primary correspond aux boutons d'envoi */
.btn-primary {
background-color: #009592 !important;
border-color: #009592 !important;
color: #fff !important;
}
.btn-primary:hover {
background-color: #007d75 !important;
border-color: #007d75 !important;
color: #fff !important;
}
.btn-primary:active {
background-color: #009592 !important;
border-color: #009592 !important;
color: #fff !important;
}
.btn-info {color:#fff!important;}


/* La classe btn-custom-color correspond aux boutons en front-page */
.btn-custom-color-0 { background-color: #0c2a22!important; border:0 !important;padding-left: 3em !important; padding-right: 3em !important; padding-top: 0.5em !important; padding-bottom: 0.5em !important;} /* couleur pour l'index 0 */
.btn-custom-color-1 { background-color: #00484a!important; border:0 !important;padding-left: 3em !important; padding-right: 3em !important; padding-top: 0.5em !important; padding-bottom: 0.5em !important;} /* couleur pour l'index 1 */
.btn-custom-color-2 { background-color: #65831c!important;border:0 !important;padding-left: 3em !important; padding-right: 3em !important; padding-top: 0.5em !important; padding-bottom: 0.5em !important;} /* couleur pour l'index 2 */
.btn-custom-color-3 { background-color: #d8ab14!important;border:0 !important;padding-left: 3em !important; padding-right: 3em !important; padding-top: 0.5em !important; padding-bottom: 0.5em !important;} /* couleur pour l'index 3 */
.btn-custom-color-4 { background-color: #009592!important;border:0 !important;padding-left: 3em !important; padding-right: 3em !important; padding-top: 0.5em !important; padding-bottom: 0.5em !important;} /* couleur pour l'index 4 */
.btn-custom-color-0:hover { background-color: #0a231d !important; } /* Légèrement plus foncé pour l'index 0 */
.btn-custom-color-1:hover { background-color: #00373a !important; } /* Légèrement plus foncé pour l'index 1 */
.btn-custom-color-2:hover { background-color: #526816 !important; } /* Légèrement plus foncé pour l'index 2 */
.btn-custom-color-3:hover { background-color: #b29012 !important; } /* Légèrement plus foncé pour l'index 3 */
.btn-custom-color-4:hover { background-color: #007876 !important; } /* Légèrement plus foncé pour l'index 4 */


.input-group .input-group-text {background-color: #009592;
  color: #fff;
}
.alert-info .btn-lg {
  margin-top: 1.5em;
  font-size: 0.95em;
}

.modal-title {font-style:normal!important;text-align:center;}
/* Un padding pour les formulaires */
.form-group  {margin-bottom:0.5em;}
/* On personnalise les pages de connexion - s'effectue en lien avec functions.php */
.logo-page-gauche{
width:400px;
margin-bottom: 25px;	
}
.login-form input[type="text"],input[type="password"] {padding:0.4em;  background-color: #F3F3F3; color: #333;border: 1px solid #CCC; width: 100%; margin-bottom: 1rem;}
.text-effect {visibility: hidden;}
.text-effect.animate {
  visibility: visible;
  animation: text-anim 1s ease-out;
}

@keyframes text-anim {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.login-password {padding:0; margin:0;}
.lost-password {}
/* Couleur de fond et de texte pour les éléments de pagination non actifs et non survolés */
.pagination .page-link {
    color: #13493F;
}
/* Couleur de fond et de texte pour les éléments de pagination survolés */
.pagination .page-link:hover {
    background-color: #009592;
    color: #ffffff;
}
/* Couleur de fond et de texte pour l'élément de pagination actif */
.pagination .page-item.active .page-link {
    background-color: #009592;
    border-color: #009592;
    color: #ffffff;
}
/* Couleur de fond et de texte pour les éléments de pagination désactivés */
.pagination .page-item.disabled .page-link {
	color: #6c757d;
}
.accordion {margin-bottom:2em!important;}
.accordion-header {padding:0!important;margin:0!important;}
.accordion-item:first-of-type .accordion-button {background-color:#009592;}
.accordion-item:first-of-type .accordion-button {color:white!important;}
.accordion-button:not(.collapsed) {background-color:#009592!important;color:white!important}
.accordion-button::after {
  filter: invert(1) hue-rotate(-90deg);
}
.accordion-button:not(.collapsed)::after {
  filter: invert(1) hue-rotate(-90deg) brightness(2);
}
.accordion-button {font-size:0.75em!important;}
.container-fluid{
overflow: hidden;
}


/********** Style pour les plugins de la suite ADSTrack */
/*** ADSTrackCart@ds */
/* Style pour les phases d'instruction */
.attente-abf {
  background-color: #AACDFF!important;
}

.arrete-transmis {
  background-color: #FFE4B2!important;
}

.attente-consultation {
  background-color: #8EE2DA!important;
}

.dossier-clos {
  background-color: #AEEBB2!important;
}

.attente-de-pieces {
  background-color: #FFA6A1!important;
}

.transmis-en-ddt {
  background-color: #C4C4C4!important;
}

.instruction-en-cours {
  background-color: #F0B6FF!important;
}
.color-date-envoi {
  background-color: #FFA6A1!important;  /* Changez la couleur comme vous le souhaitez */
}

.color-avis {
  background-color: #AEEBB2!important;  /* Changez la couleur comme vous le souhaitez */
}


/* Notification en bas de page lorsqu'un élément est supprimé ou sauvegardé */
.toast {
  min-width: 200px;
  background-color: #f1f1f1;
  border: 1px solid #ccc;
  border-radius: 5px;
  box-shadow: 0 0 5px rgba(0,0,0,0.2);
  overflow: hidden;
}
/* Les cercles qui indiquent les étapes d'instruction dans le suivi de dossier usager */
.etape-circle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 20px;
    flex-shrink: 0;
    opacity: 0;
    transform: translateY(50px);
    animation: bubbleUp 2s forwards;
  }
  @keyframes bubbleUp {
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
.etape-desc {
        flex-grow: 1;
    }

/*** Style pour les tableaux de suivi*/
#post-content .dataTables_wrapper .dataTables_paginate ul.pagination li::before {
  content: "";
  font-family: inherit;
  display: inline;
  margin-right: 0;
  margin-left: 0;
  font-size: inherit;
  line-height: inherit;
}
.table-wrapper {
    margin-left: auto;
    margin-right: auto;
    max-width: 90%;
}
#cartads-tableau {font-size:0.75em;}
#adstrackare-table {font-size:0.8em;}
.adstrackservice-formulaire {font-size:0.95em;}
#adstrackservice-tableau {font-size:0.8em;}
.etape-cartads-tableau {width:260px;}
.numero-cartads-tableau {width:210px;}
.type-cartads-tableau {width:120px;}
#adstracksve-tableau {font-size:0.8em;}
#adstracksve-tableau th {
white-space: nowrap;}
.attachment-container {
    overflow: hidden;
    text-overflow: ellipsis;
	margin:auto;
	text-align:center;
}
#adstrackcommunes-tableau th {
white-space: nowrap;}
#adstrackcommunes-tableau {font-size:0.8em;}
#cartads-tableau .modal .form-select {font-size: 0.9em;}


/*** Style pour la page de saisine par voie électronique */
.typedossierdetails {display:none!important;}


/*** Style pour les téléchargements depuis ADSTrackService*/
#adstrackservice-dl h3 {margin-bottom:2em!important;}
@keyframes fadeInOut {
    0% { opacity: 0; }
    50% { opacity: 1; }
    100% { opacity: 0; }
}

@keyframes colorChange {
    0%, 100% {
        color: #fff; /* couleur initiale de l'icône */
    }
    50% {
        color: #a52a2a; /* couleur cible au milieu de l'animation */
    }
}
#adstrackservice-dl .bi-envelope-exclamation {
    animation: colorChange 2s infinite;
    font-size: 1.5em; /* Ajustez la taille de l'icône selon vos préférences */
    vertical-align: middle; /* Alignement vertical avec le texte */
}
#adstrackservice-dl {margin-top:8em;}

#adstrackservice-dl .btn-lg {
    font-size: 1.2em; 
    line-height: 1.8; 
    padding: 1em 2.4em; /* padding-top/bottom padding-right/left */
}

/*** Style pour les téléchargements depuis ADSTrackSVE*/
#adstracksve-dl .bi-send-exclamation { animation: colorChange 2s infinite;
font-size: 2em; 
vertical-align: middle; }
#adstracksve-dl {margin-top:8em;}

/*ADSTrackSVE - pour augmenter les dimensions des PDF soumis*/
.custom-pdf-embed { 
  height: 600px;
  width:100%;
  margin:auto;
  text-align:center;}
.modal-adstracksve {padding:3em!important;color:black;font-size:0.95em;}
.modal-adstracksve h2 {margin-bottom:0.5em!important;font-size:1.15em;}
.modal-adstracksve h3 {margin-bottom:0.5em!important;font-size:1.1em;}
.modal-adstracksve h4 {margin-bottom:0.5em!important;font-size:0.95em;}

/* Animation for the checkbox des cases à cocher d'ADSTrackSVE */
.checkbox-animated {
  transition: transform 0.2s ease-in-out, background-color 0.2s ease-in-out;
}

.checkbox-animated:checked {
  transform: scale(1.2);
  background-color: #007bff; /* Change the background color when checked */
}

.checkbox-animated:checked::after {
  content: '';
  animation: resetScale 0.2s ease-in-out 0.2s forwards;
}

@keyframes resetScale {
  to {
    transform: scale(1);
  }
}
/* Styles pour rendre les étapes cliquables */
.progress-step {
    cursor: pointer;
    position: relative;
    text-decoration: none;
}
/* Surlignement pour les étapes complétées */
.progress-step.completed {
    text-decoration: underline;
}
/* Changement de couleur au survol des étapes complétées */
.progress-step.completed:hover {
    color: #007bff;
}





/*ADSTrackConsultations - modal des consultations */
#servicesModal {font-size:0.85em;}
.bold-label-services {
    font-weight: bold;
	color:#dc3545 !important;
}


/*ADSTrackConsultations - tableau de suivi */
#adstrackconsultation-table {width:auto!important;font-size:0.8em;}
#post-content-suivi-consultations {background-color: white;
box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.1);
border-radius: 0.1em;
margin-bottom: 2em;
padding-left: 0.5em;
padding-right: 0.5em;
padding-bottom: 5em;
padding-top: 2em;
flex: 1;}
.badge-larger-consultations {
    font-size: 1em!important; 
}
#adstrackconsultation-table th, 
#adstrackconsultation-table td {
    vertical-align: middle; 
}
#post-content li.consultations   {margin-top:0!important; margin-bottom:0!important;}


 /*Personnalisation de la table des matières du plugin - voir également dans le fichier PHP du plugin*/
.toc-content {padding-left: 2em; border-left: 0.2em dotted #e8e8e8;}
#toc button {display: none;}

@media screen and (max-width: 767px) {
.toc-content {border-left: none; padding-left: 0;}
.toc-title,.toc-subtitle {display: none;}
}

@media (max-width: 767px) {
    #toc button {
        display: block;
    }
}



/* ADSTrackMessages */
/*ADSTrackMessages - augmenter la hauteur de l'éditeur TinyMCE du générateur de PDF */
#pdf_content_ifr { /* Cible l'iframe générée par TinyMCE pour l'éditeur 'pdf_content' */
    height: 500px !important; /* Définir la hauteur souhaitée */
}

.tox .tox-editor-container { /* Container global de l'éditeur TinyMCE */
    height: 520px !important; /* Slightly more than the iframe to accommodate toolbars */
}
/* Personnalisation de l'accordéon */



#toolsAccordion .accordion-button:not(.collapsed) {
    background-color: #d6d8db !important; /* Un gris nuancé et élégant pour l'état ouvert */
    color: #343a40 !important; /* Couleur de la police sombre et élégante pour contraster avec le fond gris clair */
    font-weight: bold !important; /* Rend la police un peu plus visible et élégante */
}

#toolsAccordion .accordion-button {
    background-color: #f8f9fa !important; /* Un gris légèrement plus clair pour l'état collapsed */
    color: #495057 !important; /* Couleur de la police légèrement plus foncée pour rester lisible et élégante */
    font-weight: normal !important; /* Police normale pour l'état fermé */
}

#adstrackmessages-tableau_wrapper {font-size:0.85em;}
#post-content #adstrackmessages-tableau img {
    max-width: 50% !important; /* Limite la largeur de l'image à celle de la cellule */
    height: auto; /* Garde le ratio d'origine */
    display: block; /* Évite les espaces supplémentaires dans les cellules */
	margin-top:20px;
}
#post-content #adstrackmessages-tableau td a {
    max-width: 100px; /* Limite la largeur maximale des liens */
    display: inline-block; /* Permet l’application de text-overflow */
    overflow: hidden; /* Cache le texte excédentaire */
    white-space: nowrap; /* Empêche le retour à la ligne */
    text-overflow: ellipsis; /* Ajoute des points de suspension pour le texte trop long */
    vertical-align: middle; /* Aligne verticalement au centre */
}
.no-signature-content {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.no-signature-text {
    font-size: 1.2em; /* Agrandir le texte */
    color: #6c757d; /* Couleur grise douce */
    margin-bottom: 10px;
}

.no-signature-icon {
    font-size: 7em; /* Agrandir l'icône */
    color: #b7b7b7; /* Rouge pour l'icône */
}
.signature-card {
    transition: transform 0.2s ease-in-out;
}

.signature-card:hover {
    transform: scale(1.02);
}



 /********* Autres CSS personnalisés */
 /*Tableau des couleurs RAL de l'article sur les menuiseries */
.ral-color {
  display: inline-block;
  margin-right: 5px;
  margin-bottom: 2px;
}
/*Mise en forme pour les images en lien vers Intragéo */
.image-sig {
max-width: 500px; 
margin: auto;  
border: 1px solid #ddd;
border-radius: 4px;  
padding: 5px; 
-webkit-box-shadow: -1px 19px 4px -10px rgba(0,0,0,0.17); 
box-shadow: -1px 19px 4px -10px rgba(0,0,0,0.17);
margin-bottom: 2em;
}

/******************************* Ajustements pour le responsive des smartphones */


@media (min-width: 1200.1px) and (max-width: 1320px) {
}
@media (max-width: 1200px) {
	.bords-longs
{
padding-left: 0;
padding-right: 0;
padding-bottom: 0;
padding-top: 0;

}
}


@media (max-width: 1200px) {
.nav-item .dropdown-menu {margin-left:2.1em;margin-bottom:0.5em;box-shadow:none;border:none;}
}

@media (max-width: 991.98px) {
.menu-item::after {background: none;}
#presentation h1 {font-size:1.75em!important;line-height: 1.6em!important;margin-top:4em!important;}
.menu-item-124 a {}
.img-front-page {display:none!important;}
#front-page-elements h2 {font-size:1.2em!important;}
#front-page-elements p {font-size:0.8em!important;}
.card-body-category {font-size:1em!important;}
#footer .wp-block-image,
#footer .wp-block-image img {max-width: 70%;margin-left: auto;margin-right: auto ;}
.logo-page-gauche {width:250px!important;}
.login h2 {font-size: 1.5em;}
.login-form p {font-size: 0.8em!important;}
#logo-presentation img {width:220px;}
}

@media (max-width: 768px) {
body {margin-top:2em!important;background-image: none;}
#presentation h1 {font-size:1.75em!important;line-height: 1.6em!important;margin-top:2em!important;}
#post-content {
padding-left: 0.2em;
padding-right: 0.2em;
padding-top:0;
padding-bottom: 0.5em;
box-shadow:none;
}
/*Affichage du modal en responsive */
  [data-bs-toggle="modal"] {
    position: relative;
    z-index: 1040; /* juste en dessous du modal */
    pointer-events: auto;
  }

  .modal-backdrop.show {
    z-index: 1050 !important;
  }

  .modal.show {
    z-index: 1055 !important;
  }

.nav-link {margin-bottom:0.6em;}
#adstracksve-formulaire #formCarousel {
        touch-action: none; /* Désactive les gestes tactiles comme le swipe */
        pointer-events: none; /* Désactive toute interaction pointer, y compris le swipe */
    }

    #adstracksve-formulaire #formCarousel .carousel-inner {
        overflow-x: hidden; /* Cache toute tentative de scroll horizontal */
        scroll-snap-type: none; /* Désactive tout snapping sur mobile */
    }

    /* Réactiver les interactions pointer sur les éléments de formulaire pour la saisie */
    #adstracksve-formulaire input,
    #adstracksve-formulaire select,
    #adstracksve-formulaire textarea,
    #adstracksve-formulaire button {
        pointer-events: auto;
    }

 #adstracksve-formulaire .progress {
        display: none; /* Masque la barre de progression sur mobile */
    }


}

@media (max-width: 480px) {
#logo-presentation img {width:190px;}
#widget-area-1{border-right:none;}
.front-page-image {border:none!important;text-align:center!important;margin:auto!important;}
.appear {
        /*opacity: 1 !important; /* rendre l'élément totalement opaque */
		/* transform: translateY(0) !important; /* annuler la transformation */
		/*  animation: none !important; /* désactiver l'animation */
		}
#presentation h1 {font-size:1.6em!important;line-height: 1.6em!important;margin-top:3em!important;}
#presentation img {min-width:15em!important;}
#front-page-category h2 {font-size: 2em!important;}
#front-page-category h3  {font-size:1.2em!important;}
#front-page-description {font-size:1em!important;}
.page-header {padding-bottom: 3em!important; padding-top:6em!important;}
.card-title {font-size: 1.1em!important;}
#post-content {font-size:1em!important;}
#footer {font-size:0.82em!important;}
.footer-bottom {font-size:0.8em!important;text-align: center!important;}
.card-body {padding:0.7em!important;}
.btn-primary {font-size: 85%!important; padding: .375rem .75rem!important;color:white!important;}
.btn-secondary {font-size: 85%!important; padding: .375rem .75rem!important;color:white!important;}
}


/**************** CSS pour l'impression */
@media print
{
body {color-adjust: exact !important; -webkit-print-color-adjust: exact !important; color: black; font-size:12px!important;margin:0!important;padding:0!important;}
.navbar-toggler {display: none!important;}
.navbar {position:relative!important;}
.navbar-brand .large-logo {display: block!important; margin:0!important;padding:0!important;}
.navbar-brand {margin:0!important;padding:0!important;}
#bs-example-navbar-collapse-1 {display:none!important;}
nav {box-shadow:none!important;}
nav .breadcrumb {display:none!important;}
.upper-navbar {-webkit-box-shadow: none!important;box-shadow: none!important;}
#toc {line-height:1em!important;top:0!important;}
.toc-title {display:none!important;}
.toc-subtitle {font-size:1.3em!important;font-weight:normal!important;line-height:1.2em!important;}
.reading-time {display:none!important;}
.list-group-item {padding:0!important;margin-bottom:6px!important;}
#toc button {display:none!important;}
.active-heading {font-weight:normal!important;}
.progress-overlay {display:none!important;}
.menu-test {display:none;}
.toc-content {padding:0!important;margin:0!important; border:none!important;}
.page-header .overlay {display:none!important;}
#presentation {background-image:none!important;}
.page-header {padding:0!important;margin:0!important;background-image:none!important;}
.page-header h1 {color:#009592;text-shadow:none;font-weight: 200;padding:0;margin:0!important;position:relative!important;}
#post-content {box-shadow:none;margin:0!important;padding:0!important;}
#post-content img {max-width: 180pt; max-height: 180pt; width: auto; height: auto;}
.collapse:not(.show) {display: block !important;height: auto !important;visibility: visible !important;}
footer {display:none;}
#post-content h2 {margin:0!important;padding:0!important;}
}