body {
	background-color: #f8f9fa;
	font-family: "Segoe UI", sans-serif;
}

h1 {
	color: #2c3e50;
}

.primary-card {
	border: 1px solid #dee2e6;
	border-radius: 0.5rem;
	padding: 1rem;
	margin-bottom: 1rem;
	background-color: #f8f9fa;
}

.primary-card h5 {
	font-weight: bold;
	text-transform: uppercase;
}

.secondary-card {
	background-color: #ffffff;
	border: 1px solid #ced4da;
	border-radius: 0.5rem;
	padding: 0.75rem 1rem;
	margin-bottom: 0.5rem;
}

.secondary-card:hover {
	background-color: #e9ecef;
}

.card-header {
	background-color: #007bff;
	color: white;
	font-weight: bold;
}

.btn-link {
	text-decoration: none;
}

.btn-primary {
	background-color: #007bff;
	border: none;
}

.btn-primary:hover {
	background-color: #0056b3;
}

.btn-secondary {
	background-color: #6c757d;
	border: none;
}

.btn-secondary:hover {
	background-color: #5a6268;
}

input.form-control {
	border-radius: 0.3rem;
}

.capitalize-first::first-letter {
    text-transform: uppercase;
}

.title{
	font-weight: bold;
}

.card {
	border-radius: 0.5rem;
}

/* Overlay semi-transparent couvrant tout le formulaire */
.spinner-overlay {
    position: fixed; /* ou absolute si on veut seulement le formulaire */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.7);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

/* Spinner lui-même */
.spinner-border {
    width: 3rem;
    height: 3rem;
    border-width: 0.3em;
}

section{
	position: relative;
}