:root {
  --theme-primary: #3cacc6;
  --theme-primary-hover: hsl(193, 58%, 53%);
  --theme-secondary: #72c5db;
  --theme-secondary-hover: #b9dfe8;
  --theme-info: #01c0c8;
  --theme-info-hover: #138496;
  --theme-success: #2db115; /* #55ce63; */
  --theme-success-hover: #5fa022;
  --theme-danger: #d83b48;
  --theme-danger-hover: #b42332;
  --theme-warning: #ffbc34;
  --theme-warning-hover: #e0a800;
  --theme-white: #f9fafc;
  --theme-black: #3c3c3c;
  --theme-grey: #929292;
}

/* Login page background */
/* body.login-page, .register-page {
	background: linear-gradient(90deg, var(--theme-info) 0%, var(--theme-primary) 100%);
} */

.tab-content {
  padding: 15px !important;
}

.tab-pane {
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}

.app-logo {
  text-align: center;
}

.content-wrapper {
  /* background-image: url('../../../img/logo/logo_gris.png');
  background-repeat: no-repeat;
  background-position: right 20px bottom 30px; */
  background-color: #fafcff !important;
}

/* LEFT MODULE SIDEBAR */
.module-sidebar {
  position: fixed;
  top: 0;
  left: 0;
  width: 90px;
  height: 100vh;
  background: #f1f8fc;
  color: white;
  z-index: 1030;
}

.module-sidebar-inner {
    height: 100%;
}

.module-sidebar .nav-link {
  font-weight: 500;
  color: #3cacc6 !important;
  font-size: 28px;
  padding: 10px 0 10px 0;
}

.module-sidebar .nav-link:hover {
  background: #dff0f7;
  color: #3cacc6 !important;
}

.nav-link {
  font-weight: 500;
}

.nav-link i.disabled {
  color: #797979 !important;
  position: relative; /* needed for positioning the crown */
}

.nav-link i.disabled::after {
  content: "\f521"; /* Unicode for crown in Font Awesome */
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  top: -5px;
  right: -8px;
  font-size: 12px;
  color: #fe0 !important;
  -webkit-text-stroke: 1px #797979;
}

.verysmall {
font-size: 12px !important;
  color: #000000;
}
/* SHIFT MAIN SIDEBAR */
.dual-sidebar {
  margin-left: 90px !important;
}


/* Fix collapsed mode */
body.sidebar-collapse .content-wrapper,
body.sidebar-collapse .main-footer,
body.sidebar-collapse .main-header {
  margin-left: 90px !important;
}


.main-sidebar .sidebar {
overflow-y: auto;
background-color: #fcfbff;
}

/* Tabulation */
.nav-tabs-custom .nav-tabs {
background: #fff;
/* border-radius: 4px; */
/* border: 1px solid rgba(0, 0, 0, 0.2); */
/* border-bottom: 1px dashed rgba(0, 0, 0, 0.2); */
padding: 3px;
}

.nav-tabs-custom .nav-tabs {
  border-bottom: 0px;
  border: 0px;
}


.tab-content {
min-height: 275px;
border-radius: 4px;
/* border: 1px solid rgba(0, 0, 0, 0.2); */
border: 0px;
border-top: 0px;
padding: 30px;
/* padding-top: 5px;
padding-bottom: 5px;
margin-bottom: 10px; */
}

.nav-tabs-custom .nav-item {
/* border-radius: 7px; */
/* border: 1px solid rgba(0, 0, 0, 0.2); */
border: 0;
margin: 4px;
background-color: #fff;
}


.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
/* border: 1px solid rgba(0, 0, 0, 0); */
/* border-top: 1px solid var(--theme-primary-hover); */
border: 0;
/* border-radius: 7px; */
background-color: #cce9f0; /* #3cacc6; */
color: #3cacc6;

border-top-left-radius: 0rem !important;
border-top-right-radius: 0rem !important;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
/* color: #495057;
background-color: #fff;
border: 0;
border-radius: 5px;
border-top: 3px solid var(--theme-primary-hover); */

