/* Lecteur d'œuvre (partition Verovio + lecture MIDI) — voir public/assets/js/oeuvre-lecteur.js.
   Aucun style en ligne dans les vues : tout ce qui habille la portée est ici. */

/* Note en cours de lecture : le repère visuel qui fait tout l'intérêt pédagogique.
   Verovio peint la tête de note (glyphe SMuFL) en `fill`, mais trace la hampe avec une
   feuille de style qu'il embarque dans le SVG : « #<id> path { stroke: currentColor } ».
   Cette règle-là, portée par un sélecteur d'identifiant, l'emporterait sur un `stroke`
   posé ici — c'est donc `color` qui recolore la hampe, et `fill` la tête de note.

   Un simple aplat vert se noyait sur une portée réelle (têtes de note tassées, hampes fines,
   lignes noires alentour) — retour du 11/08. Deux renforts, chacun testé (Firefox réel via
   Playwright, capture d'écran) sur une portée à plusieurs voix :
   - un halo en deux couches (`drop-shadow` empilés, cf. commentaire de reglage-echelle plus
     bas sur les limites de `filter` en SVG) : un liseré or serré contre le glyphe, puis un
     halo vert plus large qui le détache du fond — les deux teintes de la charte, sans en
     sortir ;
   - la hampe épaissie via `stroke-width` sur le <path> du sélecteur .stem : contrairement à
     `stroke` (recolorié par currentColor, voir plus haut), Verovio pose stroke-width="18" en
     attribut de présentation sur l'élément — une simple règle de classe suffit à l'emporter,
     aucun sélecteur d'identifiant ne le dispute. */
