/* =========================================================
   MAISON NOYAU — PAGES LÉGALES & AGE GATE
   ========================================================= */


/* -------------------------------------------------------
   PAGES LÉGALES — MISE EN PAGE
------------------------------------------------------- */
.mn-legal-page {
  padding-block: var(--mn-space-8) var(--mn-space-24);
}

.mn-legal-header {
  padding-bottom: var(--mn-space-8);
  border-bottom: 1px solid var(--mn-border);
  margin-bottom: var(--mn-space-12);
}

.mn-legal-header h1 {
  font-size: var(--mn-text-2xl);
  margin-bottom: var(--mn-space-3);
}

.mn-legal-header p {
  font-size: var(--mn-text-sm);
  color: var(--mn-black-soft);
  opacity: 0.7;
}

.mn-legal-content {
  max-width: 760px;
  margin-inline: auto;
}

/* Titres */
.mn-legal-content h2 {
  font-family: var(--mn-font-serif);
  font-size: var(--mn-text-lg);
  font-weight: 500;
  color: var(--mn-black);
  margin-top: var(--mn-space-8);
  margin-bottom: var(--mn-space-4);
}

.mn-legal-content h3 {
  font-family: var(--mn-font-sans);
  font-size: var(--mn-text-base);
  font-weight: 600;
  color: var(--mn-black);
  margin-top: var(--mn-space-6);
  margin-bottom: var(--mn-space-3);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.mn-legal-content p {
  margin-bottom: var(--mn-space-4);
  line-height: 1.8;
  font-size: var(--mn-text-base);
}

.mn-legal-content ul,
.mn-legal-content ol {
  padding-left: var(--mn-space-6);
  margin-bottom: var(--mn-space-4);
}

.mn-legal-content li {
  margin-bottom: var(--mn-space-2);
  line-height: 1.7;
  color: var(--mn-black-soft);
}

.mn-legal-content a {
  color: var(--mn-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.mn-legal-content a:hover {
  color: var(--mn-accent-mid);
}

/* Séparateur */
.mn-legal-divider {
  border: none;
  border-top: 1px solid var(--mn-border);
  margin-block: var(--mn-space-8);
}

/* Préambule */
.mn-legal-preamble {
  background-color: var(--mn-cream-paper);
  border: 1px solid var(--mn-border-gold);
  border-radius: var(--mn-radius-md);
  padding: var(--mn-space-6);
  margin-bottom: var(--mn-space-8);
}

.mn-legal-preamble p {
  margin-bottom: var(--mn-space-3);
}

.mn-legal-preamble p:last-child {
  margin-bottom: 0;
}

/* Définitions */
.mn-legal-definitions {
  display: grid;
  gap: var(--mn-space-4);
  margin-bottom: var(--mn-space-6);
}

.mn-legal-definitions dt {
  font-family: var(--mn-font-sans);
  font-weight: 600;
  font-size: var(--mn-text-sm);
  color: var(--mn-accent);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.mn-legal-definitions dd {
  margin-left: 0;
  padding-left: var(--mn-space-4);
  border-left: 2px solid var(--mn-gold-pale);
  color: var(--mn-black-soft);
  line-height: 1.7;
  margin-top: var(--mn-space-1);
}

/* Tableau mentions légales */
.mn-legal-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: var(--mn-space-6);
  font-size: var(--mn-text-sm);
}

.mn-legal-table th,
.mn-legal-table td {
  padding: var(--mn-space-3) var(--mn-space-4);
  border-bottom: 1px solid var(--mn-border);
  text-align: left;
  vertical-align: top;
}

.mn-legal-table th {
  width: 200px;
  font-weight: 600;
  color: var(--mn-black);
  background-color: var(--mn-cream-paper);
  white-space: nowrap;
}

.mn-legal-table td {
  color: var(--mn-black-soft);
}

/* Alerte légale alcool */
.mn-legal-alert {
  background-color: #FFF8E1;
  border: 1.5px solid var(--mn-gold);
  border-radius: var(--mn-radius-md);
  padding: var(--mn-space-6);
  margin-block: var(--mn-space-6);
}

.mn-legal-alert p {
  margin-bottom: var(--mn-space-3);
  font-size: var(--mn-text-sm);
  color: var(--mn-black);
}

.mn-legal-alert p:last-child {
  margin-bottom: 0;
}

/* Carte contact */
.mn-legal-contact-card {
  background-color: var(--mn-cream-paper);
  border-radius: var(--mn-radius-md);
  padding: var(--mn-space-6);
  margin-block: var(--mn-space-4);
}

.mn-legal-contact-card ul {
  list-style: none;
  padding: 0;
  margin: var(--mn-space-3) 0 0;
}

.mn-legal-contact-card li {
  margin-bottom: var(--mn-space-2);
  font-size: var(--mn-text-base);
}


/* -------------------------------------------------------
   AGE GATE — VÉRIFICATION D'ÂGE
   Obligation légale : L.3342-1 Code de la santé publique
   Affiché à la première visite, mémorisé en sessionStorage
------------------------------------------------------- */
/*
 * IMPORTANT : l'attribut HTML [hidden] doit être respecté.
 * On force display:none sur [hidden] pour éviter que le sélecteur
 * #mn-age-gate { display:flex } ne l'écrase (bug classique).
 */
#mn-age-gate[hidden] {
  display: none !important;
}

#mn-age-gate {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background-color: var(--mn-black);
  /* display géré uniquement par le JS — pas de display:flex ici */
  align-items: center;
  justify-content: center;
  padding: var(--mn-space-6);
  opacity: 1;
  transition: opacity 0.3s ease;
}

/* Classe utilitaire gardée pour compatibilité — le JS utilise display:none directement */
#mn-age-gate.is-hidden {
  opacity: 0;
  pointer-events: none;
}

