html {
  font-size: 14.5px;
  height: 100%
}

body{
	height: 100%;
	background-color: #e7edf3;
	display: flex !important;
	flex-direction: column !important;
}
body, input, textarea, select, button {
	font-family: "Lato";
}

body > header {
	background: #37474f;
	color: #f8f9fa;
	padding: 1.5rem 0;
}

body > main > section {
	padding: 2.5rem 0;
}
body > main > section.section-sm {
	padding: 1.5rem 0;
}
body > main > section:nth-child(odd) {
	background-color: #e7edf3;
}
body > main > section:nth-child(even) {
	background-color: #dbe1e7;
}

body > footer {
	background: #263238;
	color: #f8f9fa;
	padding: 0.85rem 0;
}


/* Scrollbar fine et discrète */
.scrollable-container {
    max-height: 150px;
    overflow: auto;
	overflow-x: hidden;
	padding-left: 15px;
    padding-right: 15px;
}
.scrollable-container.full {
    max-height: none;
}

/* Scrollbar Webkit (Chrome, Edge, Opera, Safari) */
.scrollable-container::-webkit-scrollbar {
    width: 6px; /* largeur de la scrollbar */
    height: 6px;
}
.scrollable-container::-webkit-scrollbar-track {
    background: #f1f1f1; /* fond de la piste */
    border-radius: 3px;
}
.scrollable-container::-webkit-scrollbar-thumb {
    background: #c1c1c1; /* "barre" de scroll */
    border-radius: 3px;
}
.scrollable-container::-webkit-scrollbar-thumb:hover {
    background: #a0a0a0; /* au survol */
}
/* Firefox */
.scrollable-container {
    scrollbar-width: thin; /* "thin" ou "auto" */
    scrollbar-color: #c1c1c1 #f1f1f1; /* thumb color / track color */
}


.bg-login {
	background-image: url(/assets/img/bg-login.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	border-top-left-radius: .5rem !important;
	border-top-right-radius: 0 !important;
	border-bottom-left-radius: .5rem !important;
	border-bottom-right-radius: 0 !important;
}
@media (max-width: 768px) {
	.bg-login {
		min-height:240px;
		border-top-left-radius: .5rem !important;
		border-top-right-radius: .5rem !important;
		border-bottom-left-radius: 0 !important;
		border-bottom-right-radius: 0 !important;
	}
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
	font-family: "Montserrat";
}
.h1,h1 {font-size: 2.20rem; letter-spacing: -1.5px}
.h2,h2 {font-size: 2.00rem; letter-spacing: -1px}
.h3,h3 {font-size: 1.65rem; letter-spacing: -0.5px}
.h4,h4 {font-size: 1.40rem}
.h5,h5 {font-size: 1.20rem}
.h6,h6 {font-size: 1.00rem}

.truncate-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    color: #aaa;
}

.w-30px {width: 30px}
.mr-2px {margin-right: 2px}

.custom-file-label::after { content: "Parcourir";}