.note-jouee {
    color: var(--primary-green, #111111);
    fill: var(--primary-green, #111111);
    filter:
        drop-shadow(0 0 1.5px var(--gold, #C9A227))
        drop-shadow(0 0 5px var(--primary-green, #111111));
}

.note-jouee .stem path {
    stroke-width: 32;
}

.portee-oeuvre {
    overflow-x: auto;
    min-height: 8rem;
}

.portee-oeuvre svg {
    width: 100%;
    max-width: 100%;
    height: auto;
}

/* Les notes et mesures répondent au clic (annotations, exercices de théorie). */
.portee-oeuvre .note,
.portee-oeuvre .rest {
    cursor: pointer;
}

/* Pendant le chargement du moteur de gravure. */
.portee-oeuvre[aria-busy="true"] {
    opacity: 0.5;
}

/* Message d'état : créé par le script s'il n'existe pas dans la vue. */
.lecteur-oeuvre-message {
    margin-top: 0.75rem;
    margin-bottom: 0;
    font-size: 0.9rem;
    color: var(--bs-danger, #dc3545);
}

.lecteur-oeuvre-message[hidden] {
    display: none;
}

/* Colonne de contenu de la page d'une œuvre (oeuvres/show.php) : largeur de lecture
   confortable, comme .container[style="max-width:900px"] de tarifs.php mais sans
   style en ligne (règle workspace — voir l'en-tête de ce fichier). */
.oeuvre-container {
    max-width: 900px;
}

/* Tâche 11 — annotations ancrées et transposition de la copie personnelle. */

/* Réglages d'affichage (échelle, mesures par ligne) : purement clients, jamais
   persistés — voir la fin de oeuvre-lecteur.js. Largeurs bornées pour ne pas
   étirer ces deux petits contrôles sur toute la ligne. */
.reglage-echelle {
    max-width: 12rem;
}

/* Réglage « Mesures par ligne » : champ court, mais assez large pour son libellé flottant
   entier (Bootstrap tronque le label à la largeur du conteneur, avant la réduction à 85 %).
   Base flex FIXE : le curseur voisin (.form-range, width 100 %) écraserait sinon le champ à sa
   largeur minimale (constaté en capture, « Mesu… »). */
.form-floating:has(> .reglage-mesures) {
    flex: 0 0 10rem;
}

/* Note sélectionnée par un clic, en attente d'être ancrée à une annotation :
   distincte de .note-jouee (vert, pendant l'écoute) par l'accent or de la charte. */
.note-selectionnee {
    color: var(--gold, #C9A227);
    fill: var(--gold, #C9A227);
}

/* Tâche 16.1a — retours du porteur sur le lecteur (transport à icônes, tempo,
   volume, plage de mesures, indicateur de mesure courante). */

/* Curseurs tempo/volume : largeur bornée, comme .reglage-echelle ci-dessus —
   sinon ils s'étirent sur toute la largeur disponible de la card. */
.lecteur-oeuvre-reglage-range {
    max-width: 8rem;
}

/* Bornes de la plage de mesures : deux champs numériques, pas des années.
   width:auto sur le groupe : un .input-group Bootstrap prend sinon 100 % de la
   largeur et rejetait à lui seul la plage (et l'export PDF) sous la ligne
   unique de commandes (demande porteur 03/09). */
.lecteur-oeuvre-plage {
    width: auto;
}

.lecteur-oeuvre-plage input[type="number"] {
    max-width: 4.5rem;
}

/* Boutons de transport (lecture/pause, arrêt, reprise au début) : les SVG de
   Bootstrap Icons héritent de currentColor, déjà cohérent avec .btn-primary/
   .btn-outline-primary — rien à recolorier ici, juste un recentrage vertical. */
[data-lecteur-oeuvre] .btn-group svg {
    vertical-align: -0.125em;
}

/* Tâche 20 — activer/désactiver les voix d'une partition à plusieurs voix. Demande du
   porteur, mot pour mot : la portée d'une voix désactivée « devra rester, mais en mode
   moins lisible, comme un texte muted ». Une simple réduction d'opacité, comme
   .portee-oeuvre[aria-busy="true"] plus haut (déjà le même principe pour l'attente du
   chargement) — mais plus marquée : ici c'est un choix délibéré de l'utilisateur, pas un
   état transitoire, il doit se voir clairement plutôt que de se confondre avec lui. */
.voix-estompee {
    opacity: 0.3;
}

/* Impression (tâche 20) : la portée interactive (transport, réglages, cases à cocher)
   n'a rien à faire sur le papier — seule la portée d'impression (reconstruite juste
   avant l'impression par oeuvre-lecteur.js, amputée des voix désactivées) doit
   apparaître. Masquée à l'écran en toutes circonstances (le "hidden" HTML suffit déjà,
   cette règle ne fait que l'expliciter). */
.portee-oeuvre-impression {
    display: none;
}

/* Tâche 16.1b — paroles affichées sous la partition (texte seul, usage de
   chanteur) : .lecteur-oeuvre-paroles-texte n'a besoin d'aucune règle
   propre, Bootstrap (paragraphe + utilitaires .mb-3/.mb-0 posés dans la vue)
   suffit déjà — la classe existe pour que oeuvre-lecteur.js ou un futur
   ajustement aient un crochet stable, pas pour porter du style aujourd'hui.
   Visible aussi à l'impression (aucune règle @media print ne l'exclut ci-
   dessous) : un chanteur qui imprime sa partition profite aussi du texte. */

@media print {
    [data-lecteur-oeuvre] [data-role="portee"],
    [data-lecteur-oeuvre] .btn-group,
    [data-lecteur-oeuvre] select[data-role="generateur-son"],
    [data-lecteur-oeuvre] .lecteur-oeuvre-reglages,
    [data-lecteur-oeuvre] [data-role="voix"],
    [data-lecteur-oeuvre] .modal {
        display: none !important;
    }

    [data-lecteur-oeuvre] .portee-oeuvre-impression {
        display: block !important;
    }

    /* Export PDF ciblé (tâche 16.1b) : `data-export-cible` est posé par
       oeuvre-lecteur.js sur UN SEUL lecteur, juste avant window.print(), retiré
       juste après (voir brancherExportPdf()). Sans cette règle, la popup d'export
       ouverte sur un seul lecteur d'une page à plusieurs (théorie, jusqu'à six)
       imprimerait quand même TOUTES les partitions de la page — un Ctrl+P
       ordinaire (sans passer par la popup) reste, lui, inchangé : aucun lecteur
       ne porte alors `data-export-cible`, la règle ne s'applique à aucun. */
    body:has([data-lecteur-oeuvre][data-export-cible]) [data-lecteur-oeuvre]:not([data-export-cible]) {
        display: none !important;
    }

    /* Export PDF (03/09 soir) : la page imprimée = LA PARTITION SEULE, pleine
       largeur. Pendant l'export (data-export-cible posé par oeuvre-lecteur.js
       le temps du window.print()), tout ce qui ne mène pas au lecteur exporté
       disparaît — barre de navigation, footer, méta de l'œuvre, « Connectez-
       vous pour copier… », cartes voisines : à CHAQUE niveau de l'arbre, on ne
       garde que la branche qui contient la cible. Un Ctrl+P ordinaire (sans
       passer par la popup) reste inchangé : aucune cible posée. */
    body:has([data-export-cible]) > :not([data-export-cible]):not(:has([data-export-cible])),
    body:has([data-export-cible]) :has([data-export-cible]) > :not([data-export-cible]):not(:has([data-export-cible])) {
        display: none !important;
    }

    /* Dans le lecteur exporté lui-même : uniquement la zone d'impression. */
    body:has([data-export-cible]) [data-export-cible] > :not(.portee-oeuvre-impression) {
        display: none !important;
    }

    /* Pleine largeur de page : ni container, ni card — les cadres qui mènent à
       la partition perdent bordures, ombres, marges et largeur maximale, et
       les SVG s'étirent sur toute la largeur disponible. */
    body:has([data-export-cible]) .container:has([data-export-cible]) {
        max-width: none !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body:has([data-export-cible]) [data-export-cible] {
        border: 0 !important;
        box-shadow: none !important;
        border-radius: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body:has([data-export-cible]) [data-export-cible] .portee-oeuvre-impression svg {
        width: 100% !important;
        height: auto !important;
    }
}

/* Icônes métronome/haut-parleur de la ligne de commandes du lecteur (03/09) —
   fichiers maison public/assets/icones/, teintées par currentColor. */
.lecteur-oeuvre-icone {
    display: inline-flex;
    align-items: center;
    color: var(--forest, #111111);
}

/* La valeur (♩ = 120, 100 %) ne se recompose pas à chaque variation : largeur
   minimale réservée pour que la ligne ne « respire » pas pendant un glissé. */
.lecteur-oeuvre-valeur {
    min-width: 4.2em;
    white-space: nowrap;
}