/*------------------------------------------------------------------
    27. Map
-------------------------------------------------------------------*/

#map {
  height: 650px;
  z-index: 1;
}

.head_couter{
  height: 42px;
}

.alert-success {
    color: #155724;
    /* background-color: #d4edda; */
    /* border-color: #c3e6cb; */
}

.alert-error {
    color: #b12222;
    /* background-color: #d4edda; */
    /* border-color: #c3e6cb; */
}


/* Personnalisation du popup Leaflet */
/* .leaflet-popup-content-wrapper {
  background: var(--base-color)69;
  color: #ffffff;
  font-weight: 500;
  border-radius: 10px;
  padding: 8px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

.leaflet-popup-content-wrapper:hover {
    background: var(--base-color); 
}

.leaflet-popup-tip {
  background: var(--base-color);
  text-align: center;
}

.leaflet-popup-content {
  margin: 8px 12px;
  font-size: 14px; 
}*/

.topbar {
  z-index: 5;
}

/* .btn-secondary {
  color: #fff;
  background-color: var(--base-color);
  border-color: #541851;
} */

.btn-secondary:hover {
  color: #fff;
  background-color: #5a6268;
  border-color: #545b62;
}


.btn-secondary:hover {
  color: #fff;
  background-color: #a5329f;
  border-color: var(--base-color);
}

.contact_blog {
  min-height: 314px;
  background: #ececec;
}

.counter_no .head_couter {
  color: #fff;
}

.counter_no p.total_no {
  color: #fff;
  font-weight: 600;
}

.text-dark-gray {
  color: var(--dark-gray) !important;
}

.text-white {
  color: #fff !important;
}

.text-base-color {
  color: var(--base-color) !important;
}

.user_img {
  width: 58%;
  height: auto;
  float: right;
}

.user_profle_side {
  display: flex;
  justify-content: center;
}

.icon_info ul.user_profile_dd li>a.text-dark-gray::after {
  color: var(--dark-gray) !important;
}

label {
  color: var(--dark-gray);
}

/* hr {
  margin: 1rem 0;
  color: #d8e2ef;
  color: var(--base-color);
  border: 0;
  border-top: 1px solid;
  opacity: 1;
}
 */
.dropzone .dz-message {
  text-align: center;
  margin: 3em 0;
}

.dropzone.dropzone-multiple .dz-message {
  padding: 4rem 2rem;
  border: 2px dashed #d8e2ef;
  border-color: var(--base-color);
  border-radius: 0.375rem;
}

.dropzone.dz-clickable .dz-message,
.dropzone.dz-clickable .dz-message * {
  cursor: pointer;
}

.dropzone .dz-message {
  position: relative;
  padding: 5rem 2rem;
  margin: 0;
  border: 2px dashed #d8e2ef;
  border-color: var(--base-color);
  border-radius: 0.375rem;
}

.card-header {
  padding: .75rem 1.25rem;
  margin-bottom: 0;
  background-color: rgb(0 0 0 / 6%);
  /* border-bottom: 1px solid rgb(255 237 0); */
}

.form-control {
  background-color: #f5f5f5;
  background-color: #ececec;
}

.form-control:disabled,
.form-control[readonly] {
  /* background-color: #d8d9da; */
  background-color: #e3e5e6;
  opacity: 1;
}


.btn-yellow {
  background-color: var(--yellow) !important;
  border: 1px rgb(231, 224, 47) solid;
  color: var(--dark-gray);
  /* text-transform: uppercase; */
  font-weight: 500;
  /* box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); */
  font-size: 1rem;
}

.btn-base-color {
  background-color: var(--base-color) !important;
  /* border:1px rgb(231, 224, 47) solid; */
  color: #fff;
  /* text-transform: uppercase; */
  font-weight: 500;
  /* box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); */
  font-size: 1rem;
}

.btn-base-color:hover {
  background-color: purple !important;
}

.btn-yellow:hover {
  background-color: yellow !important;
}

.btn.btn-large {
  font-size: 14px;
  padding: 18px 34px;
}

a.forgot {
  /* float: right; */
  margin: 11px 0;
  position: relative;
  left: 0;
  color: var(--blue);
  text-decoration: underline !important;
}

.logo_login::after {
  /* content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute; */
  background: rgb(118 35 115 / 70%);
  background: rgb(118 35 115);
  /* top: 0px;
    left: 0; */
}


.pointer {
  cursor: pointer;
}

.table-results tbody tr:hover {
  background: #f2f2f2;
}

/* Fixe la hauteur du modal */
/* .modal-dialog {
      max-width: 800px;
    } */