.bg-darker,
.navbar-dark {background-color: #263238!important}
.border-darker {border-color: #263238!important}

.text-blue {color: #32506b!important}
.bg-blue {background-color: #32506b!important}
.border-blue {border-color: #32506b!important}

a {color: #7066e0}
a:focus,a:hover {color: #655dc7}

.text-primary {color: #7066e0!important}
a.text-primary:focus,a.text-primary:hover {
	color: #655dc7!important
}

.bg-primary {background-color:#7066e0}

.badge-primary {
	color: #fff;
	background-color: #7066e0;
}

.btn {padding: .35rem .85rem}
.btn-sm {padding: .25rem .5rem}

table.dataTable.table>tbody>tr.selected a,
table.dataTable.table>tbody>tr.selected a i {
	color: inherit!important
}

.btn-primary{
	color:#fff;
	background-color:#7066e0;
	border-color:#7066e0
}

.btn-primary:hover, .btn-primary:active, .btn-primary:focus{
	color:#fff!important;
	background-color:#655dc7!important;
	border-color:#655dc7!important
}
.btn-primary:focus,.btn-primary.focus{
	box-shadow:0 0 0 .2rem rgba(0,90,90,0.5)
}

.btn-outline-primary {
	color: #655dc7;
	border-color: #655dc7;
}
.btn-outline-primary:hover, .btn-outline-primary:active, .btn-outline-primary:focus {
	color: #fff;
	background-color: #655dc7;
	border-color: #655dc7;
}
.btn-outline-primary.focus, .btn-outline-primary:focus {
	box-shadow: 0 0 0 .2rem rgba(0, 90, 90, .5);
}

.bg-custom {background-color:#37474f}
.bordder-custom {border-color:#37474f}

.badge-custom {
	color: #fff;
	background-color: #37474f;
}

.text-muted  {color: #aaa !important}
.text-grey   {color: #cdcdcd!important}
.border-grey {border-color: #cdcdcd!important}

.text-word {color: #328cb9!important}
.text-jaune {color: #c5c92a!important}

.btn-xs {
	padding:0.25rem 0.35rem;
	font-size: .875rem;
	line-height: 1.5;
	border-radius: .2rem;
}

.list-group-small .list-group-item {
	padding: .35rem;
}

.rounded-xl {border-radius: .5rem !important}
.rounded-xxl {border-radius: 1rem !important}

.mw-200{max-width: 200px}
.mw-220{max-width: 220px}
.mw-240{max-width: 240px}
.mw-260{max-width: 260px}
.mw-280{max-width: 280px}
.mw-300{max-width: 300px}

#img-profil-menu{
	height: 30px;
	width: 30px;
	object-fit:cover
}

#img-profil-utilisateur{
	width: 150px;
	height: 150px;
	object-fit: cover;
	border: 2px solid #f8f9fa;
	box-shadow: 0 5px 15px -8px rgba(0,0,0,.24), 0 8px 10px -5px rgba(0,0,0,.2);
	margin-top: -75px;
	margin-bottom: 2rem;
	border-radius: 50%;
}

#profil-utilisateur {
	padding: 0 1.5rem 1.5rem;
	margin-top: 3rem;
	border-radius: 1rem;
}

.profil-header {
	text-align: center;
}
.profil-body {
	position: relative;
}
.profil-badge-role {
	padding: 0.20rem 0.75rem;
	color: #f8f9fa;
	background-color: #17a2b8;
	position: absolute;
	right: 0;
	bottom: 0;
}
.profil-title {
	
}

.img-avatar{
	object-fit:cover
}

.pagination {
	margin-top: .85rem !important;
}
.pagination-mt-0 {
	margin-top: 0 !important;
}

.pagination > li > a{
	background-color: #fff;
	color: #7066e0;
}
}

.pagination > li > a:focus,
.pagination > li > a:hover,
.pagination > li > span:focus,
.pagination > li > span:hover
{
	color: #fff;
	background-color: #655dc7;
	border-color: #655dc7;
}

.pagination > .active > a
{
	color: #fff;
	background-color: #7066e0 !Important;
	border: solid 1px #7066e0 !Important;
}

.pagination > .active > a:hover
{
	background-color: #7066e0 !Important;
	border: solid 1px #7066e0;
}

.ellipsis {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#dropZone {
    border: 2px dashed #6c757d; /* Pointillés autour de la zone */
    border-radius: 4px;
    padding: 20px;
    text-align: center;
    cursor: pointer;
}

#dropZone.drop-zone--over {
    border-color: #28a745; /* Couleur différente lors du drag over */
	background-color: rgba(0, 0, 0, .05);
}

#dropZone input[type="file"] {
    display: none; /* Masquer le bouton de sélection de fichier */
}

.container-personnes {
	overflow: hidden;
}

.dataTable, #customTypesList {
	font-size: 13.5px;
}
.dataTable.table-sm td, .dataTable.table-sm th {
	padding-top: .15rem;
	padding-bottom: .15rem;
}

.photo-profil {
	height: 30px;
	width: 30px;
	object-fit: cover;
	border-radius: 30px;
}
.photo-profil-o {
	height: 30px;
	width: 30px;
	object-fit: cover;
	border-radius: 50%;
}

.type-item label {
	padding: 0 5px;
}
.type-item.highlight label {
	color: #fff;
	background-color: #32506b;
	padding: 0 5px;
	border-radius: 4px;
}

.photo-container {
	transition: all .2s ease-in-out;
	border-radius : .25rem;
}
.photo-container:hover {
	background: rgba(0,0,0,.1)
}

.photo-container{
  cursor: grab;
}

.photo-container:active{
  cursor: grabbing !important;
}
.photo-container.sortable-dragging {
  cursor: grabbing !important;
}

.swal2-image {
	max-height: 320px;
	width: auto;
}