/* color: #3cacc6;
background-color: #ccb0dc;
border: 0;
margin-bottom: 15px; */

color: #3cacc6;
background-color: #ffffff; /* var(--theme-primary-hover); */
border: 0;
border-bottom: 2px solid #3cacc6;
border-radius: 0px;
margin-bottom: 10px;
}


/* --- Main header ---

.main-header {
  background: linear-gradient(to right, #6f42c1 0%, #8659d7 50%, #6f42c1 100%);
  border-image: linear-gradient(to right, #6f42c1 0%, #8659d7 50%, #6f42c1 100%);
}
   */

.main-header .navbar-nav .nav-link {
  color: #000;
}

.navbar-light {
  background-color: #fcfbff;
  border-bottom: none !important;
}

/* --- Content Header --- */
.content-header {
  padding: 15px 1rem;
}

.content-header .container-fluid .row {
  background-color: #fff;
  background-clip: border-box;
  border: 0 solid rgba(0,0,0,.125);
  border-radius: .25rem;
  box-shadow: 0 0 1px rgba(0,0,0,.125),0 1px 3px rgba(0,0,0,.1);
  padding: 10px;
}

.content-header .breadcrumb {
  line-height: 2rem;
}

.module-title {
  color: #3c3c3c;
  /* text-transform: uppercase; */
  font-size: 20px;
  font-weight: 500;
  width: 100%;
  padding: 25px 15px 15px 15px;
}


/* --- Backgrounds --- */

.bg-primary {
  background-color: var(--theme-primary) !important;
}

a.bg-primary:hover, a.bg-primary:focus, button.bg-primary:hover, button.bg-primary:focus {
  background-color: var(--theme-primary-hover) !important;
}

.bg-secondary {
  background-color: var(--theme-secondary) !important;
}

a.bg-secondary:hover, a.bg-secondary:focus, button.bg-secondary:hover, button.bg-secondary:focus {
  background-color: var(--theme-secondary-hover) !important;
}

.bg-success {
  background-color: var(--theme-success) !important;
}

a.bg-success:hover, a.bg-success:focus, button.bg-success:hover, button.bg-success:focus {
  background-color: var(--theme-success-hover) !important;
}

.bg-info {
  background-color: var(--theme-info) !important;
}

a.bg-info:hover, a.bg-info:focus, button.bg-info:hover, button.bg-info:focus {
  background-color: var(--theme-info-hover) !important;
}

.bg-warning {
  background-color: var(--theme-warning) !important;
}

a.bg-warning:hover, a.bg-warning:focus, button.bg-warning:hover, button.bg-warning:focus {
  background-color: var(--theme-warning-hover) !important;
}

.bg-danger {
  background-color: var(--theme-danger) !important;
}

a.bg-danger:hover, a.bg-danger:focus, button.bg-danger:hover, button.bg-danger:focus {
  background-color: var(--theme-danger-hover) !important;
}

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

/* --- Buttons --- */

.btn-primary {
  color: #fff;
  background-color: var(--theme-primary);
  border-color: var(--theme-primary);
  box-shadow: none;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary.focus {
  color: #fff;
  background-color: var(--theme-primary-hover);
  border-color: var(--theme-primary-hover);
}

.btn-primary.disabled, .btn-primary:disabled {
  color: #fff;
  background-color: var(--theme-primary);
  border-color: var(--theme-primary);
  opacity: 0.8;
}

.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
  color: #fff;
  background-color:  var(--theme-primary);
  border-color:  var(--theme-primary);
}

.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 rgba(66, 2, 99, 0.5);
}

.btn-secondary {
  color: #fff;
  background-color: var(--theme-secondary);
  border-color: var(--theme-secondary);
  box-shadow: none;
}

.btn-secondary:hover, .btn-secondary:focus, .btn-secondary.focus {
  color: #fff;
  background-color: var(--theme-secondary-hover);
  border-color: var(--theme-secondary-hover);
}

