/**
 * ABORO BFF Connect — front-office design system
 */

/* ──────────────────────────────────────────────
   1. VARIABLES & RESET
   ────────────────────────────────────────────── */

.aboro-bff-root,
:root {
	--aboro-primary: #e21411;
	--aboro-primary-dark: #cb1112;
	--aboro-primary-light: #fdf2f4;
	--aboro-primary-gradient: linear-gradient(90deg, #e21411 0%, #cb1112 100%);
	--aboro-primary-gradient-hover: linear-gradient(90deg, #cb1112 0%, #a80d10 100%);
	--aboro-text: #1a1a2e;
	--aboro-muted: #5c5c5c;
	--aboro-border: #e5e7eb;
	--aboro-surface: #ffffff;
	--aboro-bg: #f5f7f9;
	--aboro-success: #16a34a;
	--aboro-success-bg: #f0fdf4;
	--aboro-error: #dc2626;
	--aboro-error-bg: #fef2f2;
	--aboro-radius: 8px;
	--aboro-radius-lg: 12px;
	--aboro-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
	--aboro-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);
	--aboro-shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.15);
	--aboro-transition: 0.2s ease;

	color: var(--aboro-text);
	font-family: 'Poppins', sans-serif !important;
	font-size: 1rem;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

.aboro-bff-root *,
.aboro-bff-root *::before,
.aboro-bff-root *::after {
	box-sizing: border-box;
	font-family: 'Poppins', sans-serif !important;
}

.aboro-text-muted {
	color: var(--aboro-muted);
	font-style: italic;
}

/* ──────────────────────────────────────────────
   2. BUTTONS
   ────────────────────────────────────────────── */

.aboro-bff-root .aboro-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.625rem 1.25rem;
	font-size: 0.9375rem;
	font-weight: 600;
	text-decoration: none;
	border-radius: var(--aboro-radius);
	border: 2px solid transparent;
	cursor: pointer;
	transition: all var(--aboro-transition);
	white-space: nowrap;
}

.aboro-bff-root .aboro-btn:focus-visible {
	outline: 2px solid var(--aboro-primary);
	outline-offset: 2px;
}

.aboro-bff-root .aboro-btn-primary {
	background: var(--aboro-primary);
	color: #fff;
	border-color: var(--aboro-primary);
}

.aboro-bff-root .aboro-btn-primary:hover {
	background: var(--aboro-primary-dark);
	border-color: var(--aboro-primary-dark);
}

.aboro-bff-root .aboro-btn-outline {
	background: transparent;
	color: var(--aboro-primary);
	border-color: var(--aboro-primary);
}

.aboro-bff-root .aboro-btn-outline:hover {
	background: var(--aboro-primary-light);
}

.aboro-bff-root .aboro-btn svg {
	width: 1em;
	height: 1em;
	flex-shrink: 0;
}

