/* 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, #1f6f54);
    fill: var(--primary-green, #1f6f54);
    filter:
        drop-shadow(0 0 1.5px var(--gold, #C9A227))
        drop-shadow(0 0 5px var(--primary-green, #1f6f54));
}

.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;
}

.reglage-mesures {
    max-width: 6rem;
}

/* 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. */
.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;
    }
}