/* 1. Force le texte des options Select2 en noir par défaut */
.select2-container--default .select2-results__option {
    color: #333333 !important; /* Couleur sombre pour être visible sur fond blanc */
}

/* 2. Assure que le texte redevient blanc uniquement lors du survol (Hover) */
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option[aria-selected="true"] {
    color: #ffffff !important; /* Reste blanc sur le fond bleu du survol */
}

/* 3. Optionnel : Si vous utilisez la recherche (champ de saisie dans le menu déroulant) */
.select2-container--open .select2-search__field {
    color: #333333 !important;
    background-color: #ffffff !important;
}

/* 1. Gestion de la largeur et alignement du texte */
.select2-container {
    width: 100% !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-right: 45px !important; /* Espace pour le X et la flèche */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* 2. Alignement et séparation des boutons à droite */
.select2-container--default .select2-selection--single .select2-selection__arrow {
    right: 8px !important;
}

.ar .select2-container--default .select2-selection--single .select2-selection__clear {
    position: absolute !important;
    left: 30px !important; /* Place le X juste à gauche de la flèche */
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: none !important;
    border: none !important;
    font-weight: bold;
}

.fr .select2-container--default .select2-selection--single .select2-selection__clear {
    position: absolute !important;
    right: 30px !important; /* Place le X juste à gauche de la flèche */
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: none !important;
    border: none !important;
    font-weight: bold;
}



/* Moderniser le bloc principal */
.select2-container--default .select2-selection--single {
    border: 1px solid #e2e8f0 !important; /* Bordure grise moderne */
    border-radius: 6px !important;        /* Coins arrondis */
    height: 40px !important;               /* Plus grand, plus respirant */
    padding: 5px !important;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

/* Aligner le texte au centre verticalement */
.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 28px !important;
    color: #1e293b !important; /* Texte plus sombre, moins agressif */
}

/* Moderniser la flèche de droite */
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 38px !important;
}

/* Effet au Focus (quand on clique dessus) */
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: #3b82f6 !important; /* Bleu moderne (style Tailwind) */
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15) !important;
}

/* Styliser le menu déroulant (la liste) */
.select2-dropdown {
    border: 1px solid #e2e8f0 !important;
    border-radius: 6px !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1) !important;
}


/* Amiri */
@font-face {
  font-family: 'Amiri';
  font-style: normal;
  font-weight: normal;
  src: url('../fonts/Amiri-Regular.ttf') format('truetype');
}

/* Droid Arabic Naskh */
@font-face {
  font-family: 'Droid Arabic Naskh';
  font-style: normal;
  font-weight: normal;
  src: url('../fonts/droid-arabic-naskh.woff') format('woff');
}

/* Lateef */
@font-face {
  font-family: 'Lateef';
  font-style: normal;
  font-weight: normal;
  src: url('../fonts/Lateef-Regular.ttf') format('truetype');
}

/* Scheherazade */
@font-face {
  font-family: 'Scheherazade';
  font-style: normal;
  font-weight: normal;
  src: url('../fonts/ScheherazadeNew-Regular.ttf') format('truetype');
}

/* Thabit */
@font-face {
  font-family: 'Thabit';
  font-style: normal;
  font-weight: normal;
  src: url('../fonts/thabit.ttf') format('truetype');
}




/******** Style input-group-addon ar ********/
[dir="rtl"] .input-group-addon:not(:last-child){
  border-right: 1px solid rgba(0,0,0,.15);
  border-left: 0;
}
.ar {font-family: 'Droid Arabic Naskh'!important;}
#services-publics h2 {
  font-family: Arial, sans-serif;
  font-size: 20px;
  color: #004080; /* bleu institutionnel */
  margin-bottom: 15px;
  border-bottom: 2px solid #004080;
  padding-bottom: 5px;
}
#services-publics {
  width: 100%;
  background-color: #f5f5f5; /* gris clair institutionnel */
  padding: 20px;
  box-sizing: border-box;
  border-top: 3px solid #004080; /* bleu foncé sobre */
  border-bottom: 3px solid #004080;
}

#services-publics ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

#services-publics li {
  font-family: Arial, sans-serif;
  font-size: 16px;
  padding: 10px 0;
  border-bottom: 1px solid #ddd;
}

#services-publics li:last-child {
  border-bottom: none;
}
@media (min-width: 768px) {
.btn {
    white-space: normal;
    width: 165px;
    border-radius: 15px;
    font-size: 11px;
}
}

#myTa, #myTa th, #myTa td {font-family: amiri;font-size: 18px!important;direction:rtl;color:#000}

