/* ============================================
   CHAPITRE 13 — L'importance (!important)
   Styles spécifiques à ce chapitre
   ============================================ */

/* --- Démonstrations !important --- */
.demo-imp-1,
.demo-imp-2 {
  background-color: var(--couleur-blanc);
  border: 1px solid var(--couleur-bordure);
  border-radius: var(--rayon);
  padding: 1.25rem;
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}

/* --- Démonstration 1 : important vs ID --- */
#special-demo {
  color: red;
  font-weight: 600;
  padding: 10px;
  border-radius: 4px;
  background: #fef2f2;
}

.demo-imp-1 .important {
  color: blue !important;
  font-weight: 700;
}

/* --- Démonstration 2 : !important vs !important --- */
#id-important-demo {
  color: blue;
  font-weight: 600;
  padding: 10px;
  border-radius: 4px;
  background: #eff6ff;
}

.demo-imp-2 #id-important-demo {
  color: red !important;
  font-weight: 700;
}

.demo-imp-2 .cls-important {
  color: blue !important;
}