/* ==========================================================================
   CapTalents — thème commun (charte captalents.com)
   Chargé après Bootstrap 3 : il surcharge ses styles par défaut.
   Réutilisable sur toutes les pages (front + back-office).
   ========================================================================== */

:root {
	--ct-bleu:        #394670;  /* bleu CapTalents (boutons, footer) */
	--ct-bleu-fonce:  #2b3556;  /* survol */
	--ct-bleu-pale:   #eef0f6;  /* fonds légers */
	--ct-vert:        #92A9AA;  /* vert-gris secondaire */
	--ct-gris:        #E6E6E6;
	--ct-gris-fond:   #f5f6f9;
	--ct-noir:        #020202;
	--ct-texte:       #1c1f2a;
	--ct-texte-doux:  #5b6175;
	--ct-bordure:     #c9cdd8;
	--ct-erreur:      #c02b0a;  /* rouge des erreurs de formulaire du site */
	--ct-succes:      #2e7d5b;

	--ct-radius-pill: 30px;     /* boutons et champs */
	--ct-radius-card: 20px;     /* blocs, images, modales */
	--ct-ombre:       0 10px 30px rgba(57, 70, 112, .10);
	--ct-focus:       0 0 0 4px rgba(57, 70, 112, .15);
	--ct-font:        'DM Sans', 'Helvetica Neue', Arial, sans-serif;
}

/* ---------- Base ---------- */
html, body {
	font-family: var(--ct-font);
	font-size: 16px;
	color: var(--ct-texte);
	background: #fff;
	-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
	font-family: var(--ct-font);
	font-weight: 400;
	color: var(--ct-noir);
	letter-spacing: -0.01em;
}
a { color: var(--ct-bleu); }
a:hover, a:focus { color: var(--ct-bleu-fonce); }

/* ---------- Champs de formulaire ---------- */
label {
	font-weight: 500;
	font-size: 14px;
	color: var(--ct-texte);
	margin-bottom: 8px;
}
.form-control {
	height: 48px;
	padding: 0 20px;
	font-size: 15px;
	color: var(--ct-texte);
	background-color: #fff;
	border: 1px solid var(--ct-bordure);
	border-radius: var(--ct-radius-pill);
	-webkit-box-shadow: none;
	box-shadow: none;
	-webkit-transition: border-color .15s ease, box-shadow .15s ease;
	transition: border-color .15s ease, box-shadow .15s ease;
}
textarea.form-control {
	height: auto;
	padding: 14px 20px;
	border-radius: var(--ct-radius-card);
}
select.form-control { padding: 0 16px; }
.form-control::placeholder { color: #9aa0b1; }
.form-control:focus {
	border-color: var(--ct-bleu);
	-webkit-box-shadow: var(--ct-focus);
	box-shadow: var(--ct-focus);
	outline: 0;
}
.form-control[readonly], .form-control[disabled] {
	background-color: var(--ct-gris-fond);
	color: var(--ct-texte-doux);
}
.form-group { margin-bottom: 20px; }

/* ---------- Boutons ---------- */
.btn {
	font-family: var(--ct-font);
	font-size: 15px;
	font-weight: 500;
	padding: 12px 28px;
	border-radius: var(--ct-radius-pill);
	border: 1px solid transparent;
	-webkit-transition: background-color .15s ease, color .15s ease, border-color .15s ease;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.btn:focus, .btn:active:focus { outline: 0; box-shadow: var(--ct-focus); }
.btn-primary,
.btn-default.ct-btn-primary {
	background-color: var(--ct-bleu);
	border-color: var(--ct-bleu);
	color: #fff;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-default.ct-btn-primary:hover, .btn-default.ct-btn-primary:focus {
	background-color: var(--ct-bleu-fonce);
	border-color: var(--ct-bleu-fonce);
	color: #fff;
}
.btn-default {
	background-color: #fff;
	border-color: var(--ct-noir);
	color: var(--ct-noir);
}
.btn-default:hover, .btn-default:focus {
	background-color: var(--ct-noir);
	border-color: var(--ct-noir);
	color: #fff;
}
.btn-block { display: block; width: 100%; }

/* ---------- Messages flash (alertes Bootstrap) ---------- */
.alert {
	border: 0;
	border-radius: 14px;
	padding: 14px 18px;
	font-size: 14px;
}
.alert-danger  { background: #fbeae6; color: var(--ct-erreur); }
.alert-info    { background: var(--ct-bleu-pale); color: var(--ct-bleu); }
.alert-success { background: #e6f3ed; color: var(--ct-succes); }

/* ---------- Modales ---------- */
.modal-content {
	border: 0;
	border-radius: var(--ct-radius-card);
	-webkit-box-shadow: 0 20px 60px rgba(2, 2, 2, .25);
	box-shadow: 0 20px 60px rgba(2, 2, 2, .25);
}
.modal-header {
	border-bottom: 0;
	padding: 24px 28px 0;
}
.modal-title { font-size: 22px; }
.modal-body { padding: 16px 28px 28px; }
.modal-footer { border-top: 0; padding: 0 28px 28px; }
.modal-header .close {
	font-size: 28px;
	font-weight: 300;
	opacity: .5;
	margin-top: -4px;
}
.modal-backdrop.in { opacity: .45; background: var(--ct-noir); }

/* ---------- Pied de page (pages de connexion + espace candidat) ---------- */
.ct-footer {
	flex-shrink: 0;
	background: var(--ct-bleu);
	color: #fff;
	border-radius: var(--ct-radius-card) var(--ct-radius-card) 0 0;
	padding: 22px 0;
	font-size: 13px;
}
.ct-footer .container { max-width: 1072px; }
.ct-footer .container:before,
.ct-footer .container:after { display: none; } /* neutralise le clearfix Bootstrap */
.ct-footer .container {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px 28px;
}
.ct-footer ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 28px;
}
.ct-footer a { color: #fff; text-decoration: none; opacity: .85; }
.ct-footer a:hover, .ct-footer a:focus { opacity: 1; text-decoration: underline; color: #fff; }
.ct-footer__links li:last-child { opacity: .6; }

/* Boutons « captalents.com » et « LinkedIn » */
.ct-footer__social { display: flex; flex-wrap: wrap; gap: 10px; }
.ct-footer .ct-social {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 7px 16px 7px 8px;
	border: 1px solid rgba(255, 255, 255, .35);
	border-radius: var(--ct-radius-pill);
	font-weight: 500;
	opacity: 1;
	-webkit-transition: background-color .15s ease, color .15s ease, border-color .15s ease;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.ct-footer .ct-social:hover,
.ct-footer .ct-social:focus {
	background: #fff;
	border-color: #fff;
	color: var(--ct-bleu);
	text-decoration: none;
}
.ct-footer .ct-social:focus { outline: 0; box-shadow: 0 0 0 4px rgba(255, 255, 255, .35); }
.ct-social__brand { display: block; width: 22px; height: 22px; border-radius: 6px; background: #fff; }
.ct-social__icon {
	display: block;
	width: 22px;
	height: 22px;
	padding: 4px;
	border-radius: 6px;
	background: #fff;
	color: var(--ct-bleu);
}
.ct-footer .ct-social:hover .ct-social__icon,
.ct-footer .ct-social:focus .ct-social__icon { background: var(--ct-bleu); color: #fff; }

/* Mobile : tout centré, les boutons sous les liens */
@media (max-width: 767px) {
	.ct-footer .container,
	.ct-footer ul { justify-content: center; }
}