/* "Je postule" button — fond gris (revue client 11/06), black text, Poppins bold */
.aboro-bff-root .aboro-btn-apply {
	background: #f3f4f6;
	color: var(--aboro-text);
	border: 1px solid var(--aboro-border);
	border-radius: var(--aboro-radius);
	padding: 0.75rem 1.75rem;
	font-weight: 700;
	font-size: 0.9375rem;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	transition: all var(--aboro-transition);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

.aboro-bff-root .aboro-btn-apply:hover {
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
	border-color: var(--aboro-primary);
	color: var(--aboro-primary);
}

.aboro-bff-root .aboro-btn-apply-arrow {
	display: inline-flex;
	align-items: center;
	color: var(--aboro-primary);
}

.aboro-bff-root .aboro-btn-apply-arrow svg {
	width: 1.125em;
	height: 1.125em;
}

/* ──────────────────────────────────────────────
   3. SEARCH BAR
   ────────────────────────────────────────────── */

.aboro-bff-root .aboro-jobs-search {
	display: flex;
	gap: 0;
	margin-bottom: 2rem;
	border: 1px solid var(--aboro-border);
	border-radius: var(--aboro-radius);
	overflow: hidden;
	background: var(--aboro-surface);
	box-shadow: var(--aboro-shadow);
}

.aboro-bff-root .aboro-jobs-search input[type="search"] {
	flex: 1;
	min-width: 0;
	padding: 0.75rem 1rem;
	border: none;
	font-size: 1rem;

	background: transparent;
	color: var(--aboro-text);
}

.aboro-bff-root .aboro-jobs-search input[type="search"]:focus {
	outline: none;
}

.aboro-bff-root .aboro-jobs-search input[type="search"]::placeholder {
	color: var(--aboro-muted);
}

.aboro-bff-root .aboro-jobs-search .aboro-btn {
	border-radius: 0;
	border: none;
	padding: 0.75rem 1.5rem;
	font-size: 1rem;
}

/* ──────────────────────────────────────────────
   4. FILTERS BAR
   ────────────────────────────────────────────── */

.aboro-bff-root .aboro-filters-bar {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-bottom: 2rem;
	align-items: center;
}

.aboro-bff-root .aboro-filter-select {
	padding: 0.5rem 2rem 0.5rem 0.75rem;
	border: 1px solid var(--aboro-border);
	border-radius: var(--aboro-radius);
	background: var(--aboro-surface);

	font-size: 0.875rem;
	color: var(--aboro-text);
	cursor: pointer;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%235c5c5c' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
	transition: border-color var(--aboro-transition);
}

.aboro-bff-root .aboro-filter-select:focus {
	outline: none;
	border-color: var(--aboro-primary);
}

.aboro-bff-root .aboro-filter-reset {

	font-size: 0.8125rem;
	color: var(--aboro-muted);
	text-decoration: underline;
	cursor: pointer;
	background: none;
	border: none;
	padding: 0.5rem;
}

.aboro-bff-root .aboro-filter-reset:hover {
	color: var(--aboro-primary);
}

/* ──────────────────────────────────────────────
   5. HEADING & COUNT
   ────────────────────────────────────────────── */

.aboro-bff-root .aboro-page-heading {
	margin: 0 0 1.5rem;

	font-size: 1.5rem;
	font-weight: 600;
	color: var(--aboro-text);
	line-height: 1.3;
}

.aboro-bff-root .aboro-jobs-count {
	font-weight: 600;
	color: var(--aboro-text);
}

/* ──────────────────────────────────────────────
   6. JOB CARDS GRID (matching capture 4)
   ────────────────────────────────────────────── */

.aboro-bff-root .aboro-job-list {
	list-style: none;
	margin: 0 0 2rem;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.aboro-bff-root .aboro-job-card {
	position: relative;
	border: 1px solid var(--aboro-border);
	border-radius: var(--aboro-radius-lg);
	padding: 1.5rem;
	background: var(--aboro-surface);
	cursor: pointer;
	transition: box-shadow var(--aboro-transition), transform var(--aboro-transition);
	display: flex;
	flex-direction: column;
}

.aboro-bff-root .aboro-job-card:hover {
	box-shadow: var(--aboro-shadow-md);
	transform: translateY(-2px);
}

.aboro-bff-root .aboro-job-card-icon {
	width: 48px;
	height: 48px;
	margin-bottom: 0.75rem;
	color: var(--aboro-primary);
}

.aboro-bff-root .aboro-job-card-icon svg,
.aboro-bff-root .aboro-job-card-icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.aboro-bff-root .aboro-job-card-category {
	display: block;

	font-size: 0.75rem;
	font-weight: 500;
	color: var(--aboro-muted);
	margin-bottom: 0.25rem;
}

.aboro-bff-root .aboro-job-card-title {
	margin: 0 0 1rem;

	font-size: 1rem;
	font-weight: 700;
	color: var(--aboro-primary);
	text-transform: uppercase;
	line-height: 1.3;
}

.aboro-bff-root .aboro-job-card-metas {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.5rem;
	list-style: none;
	margin: auto 0 0;
	padding: 0;
}

.aboro-bff-root .aboro-job-card-metas li {
	display: flex;
	align-items: center;
	gap: 0.375rem;

	font-size: 0.75rem;
	color: var(--aboro-muted);
}

.aboro-bff-root .aboro-job-card-metas li svg,
.aboro-bff-root .aboro-job-card-metas li img.aboro-meta-icon {
	width: 14px;
	height: 14px;
	flex-shrink: 0;
	opacity: 0.7;
	object-fit: contain;
}

.aboro-bff-root .aboro-job-card-urgent {
	border-color: var(--aboro-error);
}

.aboro-bff-root .aboro-job-badge {
	display: inline-block;
	padding: 0.125rem 0.5rem;

	font-size: 0.6875rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	background: var(--aboro-primary);
	color: #fff;
	border-radius: 3px;
	position: absolute;
	top: 0.75rem;
	right: 0.75rem;
}

/* ──────────────────────────────────────────────
   7. EMPTY STATE & ERRORS
   ────────────────────────────────────────────── */

.aboro-bff-root .aboro-job-list-empty {
	grid-column: 1 / -1;
	text-align: center;
	padding: 3rem 1.5rem;
	background: var(--aboro-bg);
	border-radius: var(--aboro-radius-lg);
	color: var(--aboro-muted);
}

.aboro-bff-root .aboro-bff-error {
	padding: 1rem 1.25rem;
	border-radius: var(--aboro-radius);
	background: var(--aboro-error-bg);
	border-left: 4px solid var(--aboro-error);
	color: var(--aboro-text);
}

/* ──────────────────────────────────────────────
   8. PAGINATION
   ────────────────────────────────────────────── */

.aboro-bff-root .aboro-pagination {
	display: flex;
	justify-content: center;
	margin-top: 2rem;
	/* Espace sous les offres avant le footer (desktop). */
	padding-bottom: 3.5rem;
}

@media (max-width: 640px) {
	.aboro-bff-root .aboro-pagination {
		padding-bottom: 2.25rem;
	}
}

.aboro-bff-root .aboro-pagination-list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.375rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.aboro-bff-root .aboro-pagination-list a,
.aboro-bff-root .aboro-pagination-current {
	display: inline-flex;
	min-width: 2.25rem;
	height: 2.25rem;
	justify-content: center;
	align-items: center;
	padding: 0 0.5rem;
	border-radius: var(--aboro-radius);
	text-decoration: none;

	font-size: 0.875rem;
	font-weight: 500;
	transition: all var(--aboro-transition);
}

.aboro-bff-root .aboro-pagination-list a {
	border: 1px solid var(--aboro-border);
	color: var(--aboro-text);
	background: var(--aboro-surface);
}

.aboro-bff-root .aboro-pagination-list a:hover {
	border-color: var(--aboro-primary);
	color: var(--aboro-primary);
	background: var(--aboro-primary-light);
}

.aboro-bff-root .aboro-pagination-current {
	background: var(--aboro-primary);
	color: #fff;
	font-weight: 600;
}

.aboro-bff-root .aboro-pagination-disabled {
	opacity: 0.35;
	pointer-events: none;
}

.aboro-bff-root .aboro-pagination-status span {
	padding: 0.35rem 0.5rem;
	color: var(--aboro-muted);
	font-size: 0.875rem;
}

/* ──────────────────────────────────────────────
   9. MODAL — RED BORDER matching ABORO design
   ────────────────────────────────────────────── */

/* Modal overlay : on monte dans un portal #aboro-modal-portal.aboro-bff-root
   pose directement sous <body> par JS (cf. openModal). Le z-index max int
   passe au-dessus du header sticky Divi (z ~1000) et de tout autre
   stacking context. */
.aboro-bff-root .aboro-modal-overlay {
	position: fixed;
	inset: 0;
	z-index: 2147483600; /* max int — safe contre Divi/Elementor/etc. */
	background: rgba(0, 0, 0, 0.55);
	align-items: center;
	justify-content: center;
	padding: 1.5rem;
	display: none !important;
	opacity: 0;
	visibility: hidden;
}

.aboro-bff-root .aboro-modal-overlay.aboro-modal-open {
	display: flex !important;
	opacity: 1;
	visibility: visible;
}

/* Portal wrapper : neutre, n'introduit pas de contexte de stacking parasite */
#aboro-modal-portal {
	position: static;
}

.aboro-bff-root .aboro-modal {
	background: var(--aboro-surface);
	border-radius: var(--aboro-radius-lg);
	border: 2px solid var(--aboro-primary);
	box-shadow: var(--aboro-shadow-lg);
	width: 100%;
	max-width: 960px;
	max-height: 90vh;
	overflow: hidden;
	display: flex;
	flex-direction: row;
	transform: translateY(20px);
	transition: transform 0.25s ease;
	position: relative;
}

.aboro-bff-root .aboro-modal-overlay.aboro-modal-open .aboro-modal {
	transform: translateY(0);
}

.aboro-bff-root .aboro-modal-close {
	position: absolute;
	top: 1rem;
	right: 1rem;
	width: 2.25rem;
	height: 2.25rem;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	border: none;
	background: transparent;
	border-radius: 50%;
	cursor: pointer;
	color: var(--aboro-primary);
	font-size: 1.75rem;
	line-height: 1;
	/* Le glyphe × est plus haut que sa line-height : on ne doit pas le rogner. */
	overflow: visible;
	z-index: 2;
	transition: all var(--aboro-transition);
}

.aboro-bff-root .aboro-modal-close:hover {
	background: var(--aboro-primary-light);
	color: var(--aboro-primary-dark);
}

.aboro-bff-root .aboro-modal-left {
	width: 340px;
	flex-shrink: 0;
	padding: 2rem;
	border-right: 1px solid var(--aboro-border);
	overflow-y: auto;
	background: var(--aboro-surface);
}

.aboro-bff-root .aboro-modal-right {
	flex: 1;
	padding: 2rem;
	overflow-y: auto;
	position: relative;
}

.aboro-bff-root .aboro-modal-loading {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 200px;
	width: 100%;
	color: var(--aboro-muted);
	font-size: 0.9375rem;
}

/* ──────────────────────────────────────────────
   10. ACCORDION
   ────────────────────────────────────────────── */

.aboro-bff-root .aboro-accordion {
	border-bottom: 1px solid var(--aboro-border);
}

.aboro-bff-root .aboro-accordion-trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 0.875rem 0;
	border: none;
	background: transparent;
	cursor: pointer;

	font-size: 0.9375rem;
	font-weight: 700;
	color: var(--aboro-primary);
	text-align: left;
}

.aboro-bff-root .aboro-accordion-trigger:hover {
	color: var(--aboro-primary-dark);
}

.aboro-bff-root .aboro-accordion-icon {
	width: 24px;
	height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.5rem;
	font-weight: 300;
	transition: transform 0.2s ease;
	flex-shrink: 0;
	color: var(--aboro-primary);
}

.aboro-bff-root .aboro-accordion[open] .aboro-accordion-icon {
	transform: rotate(45deg);
}

.aboro-bff-root .aboro-accordion-content {
	padding: 0 0 1rem;
	font-size: 0.9375rem;
	line-height: 1.7;
	color: var(--aboro-text);
}

.aboro-bff-root .aboro-accordion-content p {
	margin: 0 0 0.75rem;
}

.aboro-bff-root .aboro-accordion-content ul {
	padding-left: 1.25rem;
	margin: 0 0 0.75rem;
}

.aboro-bff-root .aboro-accordion-content li {
	margin-bottom: 0.375rem;
}

/* ──────────────────────────────────────────────
   11. MODAL RECAP (left panel)
   ────────────────────────────────────────────── */

.aboro-bff-root .aboro-modal-recap-icon {
	width: 48px;
	height: 48px;
	margin-bottom: 0.75rem;
	color: var(--aboro-primary);
}

.aboro-bff-root .aboro-modal-recap-icon svg {
	width: 100%;
	height: 100%;
}

.aboro-bff-root .aboro-modal-recap-category {

	font-size: 0.75rem;
	font-weight: 500;
	color: var(--aboro-muted);
}

