/* =============================================================================
   Vitrine « Bois · Pellets · Poêles » — pages légales (?page=legal&doc=…)
   Chargée par templates/header.php APRÈS style.css et le thème du vendeur.
   Réutilise le socle : .vt-wrap, .vt-section, .vt-page-tete, .vt-fil, .vt-h2 (carré primaire),
   .vt-etiq, .vt-lien, .vt-btn, .vt-vide, jetons --primary, --gris, --filet, --texte-*.
   Préfixe propre à la page : .vt-legal.
   ============================================================================= */

/* ============================================================
   1. COLONNE DE LECTURE — 760 px au plus, texte 1.02rem interligne large
   ============================================================ */
.vt-legal { padding: 44px 0 64px; }
.vt-legal__wrap { max-width: calc(760px + 64px); }
.vt-legal__doc { min-width: 0; }
.vt-legal__maj { font-weight: 600; font-size: .84rem; letter-spacing: .01em; color: var(--texte-3); }
.vt-legal__source { margin-top: 6px; font-size: .88rem; font-style: italic; color: var(--texte-3); }

/* Sommaire : liste numérotée sur gris chaud, liens primaires */
.vt-legal__sommaire { margin-top: 22px; padding: 18px 22px 20px; background: var(--gris); border: 1px solid var(--filet); border-radius: var(--rayon); }
.vt-legal__sommaire .vt-etiq { margin: 0 0 8px; }
.vt-legal__sommaire ol { list-style: decimal inside; columns: 2; column-gap: 28px; }
.vt-legal__sommaire li { font-size: .92rem; line-height: 1.5; padding: 3px 0; break-inside: avoid; color: var(--texte-3); }
.vt-legal__sommaire a { color: var(--texte); font-weight: 600; transition: color .2s; }
.vt-legal__sommaire a:hover { color: var(--primary); text-decoration: underline; text-underline-offset: 3px; }

/* Sections : titre avec carré de marque, paragraphes, puces, fiche */
.vt-legal__section { margin-top: 40px; }
.vt-legal__h2 { font-size: clamp(1.2rem, 1.8vw, 1.4rem); }
.vt-legal__section p { margin-top: 14px; font-size: 1.02rem; line-height: 1.7; color: var(--texte-2); overflow-wrap: anywhere; }
.vt-legal__section ul { margin-top: 12px; padding-left: 4px; display: grid; gap: 8px; }
.vt-legal__section ul li { position: relative; padding-left: 22px; font-size: 1rem; line-height: 1.6; color: var(--texte-2); overflow-wrap: anywhere; }
.vt-legal__section ul li::before { content: ""; position: absolute; left: 2px; top: .68em; width: 9px; height: 9px; background: var(--primary); }
.vt-legal__section a { color: var(--primary); font-weight: 600; }
.vt-legal__section a:hover { color: var(--primaire-fonce); text-decoration: underline; text-underline-offset: 3px; }
.vt-legal__zones li b { color: var(--texte); font-weight: 800; }

/* Fiche d'identité : libellé / valeur sur deux colonnes, filets fins */
.vt-legal__fiche { margin-top: 14px; border: 1px solid var(--filet); border-radius: var(--rayon); overflow: hidden; background: var(--blanc); }
.vt-legal__ligne { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 12px; padding: 10px 16px; border-bottom: 1px solid var(--filet); }
.vt-legal__ligne:last-child { border-bottom: 0; }
.vt-legal__ligne:nth-child(odd) { background: var(--gris); }
.vt-legal__ligne dt { font-weight: 600; font-size: .78rem; letter-spacing: .05em; text-transform: uppercase; color: var(--texte-3); padding-top: 3px; }
.vt-legal__ligne dd { margin: 0; font-weight: 600; font-size: .96rem; color: var(--texte); overflow-wrap: anywhere; }

/* Texte propre au vendeur (remplace le document généré) */
.vt-legal__texte { margin-top: 20px; }
.vt-legal__texte p { margin-top: 14px; font-size: 1.02rem; line-height: 1.7; color: var(--texte-2); overflow-wrap: anywhere; }

/* ============================================================
   2. NAVIGATION ENTRE LES QUATRE DOCUMENTS — barre en bas, lien actif souligné
   ============================================================ */
.vt-legal__nav { margin-top: 48px; padding-top: 22px; border-top: 1px solid var(--filet); }
.vt-legal__nav .vt-etiq { margin: 0 0 10px; }
.vt-legal__nav ul { display: flex; flex-wrap: wrap; gap: 8px; }
.vt-legal__nav li a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border: 1.5px solid var(--filet); border-radius: var(--rayon); font-weight: 600; font-size: .9rem; color: var(--texte); transition: border-color .2s, color .2s, background .2s; }
.vt-legal__nav li a:hover { border-color: var(--primary); color: var(--primary); background: var(--primaire-pale); }
.vt-legal__nav li a.vt-est-actif { border-color: var(--primary); background: var(--primary); color: var(--sur-primaire); }

/* 404 : boîte vide du socle, boutons vers les quatre documents */
.vt-legal__404 { margin-top: 0; }
.vt-legal__404 .vt-legal__nav { margin-top: 8px; padding-top: 0; border-top: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.vt-legal__404-retour { margin-top: 20px; }

/* ============================================================
   3. ADAPTATIF — ≤ 1000 : sommaire sur une colonne ; ≤ 640 : fiche empilée
   ============================================================ */
@media (max-width: 1000px) {
	.vt-legal { padding: 36px 0 52px; }
	.vt-legal__sommaire ol { columns: 1; }
}
@media (max-width: 640px) {
	.vt-legal { padding: 28px 0 44px; }
	.vt-legal__section { margin-top: 32px; }
	.vt-legal__section p, .vt-legal__texte p { font-size: .98rem; }
	.vt-legal__sommaire { padding: 16px 16px 18px; }
	.vt-legal__ligne { grid-template-columns: 1fr; gap: 2px; padding: 10px 14px; }
	.vt-legal__ligne dt { padding-top: 0; }
	.vt-legal__nav ul { flex-direction: column; }
	.vt-legal__nav li a { width: 100%; justify-content: center; }
}