/* ══ PROPOSITION D'ACCOMPAGNEMENT (2026-10-14), préfixe pam- ═══════════════════════════════════════════════════════════════
   Shared/PropositionMissionModal.razor : la fenêtre s'ouvre PAR-DESSUS celle des présentations (Shared/MemorandumModal.razor),
   dont elle reprend le cadre (memo-fond, memo-modal, memo-tete, memo-corps, memo-pied, memo-champ, memo-segments). Ici : la
   superposition, les six blocs numérotés, les constats à cocher, les lignes d'honoraires, l'avertissement de la lettre, et
   l'entrée « Proposition d'accompagnement » de l'étape 1 des présentations (pam-entree).
   Jetons : --tx1, --tx2, --mut1, --o8, --brand, --brand-contrast, --surf-1, --surf-2, --st-* (clair et sombre).
   ═══════════════════════════════════════════════════════════════════════════════════════════════════════════════════════ */

.pam-fond { z-index: 12070; }
.pam-modal { width: min(920px, 100%); }
.pam-corps { gap: 14px; }

/* ── Blocs numérotés ── */
.pam-bloc { display: flex; flex-direction: column; gap: 10px; padding: 14px 16px 16px; border-radius: 12px;
            border: 1px solid var(--o8, rgba(255,255,255,.12)); background: color-mix(in oklab, var(--surf-2, #13202b) 62%, transparent); }
.pam-bloc-tete { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.pam-bloc-tete .memo-etape-t { display: inline-flex; align-items: center; gap: 9px; }
.pam-bloc .memo-etape-s { margin: -4px 0 0; }
.pam-num { flex: 0 0 auto; width: 22px; height: 22px; border-radius: 999px; display: grid; place-items: center; font-size: .72rem; font-weight: 800;
           color: var(--brand-contrast, #04131a); background: linear-gradient(135deg, var(--memo-a, var(--brand, #00b1cf)), var(--memo-b, var(--brand, #00b1cf))); }
.pam-grille { padding: 0; }
.pam-compte { font-size: .74rem; font-weight: 650; color: var(--mut1, #9fb3ba); }
.pam-compte.alerte { color: var(--st-amber, #fbbf24); }
.pam-libelle-action { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.pam-libelle-action label { color: var(--tx2, #c9d6da); }
.memo-champ small.pam-alerte { color: var(--st-amber, #fbbf24); }

/* ── Chiffres clés (15/10) : groupes activité / rentabilité / trésorerie, exercice récent mis en avant, variation colorée selon
      qu'elle est favorable ou non à l'entreprise (un BFR en jours qui monte est défavorable : le sens vient de la bibliothèque). ── */
.pam-kpi { border-radius: 12px; overflow: hidden; border: 1px solid var(--o8, rgba(255,255,255,.12));
           background: color-mix(in oklab, var(--surf-1, #0e1620) 78%, transparent); }
.pam-kpi-t { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }
.pam-kpi-t th, .pam-kpi-t td { padding: 7px 14px; text-align: right; white-space: nowrap; vertical-align: middle; }
.pam-kpi-t .pam-kpi-lib { text-align: left; white-space: normal; }
.pam-kpi-t thead th { padding-top: 10px; padding-bottom: 9px; font-size: .68rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase;
                      color: var(--mut1, #9fb3ba); border-bottom: 1px solid var(--o8, rgba(255,255,255,.1)); }
.pam-kpi-t thead .pam-kpi-lib { color: var(--tx1, #e9f1f2); letter-spacing: .04em; }
.pam-kpi-an { display: inline-block; padding: 2px 9px; border-radius: 999px; letter-spacing: .04em; color: var(--brand, #00b1cf);
              background: color-mix(in srgb, var(--brand, #00b1cf) 15%, transparent); }
.pam-kpi-g th { padding: 11px 14px 3px; text-align: left; font-size: .64rem; font-weight: 750; letter-spacing: .09em; text-transform: uppercase;
                color: color-mix(in srgb, var(--brand, #00b1cf) 70%, var(--mut1, #9fb3ba)); }
.pam-kpi-groupe + .pam-kpi-groupe .pam-kpi-g th { border-top: 1px solid var(--o8, rgba(255,255,255,.08)); }
.pam-kpi-l th { font-size: .82rem; font-weight: 500; color: var(--tx2, #c9d6da); }
.pam-kpi-l td.pam-kpi-n1 { font-size: .8rem; color: var(--mut1, #9fb3ba); }
.pam-kpi-l td.pam-kpi-n { font-size: .88rem; font-weight: 750; color: var(--tx1, #e9f1f2); }
.pam-kpi-t .pam-kpi-n { background: color-mix(in srgb, var(--brand, #00b1cf) 7%, transparent); }
.pam-kpi-groupe:last-child .pam-kpi-l:last-child > * { padding-bottom: 11px; }
.pam-kpi-l:hover > * { background-color: color-mix(in srgb, var(--tx1, #e9f1f2) 4%, transparent); }
.pam-kpi-l:hover > .pam-kpi-n { background-color: color-mix(in srgb, var(--brand, #00b1cf) 11%, transparent); }
.pam-kpi-var { width: 1%; }
.pam-var { display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px 2px 6px; border-radius: 999px; font-size: .74rem; font-weight: 750; line-height: 1.35; }
.pam-var svg { flex: 0 0 auto; }
.pam-var.favorable { color: var(--st-green, #34d399); background: color-mix(in srgb, var(--st-green, #34d399) 14%, transparent); }
.pam-var.defavorable { color: var(--st-red, #f87171); background: color-mix(in srgb, var(--st-red, #f87171) 14%, transparent); }
.pam-var.stable { color: var(--mut1, #9fb3ba); background: color-mix(in srgb, var(--tx1, #e9f1f2) 7%, transparent); }
.pam-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.pam-kpi-note { margin: 0; padding: 8px 14px 10px; font-size: .7rem; line-height: 1.45; color: var(--mut1, #9fb3ba); border-top: 1px solid var(--o8, rgba(255,255,255,.08)); }

/* ── Constats ── */
.pam-constats { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.pam-constat { display: flex; align-items: flex-start; gap: 12px; padding: 10px 12px; border-radius: 10px;
               border: 1px solid var(--o8, rgba(255,255,255,.1)); background: color-mix(in oklab, var(--surf-1, #0e1620) 70%, transparent); opacity: .72;
               transition: opacity .15s ease, border-color .15s ease; }
.pam-constat.retenu { opacity: 1; border-color: color-mix(in srgb, var(--brand, #00b1cf) 45%, var(--o8, rgba(255,255,255,.12))); }
.pam-coche { flex: 0 0 116px; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; cursor: pointer; padding-top: 3px; }
.pam-coche input { width: 18px; height: 18px; accent-color: var(--brand, #00b1cf); cursor: pointer; }
.pam-gravite { font-size: .68rem; font-weight: 750; letter-spacing: .02em; padding: 2px 8px; border-radius: 999px; white-space: nowrap; }
.pam-gravite.g3 { color: var(--st-red, #f0705a); background: color-mix(in srgb, var(--st-red, #f0705a) 16%, transparent); }
.pam-gravite.g2 { color: var(--st-amber, #fbbf24); background: color-mix(in srgb, var(--st-amber, #fbbf24) 16%, transparent); }
.pam-gravite.g1 { color: var(--st-green, #34d399); background: color-mix(in srgb, var(--st-green, #34d399) 14%, transparent); }
.pam-constat-champs { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.pam-constat-champs input, .pam-constat-champs textarea, .pam-article input, .pam-article textarea {
    width: 100%; padding: 7px 10px; border-radius: 8px; border: 1px solid var(--o8, rgba(255,255,255,.16)); font: inherit; font-size: .82rem;
    background: color-mix(in oklab, var(--surf-1, #0e1620) 85%, transparent); color: var(--tx1, #e9f1f2); resize: vertical; }
.pam-constat-t { font-weight: 700 !important; }
.pam-constat-champs input:focus, .pam-constat-champs textarea:focus, .pam-article input:focus, .pam-article textarea:focus { outline: none; border-color: var(--brand, #00b1cf); }

/* ── Honoraires ── */
.pam-honoraires { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.pam-honoraires li { display: grid; grid-template-columns: minmax(0, 1fr) 150px 140px 34px; gap: 10px; align-items: end; }
.pam-retirer { width: 34px; height: 36px; border-radius: 9px; border: 1px solid var(--o8, rgba(255,255,255,.16)); background: transparent;
               color: var(--mut1, #9fb3ba); display: grid; place-items: center; cursor: pointer; }
.pam-retirer:hover { color: var(--st-red, #f0705a); border-color: var(--st-red, #f0705a); }
.pam-ajouter { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; }

/* ── Lettre ── */
.pam-interrupteur, .pam-coche-ligne { display: inline-flex; align-items: center; gap: 8px; font-size: .8rem; color: var(--tx2, #c9d6da); cursor: pointer; }
.pam-interrupteur input, .pam-coche-ligne input { width: 17px; height: 17px; accent-color: var(--brand, #00b1cf); cursor: pointer; flex: 0 0 auto; }
.pam-avertissement { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border-radius: 10px; font-size: .79rem; line-height: 1.45;
                     color: var(--tx1, #e9f1f2); border: 1px dashed color-mix(in srgb, var(--st-amber, #fbbf24) 70%, transparent);
                     background: color-mix(in srgb, var(--st-amber, #fbbf24) 10%, transparent); }
.pam-avertissement svg { flex: 0 0 auto; margin-top: 1px; color: var(--st-amber, #fbbf24); }
.pam-articles-liste { display: flex; flex-direction: column; gap: 10px; padding: 4px 14px 14px; }
.pam-article { display: flex; flex-direction: column; gap: 5px; }
.pam-article input { font-weight: 700; }

/* ── Attente ── */
.pam-attente { display: flex; flex-direction: column; gap: 10px; padding: 8px 2px; }
.pam-sq { display: block; height: 12px; border-radius: 6px; background: color-mix(in srgb, var(--tx1, #e9f1f2) 10%, transparent); animation: memo-pulse 1.2s ease-in-out infinite; }
.pam-sq.court { width: 55%; }

/* ── Pied : le format et le message ── */
.pam-pied-info { flex-wrap: wrap; }
.pam-pied-info .memo-segments { flex: 0 0 auto; }

/* ── Entrée « Proposition d'accompagnement » (étape 1 des présentations) ── */
.pam-entree { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 12px;
              border: 1px solid color-mix(in srgb, var(--brand, #00b1cf) 40%, var(--o8, rgba(255,255,255,.14)));
              background: linear-gradient(120deg, color-mix(in oklab, var(--brand, #00b1cf) 10%, var(--surf-2, #13202b)), color-mix(in oklab, var(--surf-2, #13202b) 60%, transparent)); }
.pam-entree-ic { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; color: var(--brand, #00b1cf);
                 background: color-mix(in srgb, var(--brand, #00b1cf) 16%, transparent); }
.pam-entree-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pam-entree-txt strong { font-size: .9rem; font-weight: 750; color: var(--tx1, #e9f1f2); }
.pam-entree-txt span { font-size: .76rem; line-height: 1.45; color: var(--mut1, #9fb3ba); }
.pam-entree .memo-btn { flex: 0 0 auto; white-space: nowrap; }

html[data-theme="light"] .pam-avertissement { color: #3d2a05; }
html[data-motion="reduites"] .pam-constat, html[data-motion="reduites"] .pam-sq { transition: none; animation: none; }

@media (max-width: 720px) {
    .pam-honoraires li { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 34px; padding-bottom: 8px; border-bottom: 1px solid var(--o8, rgba(255,255,255,.1)); }
    .pam-honoraires .pam-h-lib { grid-column: 1 / -1; }
    .pam-constat { flex-direction: column; align-items: stretch; gap: 8px; }
    .pam-coche { flex: 0 0 auto; flex-direction: row; align-items: center; }
    .pam-entree { flex-wrap: wrap; }
    .pam-entree .memo-btn { flex: 1 1 100%; }
    .pam-kpi-t th, .pam-kpi-t td { padding-left: 10px; padding-right: 10px; }
}
/* Téléphone : chaque chiffre sur deux lignes, le libellé puis les valeurs (exercice précédent, exercice, variation). */
@media (max-width: 560px) {
    .pam-kpi-t thead { display: none; }
    .pam-kpi-t, .pam-kpi-t tbody { display: block; }
    .pam-kpi-g { display: block; }
    .pam-kpi-g th { display: block; padding: 10px 12px 2px; }
    .pam-kpi-l { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; column-gap: 10px; row-gap: 2px; align-items: center; padding: 6px 12px; }
    .sans-n1 .pam-kpi-l { grid-template-columns: minmax(0, 1fr) auto; }
    .pam-kpi-l > * { padding: 0 !important; background: none !important; }
    .pam-kpi-l th { grid-column: 1 / -1; font-size: .8rem; }
    .pam-kpi-l td.pam-kpi-n1::before, .pam-kpi-l td.pam-kpi-n::before { content: attr(data-an) " "; font-size: .66rem; font-weight: 650; color: var(--mut1, #9fb3ba); margin-right: 3px; }
    .pam-kpi-l td.pam-kpi-n1 { justify-self: start; }
    .pam-kpi-l td.pam-kpi-n { justify-self: end; }
    .pam-kpi-var { width: auto; justify-self: end; }
    .pam-kpi-groupe:last-child .pam-kpi-l:last-child { padding-bottom: 11px; }
}
@media (max-width: 520px) {
    .pam-pied-info { flex-direction: column; align-items: stretch; }
    .pam-pied-info .memo-segments { align-self: stretch; }
    .pam-pied-info .memo-segments button { flex: 1 1 0; }
}