/* ==========================================================================
   FESWEB — Page À propos : compétences de l'équipe + section recrutement
   --------------------------------------------------------------------------
   Volontairement minimal : les champs, libellés et boutons utilisent les
   classes natives du thème (.pxl--item, .wpcf7-form-control, .btn), donc
   seuls les éléments qui n'existent pas déjà dans le thème sont stylés ici :
   les badges de compétences, les onglets, le champ fichier et les messages.
   Tous les sélecteurs sont préfixés .fw-.
   ========================================================================== */

/* ---------- badges de compétences dans les cartes équipe ----------
   Les cartes sont sur fond sombre : badges clairs translucides.
   Le sélecteur reste sous .pxl-team pour ne toucher aucune autre liste. */

.pxl-team .fw-skills {
	list-style: none;
	margin: 12px 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
}

.pxl-team .fw-skills li {
	font-size: 11.5px;
	font-weight: 500;
	line-height: 1.3;
	color: rgba(255, 255, 255, .82);
	background-color: rgba(255, 255, 255, .08);
	border: 1px solid rgba(255, 255, 255, .16);
	border-radius: 30px;
	padding: 5px 11px;
	transition: background-color .3s ease, border-color .3s ease, color .3s ease;
}

.pxl-team .pxl-item--inner:hover .fw-skills li {
	color: #fff;
	background-color: rgba(95, 45, 222, .35);
	border-color: rgba(95, 45, 222, .55);
}

/* Repli si la carte se retrouve sur fond clair. */
@media (prefers-color-scheme: light) {
	.pxl-team-layout1 .pxl-item--holder.on-light .fw-skills li {
		color: var(--primary-darker-20-color, #4922aa);
		background-color: rgba(95, 45, 222, .08);
		border-color: rgba(95, 45, 222, .18);
	}
}

.fw-recruit {
	--fw-primary: var(--primary-color, #5f2dde);
	--fw-primary-dark: var(--primary-darker-20-color, #4922aa);
}

/* ---------- onglets Emploi / Stage ---------- */

.fw-recruit .fw-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 28px;
	padding: 0;
}

.fw-recruit .fw-tab {
	font: inherit;
	font-weight: 600;
	line-height: 1.4;
	color: var(--fw-primary-dark);
	background-color: rgba(95, 45, 222, 0.08);
	background-image: none;
	border: 1px solid rgba(95, 45, 222, 0.18);
	border-radius: 30px;
	padding: 11px 30px;
	margin: 0;
	height: auto;
	box-shadow: none;
	cursor: pointer;
	transition: background-color .3s ease, color .3s ease, border-color .3s ease;
}

.fw-recruit .fw-tab:hover {
	background-color: rgba(95, 45, 222, 0.15);
}

.fw-recruit .fw-tab[aria-selected="true"] {
	color: #fff;
	background-color: var(--fw-primary);
	border-color: var(--fw-primary);
}

.fw-recruit .fw-panel[hidden] { display: none; }

/* ---------- champ fichier (CV) ---------- */

.fw-recruit .fw-file {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	cursor: pointer;
	margin: 0;
}

.fw-recruit .fw-file input[type="file"] {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

.fw-recruit .fw-file__btn {
	display: inline-block;
	font-weight: 600;
	font-size: 14px;
	color: #fff;
	background-color: var(--fw-primary);
	border-radius: 30px;
	padding: 11px 26px;
	white-space: nowrap;
	transition: background-color .3s ease;
}

.fw-recruit .fw-file:hover .fw-file__btn,
.fw-recruit .fw-file input[type="file"]:focus-visible + .fw-file__btn {
	background-color: var(--fw-primary-dark);
}

.fw-recruit .fw-file__name {
	font-size: 14px;
	opacity: .75;
	word-break: break-word;
}

.fw-recruit .fw-file__hint {
	display: block;
	font-size: 12.5px;
	opacity: .6;
	margin-top: 8px;
}

/* ---------- erreurs de champ ---------- */

.fw-recruit .fw-err {
	display: block;
	font-size: 13px;
	font-weight: 500;
	color: #dc2626;
	margin-top: 6px;
}

.fw-recruit .fw-err:empty { display: none; }

.fw-recruit [aria-invalid="true"] {
	border-color: #dc2626 !important;
}

/* ---------- message de retour ---------- */

.fw-recruit .fw-result {
	border-radius: 12px;
	padding: 15px 18px;
	margin-bottom: 22px;
	font-size: 14.5px;
	font-weight: 500;
	line-height: 1.55;
}

.fw-recruit .fw-result[hidden] { display: none; }

.fw-recruit .fw-result.is-ok {
	color: #065f46;
	background-color: rgba(16, 185, 129, .1);
	border: 1px solid rgba(16, 185, 129, .3);
}

.fw-recruit .fw-result.is-err {
	color: #991b1b;
	background-color: rgba(220, 38, 38, .08);
	border: 1px solid rgba(220, 38, 38, .28);
}

/* ---------- état d'envoi ---------- */

.fw-recruit button[data-submit][disabled] {
	opacity: .6;
	cursor: not-allowed;
}

@media (max-width: 640px) {
	.fw-recruit .fw-tab { flex: 1 1 auto; text-align: center; padding: 11px 18px; }
}

/* Le thème ne masque pas ce fieldset : il n'y a que des champs cachés
   dedans, donc un fieldset vide dessine une bordure parasite. */
.fw-recruit .hidden-fields-container {
	display: none !important;
}