@charset "UTF-8";
/* ---------------------------------------------------------------------------------------------
   Brique « fiche-imprimable » — la fiche artiste ou projet sur une page A4 (JulienWeb, 03/10/2026).

   Servie en media="print" par brique.php, sur les fiches seulement ; tout est en plus enfermé
   dans @media print : si le média de la balise sautait, l'écran ne bougerait pas.

   Ce qu'il faut savoir avant de toucher :
   - bootstrap-grid est servi en media="screen" (functions.php du thème) : à l'impression il n'y
     a NI .row NI .col-md-* ; tout est en blocs, et cette feuille pose ses propres colonnes ;
   - une page A4 fait environ 690 px de large pour les requêtes de largeur : les règles
     « max-width: 991px » de mobile.css et de style.css s'appliquent au papier ;
   - les sélecteurs passent par #app (un identifiant) pour l'emporter sur le thème sans
     !important ; !important ne sert que contre les styles posés en ligne par les scripts
     (tiny-slider, jquery.sticky) et pour les masquages ;
   - rien ne dépend de l'impression des fonds, que les navigateurs coupent par défaut : filets
     et losange sont des bordures.

   On imprime : en-tête de la maison, nom, origine, chapeau, la photo affichée, formation,
   presse, références, texte BOOKING, prochaines dates, contact.
   On n'imprime pas : menu, projets, vidéos, agenda du thème (remplacé par la liste serrée),
   biographie, pédagogie, liens, albums, pied de page, boutons, sorties des autres briques.

   1. Page et fond
   2. Ce qui ne s'imprime pas
   3. En-tête de la maison
   4. Nom, origine, chapeau, photo
   5. Formation, presse, références, BOOKING
   6. Prochaines dates
   7. Contact
   --------------------------------------------------------------------------------------------- */

