:root {
	/* --color-background: rgba(17, 24, 39, 1); */
	--color-background: white;
	--color-border: #ced4da;
	--bs-body-font-size: 0.9rem;

	--tw-gradient-to: #6366f1;
	--tw-gradient-from: #38bdf8;
	--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(56, 189, 248, 0));
	--btn-bgcolor-primary: rgba(168, 205, 255, 0.7);
	--btn-bgcolor-primary-over: rgba(168, 205, 255, 1);
	--btn-color-primary: rgba(30, 58, 138, 1);
	--table-active-bg: rgba(168, 205, 255, 0.2);

	/* --bs-gutter-x: 1rem; */
	/* --bs-body-color: #222; */
	/* --bs-gutter-x: 3rem; */
}
.bg-gray {
	background-color: var(--btn-bgcolor-primary);
}
.navbar-dark {
	background-color: rgba(17, 24, 39, 1);
}
aside {
	background-color: rgba(17, 24, 39, 1);
}

body {
	color: var(--bs-body-color);
	background-color: var(--color-background);
	transition: color 0.5s, background-color 0.5s;
	/* line-height: 1.6;
	font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue",
		sans-serif;
	font-size: 15px;*/
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	color: var(--bs-body-color);
}
.w-10 {
	width: 10%;
}
.w-15 {
	width: 15%;
}
.w-20 {
	width: 20%;
}
.w-30 {
	width: 30%;
}
.w-40 {
	width: 40%;
}
.w-60 {
	width: 60%;
}
.w-70 {
	width: 70%;
}
.w-80 {
	width: 80%;
}
.w-90 {
	width: 90%;
}
.bg-dark {
	background-color: var(--color-background);
}

.form-control {
	font-size: var(--bs-body-font-size);
	/* padding: 0.275rem 0.5rem; */
	padding: 2px 5px;
}
.form-select {
	font-size: var(--bs-body-font-size);
}
.input-group-text {
	font-size: var(--bs-body-font-size);
}
.form-check {
	margin-right: 20px;
	padding-left: 1.3em;
}
.form-check .form-check-input {
	margin-left: -1.3em;
}
.form-label {
	margin-bottom: 0.1rem;
}
.col-form-label {
	padding-top: 5px;
	padding-bottom: 0;
	line-height: 1rem;
}
.table {
	margin-bottom: 0;
}
.table .table-active {
	/* background-color: var(--btn-bgcolor-primary); */
	--bs-table-active-bg: var(--table-active-bg);
}
.table-xs > :not(caption) > * > * {
	padding: 0.1rem 0.25rem;
}
.table td {
	line-height: 1rem;
	vertical-align: middle;
}

.btn {
	border-radius: 0.5rem;
	font-size: var(--bs-body-font-size);
	font-weight: 500;
	border: 0;
}
.btn.btn-xs {
	padding: 0.2rem 0.5rem;
	/* font-size: 0.875rem; */
	border-radius: 0.3rem;
	line-height: 0.875rem;
}
.btn.btn-primary {
	background-color: var(--btn-bgcolor-primary);
	color: var(--btn-color-primary);
}
.btn.btn-primary:hover {
	background-color: var(--btn-bgcolor-primary-over);
}
.btn-primary:focus {
	box-shadow: none;
}
.modal-footer .btn.btn-primary {
	background-color: rgba(255, 255, 255, 0.5);
	/* color: var(--btn-color-primary); */
}
.modal-footer .btn.btn-primary:hover {
	background-color: rgba(255, 255, 255, 0.6);
}
.modal-footer .btn.btn-danger {
	background-color: transparent;
	/* color: var(--btn-color-primary); */
}
.modal-footer .btn.btn-danger:hover {
	background-color: rgba(254, 16, 16, 0.8);
}

.btn.btn-secondary {
	background-color: rgba(0, 0, 0, 0.2);
	color: white;
}
.btn-secondary:focus {
	box-shadow: none;
}
.btn.btn-secondary:hover {
	background-color: rgba(0, 0, 0, 0.4);
}
.modal-footer .btn.btn-secondary {
	background-color: transparent;
	/* color: var(--btn-color-primary); */
}
.modal-footer .btn.btn-secondary:hover {
	background-color: rgba(0, 0, 0, 0.2);
}

.card {
	margin-bottom: var(--bs-gutter-x);
}
.card-body {
	padding: 0.75rem;
}
.bg-yellow {
	--tw-gradient-to: #f97316;
	--tw-gradient-from: #fcd34d;
	--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
	background-image: linear-gradient(to right, var(--tw-gradient-stops));
	border: 0;
}

#app {
	height: 100vh;
	display: flex;
}
#app-container {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
}
.row {
	--bs-gutter-x: 0.5rem;
}
/* #app-container > main > .row {
	height: 100%;
}
#app-container > main > .row > .col,
#app-container > main > .row > .col-1,
#app-container > main > .row > .col-2,
#app-container > main > .row > .col-3,
#app-container > main > .row > .col-4,
#app-container > main > .row > .col-5,
#app-container > main > .row > .col-6,
#app-container > main > .row > .col-7,
#app-container > main > .row > .col-8,
#app-container > main > .row > .col-9,
#app-container > main > .row > .col-10,
#app-container > main > .row > .col-11,
#app-container > main > .row > .col-12 {
	height: 100%;
	overflow: auto;
} */
main {
	flex-grow: 1;
	padding: 15px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
main.container-fluid {
	padding-left: 20px;
	padding-right: 20px;
}
.pointer {
	cursor: pointer;
}

::-webkit-scrollbar {
	-webkit-appearance: none;
	width: 10px;
}
::-webkit-scrollbar-thumb {
	border-radius: 4px;
	background-color: rgba(0, 0, 0, 0.2);
	box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
	-webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
}

/***************************************************
Interface un peu stylé
***************************************************/
.modal-dialog {
	height: calc(100% - 3.5rem);
	/* overflow: hidden; */
}
.modal-body {
	overflow: auto;
	padding-top: 7px;
	padding-bottom: 0;
}
.modal-content {
	max-height: 100%;
	overflow: hidden;
	border-radius: 1rem;
}
.modal-header {
	border-bottom: 0;
	background-image: linear-gradient(270deg, #38bdf8, #6366f1);
	color: white;
}
.modal-footer {
	border-top: 0;
	background-image: linear-gradient(90deg, #38bdf8, #6366f1);
}
.modal-title {
	color: white;
}

.modal-backdrop.fade {
	opacity: 1;
	transition: all 0.15s linear;
}
.modal-backdrop.show {
	opacity: 1;
	background-color: rgba(0, 0, 0, 0.5);
	/* backdrop-filter: blur(2px); */
}
.modal-backdrop {
	background-color: rgba(0, 0, 0, 0);
}

/* .bg-light {
	background-image: linear-gradient(120deg, #38bdf8, #6366f1);
} */

.fill-height {
	height: 100%;
}
h6 {
	font-weight: normal;
}
.fs-sm {
	font-size: 0.8rem;
	line-height: 0.8rem;
}
.w-33 {
	width: 33.3333%;
}
.text-sm {
	font-size: 0.8rem;
}
.line-height-1 {
	line-height: 1rem;
}