.btn-secondary.disabled, .btn-secondary:disabled {
  color: #fff;
  background-color: var(--theme-secondary);
  border-color: var(--theme-secondary);
  opacity: 0.8;
}

.btn-info {
  color: #ffffff;
  background-color: var(--theme-info);
  border-color: var(--theme-info);
  box-shadow: none;
}

.btn-info:hover, .btn-info:focus, .btn-info.focus {
  color: #fff;
  background-color: var(--theme-info-hover);
  border-color: var(--theme-info-hover);
}


.btn-info.disabled, .btn-info:disabled {
  color: #ffffff;
  background-color: #797979 !important;
  border-color: #797979 !important;
  position: relative; /* needed for positioning the crown */
}


.btn-info.crowned::after {
  content: " \f521"; /* space + crown */
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 14px;
  color: #fe0;
  -webkit-text-stroke: 1px #797979;

  position: static; /* or just remove position entirely */
}

.btn-success {
  color: #ffffff;
  background-color: var(--theme-success);
  border-color: var(--theme-success);
  box-shadow: none;
}

.btn-success:hover, .btn-success:focus, .btn-success.focus {
  color: #fff;
  background-color: var(--theme-success-hover);
  border-color: var(--theme-success-hover);
}

.btn-success.disabled, .btn-success:disabled {
  color: #000;
  background-color: var(--theme-success);
  border-color: var(--theme-success);
  opacity: 0.8;
}

.btn-warning {
  color: #000;
  background-color: var(--theme-warning);
  border-color: var(--theme-warning);
  box-shadow: none;
}

.btn-warning:hover, .btn-warning:focus, .btn-warning.focus {
  color: #000;
  background-color: var(--theme-warning-hover);
  border-color: var(--theme-warning-hover);
}

.btn-warning.disabled, .btn-warning:disabled {
  color: #000;
  background-color: var(--theme-warning);
  border-color: var(--theme-warning);
  opacity: 0.8;
}

.btn-danger {
  color: #fff;
  background-color: var(--theme-danger);
  border-color: var(--theme-danger);
  box-shadow: none;
}

.btn-danger:hover, .btn-danger:focus, .btn-danger.focus {
  color: #fff;
  background-color: var(--theme-danger-hover);
  border-color: var(--theme-danger-hover);
}

.btn-danger.disabled, .btn-danger:disabled {
  color: #fff;
  background-color: var(--theme-danger);
  border-color: var(--theme-danger);
  opacity: 0.8;
}

/* --- Outline --- */

.btn-outline-success {
  border: 1px solid var(--theme-success);
  color: var(--theme-success);
  font-size: 0.9;
  font-weight: 500;
  background-color: #f1f8fc;
}

.btn-outline-success:hover {
  border: 1px solid var(--theme-success);
  background-color: var(--theme-success);
}

.btn-outline-primary {
  border: 1px solid var(--theme-primary);
  color: var(--theme-primary);
  font-size: 0.9;
  font-weight: 500;
  background-color: #f1f8fc;
  /* padding: .25rem .75rem; */
}

.btn-outline-primary:hover {
  border: 1px solid var(--theme-primary);
  background-color: var(--theme-primary);
}


.btn-outline-primary.crowned::after {
  content: " \f521"; /* space + crown */
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 14px;
  color: #fe0;
  -webkit-text-stroke: 1px #797979;

  position: static; /* or just remove position entirely */
}

.btn-outline-warning {
  border: 1px solid var(--theme-warning);
  color: var(--theme-warning);
  font-size: 0.9;
  font-weight: 500;
  background-color: #fffbf4;
  /* padding: .25rem .75rem; */
}

.btn-outline-danger {
  border: 1px solid var(--theme-danger);
  color: var(--theme-danger);
  font-size: 0.9;
  font-weight: 500;
  background-color: #ffe5e6;
  /* padding: .25rem .75rem; */
}

/* --- Link --- */
a {
  color: var(--theme-primary);
  text-decoration: none;
  background-color: transparent;
}

