/**
 * Fameen Editorial Workflow — styles publics (signature auteur + signalement).
 * Charte : bleu #1C2F6B, rouge #D71920, gris #F3F5F7, texte #444.
 * Sobre par construction : ces blocs closent l'article, ils ne doivent jamais
 * concurrencer le contenu ni les publicités.
 */

/* ---------------------------------------------------------------- Signature */

.few-author {
	display: flex;
	gap: 18px;
	align-items: flex-start;
	margin: 34px 0 10px;
	padding: 20px 22px;
	background: #F3F5F7;
	border-left: 4px solid #1C2F6B;
	border-radius: 6px;
}

.few-author__photo img {
	width: 96px;
	height: 96px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
}

.few-author__body { flex: 1; min-width: 0; }

.few-author__kicker {
	margin: 0 0 2px;
	font-size: 11px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #6B7280;
}

.few-author__name {
	margin: 0 0 4px;
	font-size: 19px;
	line-height: 1.25;
}
.few-author__name a { color: #1C2F6B; text-decoration: none; }
.few-author__name a:hover,
.few-author__name a:focus { color: #D71920; text-decoration: underline; }

.few-author__role {
	margin: 0 0 8px;
	font-size: 13px;
	font-weight: 600;
	color: #444;
}

.few-author__bio {
	margin: 0 0 8px;
	font-size: 14.5px;
	line-height: 1.6;
	color: #444;
}

.few-author__spec,
.few-author__links { margin: 0; font-size: 13px; color: #555; }

.few-author__links a {
	color: #1C2F6B;
	margin-right: 10px;
	text-decoration: underline;
}
.few-author__links a:hover,
.few-author__links a:focus { color: #D71920; }

/* ------------------------------------------------------------- Signalement */

.few-report { margin: 22px 0 8px; }

.few-report__toggle {
	display: inline-block;
	cursor: pointer;
	font-size: 13.5px;
	font-weight: 600;
	color: #1C2F6B;
	padding: 9px 14px;
	border: 1px solid #D6DBE6;
	border-radius: 6px;
	background: #fff;
	list-style: none;
	/* Zone tactile confortable au doigt (>= 44 px de haut avec le padding). */
	min-height: 22px;
}
.few-report__toggle::-webkit-details-marker { display: none; }
.few-report__toggle::before { content: "✎ "; }
.few-report__toggle:hover { border-color: #1C2F6B; }

/* Le focus doit rester parfaitement visible au clavier (WCAG 2.2). */
.few-report__box summary:focus-visible,
.few-report__form :focus-visible {
	outline: 3px solid #1C2F6B;
	outline-offset: 2px;
}

.few-report__form {
	margin-top: 14px;
	padding: 18px;
	border: 1px solid #E5E7EB;
	border-radius: 6px;
	background: #fff;
}

.few-report__form label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: #333;
	margin-bottom: 4px;
}

.few-report__form input[type="text"],
.few-report__form input[type="email"],
.few-report__form textarea {
	width: 100%;
	padding: 9px 11px;
	border: 1px solid #CBD2E0;
	border-radius: 5px;
	font: inherit;
	font-size: 15px; /* >= 16px évite le zoom auto iOS ; 15 reste confortable. */
	background: #fff;
	color: #222;
}

.few-report__row { display: flex; gap: 14px; flex-wrap: wrap; }
.few-report__row > span { flex: 1 1 220px; }

.few-report__consent label {
	font-weight: 400;
	font-size: 13px;
	line-height: 1.5;
	color: #555;
	display: flex;
	gap: 8px;
	align-items: flex-start;
}
.few-report__consent input { margin-top: 3px; flex: none; }

.few-req { color: #D71920; }

.few-report__submit {
	background: #D71920;
	color: #fff;
	border: 0;
	border-radius: 6px;
	padding: 12px 20px;
	font-weight: 700;
	font-size: 14.5px;
	cursor: pointer;
	min-height: 44px; /* Cible tactile recommandée. */
}
.few-report__submit:hover { background: #b3141a; }

/* Champ piège anti-robot : masqué à l'œil ET aux lecteurs d'écran. */
.few-report__hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.few-report__done {
	margin: 0 0 14px;
	padding: 12px 14px;
	border-radius: 6px;
	background: #E8F5EE;
	border-left: 4px solid #178A5B;
	font-size: 14.5px;
	color: #14503a;
}
.few-report__done--err {
	background: #FEF2F2;
	border-left-color: #D71920;
	color: #7c2d12;
}

@media (max-width: 600px) {
	.few-author { flex-direction: column; gap: 12px; }
	.few-author__photo img { width: 72px; height: 72px; }
	.few-report__row { flex-direction: column; gap: 10px; }
}
