/* =========================================================================
   AUDIO CORAN — FEUILLE D'IMPRESSION COMMUNE
   assets/design/print.css
   -------------------------------------------------------------------------
   À charger APRÈS design-system.css et la feuille de l'application :

     <link rel="stylesheet" href="assets/design/print.css" media="print">

   L'attribut media="print" garantit un téléchargement non bloquant : le
   navigateur récupère le fichier en basse priorité et ne retarde pas le
   premier rendu.

   PRINCIPES
     • Fond blanc, texte noir : une page sombre imprimée vide une cartouche
       et devient illisible.
     • Rien qui ne serve à la lecture papier : barres d'outils, lecteurs
       audio, boutons, menus, animations.
     • Les URLs des liens sont imprimées entre parenthèses — sur papier, un
       lien souligné sans adresse ne mène nulle part.
     • Pied de page compact et lisible, avec la source du document.
   ====================================================================== */

@page {
  margin: 16mm 14mm;
}

@media print {

  /* ---------------------------------------------------------------------
     1. BASE — on repasse en clair quel que soit le thème affiché à l'écran
     ------------------------------------------------------------------ */
  :root,
  [data-theme="dark"],
  [data-theme="light"] {
    --bg: #FFFFFF;
    --bg-elevated: #FFFFFF;
    --surface: transparent;
    --surface-strong: transparent;
    --border: #CCCCCC;
    --border-accent: #999999;
    --border-gold: #999999;
    --text: #000000;
    --text-secondary: #333333;
    --text-tertiary: #555555;
    --accent: #0F6D4C;
    --accent-2: #8A6D22;
    --shadow-soft: none;
    --shadow-card: none;
    --shadow-glow: none;
    --halo: none;
    color-scheme: light;
  }

  html, body {
    background: #FFFFFF !important;
    color: #000000 !important;
    font-size: 11pt;
    line-height: 1.45;
  }

  /* Aucune ombre, aucun filtre, aucune animation à l'impression. */
  *, *::before, *::after {
    background-image: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    animation: none !important;
    transition: none !important;
  }

  /* ---------------------------------------------------------------------
     2. ÉLÉMENTS MASQUÉS — tout ce qui n'a pas de sens sur papier
     ------------------------------------------------------------------ */
  .topbar,
  .coran-topbar,
  .app-switch, .ac-switch,
  [data-ac-switch],
  .ac-burger,
  .ac-ctrl,
  .icon-btn,
  .coran-iconbtn,
  .lp-hero__cta,
  .player, .player-card, .mini-player,
  .bottom-nav,
  .coran-actionbar,
  .coran-sheet, .coran-skip,
  .video-card, .video-embed,
  .status-banner,
  .ds-toast, .ds-modal-backdrop,
  .lp-btn,
  audio, video,
  button,
  [role="toolbar"], [role="dialog"], [role="tablist"],
  .no-print {
    display: none !important;
  }

  /* Le lien d'évitement ne doit jamais apparaître sur papier. */
  .ac-skip { display: none !important; }

  /* ---------------------------------------------------------------------
     3. MISE EN PAGE
     ------------------------------------------------------------------ */
  main, .lp-container, .ds-container, .coran-wrap {
    max-width: none !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Pas de titre orphelin en bas de page. */
  h1, h2, h3, h4 {
    break-after: avoid-page;
    page-break-after: avoid;
  }
  h1 { font-size: 20pt; }
  h2 { font-size: 15pt; }
  h3 { font-size: 12.5pt; }

  p, li, blockquote {
    orphans: 3;
    widows: 3;
  }

  /* Ne pas couper un verset, une carte ou une réponse de FAQ en deux pages. */
  .coran-ayah,
  .lp-card, .ds-card,
  details, figure, table {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  /* Les FAQ en <details> sont dépliées : sur papier, rien n'est cliquable. */
  details { display: block !important; }
  details > summary { font-weight: 700; list-style: none; }
  details > *:not(summary) { display: revert !important; }

  img, svg { max-width: 100% !important; height: auto !important; }

  /* ---------------------------------------------------------------------
     4. LIENS — l'adresse est imprimée, sinon le lien est inutile
     ------------------------------------------------------------------ */
  a { color: #000000 !important; text-decoration: underline; }

  a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 8.5pt;
    color: #555555;
    word-break: break-all;
  }
  /* Inutile pour les ancres internes, les mailto et les liens d'icônes. */
  a[href^="#"]::after,
  a[href^="mailto:"]::after,
  .site-footer__links a::after,
  [data-ac-switch] a::after { content: ""; }

  /* ---------------------------------------------------------------------
     5. PIED DE PAGE — compact, lisible, sourcé
     ------------------------------------------------------------------ */
  .site-footer,
  [data-ac-footer] {
    display: block !important;
    min-height: 0 !important;
    margin-top: 10mm;
    padding-top: 3mm;
    border-top: 1pt solid #999999;
    background: none !important;
    font-size: 8.5pt;
    color: #333333 !important;
    break-inside: avoid;
    page-break-inside: avoid;
  }

  /* Sur papier, seules la marque et la mention légale ont un sens :
     les colonnes de navigation sont supprimées. */
  .site-footer__col,
  .site-footer__version,
  .site-footer__social,
  [data-ac-footer] nav {
    display: none !important;
  }

  .site-footer__inner {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .site-footer__tagline {
    margin: 0 0 1mm;
    font-size: 8.5pt;
    color: #333333 !important;
  }

  /* Le logo est une image de fond : invisible à l'impression.
     On le remplace par le nom de la marque en texte. */
  .brand-logo,
  .site-footer__brand-logo {
    display: block !important;
    width: auto !important;
    height: auto !important;
    background: none !important;
    font-family: 'Amiri', Georgia, serif;
    font-size: 11pt;
    font-weight: 700;
    color: #000000 !important;
  }
  .brand-logo::after,
  .site-footer__brand-logo::after {
    content: "Audio Coran";
  }

  .site-footer__bottom {
    display: block !important;
    margin-top: 1.5mm;
    padding: 0 !important;
    border: 0 !important;
  }
  .site-footer__copyright {
    margin: 0;
    font-size: 8pt;
    color: #555555 !important;
  }

  /* Source du document, ajoutée uniquement sur papier. */
  [data-ac-footer]::after,
  .site-footer::after {
    content: "Document imprimé depuis audio-coran.com";
    display: block;
    margin-top: 1.5mm;
    font-size: 8pt;
    color: #555555;
  }
}