.page-item.active .page-link {
  z-index: 3;
  color: #fff;
  background-color: var(--theme-primary);
  border-color: var(--theme-primary);
}

/* Overwrite AdminLTE CSS */
.nav-sidebar > .nav-item > .nav-link:active, .nav-treeview > .nav-item > .nav-link:focus, .nav-sidebar > .nav-item > .nav-link:focus {
	background-color: rgba(0,0,0,.1);
}


.highlight {
  background: #dff0f7;
}

.highlight > a > i {
  color: #fe0 !important;
  -webkit-text-stroke: 1px #797979;
}

/* * Text color black on menu header */
/* .main-header .navbar-nav .nav-link {
	color: rgba(0,0,0,.8);
} */

.nav-pills .nav-link:not(.active):hover {
	color: #00466f;
}

.btn-default:focus {
	background-color: #e9ecef;
	color: #2b2b2b;
}

.sidebar .form-inline .input-group {
	flex-wrap: wrap;
}


/* --- Card --- */

.card {
  border-radius: .85rem;
}

.card-header {
  border-bottom: 0px;
}

/* ============================= */
/* RIGHT SIDEBAR (DRAWER) */
/* ============================= */

.right-sidebar {
	position: fixed;
	top: 0;
	right: -350px; /* cachée par défaut */
	width: 350px;
	height: 100%;
	background: #ffffff;
	box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1);
	transition: right 0.3s ease;
	z-index: 1040;
	display: flex;
	flex-direction: column;
}

.right-sidebar-content {
	padding: 15px 5px 15px 5px;
	overflow-y: auto;
	flex: 1;
}

/* état ouvert */
.right-sidebar.open {
	right: 0;
}

/* ============================= */
/* PUSH DU CONTENU */
/* ============================= */

body.right-sidebar-open .content-wrapper,
body.right-sidebar-open .main-header,
body.right-sidebar-open .main-footer {
	margin-right: 350px !important;
	transition: margin 0.3s ease;
}


/* ============================= */
/* BOUTON FLOTTANT */
/* ============================= */

.right-sidebar-toggle {
	position: fixed;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	background:  var(--theme-primary); /* #343a40; */ 
	color: #ffffff;
	padding: 10px 0px 10px 0px; /* padding: 12px 14px; */
	border-radius: 10px 0 0 10px;
	z-index: 1050;
	cursor: pointer;
	box-shadow: -2px 0 8px rgba(0, 0, 0, 0.25);
	transition: all 0.3s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
}

/* hover */
.right-sidebar-toggle:hover {
	background:  var(--theme-primary-hover); /* #495057; */
	color: #ffffff;
	text-decoration: none;
}

/* bouton se décale quand ouvert */
body.right-sidebar-open .right-sidebar-toggle {
	right: 350px;
}

/* animation icône */
.right-sidebar-toggle i {
	transition: transform 0.3s ease;
}

body.right-sidebar-open .right-sidebar-toggle i {
	transform: rotate(180deg);
}

/* ============================= */
/* RESPONSIVE */
/* ============================= */

@media (max-width: 991.98px) {

	/* sidebar prend toute la largeur */
	.right-sidebar {
		width: 100%;
		right: -100%;
	}

	.right-sidebar.open {
		right: 0;
	}

	/* pas de push sur mobile */
	body.right-sidebar-open .content-wrapper,
	body.right-sidebar-open .main-header,
	body.right-sidebar-open .main-footer {
		margin-right: 0 !important;
	}

	/* bouton reste visible */
	body.right-sidebar-open .right-sidebar-toggle {
		right: 0;
	}
}

/* ============================= */
/* (OPTIONNEL) OVERLAY */
/* ============================= */

.right-sidebar-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.3);
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s ease;
	z-index: 1039;
}

body.right-sidebar-open .right-sidebar-overlay {
	opacity: 1;
	visibility: visible;
}


/* Loader */

.loader {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 60px;
}

.loader-img {
  width: 60px;
  height: 60px;
  animation: spin 4s linear infinite;
}

@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}