.modal-body {
  height: 400px;
  /* hauteur fixe */
  display: flex;
  flex-direction: column;
}

/* zone de résultats avec scroll */
.results-container {
  flex: 1;
  overflow-y: auto;
  border: 1px solid #dee2e6;
  border-radius: 5px;
}

.table-hover tbody tr:hover,
.table-hover tbody tr:focus {
  background-color: #1ed085 !important;
  background-color: #9C27B0 !important;
  color: #fff;
}

.description-truncate {
  display: -webkit-box;
  /* -webkit-line-clamp: 2; */
  /* nombre de lignes max */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  height: 64px;
}

.btn-link {
  padding: 0;
  margin: 0;
  /* text-decoration: underline !important; */
}

.select-overlay {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: #0003;
  z-index: 2;
}

.modal-dialog-scrollable .modal-body {
  overflow-y: auto;
  max-height: calc(100vh - 150px);
}

.form-control {
  color: #0d0910;
}

/* .card {
    border-radius: 12px;
}

.card img {
    width: 80px;
    height: 80px;
    object-fit: cover;
}

.card .badge {
    padding: 6px 10px;
    font-size: 0.75rem;
} */


/* Style optionnel pour l'effet de survol (à placer dans votre fichier CSS principal) */
.hover-lift {
  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

.hover-lift:hover {
  transform: translateY(-5px);
  /* Soulève la carte légèrement */
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important;
  /* Ombre plus prononcée */
}

/* Couleur Primaire : #762372 (Violet Profond) */

/* ---------------------------------------------------------------------- */
/* ÉTAT NORMAL */
/* ---------------------------------------------------------------------- */
.btn-primary {
  color: #fff;
  /* Texte blanc pour un bon contraste */
  background-color: #762372;
  /* Couleur primaire */
  border-color: #762372;
}

/* ---------------------------------------------------------------------- */
/* ÉTAT SURVOL (:hover) */
/* Utilisation d'une couleur légèrement plus foncée ou une ombre portée plus subtile.
   Ici, nous assombrissons légèrement la couleur primaire : #5E1C5B */
/* ---------------------------------------------------------------------- */
.btn-primary:hover {
  color: #fff;
  background-color: #5E1C5B;
  /* Un peu plus foncé que #762372 */
  border-color: #5E1C5B;
}

/* ---------------------------------------------------------------------- */
/* ÉTAT FOCUS (.focus, :focus) */
/* L'ombre doit utiliser la couleur primaire avec une opacité réduite. */
/* ---------------------------------------------------------------------- */
.btn-primary:focus,
.btn-primary.focus {
  /* box-shadow: 0 0 0 0.2rem rgba(R, G, B, 0.5); */
  /* Convertion de #762372 en RGBA(118, 35, 114) */
  box-shadow: 0 0 0 0.2rem rgba(118, 35, 114, 0.5);
}

/* ---------------------------------------------------------------------- */
/* ÉTAT DÉSACTIVÉ (:disabled, .disabled) */
/* Utilisation de la couleur primaire de base, mais avec une opacité réduite ou un filtre gris. */
/* ---------------------------------------------------------------------- */
.btn-primary.disabled,
.btn-primary:disabled {
  color: #fff;
  background-color: #762372;
  border-color: #762372;
  opacity: 0.65;
  /* Rendre le bouton désactivé visiblement inactif */
}

/* ---------------------------------------------------------------------- */
/* ÉTAT ACTIF (actived, :active) */
/* Utilisation d'une couleur encore plus foncée que le hover : #481545 */
/* ---------------------------------------------------------------------- */
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show>.btn-primary.dropdown-toggle {
  color: #fff;
  background-color: #481545;
  /* Plus foncé que le hover */
  border-color: #481545;
}

/* ---------------------------------------------------------------------- */
/* ÉTAT ACTIF + FOCUS */
/* L'ombre doit rester la même que l'état focus standard. */
/* ---------------------------------------------------------------------- */
.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.show>.btn-primary.dropdown-toggle:focus {
  /* box-shadow: 0 0 0 0.2rem rgba(118, 35, 114, 0.5); */
  box-shadow: 0 0 0 0.2rem rgba(118, 35, 114, 0.5);
}

strong {
  color: #333;
}

.progress {
  background-color: #ececec;
}

.card.falcon {
  box-shadow: 0 7px 14px 0 rgba(65, 69, 88, 0.1), 0 3px 6px 0 rgba(0, 0, 0, 0.07);
}

#content {
  width: 100%;
  min-height: 100vh;
  transition: ease all 0.3s;
  position: relative;
  /* padding: 60px 25px 25px 305px; */
  background: #f1edf9;
  background: #efefef;
}