/*
 * CoAbonnement - Design Polish v1.0.0
 * Chargé uniquement sur l'accueil (visiteur) et sur /catalogue/ (rendu #coab-sf).
 * Rien n'est modifié dans le thème ni dans les autres plugins : désactiver le plugin retire tout.
 * Les sélecteurs du catalogue passent par "html body #coab-sf.coab-shop" pour battre, dans l'ordre :
 *   force-light (body.ddbz-force-light-active ... !important), owned-contrast-hotfix, x-storefront(-fix), x-shop.
 */

/* ============================================================
   Jetons (D-040, version réduite : seulement ce qui est utilisé ici)
   ============================================================ */
:root {
	--coab-dp-link: #0a6f8f;          /* 5,70:1 sur blanc, 5,08:1 sur --coab-dp-link-bg */
	--coab-dp-link-bg: #e8f4f8;
	--coab-dp-link-hover: #0a6f8f;
	--coab-dp-on-dark: #ffffff;
	--coab-dp-on-dark-2: rgba(255, 255, 255, .86);
	--coab-dp-chip-bg: rgba(8, 12, 30, .38);
	--coab-dp-chip-line: rgba(255, 255, 255, .42);
	--coab-dp-focus: 0 0 0 3px rgba(23, 183, 226, .55);
	--coab-dp-price-bg: #ffc24b;
	--coab-dp-price-ink: #14213d;
}
html[data-coab-theme="dark"] {
	--coab-dp-link: #4fd1f5;
	--coab-dp-link-bg: rgba(79, 209, 245, .12);
	--coab-dp-link-hover: #4fd1f5;
}

/* ============================================================
   CATALOGUE  (/catalogue/)
   ============================================================ */

/* ---- D-010 : tout texte de couverture lisible, malgré force-light (span {color:#475569!important}) ---- */
html body #coab-sf.coab-shop .sf-cover:not(.has-img) {
	color: var(--coab-dp-on-dark);
}
html body #coab-sf.coab-shop .sf-cover:not(.has-img) :is(span, b, i, small, em, strong) {
	color: var(--coab-dp-on-dark) !important;
	-webkit-text-fill-color: var(--coab-dp-on-dark) !important;
	opacity: 1 !important;
}
/* sous-titre (3 ans, clé unique...) et type : blanc 86 % (>= 6,8:1 sur toutes les bases) */
html body #coab-sf.coab-shop .sf-cover:not(.has-img) :is(.sh-sub, .sf-k) {
	color: var(--coab-dp-on-dark-2) !important;
	-webkit-text-fill-color: var(--coab-dp-on-dark-2) !important;
	font-weight: 700;
	font-size: 13px;
}
/* pastilles du haut (type d'univers, période) : fond sombre translucide, texte blanc (>= 8,6:1) */
html body #coab-sf.coab-shop .sf-cover:not(.has-img) :is(.sh-badge, .sf-per) {
	background: var(--coab-dp-chip-bg) !important;
	border: 1px solid var(--coab-dp-chip-line) !important;
	color: var(--coab-dp-on-dark) !important;
	-webkit-text-fill-color: var(--coab-dp-on-dark) !important;
	font-size: 11.5px;
	font-weight: 800;
}
/* Vendeur officiel : pastille blanche, texte vert foncé (5,34:1) */
html body #coab-sf.coab-shop .sf-cover:not(.has-img) .sh-badge.sh-b-bp {
	background: #fff !important;
	border-color: #fff !important;
	color: #0e7a55 !important;
	-webkit-text-fill-color: #0e7a55 !important;
}
/* grande lettre décorative : doit rester quasi transparente (la règle générale ci-dessus la rendrait blanche) */
html body #coab-sf.coab-shop .sf-cover:not(.has-img) .sf-ghost {
	color: rgba(255, 255, 255, .09) !important;
	-webkit-text-fill-color: rgba(255, 255, 255, .09) !important;
}
/* pastille "Populaire" (ancien rendu) */
html body #coab-sf.coab-shop .sf-cover:not(.has-img) .sf-hot {
	background: var(--coab-dp-price-bg) !important;
	color: var(--coab-dp-price-ink) !important;
	-webkit-text-fill-color: var(--coab-dp-price-ink) !important;
}
/* les co-abonnements n'ont plus de désaturation (elle baissait le contraste) */
html body #coab-sf.coab-shop .sh-co .sf-cover {
	filter: none;
}

