.btn-etat i {
  height: 25px;
  width: 25px;
  text-align: center;
  line-height: 40px;
  border-radius: 50%;
  font-size: 21px;
}

.btn-etat-red i {
  background: #dc4343;
}

.btn-etat-orange i {
  background: #dc9f43;
}

.btn-etat-green i {
  background: #43dc63;
}

.form-check-input:checked + .form-check-label {
  background-color: #e9e9e9;
  border-color: #656565;
}

.form-check-input:checked + .form-check-label::before {
   background-color: #e9e9e9;
  border-color: #656565;
}

.form-check-label {
  border-radius: 0.25rem;
  cursor: pointer;
  display: inline-block;
  margin-right: 0.5rem;
  padding: 0.5rem 1rem;
  text-align: center;
  transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
}

.form-check-label:hover {
  background-color: rgba(0, 0, 0, 0.1);
}

.form-check-input:checked + .form-check-label:hover {
  background-color: #007bff;
}

.main-header-center .select2-container--default .select2-selection--single { width: 180px }

.main-signin-wrapper {
  background : url("../img/background.jpg") no-repeat center center fixed;
  background-size: cover;
}

.sign-custom{
  background: rgb(160,181,210);
  background: radial-gradient(circle, rgba(242,245,250,1) 0%, rgba(160,181,210,1)  100%);
}

.form-control, .select2, .select2-container--default .select2-selection--single .select2-selection__rendered{
  color: #5091ff !important;
  font-weight: bold !important;
}

#searchContactModal { overflow: hidden; }

#searchContactModal .modal-content { max-height: calc(100vh - 56px); overflow:auto; }

.table-responsive {
  max-height: calc(100vh - 150px);
}

.table-responsive table {
  border-collapse: collapse !important;
}

.table-responsive table thead th {
  position: sticky !important;
  top: 0;
  background: #f8f8ff !important;
  z-index: 10;
}

.dark-theme .table-responsive table thead th {
  background: #262643 !important;
}

.table-responsive table td {
  white-space: normal !important;
}


.suivi-desc-clamp span {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 10;
  overflow: hidden;
  word-break: break-word;
  white-space: pre-line;
  line-height: 1.4;
}

#ocListingTable.dataTable thead th {
  cursor: pointer;
  position: sticky;
  top: 0;
  z-index: 11;
  background: #f8f8ff !important;
}

.dark-theme #ocListingTable.dataTable thead th {
  background: #262643 !important;
}

td.date-passed {
  background: #ffe4e4;
  border-color: #ffe4e4;
}

.dark-theme td.date-passed {
  background: #262643 !important;
  border-color: var(--dark-border) !important;
}

@media (min-width: 1400px) {
  /* 1. Force le tableau à respecter strictement le CSS */
  #suiviCommercialListing, #suiviTable {
    table-layout: fixed !important;
    width: 100% !important;
  }

  #suiviCommercialListing th, #suiviCommercialListing td, #suiviTable th, #suiviTable td {
    white-space: normal !important;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: clamp(12px, 0.15vw, 14px) !important;
  }

  /* 2. Cible chaque colonne par son ordre (numéro) */
  #suiviCommercialListing th:nth-child(1), 
  #suiviCommercialListing td:nth-child(1) { 
    width: 120px !important; 
  }

  #suiviCommercialListing th:nth-child(2), 
  #suiviCommercialListing td:nth-child(2) { 
    width: 35px !important; 
  }

  #suiviCommercialListing th:nth-child(3), 
  #suiviCommercialListing td:nth-child(3) { 
    width: 70px !important; 
  }


  #suiviCommercialListing th:nth-child(4), 
  #suiviCommercialListing td:nth-child(4) { 
    width: 70px !important; 
  }

  #suiviCommercialListing th:nth-child(5), 
  #suiviCommercialListing td:nth-child(5) { 
    width: 50px !important; 
  }

  #suiviCommercialListing th:nth-child(6),
  #suiviCommercialListing td:nth-child(6) {
    width: 62px !important;
  }

  #suiviCommercialListing th:nth-child(7),
  #suiviCommercialListing td:nth-child(7) {
    width: 90px !important;
  }

  #suiviCommercialListing th:nth-child(8),
  #suiviCommercialListing td:nth-child(8) { 
    width: 250px !important; 
  }

  #suiviCommercialListing th:nth-child(9), 
  #suiviCommercialListing td:nth-child(9) { 
    width: 100px !important; 
  }

  #suiviCommercialListing th:nth-child(10), 
  #suiviCommercialListing td:nth-child(10) { 
    width: 55px !important; 
  }

  #echangesCommerciauxTable th:nth-child(5), 
  #echangesCommerciauxTable td:nth-child(5) { 
    width: 700px !important;
  }

  #echangesCommerciauxTable th:nth-child(6), 
  #echangesCommerciauxTable td:nth-child(6) { 
    width: 50px !important;
  }

  #suiviTable th:nth-child(1), 
  #suiviTable td:nth-child(1) { 
    width: 65px !important;
  }

  #suiviTable th:nth-child(2), 
  #suiviTable td:nth-child(2) { 
    width: 80px !important;
  }

  #suiviTable th:nth-child(6), 
  #suiviTable td:nth-child(6) { 
    width: 250px !important;
  }

  #suiviTable th:nth-child(8), 
  #suiviTable td:nth-child(8) { 
    width: 60px !important;
  }

   #suiviTable th:nth-child(9), 
  #suiviTable td:nth-child(9) { 
    width: 60px !important;
  }

}

@media (min-width: 992px) {
  .main-sidebar.side-menu { width: 265px; }
  .main-sidebar-hide .side-menu { width: 80px }
  .main-sidebar-open .side-menu { width: 265px }
  .main-sidebar-hide .sidemenu-logo { width: 81px }
  .main-body.leftmenu .sidemenu-logo { width: 265px; }
  .main-sidebar-open .sidemenu-logo { width: 265px !important; }
  .main-content.side-content { margin-left: 265px; }
  .main-sidebar-hide .main-content.side-content { margin-left: 80px }
  .main-body .side-header { padding-left: 265px; }
  .main-body.main-sidebar-hide .side-header { padding-left: 75px }
}