/**
 * Dassou Scan — typographie, UI type madarascans.com, contenu (Madara + Elementor)
 * - :where() = faible spécificité : Elementor garde la priorité sur couleurs / polices.
 * - Images « floues » : filtres CSS légers (contraste / saturation) + couche GPU ; pas de recréation HD sans fichier source.
 * - JS : window.dassouscanToggleSharpImages() pour désactiver / réactiver (localStorage).
 */
:root {
	--dss-accent: #f59e0b;
	--dss-accent-hover: #fbbf24;
	--dss-link: #38bdf8;
	--dss-link-hover: #7dd3fc;
	--dss-text: #e5e7eb;
	--dss-text-muted: #9ca3af;
	--dss-heading: #f8fafc;
	--dss-surface: rgba(15, 23, 42, 0.45);
	--dss-radius: 12px;
	--dss-font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", sans-serif;
	--dss-leading-body: 1.68;
	--dss-leading-heading: 1.22;
	--dss-tracking-heading: -0.02em;
	--ms-slider-accent: var(--dss-accent);
	--ms-slider-accent-hover: var(--dss-accent-hover);
	--dss-glass: rgba(15, 23, 42, 0.55);
	--dss-border-subtle: rgba(255, 255, 255, 0.08);
	--dss-card-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
	--dss-card-shadow-hover: 0 16px 48px rgba(0, 0, 0, 0.45);
	--dss-img-contrast: 1.07;
	--dss-img-saturate: 1.06;
	--dss-img-brightness: 1.02;
}

/* --- Base lisibilité (ne remplace pas les couleurs forcées par Elementor inline) --- */
:where(body) {
	font-family: var(--dss-font-sans);
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-feature-settings: "kern" 1, "liga" 1;
}

/* Mode sombre Madara (text-ui-light = fond sombre) */
:where(body.text-ui-light) {
	color: var(--dss-text);
}

:where(body.text-ui-light a:not(.c-btn):not(.button):not(.wp-block-button__link)) {
	color: var(--dss-link);
	transition: color 0.2s ease, opacity 0.2s ease;
}

:where(body.text-ui-light a:not(.c-btn):not(.button):not(.wp-block-button__link):hover) {
	color: var(--dss-link-hover);
}

/* --- Titres & textes zone principale Madara --- */
:where(.site-content .main-col) {
	font-size: clamp(0.95rem, 0.2vw + 0.9rem, 1.05rem);
	line-height: var(--dss-leading-body);
}

:where(.site-content .main-col h1) {
	font-size: clamp(1.65rem, 2.2vw + 1rem, 2.35rem);
	line-height: var(--dss-leading-heading);
	letter-spacing: var(--dss-tracking-heading);
	font-weight: 700;
}

:where(.site-content .main-col h2) {
	font-size: clamp(1.35rem, 1.4vw + 0.95rem, 1.85rem);
	line-height: var(--dss-leading-heading);
	letter-spacing: var(--dss-tracking-heading);
	font-weight: 600;
}

:where(.site-content .main-col h3),
:where(.site-content .main-col h4) {
	line-height: var(--dss-leading-heading);
	letter-spacing: var(--dss-tracking-heading);
	font-weight: 600;
}

:where(body.text-ui-light .site-content .main-col h1,
	body.text-ui-light .site-content .main-col h2,
	body.text-ui-light .site-content .main-col h3,
	body.text-ui-light .site-content .main-col h4) {
	color: var(--dss-heading);
}

:where(.site-content .main-col p) {
	margin-bottom: 1.05em;
}

:where(.site-content .main-col .post-title h3 a,
	.site-content .main-col .post-title h4 a) {
	transition: color 0.2s ease;
}

:where(body.text-ui-light .site-content .main-col .post-title h3 a,
	body.text-ui-light .site-content .main-col .post-title h4 a) {
	color: var(--dss-heading);
}

:where(body.text-ui-light .site-content .main-col .post-title h3 a:hover,
	body.text-ui-light .site-content .main-col .post-title h4 a:hover) {
	color: var(--dss-accent);
}