[dir="rtl"] .input-group .form-control:not(:last-child),
[dir="rtl"] .input-group-addon:not(:last-child),
[dir="rtl"] .input-group-btn:not(:first-child)>.btn-group:not(:last-child)>.btn,
[dir="rtl"] .input-group-btn:not(:first-child)>.btn:not(:last-child):not(.dropdown-toggle),
[dir="rtl"] .input-group-btn:not(:last-child)>.btn,
[dir="rtl"] .input-group-btn:not(:last-child)>.btn-group>.btn,
[dir="rtl"] .input-group-btn:not(:last-child)>.dropdown-toggle{
  border-bottom-right-radius: .25rem;
  border-top-right-radius: .25rem;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}

[dir="rtl"] .input-group .form-control:not(:first-child),
[dir="rtl"] .input-group-addon:not(:first-child),
[dir="rtl"] .input-group-btn:not(:first-child)>.btn,
[dir="rtl"] .input-group-btn:not(:first-child)>.btn-group>.btn,
[dir="rtl"] .input-group-btn:not(:first-child)>.dropdown-toggle,
[dir="rtl"] .input-group-btn:not(:last-child)>.btn-group:not(:first-child)>.btn,
[dir="rtl"] .input-group-btn:not(:last-child)>.btn:not(:first-child){
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
  border-bottom-left-radius: .25rem;
  border-top-left-radius: .25rem;
  border-left: 1px solid rgba(0,0,0,.15);
}

[dir="rtl"] .form-control + .input-group-addon:not(:first-child){
  border-left: 1px solid rgba(0,0,0,.15);
  border-right: 0;
}

[dir="rtl"] .input-group .form-control:not(:first-child):not(:last-child),
[dir="rtl"] .input-group .input-group-addon:not(:first-child):not(:last-child){
  border-radius: 0;
}

/******** ********/




.customers {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 80%;
	border: solid;
	border-color: #3f7a8d;
}

.customers td, .customers th {
    border: 1px solid #ddd;
    padding: 8px;
}

.customers tr:nth-child(even){background-color: #f2f2f2;}

.customers tr:hover {background-color: #ddd;}

.customers td {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #fff;
    color: black;
}



#myInputc, #myInputc_resqul,#myInputc_resagr, #myInputcMD,#myInputcMDR, #myInputcQU , #myInputcSER{
  background-image: url('../img/searchicon.png');
  background-position: 10px 10px;
  background-repeat: no-repeat;
  width: 100%;
  font-size: 16px;
  padding: 12px 20px 12px 40px;
  border: 1px solid #ddd;
  margin-bottom: 12px;
}






#myTablec {
  border-collapse: collapse;
  /* width: 100%;*/
  border: 1px solid #ddd;
  font-size: 18px;
}

#myTablec th, #myTablec td {
  text-align: left;
  padding: 6px;
}

#myTablec tr {
  border-bottom: 1px solid #262424; /* #ddd;*/
}

#myTablec tr.header, #myTablec tr:hover {
  background-color: #f1f1f1;
}



#myTablec_resqul {
  border-collapse: collapse;
  /* width: 100%;*/
  border: 1px solid #ddd;
  font-size: 18px;
}

#myTablec_resqul th, #myTablec_resqul td {
  text-align: center;
  padding: 6px;
}

#myTablec_resqul tr {
  border-bottom: 1px solid #262424; /* #ddd;*/
}

#myTablec_resqul tr.header, #myTablec_resqul tr:hover {
  background-color: #f1f1f1;
}

#myTablec_resagr {
  border-collapse: collapse;
  /* width: 100%;*/
  border: 1px solid #ddd;
  font-size: 18px;
}

#myTablec_resagr th, #myTablec_resagr td {
  text-align: center;
  padding: 6px;
}

#myTablec_resagr tr {
  border-bottom: 1px solid #262424; /* #ddd;*/
}

#myTablec_resagr tr.header, #myTablec_resagr tr:hover {
  background-color: #f1f1f1;
}


#myTablecQU {
  border-collapse: collapse;
  /* width: 100%;*/
  border: 1px solid #ddd;
  font-size: 18px;
}

#myTablecQU th, #myTablec td {
  text-align: left;
  padding: 6px;
}

#myTablecQU tr {
  border-bottom: 1px solid #262424; /* #ddd;*/
}

#myTablecQU tr.header, #myTablecQU tr:hover {
  background-color: #f1f1f1;
}




#myTablecMD {
  border-collapse: collapse;
  /* width: 100%;*/
  border: 1px solid #ddd;
  font-size: 18px;
  text-align: center;
}

#myTablecMD th, #myTablecMD td {
  text-align: center;
  padding: 6px;
}

#myTablecMD tr {
  border-bottom: 1px solid #262424; /* #ddd;*/
}

#myTablecMD tr.header, #myTablecMD tr:hover {
  background-color: #f1f1f1;
}





#myTablecMDR {
  border-collapse: collapse;
  /* width: 100%;*/
  border: 1px solid #ddd;
  font-size: 18px;
  text-align: center;
}

#myTablecMDR th, #myTablecMDR td {
  text-align: center;
  padding: 6px;
}

#myTablecMDR tr {
  border-bottom: 1px solid #262424; /* #ddd;*/
}

