/**
 * Accessibilité — contrastes, focus, navigation clavier, labels visuels.
 */

:root {
	--a11y-focus-ring: 3px solid var(--news-gold, #ffcc00);
	--a11y-focus-offset: 3px;
	--a11y-text-muted: #4a5568;
	--a11y-text-body: #2c3e50;
	--a11y-link: #145a9e;
	--a11y-link-hover: #b30000;
}

/* ── Screen reader + skip link ── */
.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.screen-reader-text:focus,
.skip-link:focus {
	position: fixed;
	top: 8px;
	inset-inline-start: 8px;
	z-index: 100001;
	width: auto;
	height: auto;
	margin: 0;
	padding: 10px 16px;
	overflow: visible;
	clip: auto;
	white-space: normal;
	background: var(--news-charcoal, #1a1a1a);
	color: #fff;
	font-size: 0.875rem;
	font-weight: 700;
	line-height: 1.35;
	border-radius: var(--news-radius-sm, 8px);
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.28);
	text-decoration: none;
	outline: var(--a11y-focus-ring);
	outline-offset: var(--a11y-focus-offset);
}

/* ── Focus visible global (priorité sur outline:none des composants) ── */
:where(
	a,
	button,
	input,
	textarea,
	select,
	summary,
	[role="button"],
	[tabindex="0"]
):focus-visible {
	outline: var(--a11y-focus-ring);
	outline-offset: var(--a11y-focus-offset);
}

.hero-dot:focus-visible,
.footer-back-top:focus-visible,
.entry-share__btn:focus-visible,
.entry-share-sticky__btn:focus-visible,
.carousel-prev:focus-visible,
.carousel-next:focus-visible,
.header-icon-btn:focus-visible,
.menu-toggle:focus-visible,
.dark-mode-toggle:focus-visible {
	outline: var(--a11y-focus-ring);
	outline-offset: var(--a11y-focus-offset);
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35);
}

/* Champs — ring visible même si :focus { outline:none } ailleurs */
:where(
	input,
	textarea,
	select,
	.header-search__field,
	.footer-newsletter-input,
	.article-newsletter__input,
	.search-field
):focus-visible {
	outline: var(--a11y-focus-ring) !important;
	outline-offset: 2px !important;
	border-color: var(--news-gold, #ffcc00) !important;
}

/* Cartes cliquables */
:where(
	.home-mosaic-tile a,
	.home-highlight-card a,
	.home-feed-item a,
	.post-card a,
	.related-post__link,
	.most-viewed-card-link
):focus-visible {
	outline: var(--a11y-focus-ring);
	outline-offset: 3px;
	border-radius: 4px;
}

/* ── Contrastes texte ── */
body {
	color: var(--a11y-text-body);
}

.entry-meta,
.entry-meta > span,
.post-card-meta,
.related-post__time,
.lachtv-breadcrumb__link,
.front-page .home-feed-time,
.front-page .most-viewed-views,
.single-post .entry-meta > span {
	color: var(--a11y-text-muted) !important;
}

.entry-content a,
body.single-lachtv .single-post .entry-content a {
	color: var(--a11y-link);
}

.entry-content a:hover,
body.single-lachtv .single-post .entry-content a:hover {
	color: var(--a11y-link-hover);
}

/* Ticker — texte plus lisible sur fond sombre */
.site-header.site-header--magazine .breaking-text {
	color: #fff !important;
	font-weight: 700;
}

.site-header.site-header--magazine .breaking-label {
	font-weight: 800;
	letter-spacing: 0.02em;
}

/* Meta petite taille — plancher 12px */
.entry-meta > span,
.post-card-meta,
.related-post__reading,
.most-viewed-subtitle {
	font-size: max(0.75rem, 1em) !important;
}

/* Boutons touch — min 44px mobile */
@media (max-width: 768px) {
	.menu-toggle,
	.dark-mode-toggle,
	.header-search__submit,
	.entry-share__btn,
	.hero-dot,
	.footer-back-top,
	.carousel-prev,
	.carousel-next {
		min-width: 44px;
		min-height: 44px;
	}
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto !important;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

/* ── Dialog notification ── */
.notification-popup[open],
.notification-popup:not([hidden]) {
	display: block;
}

.notification-popup:focus {
	outline: none;
}

.notification-popup .notification-subscribe:focus-visible,
.notification-popup .notification-later:focus-visible {
	outline: var(--a11y-focus-ring);
	outline-offset: 2px;
}

/* ── Dark mode ── */
body.dark-mode {
	--a11y-text-muted: #b8bcc4;
	--a11y-text-body: #e8eaed;
	--a11y-link: #7eb8ff;
	--a11y-link-hover: #ff8080;
}

body.dark-mode .screen-reader-text:focus,
body.dark-mode .skip-link:focus {
	background: #000;
	color: #fff;
}

body.dark-mode :where(a, button, input, textarea, select):focus-visible {
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4);
}