/* ===== tp-legal.css — Styles harmonisés Bootstrap/Tarapro, sûrs pour l'ensemble du site ===== */


/* Arrondis + carte globale de la page */
.tp-legal{
  --tp-radius: .8rem; /* garde ta valeur */
  background: var(--tp-bg-subtle);
  border: 1px solid var(--tp-border);
  border-radius: var(--tp-radius);
  padding: clamp(16px, 3vw, 28px);
  box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.06);
  overflow: hidden; /* pour que les séparateurs .border-top ne dépassent pas dans les angles */
}

/* (optionnel) coins un peu plus doux pour les encadrés internes aussi */
.tp-legal .card-soft{
  border-radius: calc(var(--tp-radius) - .2rem);
}


/* Variables avec reprises automatiques des variables Bootstrap si présentes */
.tp-legal{
  --tp-radius: .8rem;
  --tp-border: var(--bs-border-color, #e5e7eb);
  --tp-muted: var(--bs-secondary-color, #6b7280);
  --tp-heading: var(--bs-emphasis-color, #111827);
  --tp-body: var(--bs-body-color, #111827);
  --tp-bg: var(--bs-body-bg, #ffffff);
  --tp-bg-subtle: var(--bs-tertiary-bg, #f8f9fa);
  --tp-accent: var(--bs-primary, #0ea5e9);
  color: var(--tp-body);
  background: var(--tp-bg);
}

/* Titres */
.tp-legal h1,
.tp-legal h2{
  color: var(--tp-heading);
  letter-spacing: -.01em;
  margin-bottom: .75rem;
}
.tp-legal h1{
  font-weight: 800;
}
.tp-legal h2{
  font-weight: 700;
  font-size: clamp(1.05rem, 1.6vw, 1.15rem);
  position: relative;
  padding-left: .75rem;
}
.tp-legal h2::before{
  content:"";
  position:absolute;
  left:0; top:.25rem; bottom:.25rem;
  width:4px; border-radius:3px;
  background: color-mix(in oklab, var(--tp-accent) 85%, #fff 15%);
}

/* Lead / notes */
.tp-legal .lead{ color: var(--tp-muted); }
.tp-legal .note{ color: var(--tp-muted); font-size: .95rem; }

/* Grille des libellés (colonne gauche) */
.tp-legal .term{
  font-weight: 600;
  color: var(--tp-heading);
}

/* Cartes/encadrés doux (hébergeur, adresses, etc.) */
.tp-legal .card-soft{
  background: var(--tp-bg-subtle);
  border: 1px solid var(--tp-border);
  border-radius: var(--tp-radius);
  padding: 1rem 1.25rem;
  box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.06);
}

/* Paragraphes & listes */
.tp-legal p{ margin-bottom: .6rem; }
.tp-legal ul, .tp-legal ol{ padding-left: 1.2rem; }
.tp-legal li{ margin: .25rem 0; }

/* Liens (accessibles) */
.tp-legal a{
  text-underline-offset: 2px;
  color: var(--tp-accent);
}
.tp-legal a:hover{ opacity:.9; }
.tp-legal a:focus-visible{
  outline: 2px dashed var(--tp-accent);
  outline-offset: 2px;
  text-decoration: none;
}

/* Séparateurs "border-top" uniformisés (tu utilises .border-top dans le HTML) */
.tp-legal .border-top{
  border-top-color: var(--tp-border) !important;
}

/* Tableaux éventuels */
.tp-legal table{
  width: 100%;
  border-collapse: collapse;
  background: var(--tp-bg);
  border: 1px solid var(--tp-border);
  border-radius: var(--tp-radius);
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
.tp-legal th, .tp-legal td{
  padding: .6rem .75rem;
  border-bottom: 1px solid var(--tp-border);
}
.tp-legal th{
  text-align: left;
  background: color-mix(in oklab, var(--tp-accent) 10%, var(--tp-bg) 90%);
  color: color-mix(in oklab, var(--tp-heading) 85%, #000 15%);
  font-weight: 600;
}

/* Impression : liens lisibles, fond neutre */
@media print{
  .tp-legal{
    background: #fff;
    box-shadow: none;
  }
  .tp-legal a[href]::after{
    content: " (" attr(href) ")";
    font-size: .9em;
  }
}

/* (Option) Mode sombre si ton thème ne gère pas les vars Bootstrap en dark */
@media (prefers-color-scheme: dark){
  .tp-legal{
    --tp-border: #2d3748;
    --tp-muted: #9aa4b2;
    --tp-heading: #e7eaf0;
    --tp-body: #e7eaf0;
    --tp-bg: #0b1220;
    --tp-bg-subtle: #111a2b;
  }
  .tp-legal .card-soft{
    box-shadow: none;
  }
}