/* Blocs titres de section (Dernières sorties, Populaires, etc.) */
:where(.c-blog__heading h2,
	.widget-heading h4,
	.c-widget__heading .h4,
	.heading__layout .heading-title) {
	font-weight: 700;
	letter-spacing: var(--dss-tracking-heading);
	line-height: var(--dss-leading-heading);
}

:where(body.text-ui-light .c-blog__heading h2,
	body.text-ui-light .widget-heading h4,
	body.text-ui-light .c-widget__heading .h4) {
	color: var(--dss-heading);
}

:where(.c-blog__heading .c-blog__heading__action .c-btn,
	.widget-heading .btn) {
	border-radius: var(--dss-radius);
}

/* Résumés / méta */
:where(.site-content .font-meta,
	.site-content .item-meta,
	.site-content .post-on) {
	color: var(--dss-text-muted);
	font-size: 0.875rem;
	line-height: 1.5;
}

:where(.tab-summary .post-content,
	.summary__content,
	.c-tabs-item__content .description) {
	line-height: var(--dss-leading-body);
}

:where(body.text-ui-light .tab-summary .post-content,
	body.text-ui-light .summary__content) {
	color: var(--dss-text);
}

/* --- Elementor : confort de lecture sans écraser les réglages du widget --- */
:where(.elementor-widget-text-editor .elementor-widget-container) {
	line-height: var(--dss-leading-body);
}

:where(.elementor-widget-text-editor .elementor-widget-container p) {
	margin-bottom: 1em;
}

:where(.elementor-widget-text-editor .elementor-widget-container a) {
	text-underline-offset: 0.18em;
	transition: color 0.2s ease, opacity 0.2s ease;
}

:where(.elementor-widget-heading .elementor-heading-title) {
	line-height: var(--dss-leading-heading);
	letter-spacing: var(--dss-tracking-heading);
}

:where(.elementor-widget-icon-list .elementor-icon-list-item) {
	line-height: 1.55;
}