.mn-age-gate__panel {
  width: 100%;
  max-width: 480px;
  background-color: var(--mn-cream);
  border-radius: var(--mn-radius-lg);
  padding: var(--mn-space-12) var(--mn-space-8);
  text-align: center;
  position: relative;
  animation: mn-age-gate-in var(--mn-duration-slower) var(--mn-ease-out) both;
}

@keyframes mn-age-gate-in {
  from {
    opacity: 0;
    transform: scale(0.94) translateY(20px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

/* Icône / logo au-dessus */
.mn-age-gate__logo {
  width: 80px;
  height: auto;
  margin: 0 auto var(--mn-space-6);
  display: block;
}

/* Couronne décorative (si pas de logo) */
.mn-age-gate__crown {
  font-size: 2.5rem;
  margin-bottom: var(--mn-space-4);
  display: block;
  color: var(--mn-gold);
}

.mn-age-gate__eyebrow {
  font-family: var(--mn-font-sans);
  font-size: var(--mn-text-xs);
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--mn-gold);
  margin-bottom: var(--mn-space-3);
}

.mn-age-gate__title {
  font-family: var(--mn-font-serif);
  font-size: var(--mn-text-xl);
  font-weight: 500;
  color: var(--mn-black);
  line-height: 1.25;
  margin-bottom: var(--mn-space-2);
}

.mn-age-gate__subtitle {
  font-size: var(--mn-text-sm);
  color: var(--mn-black-soft);
  line-height: 1.6;
  margin-bottom: var(--mn-space-8);
  opacity: 0.75;
}

/* Boutons */
.mn-age-gate__actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--mn-space-3);
  margin-bottom: var(--mn-space-6);
}

#mn-age-gate-yes {
  background-color: var(--mn-accent);
  color: var(--mn-cream) !important;
  border-color: var(--mn-accent);
}

#mn-age-gate-yes:hover {
  background-color: var(--mn-accent-mid);
  border-color: var(--mn-accent-mid);
  transform: translateY(-1px);
}

#mn-age-gate-no {
  background-color: transparent;
  color: var(--mn-black-soft) !important;
  border-color: var(--mn-border-dark);
}

#mn-age-gate-no:hover {
  background-color: var(--mn-cream-dark);
}

/* Message de refus */
.mn-age-gate__denied {
  display: none;
  padding: var(--mn-space-6);
  background-color: #FFEBEE;
  border-radius: var(--mn-radius-md);
  font-size: var(--mn-text-sm);
  color: #C62828;
  margin-bottom: var(--mn-space-4);
}

.mn-age-gate__denied.is-visible {
  display: block;
}

/* Avertissement légal */
.mn-age-gate__legal {
  font-size: var(--mn-text-xs);
  color: var(--mn-black-soft);
  opacity: 0.5;
  line-height: 1.6;
}

.mn-age-gate__legal a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Variante fond affiche (si hero image) */
.mn-age-gate--poster #mn-age-gate {
  background-image: url('../images/affiche-felix.jpg');
  background-size: cover;
  background-position: center;
}

.mn-age-gate--poster #mn-age-gate::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(26, 24, 37, 0.80);
}

.mn-age-gate--poster .mn-age-gate__panel {
  position: relative;
  z-index: 1;
}

/* -------------------------------------------------------
   RESPONSIVE LEGAL
------------------------------------------------------- */
@media (max-width: 600px) {
  .mn-legal-table th {
    width: auto;
    white-space: normal;
  }

  .mn-legal-table th,
  .mn-legal-table td {
    display: block;
    width: 100%;
  }

  .mn-legal-table th {
    border-bottom: none;
    padding-bottom: var(--mn-space-1);
  }

  .mn-age-gate__actions {
    grid-template-columns: 1fr;
  }

  .mn-age-gate__panel {
    padding: var(--mn-space-8) var(--mn-space-6);
  }
}