/* ═══════════════════════════════════════════════════════════════
   OMAR - Espèces et habitats (portail atlas + fiche espèce)
   Complète main.css (qui définit déjà le hero portail, la grille,
   les stats et la galerie). Chargé sur l'archive espece, les fiches
   et les archives de taxonomie (groupe / UICN / milieu).
   ═══════════════════════════════════════════════════════════════ */

/* ── Onglets par groupe ─────────────────────────────────────── */
.taxo-tabs { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 2rem; }
.taxo-tab {
	padding: .45rem 1.1rem;
	border-radius: var(--r-pill);
	font-size: .8rem;
	font-weight: 600;
	border: 1.5px solid #dde5f0;
	color: var(--c-muted);
	background: #fff;
	text-decoration: none;
	transition: all var(--t-fast);
}
.taxo-tab:hover, .taxo-tab.active { border-color: var(--c-navy); background: var(--c-navy); color: #fff; }

/* ── Accès atlas externe (affiché si l'option est renseignée) ── */
.atlas-cta-box {
	background: linear-gradient(135deg, #003366, var(--c-navy));
	border-radius: var(--r-xl);
	padding: 2.25rem 2.5rem;
	color: #fff;
	display: flex;
	align-items: center;
	gap: 2.5rem;
	margin-bottom: 3rem;
}
.atlas-cta-icon { font-size: 3rem; flex-shrink: 0; }
.atlas-cta-content h3 { color: #fff; margin-bottom: .5rem; }
.atlas-cta-content p  { color: rgba(255,255,255,.7); font-size: .9rem; margin-bottom: 1.25rem; }
.atlas-cta-btns { display: flex; gap: .75rem; flex-wrap: wrap; }

/* ── Vignette lien overlay + multi-photos ───────────────────── */
.atlas-thumb, .atlas-thumb-b { position: relative; }
.atlas-thumb-link { position: absolute; inset: 0; z-index: 2; border-radius: inherit; }

.atlas-thumb-b {
	border-radius: var(--r-md);
	overflow: hidden;
	background: #fff;
	box-shadow: var(--shadow-sm);
	transition: transform var(--t-std), box-shadow var(--t-std);
	display: block;
}
.atlas-thumb-b:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.atlas-thumb-b-imgs { position: relative; aspect-ratio: 1; overflow: hidden; }
.thumb-img-b { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .38s ease; }
.thumb-img-b.active { opacity: 1; }
.atlas-thumb-b-imgs::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 40%; background: linear-gradient(to top, rgba(0,10,30,.5) 0%, transparent 100%); pointer-events: none; }
.thumb-dots { position: absolute; bottom: .55rem; left: 50%; transform: translateX(-50%); display: flex; gap: 5px; z-index: 3; }
.thumb-dot { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.45); border: 1.5px solid rgba(255,255,255,.6); transition: background .22s, transform .22s; }
.thumb-dot.active { background: #fff; transform: scale(1.2); }
.atlas-thumb-b .atlas-thumb-label { padding: .6rem .75rem .75rem; }

.atlas-empty { text-align: center; padding: 3rem 1rem; color: var(--c-muted); }

/* ── Pastilles UICN ─────────────────────────────────────────── */
.iucn-pill {
	display: inline-flex; align-items: center; gap: .4rem;
	padding: .3rem .9rem; border-radius: var(--r-pill);
	font-size: .78rem; font-weight: 700;
	text-transform: uppercase; letter-spacing: .08em;
}
.iucn-lc { background: #dcfce7; color: #15803d; }
.iucn-nt { background: #fef9c3; color: #a16207; }
.iucn-vu { background: #ffedd5; color: #c2410c; }
.iucn-en { background: #fee2e2; color: #b91c1c; }
.iucn-cr { background: #fecaca; color: #991b1b; }
.iucn-dd { background: #e5e7eb; color: #4b5563; }
.iucn-ne { background: #e5e7eb; color: #6b7280; }

/* ═══════════════ FICHE ESPÈCE ══════════════════════════════════ */
.fiche-breadcrumb { display: flex; align-items: center; gap: .5rem; font-size: .8rem; color: rgba(255,255,255,.7); flex-wrap: wrap; }
.fiche-breadcrumb a { color: rgba(255,255,255,.8); text-decoration: none; }
.fiche-breadcrumb a:hover { color: #fff; text-decoration: underline; }
.fiche-breadcrumb span { opacity: .4; }
.fiche-breadcrumb-current { color: rgba(255,255,255,.85); }

.fiche-hero { background: linear-gradient(180deg, #0a3a6e 0%, var(--c-deep) 100%); padding: 6rem 0 3.5rem; color: #fff; }
.fiche-hero-inner { display: grid; grid-template-columns: 1fr 380px; gap: 3rem; align-items: center; margin-top: 1.75rem; }
.fiche-hero-main h1 { font-size: clamp(2rem, 4vw, 3rem); color: #fff; margin-bottom: .3rem; line-height: 1.1; }
.fiche-sci { font-style: italic; color: rgba(255,255,255,.6); font-size: 1.05rem; margin-bottom: 1rem; }
.fiche-hero-lead { color: rgba(255,255,255,.72); max-width: 540px; line-height: 1.7; margin-bottom: 1rem; }
.fiche-hero-img { border-radius: var(--r-lg); overflow: hidden; box-shadow: 0 12px 40px rgba(0,0,0,.35); }
.fiche-hero-img img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.fiche-badges { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.fiche-pdf-btn { color: #fff; border-color: rgba(255,255,255,.4); background: transparent; margin-bottom: .5rem; }
.fiche-pdf-btn:hover { background: rgba(255,255,255,.12); border-color: #fff; }
.fiche-stats { display: flex; gap: 2rem; margin-top: 1.5rem; flex-wrap: wrap; }
.fiche-stat-num { font-family: var(--f-display); font-size: 1.5rem; font-weight: 700; color: #fff; line-height: 1; }
.fiche-stat-lbl { font-size: .72rem; color: rgba(255,255,255,.55); text-transform: uppercase; letter-spacing: .07em; margin-top: .25rem; }

.fiche-nav-bar { background: #f4f8ff; border-bottom: 1.5px solid #e4edf8; padding: .9rem 0; }
.fiche-nav-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.fiche-nav-link { display: flex; align-items: center; gap: .5rem; font-size: .82rem; font-weight: 600; color: var(--c-navy); text-decoration: none; padding: .4rem .8rem; border-radius: var(--r-pill); transition: background var(--t-fast); }
.fiche-nav-link:hover { background: #fff; }
.fiche-nav-center a { font-size: .8rem; color: var(--c-sky); text-decoration: none; font-weight: 600; }
.fiche-nav-center a:hover { text-decoration: underline; }

.fiche-content { padding: 3rem 0 4rem; background: #fff; }
.fiche-layout { display: grid; grid-template-columns: 1fr 280px; gap: 3rem; align-items: start; }
.fiche-main { min-width: 0; }

.fiche-section { margin-bottom: 2.5rem; }
.fiche-section-title { font-size: .9rem; font-weight: 700; color: var(--c-navy); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 1rem; padding-bottom: .5rem; border-bottom: 1.5px solid #e4edf8; }

.noms-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; }
.nom-item { background: #f4f8ff; border-radius: var(--r-md); padding: .75rem 1rem; }
.nom-lang { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--c-sky); }
.nom-val { font-weight: 600; font-size: .92rem; margin-top: .1rem; }

.bio-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; }
.fiche-section .bio-item { text-align: left; padding: .9rem 1rem; }
.bio-label { font-size: .68rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--c-muted); margin-bottom: .3rem; }
.bio-value { font-family: var(--f-display); font-size: 1.2rem; font-weight: 700; color: var(--c-navy); }
.bio-unit { font-size: .72rem; font-weight: 400; color: var(--c-muted); }
.bio-alim { margin-top: 1rem; font-size: .9rem; color: var(--c-ink); line-height: 1.7; }

.fiche-description { color: var(--c-muted); line-height: 1.8; font-size: .98rem; }
.fiche-description p { margin-bottom: 1rem; }
.fiche-description p:last-child { margin-bottom: 0; }
.fiche-description a { color: var(--c-sky); }

.fiche-map img { width: 100%; border-radius: var(--r-lg); display: block; }
.map-placeholder { background: linear-gradient(135deg, #eef5ff, #ddeeff); border-radius: var(--r-lg); aspect-ratio: 16/7; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: .75rem; color: var(--c-muted); border: 1.5px dashed #b0c8e8; text-align: center; padding: 1rem; }
.map-placeholder svg { width: 40px; opacity: .4; }

.ext-links { display: flex; gap: .6rem; flex-wrap: wrap; }
.ext-link-btn { display: inline-flex; align-items: center; gap: .4rem; padding: .5rem 1.1rem; border-radius: var(--r-pill); border: 1.5px solid #dde5f0; font-size: .8rem; font-weight: 600; color: var(--c-navy); text-decoration: none; transition: all var(--t-fast); }
.ext-link-btn:hover { border-color: var(--c-sky); background: #f4f8ff; }

/* Sidebar */
.fiche-sidebar { position: sticky; top: 90px; }
.sidebar-card { background: #f4f8ff; border: 1.5px solid #e4edf8; border-radius: var(--r-lg); padding: 1.25rem; margin-bottom: 1rem; }
.sidebar-card h4 { font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--c-navy); margin: 0 0 .9rem; }
.sidebar-taxo-row { display: flex; justify-content: space-between; align-items: baseline; padding: .35rem 0; border-bottom: 1px solid #e4edf8; font-size: .82rem; }
.sidebar-taxo-row:last-child { border-bottom: none; }
.sidebar-taxo-rank { color: var(--c-muted); font-size: .72rem; }
.sidebar-taxo-val { font-weight: 600; color: var(--c-ink); font-style: italic; }
.sidebar-cta { background: linear-gradient(135deg, #003366, var(--c-navy)); border-radius: var(--r-lg); padding: 1.25rem; color: #fff; text-align: center; }
.sidebar-cta p { color: rgba(255,255,255,.7); font-size: .82rem; margin-bottom: 1rem; }

/* Pagination atlas (paginate_links) */
.atlas-pagination { display: flex; align-items: center; justify-content: center; gap: .4rem; margin-top: 3rem; flex-wrap: wrap; }
.atlas-pagination .page-numbers {
	min-width: 36px; height: 36px; padding: 0 .6rem;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: var(--r-md); border: 1.5px solid #dde5f0; background: #fff;
	color: var(--c-muted); font-size: .83rem; font-weight: 600; text-decoration: none;
	transition: all var(--t-fast);
}
.atlas-pagination a.page-numbers:hover { border-color: var(--c-navy); color: var(--c-navy); }
.atlas-pagination .page-numbers.current { background: var(--c-navy); border-color: var(--c-navy); color: #fff; }
.atlas-pagination .page-numbers.dots { border: none; }

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 900px) {
	.fiche-hero-inner { grid-template-columns: 1fr; }
	.fiche-hero-img { order: -1; max-width: 480px; margin: 0 auto; }
	.fiche-layout { grid-template-columns: 1fr; }
	.fiche-sidebar { position: static; }
	.noms-list, .bio-grid { grid-template-columns: 1fr 1fr; }
	.atlas-cta-box { flex-direction: column; text-align: center; gap: 1.25rem; }
}
@media (max-width: 540px) {
	.noms-list, .bio-grid { grid-template-columns: 1fr; }
	.fiche-stats { gap: 1.25rem; }
	.fiche-nav-inner { flex-wrap: wrap; }
	.fiche-nav-center { order: 3; width: 100%; text-align: center; }
}

/* Logo d'impression : masqué à l'écran. */
.fiche-print-logo { display: none; }

/* ── Impression / PDF (bouton « Générer un PDF ») ─────────────── */
@media print {

	/* Format de page - pas d'en-tête ni de pied répétés. */
	@page { size: A4; margin: 15mm 14mm; }

	/* Couleurs conservées (pastilles, badges). */
	* { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }

	/* Masquer tout ce qui ne sert pas sur papier. */
	.site-nav, .site-footer, .fiche-nav-bar, .fiche-pdf-btn, .skip-link,
	.sidebar-cta, .map-placeholder, .atlas-pagination { display: none !important; }

	body { background: #fff !important; color: #1a1a1a; font-size: 10.5pt; }
	a { text-decoration: none; color: #1a1a1a; }

	/* Logo OMAR : une seule fois, en haut de la fiche. */
	.fiche-print-logo { display: block; margin: 0 0 5mm; }
	.fiche-print-logo img { height: 30px; width: auto; }

	/* Hero : fond clair, texte noir, sur une largeur pleine. */
	.fiche-hero { background: #fff !important; color: #1a1a1a !important; padding: 0 0 .6rem !important; border-bottom: 1.5px solid #d7e0ec; }
	.fiche-hero-inner { grid-template-columns: 1.4fr 1fr !important; gap: 1.2rem !important; margin-top: .4rem !important; }
	.fiche-hero-main h1 { color: #002050 !important; font-size: 22pt; margin-bottom: .1rem; }
	.fiche-sci { color: #444 !important; font-size: 11pt; margin-bottom: .5rem; }
	.fiche-hero-lead { color: #333 !important; font-size: 10pt; }
	.fiche-breadcrumb { display: none !important; }
	.fiche-hero-img { box-shadow: none !important; }
	.fiche-hero-img img { aspect-ratio: 4/3; max-height: 62mm; }
	.fiche-stats { gap: 1.2rem; margin-top: .8rem; }
	.fiche-stat-num { color: #002050 !important; font-size: 13pt; }
	.fiche-stat-lbl { color: #555 !important; }

	/* Corps sur une seule colonne, la classification passe en fin. */
	.fiche-content { padding: .8rem 0 0 !important; }
	.fiche-layout { display: block !important; }
	.fiche-sidebar { position: static !important; margin-top: 1rem; }
	.container { max-width: none; padding: 0; }

	/* Sections : titres soignés, pas de coupure interne. */
	.fiche-section { margin-bottom: 1.1rem; break-inside: avoid; }
	.fiche-section-title { color: #002050 !important; break-after: avoid; }
	.fiche-section, .bio-item, .nom-item, .sidebar-card,
	.species-gallery, .fiche-hero-inner, .fiche-badges { break-inside: avoid; }
	.bio-item, .nom-item, .sidebar-card { background: #f3f6fb !important; border: 1px solid #e2e9f3; }
	img { break-inside: avoid; }

	/* Liens externes : afficher l'URL en clair. */
	.ext-links a::after, .fiche-description a[href^="http"]::after {
		content: " (" attr(href) ")";
		font-size: .82em; color: #666; word-break: break-all;
	}
	.ext-link-btn { border: 1px solid #ccd6e4 !important; }
}