/* ============================================================
 * VideoIA — Overrides plugin Boîte à Outils
 * Aligne le rendu sur la charte v2.0 (papier crème, Instrument Serif)
 * sans toucher au plugin.
 * ============================================================ */

/* === Override des variables CSS du plugin === */
.vi-home,
body .single-bao_outil,
body .post-type-archive-bao_outil,
body.page-id-12805 {
	/* Palette : ink remplace bleu, paper-2 remplace blanc-cassé */
	--bp: var(--vi-ink);
	--bph: var(--vi-mute);
	--bcta: var(--vi-ink);
	--bctah: var(--vi-ink-2);
	--bbadge: var(--vi-ink);
	--bfb: var(--vi-line);
	--btb: var(--vi-ink);
	--bw: #ffffff;
	--bbdr: var(--vi-line);
	--bt: var(--vi-ink);
	--bm: var(--vi-mute);
	--br: 14px;
	--bsh: 0 2px 8px rgba(15, 23, 42, 0.04);
	--bshh: 0 14px 36px rgba(15, 23, 42, 0.08);
}

/* ============================================================
 * HERO — la page boite-a-outils (page_id 12805)
 * ============================================================ */
body.page-id-12805 .bao-hero {
	background:
		radial-gradient(ellipse 60% 80% at 100% 0%, rgba(159, 63, 251, 0.06), transparent 55%),
		linear-gradient(180deg, var(--vi-paper) 0%, var(--vi-paper-2) 100%) !important;
	border: 1px solid var(--vi-line) !important;
	border-radius: 24px !important;
	box-shadow: 0 14px 36px rgba(74, 108, 247, 0.05) !important;
	padding: 48px 44px !important;
	margin-bottom: 36px !important;
}
body.page-id-12805 .bao-hero::before {
	background: var(--vi-grad-logo, linear-gradient(90deg, #4A6CF7, #9F3FFB)) !important;
}

body.page-id-12805 .bao-hero__chip {
	background: rgba(74, 108, 247, 0.08) !important;
	color: var(--vi-accent, #4A6CF7) !important;
	font-family: var(--vi-mono) !important;
	font-weight: 500 !important;
	font-size: 11px !important;
	letter-spacing: 0.16em !important;
	text-transform: uppercase !important;
	padding: 6px 14px !important;
	border-radius: 999px !important;
}

body.page-id-12805 .bao-hero__title {
	font-family: var(--vi-serif) !important;
	font-weight: 400 !important;
	font-size: clamp(40px, 6vw, 72px) !important;
	letter-spacing: -0.015em !important;
	line-height: 1 !important;
	color: var(--vi-ink) !important;
}
body.page-id-12805 .bao-hero__title em,
body.page-id-12805 .bao-hero__sub {
	font-style: italic !important;
	color: var(--vi-mute) !important;
	background: none !important;
	-webkit-background-clip: initial !important;
	background-clip: initial !important;
	-webkit-text-fill-color: var(--vi-mute) !important;
	font-weight: 400 !important;
}

body.page-id-12805 .bao-hero__lead {
	font-size: 16.5px !important;
	color: var(--vi-ink-2) !important;
	line-height: 1.55 !important;
	margin-top: 16px !important;
}

body.page-id-12805 .bao-hero__meta,
body.page-id-12805 .bao-hero__meta span {
	font-size: 13.5px !important;
	color: var(--vi-mute) !important;
}

body.page-id-12805 .bao-hero__cats a {
	background: #fff !important;
	border: 1px solid var(--vi-line) !important;
	border-radius: 999px !important;
	padding: 8px 16px !important;
	color: var(--vi-ink) !important;
	font-weight: 500 !important;
	font-size: 14px !important;
}
body.page-id-12805 .bao-hero__cats a:hover {
	border-color: var(--vi-accent, #4A6CF7) !important;
	color: var(--vi-accent, #4A6CF7) !important;
}

/* ============================================================
 * Tour d'horizon (table)
 * ============================================================ */
body.page-id-12805 .bao-quick {
	background: #fff !important;
	border: 1px solid var(--vi-line) !important;
	border-radius: 14px !important;
	box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04) !important;
}
body.page-id-12805 .bao-quick__head {
	background: linear-gradient(135deg, var(--vi-paper), var(--vi-paper-2)) !important;
	border-bottom: 1px solid var(--vi-line) !important;
}
body.page-id-12805 .bao-quick__head h2 {
	font-family: var(--vi-serif) !important;
	font-weight: 400 !important;
	font-size: 24px !important;
	color: var(--vi-ink) !important;
	border: none !important;
	padding: 0 !important;
}
body.page-id-12805 .bao-quick thead th {
	font-family: var(--vi-mono) !important;
	font-size: 11px !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	color: var(--vi-mute) !important;
	background: var(--vi-paper) !important;
}
body.page-id-12805 .bao-quick__btn {
	background: var(--vi-ink) !important;
	color: var(--vi-paper) !important;
	border: none !important;
	box-shadow: none !important;
}
body.page-id-12805 .bao-quick__btn:hover {
	background: var(--vi-ink-2) !important;
	transform: translateY(-1px);
}

/* ============================================================
 * Section titles (.bao-h2)
 * ============================================================ */
body.page-id-12805 .bao-h2 {
	font-family: var(--vi-serif) !important;
	font-weight: 400 !important;
	font-size: clamp(28px, 3.2vw, 38px) !important;
	letter-spacing: -0.01em !important;
	line-height: 1.05 !important;
	color: var(--vi-ink) !important;
	border: none !important;
	padding-left: 0 !important;
	margin-bottom: 12px !important;
}
body.page-id-12805 .bao-h2::before {
	display: none !important;
}
body.page-id-12805 .bao-sub {
	font-size: 13.5px !important;
	color: var(--vi-mute) !important;
	margin: 0 0 22px !important;
	padding-left: 0 !important;
}

/* ============================================================
 * Sticky filter bar (.bao-nav)
 * ============================================================ */
body.page-id-12805 .bao-nav {
	background: rgba(250, 248, 243, 0.92) !important;
	border: 1px solid var(--vi-line) !important;
	box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05) !important;
}
body.page-id-12805 .bao-nav-l {
	font-family: var(--vi-mono) !important;
	color: var(--vi-mute) !important;
}
body.page-id-12805 .bao-pill {
	background: transparent !important;
	color: var(--vi-mute) !important;
	border: 1px solid transparent !important;
}
body.page-id-12805 .bao-pill:hover {
	background: var(--vi-paper-2) !important;
	color: var(--vi-ink) !important;
	border-color: transparent !important;
}
body.page-id-12805 .bao-pill.is-active,
body.page-id-12805 .bao-pill.on {
	background: var(--vi-ink) !important;
	color: var(--vi-paper) !important;
	border-color: var(--vi-ink) !important;
}
body.page-id-12805 .bao-pill-cnt {
	background: var(--vi-paper-2) !important;
	color: var(--vi-mute) !important;
}
body.page-id-12805 .bao-pill.is-active .bao-pill-cnt {
	background: rgba(250, 248, 243, 0.25) !important;
	color: var(--vi-paper) !important;
}

/* ============================================================
 * Filters (Prix, Niveau)
 * ============================================================ */
body.page-id-12805 .bao-filters {
	background: #fff !important;
	border: 1px solid var(--vi-line) !important;
	border-radius: 14px !important;
	box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04) !important;
}
body.page-id-12805 .bao-filters__lbl {
	font-family: var(--vi-mono) !important;
	color: var(--vi-mute) !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	font-size: 11px !important;
}
body.page-id-12805 .bao-filter {
	background: var(--vi-paper-2) !important;
	color: var(--vi-mute) !important;
}
body.page-id-12805 .bao-filter:hover {
	background: var(--vi-line) !important;
	color: var(--vi-ink) !important;
}
body.page-id-12805 .bao-filter.is-active {
	background: var(--vi-ink) !important;
	color: var(--vi-paper) !important;
	box-shadow: 0 4px 10px rgba(20, 19, 15, 0.15) !important;
}
body.page-id-12805 .bao-filters__count {
	color: var(--vi-mute) !important;
	font-family: var(--vi-mono) !important;
}

/* ============================================================
 * Cards outils (.bao-cd) et incontournables (.bao-feat)
 * ============================================================ */
body.page-id-12805 .bao-cd,
body.page-id-12805 .bao-feat {
	background: #fff !important;
	border: 1px solid var(--vi-line) !important;
	border-radius: 14px !important;
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04), 0 8px 20px rgba(15, 23, 42, 0.04) !important;
	transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
body.page-id-12805 .bao-cd:hover,
body.page-id-12805 .bao-feat:hover {
	transform: translateY(-3px) !important;
	box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08), 0 18px 40px rgba(15, 23, 42, 0.06) !important;
	border-color: var(--vi-ink) !important;
}
body.page-id-12805 .bao-cd::before,
body.page-id-12805 .bao-feat::before {
	display: none !important;
}
body.page-id-12805 .bao-cd-top {
	border-color: var(--vi-ink) !important;
	box-shadow: 0 1px 3px rgba(20, 19, 15, 0.06), 0 12px 28px rgba(20, 19, 15, 0.10) !important;
}

body.page-id-12805 .bao-cd-name,
body.page-id-12805 .bao-feat-n {
	font-family: var(--vi-serif) !important;
	font-weight: 400 !important;
	font-size: 22px !important;
	color: var(--vi-ink) !important;
	letter-spacing: -0.01em !important;
}
body.page-id-12805 .bao-feat-n {
	font-size: 18px !important;
	font-weight: 500 !important;
	letter-spacing: 0.05em !important;
}

body.page-id-12805 .bao-cd-rk em {
	font-family: var(--vi-serif) !important;
	color: var(--vi-mute) !important;
}

body.page-id-12805 .bao-cd-desc,
body.page-id-12805 .bao-feat-d {
	color: var(--vi-ink-2) !important;
	font-size: 14px !important;
	line-height: 1.5 !important;
}

body.page-id-12805 .bao-cd-row strong,
body.page-id-12805 .bao-cd-cl {
	color: var(--vi-ink) !important;
	font-family: var(--vi-mono) !important;
	font-size: 11.5px !important;
	letter-spacing: 0.08em !important;
	text-transform: uppercase !important;
	font-weight: 600 !important;
}

body.page-id-12805 .bao-cd-criteria {
	background: var(--vi-paper) !important;
	border-radius: 10px !important;
}

body.page-id-12805 .bao-cd-price {
	font-family: var(--vi-serif) !important;
	color: var(--vi-ink) !important;
	font-weight: 400 !important;
}

body.page-id-12805 .bao-cd-tag {
	background: var(--vi-paper-2) !important;
	color: var(--vi-mute) !important;
	font-family: var(--vi-mono) !important;
}

body.page-id-12805 .bao-cd-badge {
	background: var(--vi-ink) !important;
	color: var(--vi-paper) !important;
	font-family: var(--vi-mono) !important;
	font-size: 10.5px !important;
	letter-spacing: 0.1em !important;
	box-shadow: none !important;
}

/* CTA boutons */
body.page-id-12805 .bao-cta {
	background: var(--vi-ink) !important;
	color: var(--vi-paper) !important;
	border-radius: 9px !important;
	box-shadow: none !important;
	font-weight: 500 !important;
}
body.page-id-12805 .bao-cta:hover {
	background: var(--vi-ink-2) !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 4px 12px rgba(20, 19, 15, 0.15) !important;
}

body.page-id-12805 .bao-avis {
	color: var(--vi-mute) !important;
}
body.page-id-12805 .bao-avis:hover {
	color: var(--vi-ink) !important;
}

/* ============================================================
 * Promo box
 * ============================================================ */
body.page-id-12805 .bao-cd-promo {
	background: var(--vi-paper-2) !important;
	border: 1px dashed var(--vi-line) !important;
}
body.page-id-12805 .bao-cd-promo code {
	background: #fff !important;
	color: var(--vi-ink) !important;
	font-family: var(--vi-mono) !important;
	font-weight: 600 !important;
}

body.page-id-12805 .bao-tag {
	background: var(--vi-ink) !important;
	color: var(--vi-paper) !important;
	font-family: var(--vi-mono) !important;
}

/* ============================================================
 * Trust + FAQ + Recent posts
 * ============================================================ */
body.page-id-12805 .bao-trust {
	background:
		radial-gradient(ellipse 50% 60% at 50% 0%, rgba(74, 108, 247, 0.05), transparent 60%),
		var(--vi-paper-2) !important;
	border: 1px solid var(--vi-line) !important;
	border-radius: 24px !important;
	box-shadow: 0 12px 32px rgba(15, 23, 42, 0.04) !important;
}
body.page-id-12805 .bao-trust__title {
	font-family: var(--vi-serif) !important;
	font-weight: 400 !important;
	font-size: clamp(24px, 3vw, 32px) !important;
	color: var(--vi-ink) !important;
}
body.page-id-12805 .bao-trust__lead {
	color: var(--vi-ink-2) !important;
}
body.page-id-12805 .bao-trust__num {
	font-family: var(--vi-serif) !important;
	font-weight: 400 !important;
	background: none !important;
	-webkit-background-clip: initial !important;
	background-clip: initial !important;
	-webkit-text-fill-color: var(--vi-ink) !important;
	color: var(--vi-ink) !important;
}
body.page-id-12805 .bao-trust__lbl {
	color: var(--vi-mute) !important;
}

body.page-id-12805 .bao-faq__item {
	background: #fff !important;
	border: 1px solid var(--vi-line) !important;
	border-radius: 14px !important;
}
body.page-id-12805 .bao-faq__item summary {
	font-family: var(--vi-sans) !important;
	color: var(--vi-ink) !important;
}
body.page-id-12805 .bao-faq__item[open] summary::after {
	color: var(--vi-accent, #4A6CF7) !important;
}

body.page-id-12805 .bao-recent__card {
	background: #fff !important;
	border: 1px solid var(--vi-line) !important;
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04), 0 8px 20px rgba(15, 23, 42, 0.04) !important;
}
body.page-id-12805 .bao-recent__card:hover {
	transform: translateY(-3px) !important;
	border-color: var(--vi-ink) !important;
}
body.page-id-12805 .bao-recent__title {
	font-family: var(--vi-serif) !important;
	font-weight: 400 !important;
	color: var(--vi-ink) !important;
	letter-spacing: -0.005em !important;
}
body.page-id-12805 .bao-recent__date {
	font-family: var(--vi-mono) !important;
	color: var(--vi-mute) !important;
}
body.page-id-12805 .bao-recent__excerpt {
	color: var(--vi-ink-2) !important;
}

/* ============================================================
 * Stars : on garde l'ambre (signe universel)
 * ============================================================ */
body.page-id-12805 .bao-stars {
	color: var(--vi-warn, #fbbf24) !important;
}