#myTablecMDR tr.header, #myTablecMDR tr:hover {
  background-color: #f1f1f1;
}

.ligne_r1
{
background-color: #eacced;
}


.ligne_r2
{
background-color: #edebcc;
}

.ligne_r3
{
background-color: #cceded;
}


.align-middle{
	display: flex;
	align-items: center;
}

.modal-smd
{
	max-width: 430px !important;
}

.errorContainer
{
	padding: 20px; 
	min-height: 150px;
	text-align: center;
	vertical-align: center;
}

.authenticate-container
{
	padding: 15px;
}
.authenticate-panel
{
	max-width: 500px;
	margin: auto;
	padding: 15px;
}

.error
{
	color: red;
	padding-bottom: 8px;
	font-size: 12px;
	font-style: italic;
}
.form-error{
	padding-left: 8px;
	padding-top: 5px;
	font-size: 15px !important; 
}

.alert-danger {
    background-color: #F44 !important;
}

.login-head
{
	background-color: #051b35;
	padding: 7px;
	min-height: 40px;
}

.disconnect
{
	float: right;
	margin-right: 20px;
}

.disconnect .fa
{
	font-size: 1.66em;
}


.disconnect .btn {
	font-family: Verdana, Sans-serif;
	font-size: 11px;
	padding: 1px 10px;
	vertical-align: bottom;
}

.user-name
{
	font-weight: bold;
	padding-right: 10px;
}

.copyright-container
{
	background-color: #051b35;
	text-align: center !important;
	padding: 0 50px; 
}


.copyright-border
{
	margin: auto;
	max-width: 700px;
	border-top: 1px solid #fff;
}

.copyright
{
	padding: 15px 0px;
	color: #fff !important;
} 

.nav-link:hover;
{
	border-bottom: 2px solid #f00;
	background-color: #f00;
}

.authentication-panel
{
	min-height: 336px;
    margin-bottom: 20px;
}

.disconnect-container{
	padding-top: 100px;
	text-align: right;
}

.user-name
{
	font-weight: bold;
}

.center
{
	text-align: center;
}
.suivi
{
	padding-top: 20px;
}

.modal-inscription, .modal-suivi
{
	padding:0px !important;
}

.modal-inscription .modal-body, .modal-suivi .modal-body
{
	max-height: 600px !important;
	max-width:600px !important;
}


.modal-suivi
{
	
	max-width:600px !important;
}

.input-label
{
	padding-top: 7px;
}

.captcha-contrainer{
	padding-bottom: 10px;
}

.margin-bottom
{
	margin-bottom: 1em;
}

 .margin-bottom > .input-group
 {
 	margin-bottom: 0px !important;
 }
 .active_t{background: #393d422e;}
 .activation-error{
 	font-size: 15px;
 	color: red;
 	padding: 30px;
 	text-align: center;
 }

 .activation-succes{
 	font-size: 15px;
 	color: green;
 	padding: 30px;
 	text-align: center;
 }

 #msform
 {
 	display: none;
 }

.input-max-width
{
	max-width: 300px;
}

#template1Summary, #step2Summary
{
	display: none;
	margin-bottom: 8px;
	padding:15 10 0 10px;
	background-color: #fff0e4;
	color: #f00; 
	border: 2px solid #f5593d;
	border-radius: 8px;
}

#simulSummary
{
	display: none;
	margin-bottom: 8px;
	padding:15 10 0 10px;
	background-color: #fff0e4;
	color: #f00; 
	border: 2px solid #f5593d;
	border-radius: 8px;
}

.simul-label
{
	font-size:12px;
	
}

#njf-container, #recap-njf-container
{
	display:none;
}
/*
.result{
	color: rgba(255,255,255,0.9) !important;
    border: 1px solid rgba(255,255,255,0.7) !important;
}
*/

.PerPhyMor{
	margin-bottom:10px;
}

.p-3{
	margin-bottom: 2px;
}

/*
.suivi-result
{
	color: rgba(0,106,184,0.7);
    border: 1px solid rgba(0,106,184,0.5);
    padding: 10px;
    border-radius: 20px;
	font-weight: 300;
}
*/
.suivi-value
{
	font-weight: 700;
}

.suivi-lib
{
	font-size: 10px;
	color:#aaa;
	font-style:italic;
}


.multi-steps li{
	margin-bottom: 20px;
}

.underline
{
	text-decoration: underline;
}

.padding
{
padding:10px;
}
.classif
{
font-size:11px;
padding:5px;
border:1px solid #fff;
border-radius:20px;
text-align:center;	

	
}

.fichet
{
font-size:12px;
text-align:center;	

	
}
.classif:hover
{
	color:#1f99d9;
	background-color:#fff;
	
}

#infoportail ,#infotaxi, #infomod78
{
color: #a70909 !important;
font-weight: bold !important;
background: #f7f3fc !important;
padding: 10px !important;
border-radius: 8px !important;
}