/* ---- D-011 : palette des dégradés (blanc >= 4,7:1 sur la tache claire, >= 8,6:1 sur la base) ---- */
html body #coab-sf.coab-shop .sh-c-streaming { background: radial-gradient(120% 90% at 100% 0, #c2283c 0, transparent 55%), #7a1020 !important; }
html body #coab-sf.coab-shop .sh-c-musique   { background: radial-gradient(120% 90% at 100% 0, #168148 0, transparent 55%), #0a4a2b !important; }
html body #coab-sf.coab-shop .sh-c-ia        { background: radial-gradient(120% 90% at 100% 0, #6a4ff0 0, transparent 55%), #3b22b0 !important; }
html body #coab-sf.coab-shop .sh-c-logiciels { background: radial-gradient(120% 90% at 100% 0, #2462c4 0, transparent 55%), #0b3270 !important; }
html body #coab-sf.coab-shop .sh-c-formation { background: radial-gradient(120% 90% at 100% 0, #c22f6a 0, transparent 55%), #7d1246 !important; }
html body #coab-sf.coab-shop .sh-c-securite  { background: radial-gradient(120% 90% at 100% 0, #0f7f8a 0, transparent 55%), #083e48 !important; }
html body #coab-sf.coab-shop .sh-c-ebooks    { background: radial-gradient(120% 90% at 100% 0, #16805f 0, transparent 55%), #0a4434 !important; }
html body #coab-sf.coab-shop .sh-c-cadeaux   { background: radial-gradient(120% 90% at 100% 0, #b8561e 0, transparent 55%), #7f3612 !important; }
html body #coab-sf.coab-shop .sh-c-autres    { background: radial-gradient(120% 90% at 100% 0, #33508a 0, transparent 55%), #1a2540 !important; }

/* ---- D-012 : onglets d'univers (force-light les passait tous en bleu nuit) ---- */
html body #coab-sf.coab-shop .sh-tabs {
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}
html body #coab-sf.coab-shop .sh-tab {
	background: var(--sf-card) !important;
	background-image: none !important;
	color: var(--sf-ink) !important;
	-webkit-text-fill-color: var(--sf-ink) !important;
	border: 1.5px solid var(--sf-line) !important;
	box-shadow: none !important;
	height: auto !important;
}
html body #coab-sf.coab-shop .sh-tab :is(b, em) {
	color: inherit !important;
	-webkit-text-fill-color: currentColor !important;
}
html body #coab-sf.coab-shop .sh-tab small,
html body #coab-sf.coab-shop .sh-tab em {
	color: var(--sf-mute) !important;
	-webkit-text-fill-color: var(--sf-mute) !important;
}
html body #coab-sf.coab-shop .sh-tab.is-on {
	background: var(--sf-ink) !important;
	border-color: var(--sf-ink) !important;
	color: var(--sf-paper) !important;
	-webkit-text-fill-color: var(--sf-paper) !important;
}
html body #coab-sf.coab-shop .sh-tab.is-on :is(small, em) {
	color: var(--sf-paper) !important;
	-webkit-text-fill-color: var(--sf-paper) !important;
	opacity: .82;
}
html body #coab-sf.coab-shop .sh-tab:hover:not(.is-on) {
	border-color: var(--sf-ink) !important;
}
html body #coab-sf.coab-shop :is(.sh-tab, .sf-chip, .sf-card, select, input):focus-visible {
	outline: none !important;
	box-shadow: var(--coab-dp-focus) !important;
}