@media print {

    /* -- 1. Page et fond ------------------------------------------------------------------- */

    @page {
        size: A4 portrait;
        margin: 12mm 14mm;
    }

    html,
    body {
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #fff !important;
    }

    body {
        color: #262830;
        font-size: 9.5pt;
        line-height: 1.4;
    }


    /* -- 2. Ce qui ne s'imprime pas --------------------------------------------------------
       Par liste blanche : seul #app s'imprime, et dans #app seuls les conteneurs de la fiche
       et les blocs de la brique. Une brique nouvelle, un bandeau, une fenêtre posée dans
       <body> par un script : masqués sans avoir à les connaître. */

    body > *:not(#app) {
        display: none !important;
    }

    #app > *:not(.container):not(.jws-fiche-imprimable__papier) {
        display: none !important;
    }

    /* Corps de la fiche : deux conteneurs, chacun en .col-md-8 + .col-md-4. */
    #app > .container > .row > .col-md-8 > *:not(.artist-presse),
    #app > .container > .row > .col-md-4 > *:not(.artist-lineup):not(.artist-references):not(.artist-pour-info) {
        display: none !important;
    }

    /* Ligne du nom : on garde le nom et l'origine (le compteur d'albums est un lien d'ancre). */
    #app .single-artist-header .text-right > *:not(h1):not(.artist-origine) {
        display: none !important;
    }

    /* Boutons, et le bloc BOOKING que la brique « programmer » crée pour son seul bouton. */
    #app button,
    #app .jws-btn,
    #app .is-btn,
    #app .is-btn-jelly,
    #app .jws-programmer,
    #app .jws-programmer__bloc,
    #app .jws-fiche-imprimable__action {
        display: none !important;
    }

    /* Ce que la presse peut embarquer et que le papier ne rend pas. */
    #app iframe,
    #app video,
    #app audio,
    #app embed,
    #app object {
        display: none !important;
    }

    /* Navigateurs récents : un conteneur dont rien ne s'imprime, et l'encart de formation
       que le thème sert même vide, disparaissent. Sans :has(), ces deux règles sont ignorées. */
    #app > .container:not(:has(.single-artist-header, .artist-presse, .artist-lineup > *, .artist-references, .artist-pour-info:not(.jws-programmer__bloc))) {
        display: none !important;
    }

    #app .artist-lineup:not(:has(> *)) {
        display: none !important;
    }


    /* -- 3. En-tête de la maison ------------------------------------------------------------
       Le bloc est servi après l'en-tête de la fiche (accroche jws_*_apres_entete) : il est
       remonté en haut de la page, dans la marge que #app lui réserve.
       Le logo n'existe qu'en 200 px : 19 mm, soit 267 points par pouce. Jamais plus de 4 cm. */

    #app {
        position: relative;
        margin: 0 !important;
        padding: 27mm 0 0 !important;
    }

    #app > .container {
        width: auto;
        max-width: none;
        margin: 0;
        padding: 0;
    }

    #app .row {
        display: block;
        margin: 0;
    }

    #app [class*="col-"] {
        flex: none;
        width: auto;
        max-width: none;
        padding: 0;
    }

    #app a {
        color: inherit;
        text-decoration: none;
    }

    #app > .jws-fiche-imprimable__tete {
        display: flex !important;
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        box-sizing: border-box;
        height: 22mm;
        padding: 0 0 3mm;
        align-items: center;
        gap: 5mm;
        border-bottom: .35mm solid #312783;
    }

    .jws-fiche-imprimable__logo {
        flex: 0 0 auto;
        width: 19mm;
        max-width: 40mm;
        height: auto;
        max-height: 19mm;
    }

    .jws-fiche-imprimable__maison {
        margin: 0;
        color: #312783;
        font-family: 'Poppins', 'Open Sans', sans-serif;
        font-size: 12pt;
        line-height: 1.2;
        letter-spacing: .06em;
        text-transform: uppercase;
    }

    .jws-fiche-imprimable__devise {
        display: block;
        margin: .8mm 0 0;
        color: #555;
        font-family: 'Open Sans', sans-serif;
        font-size: 8pt;
        letter-spacing: 0;
        text-transform: none;
    }

    .jws-fiche-imprimable__site {
        margin: 0 0 0 auto;
        color: #312783;
        font-size: 9pt;
        text-align: right;
        white-space: nowrap;
    }


    /* -- 4. Nom, origine, chapeau, photo ----------------------------------------------------
       Deux colonnes : le texte, puis la photo sur 84 mm (la dérivée medium-paysage fait
       640 px : 193 points par pouce). Sans diaporama, le texte prend la largeur.
       Le chapeau s'enroule autour du logo rond de l'artiste, comme à l'écran. */

    #app .single-artist-header {
        padding: 0;
        break-inside: avoid;
    }

    #app .single-artist-header > .row {
        display: flex;
        flex-wrap: nowrap;
        align-items: flex-start;
        gap: 7mm;
    }

    #app .single-artist-header > .row > .col-md-5 {
        flex: 1 1 0;
        min-width: 0;
    }

    #app .single-artist-header > .row > .col-md-7 {
        flex: 0 0 84mm;
        width: 84mm;
        max-width: 84mm;
    }

    #app .single-artist-header .text-right {
        text-align: left;
    }

    #app .single-artist-header h1.artist-name {
        margin: 0;
        color: #312783;
        font-size: 21pt;
        line-height: 1.1;
        break-after: avoid;
    }

    /* L'orange du thème (#f39200) est trop pâle sur papier : l'orange « texte » du socle. */
    #app .single-artist-header .artist-origine {
        margin: 1.5mm 0 0;
        color: #a86400;
        font-size: 9pt;
        letter-spacing: .04em;
    }

    #app .single-artist-header .artist-excerpt {
        padding: 4mm 0 0;
        color: #262830;
        font-size: 10pt;
        line-height: 1.45;
    }

    #app .single-artist-header .artist-excerpt p {
        margin: 0 0 1.5mm;
        text-align: left;             /* justifié à l'écran : trop de blancs sur 9 cm */
    }

    #app .artist-icone {
        float: left;
        margin: 0 4mm 1mm 0;
        -webkit-shape-outside: circle(50%);
        shape-outside: circle(50%);
    }

    #app .artist-icone img {
        display: block;
        width: 24mm;
        height: auto;
    }

    /* La photo : celle que le diaporama affiche au moment d'imprimer (.tns-slide-active).
       tiny-slider pose une largeur et un transform sur .my-slider : on les annule. Sans
       JavaScript, ou si aucune diapo n'est marquée, la première. */
    #app .artist-diaporama {
        margin: 0;
        padding: 0;
    }

    #app .artist-diaporama .tns-outer,
    #app .artist-diaporama .tns-ovh,
    #app .artist-diaporama .tns-inner {
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #app .artist-diaporama .my-slider {
        display: block !important;
        left: auto !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        transform: none !important;
        transition: none !important;
    }

    #app .artist-diaporama .artist-diapo-slide {
        display: none !important;
    }

    #app .artist-diaporama .artist-diapo-slide.tns-slide-active,
    #app .artist-diaporama .my-slider:not(.tns-slider) > .artist-diapo-slide:first-child {
        display: block !important;
        float: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #app .artist-diaporama .my-slider.tns-slider:not(:has(.tns-slide-active)) > .artist-diapo-slide:first-child {
        display: block !important;
        float: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #app .artist-diaporama .tns-controls,
    #app .artist-diaporama .tns-nav,
    #app .artist-diaporama .tns-liveregion,
    #app .artist-diaporama .tns-visually-hidden {
        display: none !important;
    }

    #app .artist-diaporama .artist-diapo-slide > a {
        background: none;
    }

    /* Galerie owl-carousel (seconde forme du diaporama dans single-projet.php). */
    #app .artist-diaporama .owl-stage {
        width: auto !important;
        transform: none !important;
    }

    #app .artist-diaporama .owl-item {
        display: none !important;
    }

    #app .artist-diaporama .owl-item.active {
        display: block !important;
        float: none !important;
        width: 100% !important;
    }

    #app .artist-diaporama .owl-nav,
    #app .artist-diaporama .owl-dots {
        display: none !important;
    }

    #app .artist-diaporama img {
        max-width: 100%;
    }


    /* -- 5. Formation, presse, références, BOOKING -------------------------------------------
       À l'écran : des encarts bordés, dont l'intertitre est posé en absolu sur la bordure,
       sur fond blanc. Sur papier : un filet indigo au-dessus, l'intertitre en petites
       capitales, le texte en encre. Formation et références passent sur deux colonnes. */

    #app .artist-lineup,
    #app .artist-presse,
    #app .artist-references,
    #app .artist-pour-info,
    .jws-fiche-imprimable__dates {
        position: static;
        margin: 5mm 0 0;
        padding: 2.5mm 0 0;
        border: 0;
        border-top: .3mm solid #312783;
        color: #262830;
        font-family: 'Open Sans', sans-serif;
        font-size: 9pt;
        line-height: 1.4;
    }

    #app .artist-lineup,
    #app .artist-pour-info,
    .jws-fiche-imprimable__dates {
        break-inside: avoid;
    }

    #app .artist-lineup h4,
    #app .artist-presse h4,
    #app .artist-references h4,
    #app .artist-pour-info h4,
    .jws-fiche-imprimable__dates h4,
    .jws-fiche-imprimable__contact h4 {
        position: static;
        margin: 0 0 1.5mm;
        padding: 0;
        border: 0;
        background: none;
        color: #312783;
        font-size: 9pt;
        line-height: 1.3;
        letter-spacing: .08em;
        text-transform: uppercase;
        break-after: avoid;
    }

    #app .artist-lineup p,
    #app .artist-presse p,
    #app .artist-references p,
    #app .artist-pour-info p {
        margin: 0 0 1mm;
    }

    #app .artist-lineup {
        column-count: 2;
        column-gap: 8mm;
    }

    #app .artist-lineup h4 {
        column-span: all;
    }

    #app .artist-lineup p {
        break-inside: avoid;
    }

    #app .artist-lineup a.artist-name {
        display: block;
        margin: 1mm 0 .5mm;
        color: #312783;
        font-size: 9pt;
        break-after: avoid;
    }

    #app .artist-presse-content {
        margin: 0;
    }

    #app .artist-presse img {
        max-width: 40mm;
        height: auto;
    }

    #app .artist-references .references-content {
        column-count: 2;
        column-gap: 8mm;
        color: #262830;
        font-size: 9pt;
    }


    /* -- 6. Prochaines dates ------------------------------------------------------------------
       Bloc de la brique (hidden à l'écran). Une ligne par date : le jour, puis l'intitulé et
       le lieu dessous. Deux colonnes. */

    #app > .jws-fiche-imprimable__pied {
        display: block !important;
    }

    .jws-fiche-imprimable__liste {
        margin: 0;
        padding: 0;
        column-count: 2;
        column-gap: 8mm;
        list-style: none;
    }

    .jws-fiche-imprimable__liste li {
        display: flex;
        gap: 3mm;
        margin: 0;
        padding: .6mm 0;
        break-inside: avoid;
    }

    .jws-fiche-imprimable__jour {
        flex: 0 0 22mm;
        color: #312783;
        white-space: nowrap;
    }

    .jws-fiche-imprimable__quoi {
        flex: 1 1 0;
        min-width: 0;
    }

    .jws-fiche-imprimable__lieu {
        display: block;
        color: #555;
    }

    .jws-fiche-imprimable__suite {
        margin: 1.5mm 0 0;
        color: #555;
    }


    /* -- 7. Contact ----------------------------------------------------------------------------
       Un cadre indigo, l'adresse du booking en plus grand, un losange orange devant chaque
       ligne (une bordure tournée : il s'imprime sans les fonds). */

    .jws-fiche-imprimable__contact {
        margin: 6mm 0 0;
        padding: 3.5mm 5mm;
        border: .5mm solid #312783;
        color: #312783;
        break-inside: avoid;
    }

    .jws-fiche-imprimable__lignes {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        gap: 1mm 8mm;
        margin: 0;
        font-size: 10pt;
        line-height: 1.4;
    }

    .jws-fiche-imprimable__lignes > span::before {
        content: "";
        display: inline-block;
        width: 0;
        height: 0;
        margin: 0 2.5mm 0 .5mm;
        border: .9mm solid #f39200;
        vertical-align: .3mm;
        rotate: 45deg;
    }

    .jws-fiche-imprimable__courriel {
        font-size: 12pt;
    }
}