:where(.elementor-widget-button .elementor-button) {
	border-radius: var(--dss-radius);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

:where(.elementor-widget-button .elementor-button:hover) {
	transform: translateY(-1px);
}

/* Colonnes / sections : léger contraste (ignore si fond déjà défini dans Elementor) */
:where(.elementor-section.elementor-section-boxed > .elementor-container) {
	border-radius: var(--dss-radius);
}

/* Liste de chapitres / tableaux lisibles */
:where(body.text-ui-light .manga-chapters-listing,
	body.text-ui-light .listing-chapters_wrap) {
	font-variant-numeric: tabular-nums;
}

/* Widgets barre latérale */
:where(#main-sidebar .widget) {
	font-size: 0.94rem;
	line-height: 1.6;
}

:where(body.text-ui-light #main-sidebar .widget a:hover) {
	color: var(--dss-accent-hover);
}

/* =============================================================================
   UI type madarascans.com — cartes, header, listes (Madara)
   ============================================================================= */

/* En-tête & recherche */
:where(body.text-ui-light .site-header .c-header__top) {
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border-bottom: 1px solid var(--dss-border-subtle);
}

:where(body.text-ui-light .site-header .c-header__top .search-main-menu form input[type="text"],
	body.text-ui-light .site-header .c-header__top .search-main-menu form input[type="search"]) {
	border-radius: var(--dss-radius);
	border: 1px solid var(--dss-border-subtle);
	background: var(--dss-glass);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

:where(body.text-ui-light .site-header .c-header__top .search-main-menu form input[type="text"]:focus,
	body.text-ui-light .site-header .c-header__top .search-main-menu form input[type="search"]:focus) {
	border-color: rgba(245, 158, 11, 0.45);
	box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.15);
}

:where(.site-header .c-sub-header-nav) {
	border-radius: 0 0 var(--dss-radius) var(--dss-radius);
}

/* Vignettes grilles manga */
:where(.page-listing-item .item-thumb) {
	border-radius: var(--dss-radius);
	overflow: hidden;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	box-shadow: var(--dss-card-shadow);
}

:where(.page-listing-item:hover .item-thumb) {
	transform: translateY(-4px);
	box-shadow: var(--dss-card-shadow-hover);
}

:where(.page-listing-item .item-thumb img) {
	transition: transform 0.45s ease;
}

:where(.page-listing-item:hover .item-thumb img) {
	transform: scale(1.03);
}

:where(.page-item-detail .item-summary) {
	border-radius: var(--dss-radius);
}

/* Onglets résultats recherche / listing */
:where(.tab-content-wrap .c-tabs-item .c-tabs-item__content) {
	border-radius: var(--dss-radius);
	border: 1px solid transparent;
	transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

:where(body.text-ui-light .tab-content-wrap .c-tabs-item .c-tabs-item__content) {
	background: linear-gradient(165deg, rgba(30, 41, 59, 0.5), rgba(15, 23, 42, 0.35));
	border-color: var(--dss-border-subtle);
}

:where(.tab-content-wrap .c-tabs-item:hover .c-tabs-item__content) {
	box-shadow: var(--dss-card-shadow);
	border-color: rgba(245, 158, 11, 0.2);
}

/* Fil d’Ariane */
:where(.c-breadcrumb-wrapper .c-breadcrumb) {
	font-size: 0.875rem;
	letter-spacing: 0.02em;
}

:where(body.text-ui-light .c-breadcrumb-wrapper .c-breadcrumb a) {
	color: var(--dss-text-muted);
}

:where(body.text-ui-light .c-breadcrumb-wrapper .c-breadcrumb a:hover) {
	color: var(--dss-accent);
}

/* Pagination */
:where(.wp-pagenavi a,
	.wp-pagenavi span) {
	border-radius: 999px;
	padding: 0.35em 0.85em;
	transition: background 0.2s ease, color 0.2s ease, transform 0.15s ease;
}

:where(body.text-ui-light .wp-pagenavi a:hover) {
	background: rgba(245, 158, 11, 0.2);
	color: var(--dss-accent-hover);
}

/* Fiche manga — bloc résumé */
:where(body.text-ui-light .profile-manga .tab-summary .summary_image,
	body.text-ui-light .profile-manga .tab-summary .summary_content_wrap) {
	border-radius: var(--dss-radius);
	border: 1px solid var(--dss-border-subtle);
}

:where(.profile-manga .post-rating .score) {
	font-weight: 700;
	letter-spacing: 0.02em;
}

/* Boutons Madara génériques */
:where(.c-btn:not(.c-btn_style-3)) {
	border-radius: var(--dss-radius);
	transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

:where(.c-btn:not(:disabled):hover) {
	transform: translateY(-1px);
}

/* Pied de page */
:where(body.text-ui-light .site-footer) {
	border-top: 1px solid var(--dss-border-subtle);
}

/* Grille Elementor : cartes image */
:where(.elementor-widget-image .elementor-widget-container img) {
	border-radius: calc(var(--dss-radius) - 2px);
	transition: box-shadow 0.3s ease, transform 0.3s ease;
}

:where(.elementor-widget-image .elementor-widget-container a:hover img) {
	box-shadow: var(--dss-card-shadow-hover);
}

/* =============================================================================
   Images lecteur — rendu plus « propre » (perception, pas magie sur fichiers HD)
   - Désactiver : classe body .dsss-sharp-img-off (ou localStorage via script)
   - Ajuster : --dss-img-contrast / --dss-img-saturate / --dss-img-brightness
   ============================================================================= */
:where(.c-blog-post .entry-content .entry-content_wrap .read-container img,
	.reading-content img,
	body.wp-manga-page .wp-manga-section .read-container img,
	#oneshot-reader img) {
	max-width: 100%;
	height: auto;
	display: block;
	margin-left: auto;
	margin-right: auto;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transform: translateZ(0);
}

/* Filtre léger quand le mode netteté est actif (défaut) */
body:not(.dsss-sharp-img-off) .c-blog-post .entry-content .entry-content_wrap .read-container img,
body:not(.dsss-sharp-img-off) .reading-content img,
body:not(.dsss-sharp-img-off).wp-manga-page .wp-manga-section .read-container img,
body:not(.dsss-sharp-img-off) #oneshot-reader img {
	filter: contrast(var(--dss-img-contrast)) saturate(var(--dss-img-saturate)) brightness(var(--dss-img-brightness));
}

/* Conteneur lecture : largeur confortable type sites scan */
:where(.reading-content .text-left,
	.c-blog-post .entry-content .entry-content_wrap .read-container) {
	max-width: min(920px, 100%);
	margin-left: auto;
	margin-right: auto;
}

:where(body.reading-manga .reading-content) {
	padding-left: clamp(8px, 2vw, 20px);
	padding-right: clamp(8px, 2vw, 20px);
}

/* Vignettes hors lecteur : léger punch sans pixeliser */
:where(body:not(.dsss-sharp-img-off) .page-listing-item .item-thumb img,
	body:not(.dsss-sharp-img-off) .slider__thumb_item img) {
	filter: contrast(1.03) saturate(1.04);
}

/* =============================================================================
   Bouton flottant « netteté » (page lecture uniquement, injecté par PHP)
   ============================================================================= */
.dsss-sharp-fab {
	position: fixed;
	bottom: max(1rem, env(safe-area-inset-bottom));
	right: max(1rem, env(safe-area-inset-right));
	z-index: 99990;
	display: none;
	align-items: center;
	gap: 0.45rem;
	padding: 0.55rem 0.85rem;
	border: 1px solid var(--dss-border-subtle, rgba(255, 255, 255, 0.12));
	border-radius: 999px;
	background: rgba(15, 23, 42, 0.88);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	color: #f8fafc;
	font-family: var(--dss-font-sans, system-ui, sans-serif);
	font-size: 0.78rem;
	font-weight: 600;
	cursor: pointer;
	box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
	transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease, color 0.2s ease;
}

body.reading-manga .dsss-sharp-fab {
	display: inline-flex;
}

.dsss-sharp-fab:hover {
	border-color: rgba(245, 158, 11, 0.45);
	box-shadow: 0 10px 36px rgba(0, 0, 0, 0.55);
	transform: translateY(-1px);
}

.dsss-sharp-fab:focus-visible {
	outline: 2px solid var(--dss-accent, #f59e0b);
	outline-offset: 3px;
}

.dsss-sharp-fab--off {
	color: var(--dss-text-muted, #9ca3af);
	border-color: rgba(148, 163, 184, 0.25);
}

.dsss-sharp-fab__glow {
	position: absolute;
	inset: -2px;
	border-radius: inherit;
	background: radial-gradient(circle at 30% 30%, rgba(245, 158, 11, 0.35), transparent 55%);
	opacity: 0.9;
	pointer-events: none;
	z-index: -1;
}

.dsss-sharp-fab--off .dsss-sharp-fab__glow {
	opacity: 0.2;
}

.dsss-sharp-fab__icon {
	flex-shrink: 0;
	display: block;
}

.dsss-sharp-fab__text {
	white-space: nowrap;
	max-width: min(42vw, 11rem);
	overflow: hidden;
	text-overflow: ellipsis;
}

@media (max-width: 480px) {
	.dsss-sharp-fab__text {
		display: none;
	}

	.dsss-sharp-fab {
		padding: 0.65rem;
	}
}

/* Moins d’animations si l’utilisateur le demande (confort + perf) */
@media (prefers-reduced-motion: reduce) {
	.dsss-sharp-fab,
	:where(.page-listing-item .item-thumb),
	:where(.page-listing-item .item-thumb img),
	:where(.c-btn),
	:where(.elementor-widget-button .elementor-button),
	:where(.elementor-widget-image .elementor-widget-container img) {
		transition: none !important;
	}

	:where(.page-listing-item:hover .item-thumb),
	:where(.page-listing-item:hover .item-thumb img) {
		transform: none;
	}

	:where(.c-btn:not(:disabled):hover),
	:where(.elementor-widget-button .elementor-button:hover) {
		transform: none;
	}
}