/* ---- D-013 : "Voir" / "Commander" lisibles (cyan #0e9fc6 = 3,09:1 -> #0a6f8f = 5,70:1) ---- */
html body #coab-sf.coab-shop .sf-card .sf-go {
	display: inline-flex !important;
	align-items: center;
	gap: 4px;
	padding: 8px 12px;
	border-radius: 12px;
	background: var(--coab-dp-link-bg) !important;
	color: var(--coab-dp-link) !important;
	-webkit-text-fill-color: var(--coab-dp-link) !important;
	font-size: 13.5px;
	font-weight: 800;
	line-height: 1;
	text-decoration: none !important;
}
html body #coab-sf.coab-shop .sf-card .sf-go::after { content: "\2192"; }
html body #coab-sf.coab-shop .sf-card:hover .sf-go {
	background: var(--coab-dp-link) !important;
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}
html body #coab-sf.coab-shop .sf-card.sh-bp .sf-go {
	background: var(--sf-ink) !important;
	color: var(--sf-paper) !important;
	-webkit-text-fill-color: var(--sf-paper) !important;
}
html body #coab-sf.coab-shop .sf-card .sf-tag,
html body #coab-sf.coab-shop .sf-card .sf-tag * {
	color: var(--coab-dp-price-ink) !important;
	-webkit-text-fill-color: var(--coab-dp-price-ink) !important;
}
html body #coab-sf.coab-shop .sf-row { min-height: 40px; flex-wrap: wrap; }
html body #coab-sf.coab-shop .sh-share { color: var(--sf-ink) !important; -webkit-text-fill-color: var(--sf-ink) !important; }

/* ---- D-021 : titres de carte sur 3 lignes (desktop), complétés par un attribut title posé côté PHP ---- */
html body #coab-sf.coab-shop .sf-t {
	-webkit-line-clamp: 3;
	min-height: 4.05em; /* 3 lignes x line-height 1.35 */
}

@media (max-width: 640px) {
	html body #coab-sf.coab-shop .sf-t { -webkit-line-clamp: 2; min-height: 2.7em; }
	/* mobile : la base masque .sf-go ; on garde une flèche compacte (32 px) pour qu'il reste un appel à l'action visible */
	html body #coab-sf.coab-shop .sf-card .sf-go {
		width: 32px;
		height: 32px;
		padding: 0;
		justify-content: center;
		font-size: 0;
		gap: 0;
	}
	html body #coab-sf.coab-shop .sf-card .sf-go::after { font-size: 16px; }
}

/* 4 blocs "Comment ça marche" quand l'univers Licences & accès existe */
html body #coab-sf.coab-shop .sh-how { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }

/* Nouvel univers "Licences & accès" : même pied de carte que les autres */
html body #coab-sf.coab-shop .sf-card.sh-lc { border-color: var(--sf-line); }

@media (prefers-reduced-motion: reduce) {
	html body #coab-sf.coab-shop .sf-card { transform: none !important; transition: none !important; }
}

/* ============================================================
   ACCUEIL  (visiteur : body.coab-public-home)
   ============================================================ */

/* ---- D-020 : textes secondaires des cartes (#8a919e = 3,17:1 -> #5b6270 = 6,13:1) ---- */
html body.coab-public-home :is(.coabm-card-desc, .coabm-card-price-label, .coabm-chip-desc, .coabm-author-role, .coabm-quote-role, .coabm-empty-note) {
	color: #5b6270 !important;
}
html body.coab-public-home .coabm-card-price-value { color: #14171c; }

/* ---- D-021 : titres des cartes digitales sur 3 lignes (desktop) ---- */
@media (min-width: 981px) {
	html body.coab-public-home .coabm-cards--digital .coabm-card-title {
		-webkit-line-clamp: 3;
		min-height: 57px;
	}
}

/* ---- D-020 (mobile) : tailles trop petites (10,5 / 11,5 / 12,5 px) ---- */
@media (max-width: 700px) {
	html body.coab-public-home .coabm-card-title { font-size: 13.5px !important; min-height: 36px; }
	html body.coab-public-home .coabm-card-desc { font-size: 12px !important; min-height: 32px; }
	html body.coab-public-home .coabm-card-price-label { font-size: 10.5px !important; }
	html body.coab-public-home .coabm-card-price-value { font-size: 13px !important; }
	html body.coab-public-home .coabm-card-body { min-height: 0; }
}

/* ---- D-023 : focus clavier visible + mouvement réduit ---- */
html body.coab-public-home :is(.coabm-card, .coabm-chip-card, .coabm-btn, .coabm-more-btn, .coabm-section-link, .coabm-text-link):focus-visible {
	outline: none;
	box-shadow: var(--coab-dp-focus);
}
@media (prefers-reduced-motion: reduce) {
	html body.coab-public-home :is(.coabm-card, .coabm-chip-card) { transition: none; }
	html body.coab-public-home :is(.coabm-card, .coabm-chip-card):hover { transform: none; }
}