.aboro-bff-root .aboro-modal-recap-title {
	margin: 0.25rem 0 1rem;

	font-size: 1.125rem;
	font-weight: 600;
	color: var(--aboro-primary);
	text-transform: uppercase;
	line-height: 1.3;
}

.aboro-bff-root .aboro-modal-recap-metas {
	list-style: none;
	margin: 0 0 1.25rem;
	padding: 0;
}

.aboro-bff-root .aboro-modal-recap-metas li {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.375rem 0;

	font-size: 0.8125rem;
	color: var(--aboro-muted);
}

.aboro-bff-root .aboro-modal-recap-metas li svg,
.aboro-bff-root .aboro-modal-recap-metas li img.aboro-meta-icon {
	width: 16px;
	height: 16px;
	flex-shrink: 0;
	opacity: 0.7;
	object-fit: contain;
}

.aboro-bff-root .aboro-modal-recap-icon img.aboro-meta-icon {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.aboro-bff-root .aboro-modal-recap-details {
	border-top: 1px solid var(--aboro-border);
	padding-top: 1rem;
}

.aboro-bff-root .aboro-recap-detail-item {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	padding: 0.375rem 0;

	font-size: 0.8125rem;
	color: var(--aboro-text);
}

.aboro-bff-root .aboro-recap-detail-arrow {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	color: var(--aboro-primary);
}

.aboro-bff-root .aboro-recap-detail-arrow svg {
	width: 14px;
	height: 14px;
}

.aboro-bff-root .aboro-recap-detail-item strong {
	font-weight: 600;
}

/* ──────────────────────────────────────────────
   12. APPLY FORM
   ────────────────────────────────────────────── */

.aboro-bff-root .aboro-apply-choices {
	max-width: 100%;
}

.aboro-bff-root .aboro-apply-choices-title {
	margin: 0 0 0.5rem;

	font-size: 1.125rem;
	font-weight: 600;
	color: var(--aboro-text);
}

.aboro-bff-root .aboro-apply-choices-desc {
	margin: 0 0 1.5rem;
	font-size: 0.875rem;
	color: var(--aboro-muted);
}

.aboro-bff-root .aboro-apply-form {
	max-width: 100%;
}

.aboro-bff-root .aboro-apply-field {
	margin: 0 0 1rem;
}

.aboro-bff-root .aboro-apply-field label {
	display: block;

	font-size: 0.875rem;
	font-weight: 600;
	margin-bottom: 0.375rem;
	color: var(--aboro-text);
}

.aboro-bff-root .aboro-apply-field input[type="text"],
.aboro-bff-root .aboro-apply-field input[type="email"],
.aboro-bff-root .aboro-apply-field input[type="tel"],
.aboro-bff-root .aboro-apply-field input[type="password"],
.aboro-bff-root .aboro-apply-field textarea {
	width: 100%;
	padding: 0.625rem 0.75rem;
	border: 1px solid var(--aboro-border);
	border-radius: var(--aboro-radius);

	font-size: 0.9375rem;
	color: var(--aboro-text);
	background: var(--aboro-surface);
	transition: border-color var(--aboro-transition), box-shadow var(--aboro-transition);
}

.aboro-bff-root .aboro-apply-field input:focus,
.aboro-bff-root .aboro-apply-field textarea:focus {
	outline: none;
	border-color: var(--aboro-primary);
	box-shadow: 0 0 0 3px rgba(196, 18, 48, 0.1);
}

.aboro-bff-root .aboro-apply-field input.aboro-field-error,
.aboro-bff-root .aboro-apply-field textarea.aboro-field-error {
	border-color: var(--aboro-error);
}

/* Bouton rendu comme un lien (retour vers la candidature sans compte, etc.). */
.aboro-bff-root .aboro-linklike {
	background: none;
	border: 0;
	padding: 0;
	font: inherit;
	color: var(--aboro-primary, #e21411);
	cursor: pointer;
	text-decoration: underline;
}
.aboro-bff-root .aboro-linklike:focus-visible {
	outline: 2px solid var(--aboro-primary, #e21411);
	outline-offset: 2px;
}

/* Candidat connecté avec CV au dossier : rappel discret à la place du champ fichier. */
.aboro-bff-root .aboro-apply-cv-dossier {
	padding: 0.625rem 0.75rem;
	border: 1px dashed var(--aboro-border);
	border-radius: var(--aboro-radius);
	background: var(--aboro-surface-alt, #f7f7f7);
	font-size: 0.8125rem;
	color: var(--aboro-text-light, #666);
}

.aboro-bff-root .aboro-field-error-msg {
	display: block;
	margin-top: 0.25rem;
	font-size: 0.75rem;
	color: var(--aboro-error);
}

.aboro-bff-root .aboro-apply-honeypot {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.aboro-bff-root .aboro-apply-rgpd label {
	font-weight: 400;
	font-size: 0.8125rem;
	display: flex;
	gap: 0.5rem;
	align-items: flex-start;
	cursor: pointer;
}

.aboro-bff-root .aboro-apply-rgpd input[type="checkbox"] {
	margin-top: 0.125rem;
	accent-color: var(--aboro-primary);
}

.aboro-bff-root .aboro-apply-dual-actions {
	margin-top: 1.5rem;
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.aboro-bff-root .aboro-apply-dual-actions .aboro-btn-apply {
	flex: 1;
	min-width: 200px;
	justify-content: center;
}

.aboro-bff-root .required {
	color: var(--aboro-primary);
}

/* ──────────────────────────────────────────────
   13. APPLY NOTICE / CONFIRMATION
   ────────────────────────────────────────────── */

.aboro-bff-root .aboro-apply-notice {
	margin-bottom: 1.25rem;
	padding: 1rem 1.25rem;
	border-radius: var(--aboro-radius);
	font-size: 0.9375rem;
}

.aboro-bff-root .aboro-apply-notice-success {
	background: var(--aboro-success-bg);
	border: 1px solid #bbf7d0;
	color: #166534;
}

.aboro-bff-root .aboro-apply-notice-error {
	background: var(--aboro-error-bg);
	border: 1px solid #fecaca;
	color: #991b1b;
}

.aboro-bff-root .aboro-confirmation {
	text-align: center;
	padding: 2rem 1.5rem;
}

.aboro-bff-root .aboro-confirmation-icon {
	width: 64px;
	height: 64px;
	margin: 0 auto 1rem;
	color: var(--aboro-success);
}

.aboro-bff-root .aboro-confirmation-icon svg {
	width: 100%;
	height: 100%;
}

.aboro-bff-root .aboro-confirmation h3 {
	margin: 0 0 0.5rem;

	font-size: 1.25rem;
	color: var(--aboro-text);
}

.aboro-bff-root .aboro-confirmation p {
	color: var(--aboro-muted);
	font-size: 0.9375rem;
	margin: 0 0 0.75rem;
}

.aboro-bff-root .aboro-confirmation .aboro-btn {
	margin-top: 1rem;
}

/* ──────────────────────────────────────────────
   14. MODAL APPLY BUTTON (bottom of right panel)
   ────────────────────────────────────────────── */

.aboro-bff-root .aboro-modal-apply-wrap {
	display: flex;
	justify-content: flex-end;
	margin-top: 1.5rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--aboro-border);
}

/* ──────────────────────────────────────────────
   15. SPINNER
   ────────────────────────────────────────────── */

.aboro-bff-root .aboro-spinner {
	display: inline-block;
	width: 18px;
	height: 18px;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: aboro-spin 0.6s linear infinite;
}

@keyframes aboro-spin {
	to { transform: rotate(360deg); }
}

/* ──────────────────────────────────────────────
   16. JOB SINGLE (no-JS fallback page)
   ────────────────────────────────────────────── */

.aboro-bff-root .aboro-job-single {
	max-width: 720px;
}

.aboro-bff-root .aboro-job-single-title {
	margin: 0 0 0.5rem;

	font-size: 1.5rem;
	color: var(--aboro-primary);
	font-weight: 600;
}

.aboro-bff-root .aboro-job-meta {
	list-style: none;
	margin: 0 0 0.75rem;
	padding: 0;
	font-size: 0.875rem;
	color: var(--aboro-muted);
}

.aboro-bff-root .aboro-job-meta li {
	margin-bottom: 0.25rem;
}

.aboro-bff-root .aboro-job-meta-label {
	font-weight: 600;
	color: var(--aboro-text);
	margin-right: 0.25rem;
}

.aboro-bff-root .aboro-job-meta-inline {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.25rem;
}

.aboro-bff-root .aboro-job-section {
	margin-top: 1.5rem;
}

.aboro-bff-root .aboro-job-section h3 {
	font-size: 1.1rem;
	margin: 0 0 0.5rem;
	color: var(--aboro-primary);
}

.aboro-bff-root .aboro-job-html p {
	margin: 0 0 0.75rem;
}

.aboro-bff-root .aboro-job-closed {
	margin-top: 1.5rem;
	padding: 0.75rem 1rem;
	background: var(--aboro-error-bg);
	border-radius: var(--aboro-radius);
	color: var(--aboro-muted);
}

.aboro-bff-root .aboro-job-excerpt {
	margin: 0 0 0.75rem;
	font-size: 0.9375rem;
	color: var(--aboro-muted);
}

.aboro-bff-root .aboro-job-card-actions {
	margin: 0;
}

.aboro-bff-root .aboro-job-card-header {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: 0.5rem;
}

/* ──────────────────────────────────────────────
   17. SPONTANEOUS APPLICATION PAGE
   ────────────────────────────────────────────── */

.aboro-bff-root .aboro-spontaneous {
	max-width: 560px;
	margin: 0 auto;
}

.aboro-bff-root .aboro-spontaneous h2 {

	font-size: 1.5rem;
	font-weight: 600;
	color: var(--aboro-text);
	margin: 0 0 0.75rem;
}

.aboro-bff-root .aboro-spontaneous .aboro-intro {
	color: var(--aboro-muted);
	margin: 0 0 2rem;
	font-size: 0.9375rem;
}

/* ──────────────────────────────────────────────
   18. RESPONSIVE
   ────────────────────────────────────────────── */

@media (max-width: 1024px) {
	.aboro-bff-root .aboro-job-list {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 768px) {
	.aboro-bff-root .aboro-modal {
		flex-direction: column;
		max-height: 95vh;
	}

	.aboro-bff-root .aboro-modal-left {
		width: 100%;
		border-right: none;
		border-bottom: 1px solid var(--aboro-border);
		max-height: 40vh;
	}

	.aboro-bff-root .aboro-modal-right {
		max-height: 55vh;
	}

	.aboro-bff-root .aboro-filters-bar {
		flex-direction: column;
		align-items: stretch;
	}

	.aboro-bff-root .aboro-job-card-metas {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 600px) {
	.aboro-bff-root .aboro-job-list {
		grid-template-columns: 1fr;
	}

	.aboro-bff-root .aboro-modal-overlay {
		padding: 0.5rem;
	}

	.aboro-bff-root .aboro-modal-left,
	.aboro-bff-root .aboro-modal-right {
		padding: 1.25rem;
	}

	.aboro-bff-root .aboro-page-heading {
		font-size: 1.25rem;
	}

	.aboro-bff-root .aboro-apply-dual-actions {
		flex-direction: column;
	}
}

/* ──────────────────────────────────────────────
   19. PRINT
   ────────────────────────────────────────────── */

@media print {
	.aboro-bff-root .aboro-modal-overlay {
		display: none !important;
	}

	.aboro-bff-root .aboro-job-card {
		break-inside: avoid;
		box-shadow: none;
		border: 1px solid #ccc;
	}
}

/* =====================================================================
   CANDIDATE MULTI-STEP FORM
   ===================================================================== */

.aboro-bff-root .aboro-candidate {
	max-width: 860px;
	margin: 2rem auto;
}

.aboro-bff-root .aboro-candidate-heading {
	text-align: center;
	font-size: 2rem;
	font-weight: 600;
	color: var(--aboro-text) !important;
	margin-bottom: 0.25rem;
	font-family: 'Poppins', sans-serif !important;
}

/* Mode FINALISATION : rappel du compte en cours de complétion + sortie rapide.
   Lève l'ambiguïté « pourquoi mes champs sont-ils pré-remplis ? » sur un poste
   partagé, où le formulaire affichait les données d'un tiers connecté. */
.aboro-bff-root .aboro-candidate-identity-note {
	text-align: center;
	font-size: 0.9rem;
	line-height: 1.6;
	color: var(--aboro-text-muted, #6b7280);
	max-width: 34rem;
	margin: 0 auto 1.25rem;
}

.aboro-bff-root .aboro-candidate-identity-note strong {
	color: var(--aboro-text);
	white-space: nowrap;
}

.aboro-bff-root .aboro-candidate-notme {
	display: inline;
	background: none;
	border: none;
	padding: 0;
	margin-left: 0.35rem;
	font: inherit;
	color: var(--aboro-rouge, #e2001a);
	text-decoration: underline;
	cursor: pointer;
}

.aboro-bff-root .aboro-candidate-notme:hover {
	opacity: 0.75;
}

.aboro-bff-root .aboro-candidate-progress {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0;
	margin: 1.5rem auto 2.5rem;
	position: relative;
	max-width: 320px;
}

.aboro-bff-root .aboro-candidate-progress-line {
	position: absolute;
	top: 50%;
	left: 24px;
	right: 24px;
	height: 2px;
	background: #ddd;
	transform: translateY(-50%);
	z-index: 0;
}

.aboro-bff-root .aboro-candidate-progress-fill {
	position: absolute;
	top: 50%;
	left: 24px;
	height: 2px;
	background: var(--aboro-primary);
	transform: translateY(-50%);
	z-index: 1;
	width: 0;
	transition: width 0.4s ease;
}

.aboro-bff-root .aboro-candidate-step-dot {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: 2px solid #ddd;
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.875rem;
	font-weight: 600;
	color: #999;
	z-index: 2;
	position: relative;
	flex-shrink: 0;
	margin: 0 16px;
	transition: all 0.3s ease;
}

.aboro-bff-root .aboro-candidate-step-dot.active {
	border-color: var(--aboro-primary);
	color: var(--aboro-primary);
}

.aboro-bff-root .aboro-candidate-step-dot.current {
	border-color: var(--aboro-primary);
	background: var(--aboro-primary);
	color: #fff;
}

.aboro-bff-root .aboro-candidate-form {
	background: #f8f8f8;
	border-radius: 16px;
	padding: 2rem 2.5rem;
}

.aboro-bff-root .aboro-candidate-step {
	display: none;
}

.aboro-bff-root .aboro-candidate-step.active {
	display: block;
	animation: aboroFadeIn 0.35s ease;
}

@keyframes aboroFadeIn {
	from { opacity: 0; transform: translateY(8px); }
	to { opacity: 1; transform: translateY(0); }
}

.aboro-bff-root .aboro-candidate-step-intro {
	font-size: 0.9rem;
	color: var(--aboro-muted);
	margin-bottom: 1.5rem;
}

.aboro-bff-root .aboro-candidate-grid {
	display: grid;
	gap: 1rem;
	margin-bottom: 1rem;
}

.aboro-bff-root .aboro-grid-2 { grid-template-columns: 1fr 1fr; }
.aboro-bff-root .aboro-grid-3 { grid-template-columns: 1fr 1fr 1fr; }
.aboro-bff-root .aboro-grid-step5 { grid-template-columns: 1.5fr 1fr; gap: 2rem; }

.aboro-bff-root .aboro-candidate-field {
	margin-bottom: 0.5rem;
}

.aboro-bff-root .aboro-field-full {
	margin-bottom: 1rem;
	position: relative;
}

.aboro-bff-root .aboro-candidate-field input[type="text"],
.aboro-bff-root .aboro-candidate-field input[type="email"],
.aboro-bff-root .aboro-candidate-field input[type="tel"],
.aboro-bff-root .aboro-candidate-field input[type="date"],
.aboro-bff-root .aboro-candidate-field select {
	width: 100%;
	padding: 0.75rem 1rem;
	border: 1px solid #ddd;
	border-radius: 8px;
	font-size: 0.9rem;
	background: #fff;
	color: var(--aboro-text);
	font-family: 'Poppins', sans-serif !important;
	transition: border-color 0.2s;
	box-sizing: border-box;
}

.aboro-bff-root .aboro-candidate-field input:focus,
.aboro-bff-root .aboro-candidate-field select:focus {
	outline: none;
	border-color: var(--aboro-primary);
	box-shadow: 0 0 0 3px rgba(196, 18, 48, 0.08);
}

.aboro-bff-root .aboro-candidate-field input.aboro-field-error,
.aboro-bff-root .aboro-candidate-field select.aboro-field-error,
.aboro-bff-root .aboro-candidate-field.aboro-field-error input,
.aboro-bff-root .aboro-candidate-field.aboro-field-error select,
.aboro-bff-root .aboro-file-drop.aboro-field-error {
	border-color: #d32f2f !important;
}

/* ─── intl-tel-input : ajustements pour matcher le design ABORO ─── */
.aboro-bff-root .aboro-phone-field .iti {
	width: 100%;
	display: block;
}
.aboro-bff-root .aboro-phone-field .iti__tel-input {
	width: 100%;
	box-sizing: border-box;
}
.aboro-bff-root .iti--separate-dial-code .iti__selected-flag {
	background: #f9f9fb;
	border-radius: 8px 0 0 8px;
	padding: 0 10px 0 14px;
}
.aboro-bff-root .iti__country-list {
	max-height: 280px;
	border-radius: 8px;
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.12);
}
.aboro-bff-root .iti__country.iti__highlight {
	background: rgba(200, 16, 46, 0.08);
}
/* Focus rouge ABORO sur le wrapper iti */
.aboro-bff-root .aboro-phone-field .iti__tel-input:focus {
	border-color: #C8102E;
	box-shadow: 0 0 0 3px rgba(200, 16, 46, 0.1);
	outline: none;
}

/* ─── Labels block (étape 1, 2, 3, 4) ─── */
.aboro-bff-root .aboro-field-label-block {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: #1a1a1a;
	margin-bottom: 8px;
}
.aboro-bff-root .aboro-required { color: #C8102E; font-weight: 600; }
.aboro-bff-root .aboro-optional {
	color: #888;
	font-weight: 400;
	font-size: 12px;
	font-style: italic;
}

/* ─── Radio / Checkbox groups (étape 2 + 4) ─── */
.aboro-bff-root .aboro-radio-group,
.aboro-bff-root .aboro-checkbox-group {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 24px;
	padding: 4px 0;
}
.aboro-bff-root .aboro-radio,
.aboro-bff-root .aboro-checkbox {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: #333;
	cursor: pointer;
	font-weight: 400;
}
.aboro-bff-root .aboro-radio input[type="radio"],
.aboro-bff-root .aboro-checkbox input[type="checkbox"] {
	accent-color: #C8102E;
	width: 16px;
	height: 16px;
}

/* ─── Multi-diplômes ─── */
.aboro-bff-root .aboro-diplomas-container {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.aboro-bff-root .aboro-diploma-entry {
	position: relative;
	padding: 18px 20px;
	background: #fafafb;
	border: 1px solid #ececef;
	border-radius: 10px;
}
.aboro-bff-root .aboro-diploma-entry > .aboro-candidate-field {
	margin-bottom: 14px;
}
.aboro-bff-root .aboro-diploma-entry > .aboro-candidate-grid {
	margin-bottom: 0;
}
.aboro-bff-root .aboro-add-diploma {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 16px;
	padding: 11px 22px;
	background-image: linear-gradient(90deg, #e21411 0%, #cb1112 100%);
	background-color: #cb1112;
	color: #ffffff;
	border: none;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: background-image 0.15s, transform 0.05s, box-shadow 0.15s;
	font-family: inherit;
	box-shadow: 0 1px 2px rgba(226, 20, 17, 0.25);
}
.aboro-bff-root .aboro-add-diploma svg {
	stroke: #ffffff;
}
.aboro-bff-root .aboro-add-diploma:hover {
	background-image: linear-gradient(90deg, #cb1112 0%, #a80d10 100%);
	background-color: #a80d10;
	box-shadow: 0 2px 6px rgba(226, 20, 17, 0.35);
}
.aboro-bff-root .aboro-add-diploma:active {
	transform: translateY(1px);
	box-shadow: 0 1px 2px rgba(226, 20, 17, 0.2);
}
.aboro-bff-root .aboro-remove-diploma {
	display: inline-flex;
	align-items: center;
	margin-top: 14px;
	padding: 6px 14px;
	background: transparent;
	color: #888;
	border: 1px solid #ddd;
	border-radius: 6px;
	font-size: 12px;
	cursor: pointer;
	font-family: inherit;
}
.aboro-bff-root .aboro-remove-diploma:hover {
	color: #C8102E;
	border-color: #C8102E;
}

.aboro-bff-root .aboro-field-hint {
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	cursor: help;
	color: #999;
	font-size: 1.1rem;
}

.aboro-bff-root .aboro-field-label {
	font-size: 0.85rem;
	font-weight: 500;
	color: var(--aboro-text);
	margin-bottom: 0.5rem;
	display: block;
}

.aboro-bff-root .aboro-field-inline {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
}

.aboro-bff-root .aboro-field-inline .aboro-field-label {
	width: 100%;
	margin-bottom: 0.25rem;
}

.aboro-bff-root .aboro-radio,
.aboro-bff-root .aboro-checkbox {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	font-size: 0.875rem;
	cursor: pointer;
	color: var(--aboro-text);
	margin-right: 0.75rem;
}

.aboro-bff-root .aboro-radio input,
.aboro-bff-root .aboro-checkbox input {
	accent-color: var(--aboro-primary);
	width: 18px;
	height: 18px;
}

.aboro-bff-root .aboro-checkbox-group {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.aboro-bff-root .aboro-candidate-required-note {
	font-size: 0.75rem;
	color: #999;
	margin-top: 1.5rem;
	line-height: 1.5;
}

.aboro-bff-root .aboro-candidate-nav {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	margin-top: 1.5rem;
	gap: 1rem;
}

.aboro-bff-root .aboro-btn-outline {
	background: transparent;
	border: 1px solid #ccc;
	color: var(--aboro-text);
	padding: 0.6rem 1.25rem;
	border-radius: 8px;
	font-weight: 500;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	font-family: 'Poppins', sans-serif !important;
	font-size: 0.875rem;
	transition: background 0.2s, border-color 0.2s;
}

.aboro-bff-root .aboro-btn-outline:hover {
	background: #f5f5f5;
	border-color: #999;
}

.aboro-bff-root .aboro-btn-next {
	background: #fff;
	border: 1px solid #ddd;
	color: var(--aboro-text);
	padding: 0.65rem 1.5rem;
	border-radius: 8px;
	font-weight: 600;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-family: 'Poppins', sans-serif !important;
	font-size: 0.9rem;
	font-style: italic;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
	transition: box-shadow 0.2s, border-color 0.2s;
}

.aboro-bff-root .aboro-btn-next:hover {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	border-color: #bbb;
}

.aboro-bff-root .aboro-btn-next svg,
.aboro-bff-root .aboro-btn-submit svg {
	color: var(--aboro-primary);
}

.aboro-bff-root .aboro-btn-submit {
	background: var(--aboro-primary);
	border: none;
	color: #fff;
	padding: 0.75rem 2rem;
	border-radius: 8px;
	font-weight: 700;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-family: 'Poppins', sans-serif !important;
	font-size: 0.95rem;
	box-shadow: 0 4px 16px rgba(196, 18, 48, 0.25);
	transition: background 0.2s, box-shadow 0.2s;
}

.aboro-bff-root .aboro-btn-submit:hover {
	background: #a31028;
	box-shadow: 0 6px 20px rgba(196, 18, 48, 0.35);
}

.aboro-bff-root .aboro-btn-submit svg {
	color: #fff;
}

/* File drop zone */
.aboro-bff-root .aboro-file-drop {
	border: 2px dashed #ddd;
	border-radius: 12px;
	padding: 2rem;
	text-align: center;
	background: #fff;
	transition: border-color 0.2s, background 0.2s;
	cursor: pointer;
}

.aboro-bff-root .aboro-file-drop.aboro-file-drop-active {
	border-color: var(--aboro-primary);
	background: rgba(196, 18, 48, 0.03);
}

.aboro-bff-root .aboro-file-drop-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.5rem;
}

.aboro-bff-root .aboro-file-drop-icon {
	width: 48px;
	height: 48px;
	opacity: 0.5;
}

.aboro-bff-root .aboro-file-drop-text {
	font-size: 0.9rem;
	color: #888;
}

.aboro-bff-root .aboro-file-drop-btn {
	background: #f0f0f0;
	border: 1px solid #ccc;
	border-radius: 6px;
	padding: 0.3rem 0.8rem;
	font-size: 0.85rem;
	cursor: pointer;
	font-family: 'Poppins', sans-serif !important;
	color: var(--aboro-text);
}

.aboro-bff-root .aboro-file-drop-btn:hover {
	background: #e8e8e8;
}

.aboro-bff-root .aboro-file-input {
	display: none;
}

.aboro-bff-root .aboro-file-preview {
	margin-top: 0.5rem;
}

.aboro-bff-root .aboro-file-name {
	font-size: 0.85rem;
	color: var(--aboro-primary);
	font-weight: 500;
}

.aboro-bff-root .aboro-id-notice {
	font-size: 0.85rem;
	color: #888;
	line-height: 1.6;
	align-self: center;
}

.aboro-bff-root .aboro-candidate-consents {
	margin-top: 1.5rem;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.aboro-bff-root .aboro-candidate-consents .aboro-checkbox {
	font-size: 0.8rem;
	line-height: 1.4;
	align-items: flex-start;
}

.aboro-bff-root .aboro-candidate-consents .aboro-checkbox input {
	margin-top: 2px;
	flex-shrink: 0;
}

.aboro-bff-root .aboro-candidate-consents label.aboro-field-error {
	color: #d32f2f;
}

@media (max-width: 768px) {
	.aboro-bff-root .aboro-grid-2,
	.aboro-bff-root .aboro-grid-3,
	.aboro-bff-root .aboro-grid-step5 {
		grid-template-columns: 1fr;
	}
	.aboro-bff-root .aboro-candidate-form {
		padding: 1.5rem 1rem;
	}
}

/* =====================================================================
   SEARCH BAR WIDGET
   ===================================================================== */

.aboro-bff-root .aboro-search-widget {
	max-width: 640px;
}

.aboro-bff-root .aboro-search-widget-form {
	background: transparent;
}

.aboro-bff-root .aboro-search-widget-row {
	display: flex;
	gap: 1rem;
	margin-bottom: 0.75rem;
}

.aboro-bff-root .aboro-search-widget-field {
	position: relative;
	flex: 1;
}

.aboro-bff-root .aboro-search-widget-icon {
	position: absolute;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
	width: 16px;
	height: 16px;
	color: #999;
	z-index: 1;
	pointer-events: none;
}

.aboro-bff-root .aboro-search-widget-icon-loc {
	color: var(--aboro-primary);
}

.aboro-bff-root .aboro-search-widget-select,
.aboro-bff-root .aboro-search-widget-input {
	width: 100%;
	padding: 0.65rem 0.75rem 0.65rem 2.25rem;
	border: 1px solid #ddd;
	border-radius: 8px;
	font-size: 0.875rem;
	background: #fff;
	color: var(--aboro-text);
	font-family: 'Poppins', sans-serif !important;
	appearance: none;
	box-sizing: border-box;
}

.aboro-bff-root .aboro-search-widget-select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	padding-right: 2rem;
}

.aboro-bff-root .aboro-search-widget-actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	flex-wrap: wrap;
}

.aboro-bff-root .aboro-search-widget-more {
	background: none;
	border: none;
	color: var(--aboro-primary);
	font-size: 0.8rem;
	cursor: pointer;
	padding: 0;
	font-family: 'Poppins', sans-serif !important;
	text-decoration: underline;
	white-space: nowrap;
}

.aboro-bff-root .aboro-search-widget-submit {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	/* CTA principal « Voir les offres » : rouge dégradé + texte blanc (revue client). */
	background-image: linear-gradient(90deg, #e21411 0%, #cb1112 100%) !important;
	background-color: #cb1112 !important;
	border: 1px solid transparent;
	border-radius: 8px;
	padding: 0.55rem 1.25rem;
	font-size: 0.85rem;
	font-weight: 600;
	color: #fff !important;
	cursor: pointer;
	font-family: 'Poppins', sans-serif !important;
	box-shadow: 0 2px 6px rgba(226, 20, 17, 0.25);
	transition: box-shadow 0.2s, background-image 0.2s;
	white-space: nowrap;
}

.aboro-bff-root .aboro-search-widget-submit svg {
	color: #fff !important;
	stroke: #fff !important;
	flex-shrink: 0;
}

.aboro-bff-root .aboro-search-widget-submit:hover {
	background-image: linear-gradient(90deg, #cb1112 0%, #a80d10 100%) !important;
	box-shadow: 0 4px 12px rgba(226, 20, 17, 0.35);
}

.aboro-bff-root .aboro-search-widget-extra {
	margin-top: 0.75rem;
}

/* Fix gap blanc au-dessus du header en mobile quand WP admin bar presente.
   WP ajoute html { margin-top: 46px } mobile, et le background blanc du
   body remonte dans cette zone. On force le html avec le gradient rouge
   officiel ABORO pour que la zone reservee se fonde avec le header. */
@media screen and (max-width: 782px) {
	html {
		background-image: linear-gradient(90deg, #e21411 0%, #cb1112 100%);
		background-attachment: fixed;
	}
}

@media (max-width: 600px) {
	.aboro-bff-root .aboro-search-widget-row {
		flex-direction: column;
		gap: 0.5rem;
	}
	/* Actions : empilées verticalement, chaque bouton plein largeur */
	.aboro-bff-root .aboro-search-widget-actions {
		flex-direction: column-reverse;
		align-items: stretch;
		gap: 0.5rem;
	}
	.aboro-bff-root .aboro-search-widget-submit {
		width: 100%;
		justify-content: center;
		padding: 0.75rem 1rem;
		font-size: 0.9rem;
		background-image: linear-gradient(90deg, #e21411 0%, #cb1112 100%) !important;
		background-color: #cb1112 !important;
		color: #fff !important;
		border-color: #cb1112 !important;
		font-weight: 600;
	}
	.aboro-bff-root .aboro-search-widget-submit svg {
		color: #fff !important;
		stroke: #fff !important;
	}
	.aboro-bff-root .aboro-search-widget-submit:hover {
		background-image: linear-gradient(90deg, #cb1112 0%, #a80d10 100%) !important;
		background-color: #a80d10 !important;
	}
	.aboro-bff-root .aboro-search-widget-more {
		text-align: center;
		padding: 0.5rem;
		font-size: 0.85rem;
	}
}

/* =====================================================================
   LATEST OFFERS CAROUSEL
   ===================================================================== */

.aboro-bff-root .aboro-latest-offers {
	margin: 2rem 0;
}

.aboro-bff-root .aboro-latest-offers-header {
	margin-bottom: 1.25rem;
}

.aboro-bff-root .aboro-latest-offers-title {
	font-size: 1.25rem;
	font-weight: 600;
	color: var(--aboro-text);
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-family: 'Poppins', sans-serif !important;
}

.aboro-bff-root .aboro-latest-offers-icon {
	width: 20px;
	height: 20px;
	color: var(--aboro-primary);
}

.aboro-bff-root .aboro-latest-offers-track-wrap {
	position: relative;
}

.aboro-bff-root .aboro-latest-offers-track {
	display: flex;
	gap: 1.25rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	padding-bottom: 0.5rem;
	scrollbar-width: none;
}

.aboro-bff-root .aboro-latest-offers-track::-webkit-scrollbar {
	display: none;
}

.aboro-bff-root .aboro-latest-card {
	flex: 0 0 240px;
	scroll-snap-align: start;
	background: #fff;
	/* Cadre légèrement visible sans hover (revue client 11/06). */
	border: 1px solid #d8dade;
	border-radius: 12px;
	padding: 1.25rem;
	cursor: pointer;
	transition: box-shadow 0.2s, border-color 0.2s;
	display: flex;
	flex-direction: column;
	/* Ancre le badge « Urgent » (position:absolute) sur la carte. */
	position: relative;
}

.aboro-bff-root .aboro-latest-card:hover {
	/* Cadre renforcé au survol (revue client 11/06). */
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
	border-color: var(--aboro-primary);
}

/* Domaine d'activité : noir, sans graisse (revue client 11/06). */
.aboro-bff-root .aboro-latest-card-sector {
	font-size: 0.7rem;
	font-weight: 400;
	color: var(--aboro-text);
	text-transform: uppercase;
	letter-spacing: 0.02em;
	margin-bottom: 0.25rem;
}

/* Intitulé du poste : rouge, avec graisse (revue client 11/06). */
.aboro-bff-root .aboro-latest-card-title {
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--aboro-primary);
	margin: 0 0 0.75rem;
	font-family: 'Poppins', sans-serif !important;
	line-height: 1.3;
}

.aboro-bff-root .aboro-latest-card-metas {
	list-style: none;
	padding: 0;
	/* Aligné vers le bas : localisation + contrat restent à la même hauteur
	   quel que soit le nombre de lignes de l'intitulé (revue client 19/06). */
	margin: auto 0 0;
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}

.aboro-bff-root .aboro-latest-card-metas li {
	display: flex;
	align-items: center;
	gap: 0.35rem;
	font-size: 0.8rem;
	color: var(--aboro-muted);
}

.aboro-bff-root .aboro-latest-card-metas li svg {
	width: 14px;
	height: 14px;
	flex-shrink: 0;
	color: var(--aboro-primary);
	opacity: 0.7;
}

/* Badge « Urgent » sur la carte accueil : rendu dans la ligne du type de
   contrat, calé à droite (revue client 22/09 — en absolu haut-droite il
   chevauchait le domaine affiché sur deux lignes). */
.aboro-bff-root .aboro-latest-card-metas .aboro-job-badge {
	position: static;
	margin-left: auto;
	flex-shrink: 0;
}

.aboro-bff-root .aboro-latest-card-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--aboro-text);
	/* Fond gris (revue client 11/06). */
	background: #f3f4f6;
	border: 1px solid #d1d5db;
	border-radius: 6px;
	padding: 0.4rem 0.8rem;
	margin-top: 1rem;
	cursor: pointer;
	font-family: 'Poppins', sans-serif !important;
	align-self: flex-start;
	transition: box-shadow 0.2s;
}

.aboro-bff-root .aboro-latest-card-btn svg {
	color: var(--aboro-primary);
}

.aboro-bff-root .aboro-latest-card-btn:hover {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.aboro-bff-root .aboro-latest-offers-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #fff;
	border: 1px solid #ddd;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	z-index: 2;
	transition: box-shadow 0.2s;
}

.aboro-bff-root .aboro-latest-offers-arrow:hover {
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.aboro-bff-root .aboro-latest-offers-arrow svg {
	width: 18px;
	height: 18px;
	color: var(--aboro-text);
}

.aboro-bff-root .aboro-latest-offers-arrow-right {
	right: -16px;
}

.aboro-bff-root .aboro-latest-offers-arrow-left {
	left: -16px;
}

/* `hidden` doit l'emporter sur le display:flex de la classe (arrows masquées en bord). */
.aboro-bff-root .aboro-latest-offers-arrow[hidden] {
	display: none;
}

@media (max-width: 600px) {
	.aboro-bff-root .aboro-latest-card {
		flex: 0 0 200px;
	}
	.aboro-bff-root .aboro-latest-offers-arrow {
		display: none;
	}
}

/* ─── Postuler : champ CV + CTA espace candidat (chantier A) ─── */
.aboro-bff-root input[type="file"][name="cv"] {
	width: 100%;
	font-size: 0.85rem;
	padding: 6px 0;
}
.aboro-bff-root .aboro-apply-account-cta {
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px solid #ececec;
}
.aboro-bff-root .aboro-apply-account-cta-title {
	font-size: 0.85rem;
	font-weight: 600;
	margin: 0 0 10px;
}
.aboro-bff-root .aboro-apply-account-cta-actions {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}
.aboro-bff-root .aboro-apply-account-cta-note { font-size: 0.8rem; color: var(--aboro-muted, #6b7280); margin: 0 0 8px; }

/* « â » stylisé Âboro dans la fiche offre (remplace le picto — revue 11/06) */
.aboro-bff-root .aboro-modal-recap-icon .aboro-recap-a {
	display: inline-block;
	font-family: 'Poppins', sans-serif !important;
	font-weight: 800;
	font-size: 46px;
	line-height: 1;
	color: var(--aboro-primary);
}

/* ─── Surcharges cartes « dernières offres » (revue client 11/06) ───
   Un Custom CSS Divi collé dans la page d'accueil duplique les ANCIENS
   styles de cartes (sector rouge, titre noir, bouton blanc) avec !important.
   Ces règles plus spécifiques (3 classes) garantissent le rendu validé.
   À terme : supprimer le CSS custom Divi en doublon côté admin WP. */
.aboro-bff-root .aboro-latest-offers .aboro-latest-card-sector {
	color: var(--aboro-text) !important;
	font-weight: 400 !important;
	text-decoration: none !important;
}
.aboro-bff-root .aboro-latest-offers .aboro-latest-card-title {
	color: var(--aboro-primary) !important;
	font-weight: 700 !important;
}
.aboro-bff-root .aboro-latest-offers .aboro-latest-card {
	border: 1px solid #d8dade !important;
}
.aboro-bff-root .aboro-latest-offers .aboro-latest-card:hover {
	border-color: var(--aboro-primary) !important;
}
.aboro-bff-root .aboro-latest-offers .aboro-latest-card-btn {
	background: #f3f4f6 !important;
	border-color: #d1d5db !important;
}

/* ─── [aboro_cv_buttons] : « Je dépose mon CV » + « Je crée mon espace » ─── */
/* Conteneur en bloc + text-align (PAS flex) : immunisé contre le contexte
 * flex des colonnes Divi qui faisait s'effondrer le conteneur flex. Les
 * boutons (inline-flex) se placent côte à côte, centrés, et passent à la
 * ligne proprement si la colonne est étroite. */
.aboro-bff-root .aboro-cv-buttons {
	display: block;
	text-align: center;        /* boutons centrés dans la div (revue client) */
	width: 100%;
	margin: 0;
}
.aboro-bff-root .aboro-cv-buttons-left { text-align: left; }
.aboro-bff-root .aboro-cv-buttons .aboro-cv-btn {
	display: inline-flex;      /* côte à côte (flux inline) */
	vertical-align: middle;
	margin: 7px;               /* remplace le gap flex */
	/* Largeur identique pour les deux boutons (revue client). */
	min-width: 230px;
	justify-content: center;
	box-sizing: border-box;
}
/* Petite étoile/astérisque après « Je dépose mon CV ». */
.aboro-bff-root .aboro-cv-btn-star {
	color: var(--aboro-primary);
	font-weight: 700;
	margin-left: 2px;
	line-height: 1;
}

/* Bouton CTA « Voir les offres » (rouge dégradé + texte blanc).
 * Ajoute la classe `aboro-btn-offres` à ton bouton Divi pour l'appliquer. */
.aboro-bff-root .aboro-btn-offres,
.aboro-btn-offres.et_pb_button,
a.aboro-btn-offres {
	background-image: linear-gradient(90deg, #e21411 0%, #cb1112 100%) !important;
	background-color: #cb1112 !important;
	color: #ffffff !important;
	border-color: transparent !important;
}
.aboro-bff-root .aboro-btn-offres:hover,
.aboro-btn-offres.et_pb_button:hover,
a.aboro-btn-offres:hover {
	background-image: linear-gradient(90deg, #cb1112 0%, #a80d10 100%) !important;
	color: #ffffff !important;
}
.aboro-bff-root .aboro-cv-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	background: #efefef;
	color: #000 !important;
	border: 0;
	border-radius: 5px;
	font-size: 16px;
	font-weight: 700;
	font-family: 'Poppins', sans-serif !important;
	padding: 10px 1.3em;
	cursor: pointer;
	text-decoration: none !important;
	transition: background 0.15s, box-shadow 0.15s;
}
.aboro-bff-root .aboro-cv-btn:hover { background: #e4e4e4; box-shadow: 0 2px 8px rgba(0,0,0,0.08); }
.aboro-bff-root .aboro-cv-btn-arrow { display: inline-flex; color: var(--aboro-primary); }

/* Panneau gauche de la candidature spontanée (choix de l'agence) */
.aboro-bff-root .aboro-spont-left { padding: 0.5rem 0; }
.aboro-bff-root .aboro-spont-left-title {
	font-size: 1.02rem;
	font-weight: 600;
	line-height: 1.45;
	margin: 0 0 1.1rem;
}
.aboro-bff-root .aboro-spont-agency {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	font-size: 0.9rem;
	margin-bottom: 0.85rem;
	cursor: pointer;
	line-height: 1.4;
}
.aboro-bff-root .aboro-spont-agency input {
	accent-color: var(--aboro-primary);
	margin-top: 3px;
	flex-shrink: 0;
}

/* ─── Gate de connexion pour postuler à une offre (CR 10/06) ─── */
.aboro-bff-root .aboro-apply-loginwall .aboro-btn-block {
	width: 100%;
	justify-content: center;
	margin-top: 4px;
}
.aboro-bff-root .aboro-apply-forgot {
	margin: -4px 0 4px;
	text-align: right;
}
.aboro-bff-root .aboro-apply-forgot a {
	font-size: 0.85rem;
	color: var(--aboro-primary);
	font-weight: 600;
	text-decoration: none;
}
.aboro-bff-root .aboro-apply-forgot a:hover { text-decoration: underline; }
.aboro-bff-root .aboro-apply-loginwall-alt {
	margin: 18px 0 0;
	padding-top: 16px;
	border-top: 1px solid #eee;
	font-size: 0.9rem;
	color: var(--aboro-muted, #5c5c5c);
}
.aboro-bff-root .aboro-apply-loginwall-alt a {
	color: var(--aboro-primary);
	font-weight: 700;
	text-decoration: underline;
}
.aboro-bff-root .aboro-apply-feedback {
	min-height: 1.2em;
	margin-top: 10px;
	font-size: 0.9rem;
}
.aboro-bff-root .aboro-apply-feedback.is-error { color: #dc2626; }
.aboro-bff-root .aboro-apply-feedback.is-success { color: #16a34a; }

/* « â » Âboro rouge dans l'icône de carte offre (remplace le stéthoscope — revue 17/06) */
.aboro-bff-root .aboro-job-card-icon .aboro-card-a {
	display: inline-block;
	font-family: 'Poppins', sans-serif !important;
	font-weight: 800;
	font-size: 44px;
	line-height: 1;
	color: var(--aboro-primary);
}

/* ─── Domaines métier : liste de cases à cocher (remplace un `select multiple`,
   qui exigeait Ctrl/Cmd — geste non intuitif, demande client 18/08). Hauteur
   bornée + défilement : 21 domaines tiendraient sinon sur une page entière. */
.aboro-bff-root .aboro-domains-box {
	max-height: 230px;
	overflow-y: auto;
	border: 1px solid #d8d8d8;
	border-radius: 6px;
	padding: 6px 4px;
	background: #fff;
}
.aboro-bff-root .aboro-domain-option {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 7px 10px;
	border-radius: 4px;
	cursor: pointer;
	font-size: 0.95rem;
	line-height: 1.35;
}
.aboro-bff-root .aboro-domain-option:hover { background: #f5f5f5; }
.aboro-bff-root .aboro-domain-option input[type="checkbox"] {
	width: auto;
	margin: 2px 0 0;
	flex: 0 0 auto;
	cursor: pointer;
}
.aboro-bff-root .aboro-candidate-field.aboro-field-error .aboro-domains-box {
	border-color: #d32f2f;
}
.aboro-bff-root .aboro-domains-error {
	color: #d32f2f;
	font-size: 0.85rem;
	margin: 6px 0 0;
}
/* Mention « (plusieurs choix possibles) » : en flux normal, contrairement à
   `.aboro-field-hint` qui est positionné en absolu et venait chevaucher la
   liste. */
.aboro-bff-root .aboro-field-note {
	font-weight: 400;
	color: #777;
	font-size: 0.85rem;
	margin-left: 6px;
}

/* ── SEO (29/09/2026) : lien des cartes vers la fiche indexable ─────────── */

.aboro-bff-root .aboro-job-card-link {
	color: inherit;
	text-decoration: none;
}

/* ── Fiche d'offre indexable /offre-emploi/{titre}-{id}/ ───────────────── */

.aboro-bff-root.aboro-job-detail-page {
	max-width: 960px;
	margin: 0 auto;
	padding: clamp(32px, 5vw, 64px) 0 clamp(48px, 6vw, 88px);
}

.aboro-bff-root .aboro-breadcrumb ol {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 clamp(20px, 3vw, 32px);
	padding: 0;
	list-style: none;
	font-size: 13px;
	color: #707070;
}

.aboro-bff-root .aboro-breadcrumb li {
	padding: 0;
}

.aboro-bff-root .aboro-breadcrumb li + li::before {
	content: '›';
	margin-right: 6px;
	color: #b3b3b3;
}

.aboro-bff-root .aboro-breadcrumb a {
	color: #707070;
	text-decoration: none;
}

.aboro-bff-root .aboro-breadcrumb a:hover {
	color: var(--aboro-primary, #e21411);
}

.aboro-bff-root .aboro-breadcrumb [aria-current='page'] {
	color: #242424;
}

.aboro-bff-root .aboro-job-detail-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 28px;
	margin-top: clamp(28px, 4vw, 40px);
	padding-top: clamp(24px, 3vw, 32px);
	border-top: 1px solid #e5e5e5;
}

.aboro-bff-root .aboro-job-detail-cta {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 13px 28px;
	border: 0;
	border-radius: 5px;
	background: var(--aboro-primary, #e21411);
	color: #fff;
	font: 500 16px/1.5 'Poppins', Arial, sans-serif;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.25s;
}

.aboro-bff-root .aboro-job-detail-cta:hover {
	background: var(--aboro-primary-dark, #cb1112);
	color: #fff;
}

.aboro-bff-root .aboro-job-detail-cta svg {
	transition: transform 0.3s;
}

.aboro-bff-root .aboro-job-detail-cta:hover svg {
	transform: translateX(3px);
}

.aboro-bff-root .aboro-job-detail-cta:focus-visible,
.aboro-bff-root .aboro-job-detail-back:focus-visible {
	outline: 2px solid var(--aboro-primary, #e21411);
	outline-offset: 3px;
}

.aboro-bff-root .aboro-job-detail-back {
	color: #242424;
	font-size: 15px;
	text-decoration: underline;
	text-underline-offset: 4px;
}

.aboro-bff-root .aboro-job-detail-back:hover {
	color: var(--aboro-primary, #e21411);
}

.aboro-bff-root .aboro-job-detail-missing {
	padding: clamp(24px, 4vw, 48px) 0;
}

.aboro-bff-root .aboro-job-detail-missing h1 {
	margin: 0 0 12px;
	font-size: clamp(24px, 3vw, 32px);
	font-weight: 600;
}

@media (max-width: 767px) {
	.aboro-bff-root .aboro-job-detail-cta {
		width: 100%;
		justify-content: center;
	}
}