/************************************************************
    ICF PROJECTS — identité orange du module

    Le site est violet (#601E82) : fellowships, comptes, écrans communs.
    Le module projets porte l'orange déjà utilisé pour la tuile « Projects »
    de la page d'accueil. Cette feuille ne colore QUE ce module.

    Deux portées :
      .icfp-page   → les gabarits du module (classe posée sur <main>)
      .icfp-scope  → un bloc projets inséré dans un écran commun
                     (section « Project Links » du tableau de bord)

    Le thème pilote ses boutons par les variables Bootstrap : on les
    surcharge plutôt que de réécrire chaque règle.
************************************************************/

:root {
    --icfp-orange:        #F59B00;
    --icfp-orange-dark:   #d98800;
    --icfp-orange-darker: #b87300;
    --icfp-orange-soft:   #fff7e8;
    --icfp-orange-line:   #f3ddb2;
    --icfp-ink:           #2b2532;
    --icfp-ink-soft:      #7d7688;
    --icfp-grey:          #e4e1e8;
}

/* ---------- Boutons ---------- */

.icfp-page .btn-primary,
.icfp-page .btn.btn-primary,
.icfp-page .btn-secondary,
.icfp-page .btn.btn-secondary,
.icfp-scope .btn-primary,
.icfp-scope .btn.btn-primary,
.icfp-scope .btn-secondary,
.icfp-scope .btn.btn-secondary {
    --bs-btn-bg: var(--icfp-orange);
    --bs-btn-border-color: var(--icfp-orange);
    --bs-btn-hover-bg: var(--icfp-orange-dark);
    --bs-btn-hover-border-color: var(--icfp-orange-dark);
    --bs-btn-active-bg: var(--icfp-orange-darker);
    --bs-btn-active-border-color: var(--icfp-orange-darker);
    background-color: var(--icfp-orange);
    border-color: var(--icfp-orange);
    color: #fff;
}

.icfp-page .btn-primary:hover,
.icfp-page .btn-secondary:hover,
.icfp-page .btn-primary:focus,
.icfp-page .btn-secondary:focus,
.icfp-scope .btn-primary:hover,
.icfp-scope .btn-secondary:hover,
.icfp-scope .btn-primary:focus,
.icfp-scope .btn-secondary:focus {
    background-color: var(--icfp-orange-dark);
    border-color: var(--icfp-orange-dark);
    color: #fff;
}

.icfp-page .btn-primary:focus-visible,
.icfp-page .btn-secondary:focus-visible,
.icfp-scope .btn-primary:focus-visible,
.icfp-scope .btn-secondary:focus-visible {
    box-shadow: 0 0 0 .25rem rgba(245, 155, 0, .35);
}

.icfp-page .btn-outline-secondary,
.icfp-scope .btn-outline-secondary {
    --bs-btn-color: var(--icfp-orange-darker);
    --bs-btn-border-color: var(--icfp-orange);
    --bs-btn-hover-bg: var(--icfp-orange);
    --bs-btn-hover-border-color: var(--icfp-orange);
    --bs-btn-hover-color: #fff;
    color: var(--icfp-orange-darker);
    border-color: var(--icfp-orange);
}

.icfp-page .btn-link,
.icfp-scope .btn-link { color: var(--icfp-orange-darker); }

/* ---------- Titres et onglets ----------
   Règle du module : #F59B00 sert aux SURFACES (boutons, pastilles, aplats),
   jamais au texte sur fond clair — son contraste y tombe sous 2:1. Pour du
   texte, on prend la déclinaison sombre, lisible sur blanc comme sur gris.
------------------------------------------------------------------ */

