/*
 * Copyright (c) 2025-2026.
 * kwargs SRL : Ingénierie logicielle, Bruxelles
 * Tous droits réservés.
 */

/* ── FORSA : CONSTELLATION DE COMPOSITION ────────────────────────────
 *
 *  Rendu serveur (SVG inline) de la constellation d'un CV ou d'une
 *  Offre. Identité visuelle stricte avec le blason métier rendu en
 *  sidebar de /explorateur/2d/ et /explorateur/3d/ : mêmes valeurs
 *  que .sb-constellation (cf. src/esco/templates/esco/map.html et
 *  src/atlas/static/atlas/cadastre_treemap.css).
 *
 *  Sur une composition mono-métier sans ajouts hors-métier, la
 *  constellation Offre/CV est identique au pixel près au blason de
 *  ce métier dans la sidebar.
 *
 *  Seul écart fonctionnel : .constellation-star.is-featured ajoute un
 *  halo doré FORSA pour les aptitudes phares (featured_skill_pks de
 *  la Composition). Le blason métier sidebar ne porte jamais cette
 *  classe.
 *
 * ─────────────────────────────────────────────────────────────────── */

.constellation-hero {
    width: 100%;
    max-width: 400px;
    aspect-ratio: 1 / 1;
    margin: 0 auto 1.25rem auto;
    background: #0d1424;
    border: 1px solid var(--bs-border-color);
    border-radius: 10px;
    overflow: hidden;
    box-shadow: inset 0 0 24px rgba(0, 0, 0, .45);
}
.constellation-hero .constellation-svg {
    width: 100%;
    height: 100%;
    display: block;
}

/* Vignette cliquable : ouvre la modale d'agrandissement. */
.constellation-hero-btn {
    -webkit-appearance: none;
    appearance: none;
    padding: 0;
    cursor: pointer;
    position: relative;
}
.constellation-expand-hint {
    position: absolute;
    right: .5rem;
    bottom: .5rem;
    color: rgba(255, 255, 255, .55);
    font-size: 1rem;
    line-height: 1;
    pointer-events: none;
    transition: color .15s ease;
}
.constellation-hero-btn:hover .constellation-expand-hint,
.constellation-hero-btn:focus-visible .constellation-expand-hint {
    color: #fff;
}

/* Modale : la même constellation en grand sur fond marine. Sélecteur à deux
   classes (.modal-content.constellation-modal-content) pour battre le fond
   par défaut de Bootstrap (sinon, en thème clair, le fond redevient blanc et
   les étoiles blanches pâles du champ disparaissent). */
.modal-content.constellation-modal-content {
    background: #0d1424;
    color: #e9ecef;
    border: 1px solid rgba(255, 255, 255, .12);
}
.constellation-modal-stage {
    width: 100%;
    max-width: 80vh;
    aspect-ratio: 1 / 1;
    margin: 0 auto;
    overflow: hidden;
    border-radius: 8px;
    background: #0d1424;
}
.constellation-modal-stage .constellation-svg {
    width: 100%;
    height: 100%;
    display: block;
}

/* Classes constellation-* : copie volontaire des règles
   src/atlas/static/atlas/cadastre_treemap.css (lignes 646-677) pour
   que la page /offre/<uuid>/ n'ait pas à charger tout le CSS de la
   sidebar /explorateur/. À factoriser dans un fichier partagé
   constellation-base.css quand le besoin se généralise. */
.constellation-dome {
    fill: none;
    stroke: rgba(255, 255, 255, .15);
    stroke-width: 16;
}
.constellation-bg-star {
    fill: rgba(255, 255, 255, .2);
}
.constellation-edge {
    /* Gold FORSA (cf. HIGHLIGHT_EMISSIVE = 0xffd166 dans cadastre_3d.js). */
    stroke: rgba(255, 209, 102, .55);
    stroke-width: 1.4;
}
.constellation-star {
    transition: filter .12s ease, transform .12s ease;
    transform-origin: center;
    transform-box: fill-box;
}
.constellation-star-essential {
    fill: #FF7043;
    color: #FF7043;
}
.constellation-star-optional {
    fill: #42A5F5;
    color: #42A5F5;
}

/* Aptitude phare : halo doré FORSA, lisible sur fond marine et sur
   les deux couleurs essential/optional. Halo statique (filter sur
   l'étoile elle-même), donc visible même sans survol. */
.constellation-star.is-featured {
    filter: drop-shadow(0 0 8px rgba(255, 193, 13, .9))
            drop-shadow(0 0 3px rgba(255, 193, 13, 1));
}