/* Comptes qui arrivent sans dépôt (2026-10-14) : la puce de la barre du hub (Shared/ComptesAutoPuce) et son panneau
   (Shared/ComptesAutoPanneau, posé sur les classes upd-* de la fenêtre de mise à jour). Préfixe cpa-. */

.cpa { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 4px; min-width: 0; }
.cpa-puce {
    display: inline-flex; align-items: center; gap: 6px; min-width: 0; max-width: 420px;
    font: 600 11.5px/1.2 var(--font-family); white-space: nowrap;
    color: var(--color-text-secondary); background: var(--o5); border: 1px solid var(--o12);
    border-radius: 999px; padding: 5px 11px; transition: .14s;
}
button.cpa-puce { cursor: pointer; }
button.cpa-puce:hover { border-color: color-mix(in srgb, var(--brand) 55%, transparent); color: var(--tb1); transform: translateY(-1px); }
.cpa-src { font-weight: 500; opacity: .8; overflow: hidden; text-overflow: ellipsis; }
.cpa-msg { overflow: hidden; text-overflow: ellipsis; }
.cpa-action { font-weight: 700; padding-left: 6px; margin-left: 2px; border-left: 1px solid currentColor; }

.cpa-ok { color: #6fcf97; background: rgba(39,174,96,.10); border-color: rgba(39,174,96,.35); }
.cpa-neuf { color: var(--tb1); background: color-mix(in srgb, var(--brand) 16%, transparent); border-color: color-mix(in srgb, var(--brand) 55%, transparent); font-weight: 700; }
.cpa-neuf:hover { background: color-mix(in srgb, var(--brand) 24%, transparent); }
.cpa-info { color: var(--tb1); }
.cpa-ko { color: #F0997B; background: rgba(240,153,123,.12); border-color: rgba(240,153,123,.4); }
.cpa-cours { cursor: default; }
.cpa-roue {
    width: 11px; height: 11px; flex: 0 0 auto; border-radius: 50%;
    border: 2px solid var(--o18); border-top-color: var(--brand); animation: cpa-tourne .8s linear infinite;
}
@keyframes cpa-tourne { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .cpa-roue { animation: none; } }

.cpa-plus {
    display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 0;
    border-radius: 999px; border: 1px solid var(--o12); background: transparent; color: var(--color-text-secondary); cursor: pointer;
}
.cpa-plus:hover { color: var(--tb1); border-color: color-mix(in srgb, var(--brand) 55%, transparent); }
.cpa-puce:focus-visible, .cpa-plus:focus-visible, .cpa-btn:focus-visible, .cpa-choix:focus-visible {
    outline: 2px solid var(--brand); outline-offset: 2px;
}

html[data-theme="light"] .cpa-ok { color: #1e7a46; background: rgba(39,174,96,.10); border-color: rgba(30,122,70,.4); }
html[data-theme="light"] .cpa-ko { color: #a4431f; background: rgba(200,90,50,.10); border-color: rgba(164,67,31,.4); }

/* Le panneau */
.cpa-fen { width: min(620px, 96vw); }
.cpa-fen-corps { overflow-y: auto; padding: 4px 20px 20px; display: flex; flex-direction: column; gap: 14px; }
.cpa-bloc { display: flex; flex-direction: column; gap: 6px; }
.cpa-h { margin: 8px 0 2px; font: 700 12px/1.3 var(--font-family); letter-spacing: .04em; text-transform: uppercase; color: var(--color-text-secondary); }
.cpa-ligne { margin: 0; font-size: 13px; line-height: 1.45; color: var(--tb1); display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.cpa-discret { color: var(--color-text-secondary); font-size: 12px; }
.cpa-alerte { color: #F0997B; }
html[data-theme="light"] .cpa-alerte { color: #a4431f; }
.cpa-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.cpa-choix {
    flex: 1 1 260px; min-width: 0; font: 500 13px/1.3 var(--font-family); color: var(--tb1);
    background: var(--o5); border: 1px solid var(--o12); border-radius: 8px; padding: 7px 10px;
}
.cpa-actions { display: flex; justify-content: flex-end; }
.cpa-btn {
    font: 700 12.5px/1 var(--font-family); color: var(--tb1); cursor: pointer;
    background: color-mix(in srgb, var(--brand) 18%, transparent); border: 1px solid color-mix(in srgb, var(--brand) 55%, transparent);
    border-radius: 999px; padding: 8px 16px;
}
.cpa-btn:disabled { opacity: .5; cursor: default; }
.cpa-fiches { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.cpa-fiche.branche { grid-column: 1 / -1; }
.cpa-fiche {
    display: grid; grid-template-columns: minmax(90px, auto) auto 1fr; gap: 2px 10px; align-items: baseline;
    padding: 8px 10px; border-radius: 10px; background: var(--o3); border: 1px solid var(--o7);
}
.cpa-fiche-nom { font-weight: 700; font-size: 13px; color: var(--tb1); }
.cpa-etat { font-size: 11px; font-weight: 700; color: var(--color-text-secondary); white-space: nowrap; }
.cpa-fiche.branche .cpa-etat { color: #6fcf97; }
html[data-theme="light"] .cpa-fiche.branche .cpa-etat { color: #1e7a46; }
.cpa-fiche-txt { grid-column: 1 / -1; font-size: 12px; color: var(--tb1); }
.cpa-fiche-txt.cpa-discret { color: var(--color-text-secondary); }

@media (max-width: 640px) {
    .cpa-puce { max-width: 70vw; }
    .cpa-src { display: none; }
    .cpa-fen-corps { padding: 4px 14px 16px; }
    .cpa-fiches { grid-template-columns: 1fr; }
}