.icfp-page .hero,
.icfp-page .pt-menu { background-color: #f6f5f7; }

.icfp-page .page-title,
.icfp-page .page-title.font-color-purple { color: var(--icfp-orange-darker) !important; }

.icfp-page .pt-menu p,
.icfp-page .pt-menu li { color: var(--icfp-ink); }

/* Les onglets sont désormais une barre segmentée définie dans custom.css,
   commune aux deux modules. L'ancien filet orange en `inset box-shadow`
   était chargé APRÈS elle et redessinait un trait au-dessus de l'onglet
   actif : il est retiré, pas neutralisé. */

/* Aplat de remplacement quand un projet n'a pas d'image. */
.icfp-placeholder {
    background: linear-gradient(135deg, var(--icfp-orange) 0%, #ffc255 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
}

/* ---------- Bloc d'appel à candidature (shortcode) ---------- */

.icfp-apply-block__status {
    display: inline-block;
    margin: 0 0 14px;
    padding: 10px 16px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
}
.icfp-apply-block__status.is-open   { background: #e8f5ec; color: #1c6b3a; }
.icfp-apply-block__status.is-closed { background: #f1f0f3; color: #5c5566; }
.icfp-apply-block__cta { margin: 0; }

/* ---------- Carte accentuée (dates de session) ---------- */

.icfp-card--accent {
    background: var(--icfp-orange-soft);
    border: 1px solid var(--icfp-orange-line);
}

/* ---------- Parcours du dossier (onglet Process) ---------- */

.icfp-track { list-style: none; margin: 0; padding: 0; position: relative; }
.icfp-track::before {
    content: "";
    position: absolute;
    left: 16px; top: 18px; bottom: 18px;
    width: 2px;
    background: var(--icfp-grey);
}

.icfp-node { position: relative; display: flex; gap: 16px; padding: 0 0 28px; }
.icfp-node:last-child { padding-bottom: 0; }

.icfp-dot {
    position: relative; z-index: 1;
    flex: 0 0 34px; width: 34px; height: 34px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 13px; font-weight: 700;
    background: #eeecf1; color: #9a94a3;
    border: 2px solid #eeecf1;
}
.icfp-node.is-done .icfp-dot {
    background: var(--icfp-orange);
    border-color: var(--icfp-orange);
    color: #fff;
}
.icfp-node.is-current .icfp-dot {
    background: #fff;
    border-color: var(--icfp-orange);
    color: var(--icfp-orange-darker);
    box-shadow: 0 0 0 5px rgba(245, 155, 0, .18);
}

.icfp-node__body { padding-top: 4px; }
.icfp-node__label { margin: 0; font-weight: 700; font-size: 15px; color: var(--icfp-ink); }
.icfp-node.is-todo .icfp-node__label { color: #9a94a3; font-weight: 600; }
.icfp-node.is-current .icfp-node__label { color: var(--icfp-orange-darker); }
.icfp-node__hint { margin: 2px 0 0; font-size: 12.5px; color: var(--icfp-ink-soft); }
.icfp-node__date { margin: 4px 0 0; font-size: 12px; color: #9a94a3; }

.icfp-branches { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 6px; }
.icfp-branch {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 12px;
    border: 1px solid var(--icfp-grey);
    border-radius: 8px;
    background: #fbfafc;
    font-size: 13px; color: #9a94a3;
}
.icfp-branch__label { flex: 1 1 auto; }
.icfp-branch__date { font-size: 11.5px; color: var(--icfp-ink-soft); }

.icfp-branch.is-active {
    border-color: var(--icfp-orange);
    background: var(--icfp-orange-soft);
    color: var(--icfp-ink);
    font-weight: 600;
}

/* Refus : même orange, en aplat plein — c'est une fin de parcours. */
.icfp-branch.is-active.is-end {
    background: var(--icfp-orange);
    border-color: var(--icfp-orange);
    color: #fff;
}
.icfp-branch.is-active.is-end .icfp-branch__date { color: #fff; }

/* ---------- Table de notation ----------
   Lignes = critères, colonnes = évaluateurs, dernière colonne = moyenne.
   Le total d'un évaluateur passe au vert au-delà de 9, à l'orange en deçà :
   la couleur donne le verdict avant même la lecture du chiffre.
------------------------------------------------------------------ */

.icfp-scoring__caption { margin: 0 0 10px; font-size: 14px; color: var(--icfp-ink); }
.icfp-scoring__caption em { color: var(--icfp-ink-soft); font-size: 13px; }

.icfp-scoring {
    width: 100%;
    border-collapse: collapse;
    font-size: 13.5px;
    background: #fff;
}
.icfp-scoring th,
.icfp-scoring td {
    border: 1px solid #cfcbd6;
    padding: 10px 12px;
    vertical-align: middle;
    text-align: left;
}

.icfp-scoring thead th {
    background: #cfcbd6;
    color: var(--icfp-ink);
    font-weight: 700;
    font-size: 13px;
    white-space: nowrap;
}
.icfp-scoring thead th.icfp-scoring__head {
    text-transform: uppercase;
    letter-spacing: .01em;
    white-space: normal;
    min-width: 260px;
}

.icfp-scoring tbody th { background: #f1eff3; font-weight: 500; }
.icfp-scoring__score { background: #e2efdc; color: var(--icfp-ink); }
.icfp-scoring__avg   { background: var(--icfp-orange); color: #fff; font-weight: 600; }

.icfp-scoring__opinion th,
.icfp-scoring__opinion td { background: #eeecf1; font-size: 12.5px; }

.icfp-scoring tfoot th {
    background: #fff;
    font-weight: 800;
    font-size: 15px;
    text-transform: uppercase;
}
.icfp-scoring__total,
.icfp-scoring__grand { font-weight: 800; font-size: 15px; color: #fff; }
.icfp-scoring__total.is-high { background: #14a06b; }
.icfp-scoring__total.is-low  { background: var(--icfp-orange); }
.icfp-scoring__grand { background: #fff; color: var(--icfp-ink); }

/* ---------- Panneau d'état ---------- */

.icfp-state {
    border: 1px solid var(--icfp-orange-line);
    border-radius: 12px;
    padding: 20px;
    background: var(--icfp-orange-soft);
}
.icfp-state__caption {
    margin: 0;
    font-size: 11px; text-transform: uppercase; letter-spacing: .06em;
    font-weight: 700; color: var(--icfp-orange-darker);
}
.icfp-state__badge { margin: 8px 0 16px; font-size: 15px; }
.icfp-state__list { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; margin: 0; font-size: 13px; }
.icfp-state__list dt { color: var(--icfp-ink-soft); font-weight: 600; }
.icfp-state__list dd { margin: 0; color: var(--icfp-ink); }
.icfp-state__note { margin-top: 16px; font-size: 12.5px; color: var(--icfp-ink-soft); }
.icfp-state__note p { margin: 8px 0 0; }

/* ---------- Tableau de bord : familles de cartes ----------
   Fellowship en violet, projets en orange, le reste en gris.
   Les cartes portent leur fond en style inline : la surcharge doit donc
   l'emporter explicitement.
------------------------------------------------------------------ */

.cuv-scope.icf-card,
.cuv-scope .icf-card { background-color: #601E82 !important; }

.icfp-scope.icf-card,
.icfp-scope .icf-card { background-color: var(--icfp-orange) !important; }

.cuv-scope.icf-card div,
.cuv-scope.icf-card p,
.cuv-scope .icf-card div,
.cuv-scope .icf-card p,
.icfp-scope.icf-card div,
.icfp-scope.icf-card p,
.icfp-scope .icf-card div,
.icfp-scope .icf-card p { color: #fff !important; }

.cuv-scope.icf-card .btn,
.cuv-scope .icf-card .btn,
.icfp-scope.icf-card .btn,
.icfp-scope .icf-card .btn {
    background-color: #fff !important;
    border-color: #fff !important;
}
.cuv-scope.icf-card .btn,
.cuv-scope .icf-card .btn { color: #601E82 !important; }
.icfp-scope.icf-card .btn,
.icfp-scope .icf-card .btn { color: var(--icfp-orange-darker) !important; }

/* Pastilles de comptage : lisibles sur les deux fonds. */
.cuv-scope .icf-card .badge,
.icfp-scope .icf-card .badge {
    background-color: #fff !important;
    color: var(--icfp-ink) !important;
}

/* ---------- Repères du dossier (vue du porteur) ----------
   Un dossier a peu de repères mais ils comptent : statut, région, dates.
   Grille de tuiles plutôt qu'une liste, pour qu'ils se lisent d'un coup.
------------------------------------------------------------------ */

.icfp-facts {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    margin-bottom: 24px;
}
.icfp-facts__item {
    border: 1px solid var(--icfp-orange-line);
    border-radius: 10px;
    padding: 14px 16px;
    background: var(--icfp-orange-soft);
}
.icfp-facts__label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-weight: 700;
    color: var(--icfp-orange-darker);
}
.icfp-facts__value {
    display: block;
    margin-top: 6px;
    font-size: 15px;
    font-weight: 600;
    color: var(--icfp-ink);
}

.icfp-note {
    border-left: 4px solid var(--icfp-orange);
    background: #fff;
    border-radius: 0 10px 10px 0;
    padding: 16px 20px;
    margin-bottom: 24px;
}
.icfp-note__caption {
    margin: 0 0 6px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-weight: 700;
    color: var(--icfp-orange-darker);
}
.icfp-note p:last-child { margin-bottom: 0; }

/* ---------- Bandeau orange du haut de page ----------
   Texte en blanc, choix assumé : #F59B00 étant une couleur claire, le blanc y
   plafonne à 2.3:1 de contraste. Assombrir le fond du bandeau suffirait à
   repasser au-dessus de 4.5:1 sans toucher au texte.
------------------------------------------------------------------ */

#hero-top-project,
#hero-top-project p,
#hero-top-project li,
#hero-top-project h1,
#hero-top-project h2,
#hero-top-project .page-title { color: #fff !important; }

/* Sur ce fond, un bouton plein orange disparaîtrait : on le passe en blanc. */
.icfp-page .bg-yellow .btn-secondary,
.icfp-page .bg-yellow .btn-primary {
    background-color: #fff;
    border-color: #fff;
    color: var(--icfp-orange-darker);
}
.icfp-page .bg-yellow .btn-secondary:hover,
.icfp-page .bg-yellow .btn-primary:hover {
    background-color: var(--icfp-ink);
    border-color: var(--icfp-ink);
    color: #fff;
}
.icfp-page .bg-yellow .btn-link { color: #fff; }

/* ----------------------------------------------------------------------
   Plan de budget (formulaire de dépôt, section ICF)

   La ligne de total doit se détacher du corps du tableau : c'est le
   chiffre qu'on vient chercher, pas une ligne de plus.
   ---------------------------------------------------------------------- */
.icfp-budget__total-row {
    background: var(--icfp-orange-soft, #fff7e8);
}
.icfp-budget__total-row th,
.icfp-budget__total-row td {
    border-top: 2px solid var(--icfp-orange-line, #f3ddb2);
}
.icfp-budget__total-row strong {
    font-size: 18px;
    color: var(--icfp-orange-darker, #b87300);
}
.icfp-budget__delete {
    line-height: 1;
    border: 0;
}
.icfp-budget__delete:hover {
    color: #b02a37 !important;
}

/* Navigation à deux niveaux et barre de filtres : les composants vivent
   désormais dans custom.css, partagés par les deux modules
   (.icf-pills / .icf-segments, avec les alias .icfp-tabgroup et
   .icfp-substatus pour le balisage existant). */

/* ----------------------------------------------------------------------
   Liste des projets — barre de filtres

   Neuf statuts et N régions alignés en boutons occupaient trois rangées
   avant la première ligne de données. Même découpage que la fiche projet :
   la famille d'abord (.icfp-tabgroup, déjà défini plus haut), le statut
   précis ensuite, la région en menu déroulant.
   ---------------------------------------------------------------------- */
.icfp-filters {
    margin-bottom: 24px;
}

/* Niveau 2 — les statuts de la famille ouverte. Volontairement plus
   discret que les familles : c'est un affinage, pas un choix de départ. */
.icfp-filters__bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 10px 0;
    border-top: 1px solid var(--icfp-grey, #e4e1e8);
    border-bottom: 1px solid var(--icfp-grey, #e4e1e8);
}
.icfp-filters__region {
    display: flex;
    align-items: center;
    margin-right: 18px;
}
.icfp-filters__region .form-select {
    width: auto;
    min-width: 170px;
}
.icfp-filters__count {
    font-size: 13px;
    color: var(--icfp-ink-soft, #7d7688);
}
.icfp-filters__count strong { color: var(--icfp-ink, #2b2532); }

/* Résumé de la sélection : ce qui filtre la liste, et comment l'enlever.
   Sans lui, un filtre oublié se lit comme une base vide. */
.icfp-filters__active {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-top: 10px;
}
.icfp-filters__active-label {
    margin-right: 8px;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-weight: 700;
    color: var(--icfp-ink-soft, #7d7688);
}
.icfp-chip {
    display: inline-flex;
    align-items: center;
    margin: 0 6px 4px 0;
    padding: 4px 10px;
    border-radius: 5px;
    border: 1px solid var(--icfp-orange-line, #f3ddb2);
    background: var(--icfp-orange-soft, #fff7e8);
    color: var(--icfp-orange-darker, #b87300);
    font-size: 12.5px;
    font-weight: 700;
    text-decoration: none;
    transition: background-color .12s ease, border-color .12s ease;
}
.icfp-chip:hover {
    background: #fff;
    border-color: var(--icfp-orange, #F59B00);
    color: var(--icfp-orange-darker, #b87300);
}
.icfp-chip__x {
    margin-left: 8px;
    font-size: 15px;
    line-height: 1;
    opacity: .6;
}
.icfp-chip:hover .icfp-chip__x { opacity: 1; }
.icfp-filters__clear {
    margin-bottom: 4px;
    font-size: 12.5px;
    color: var(--icfp-ink-soft, #7d7688);
    text-decoration: underline;
}

@media (max-width: 575.98px) {
    .icfp-substatus {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}