/* Volet du concierge (2026-09-24) : sous l'en-tete, pleine largeur, deplie quand il parle, replie en fine barre.
   La couleur (bordure gauche, avatar, etiquette) dit le type d'intervention. */
.s25c{--c:#64748b;--c-bg:#111827;--c-fg:#e5e7eb;--c-muted:#94a3b8;--c-line:#1f2937;
  position:relative;z-index:50;max-width:1200px;margin:10px auto 0;padding:0 12px;font-size:15px;line-height:1.45}
html.theme-light .s25c{--c-bg:#ffffff;--c-fg:#0f172a;--c-muted:#475569;--c-line:#e2e8f0}
.s25c[hidden]{display:none}
.s25c[data-level=info]{--c:#64748b}
.s25c[data-level=guide]{--c:#0891b2}
.s25c[data-level=suggest]{--c:#8b5cf6}
.s25c[data-level=news]{--c:#10b981}
.s25c[data-level=success]{--c:#22c55e}
.s25c[data-level=live]{--c:#ef4444}
.s25c[data-level=alert]{--c:#f59e0b}
.s25c[data-level=error]{--c:#dc2626}

.s25c-box{display:flex;gap:14px;align-items:flex-start;background:var(--c-bg);color:var(--c-fg);
  border:1px solid var(--c-line);border-left:5px solid var(--c);border-radius:14px;padding:14px 14px 12px;
  box-shadow:0 8px 24px rgba(0,0,0,.18);overflow:hidden;
  animation:s25c-in .28s ease-out}
@keyframes s25c-in{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
.s25c-avatar{flex:0 0 auto;width:44px;height:44px;border-radius:50%;background:var(--c);display:grid;place-items:center;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 30%,transparent)}
.s25c-avatar svg{width:28px;height:28px}
.s25c[data-level=live] .s25c-avatar{animation:s25c-pulse 1.6s ease-in-out infinite}
@keyframes s25c-pulse{50%{box-shadow:0 0 0 8px color-mix(in srgb,var(--c) 10%,transparent)}}
.s25c-main{flex:1;min-width:0}
.s25c-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:.78rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--c)}
.s25c-head .step{color:var(--c-muted);font-weight:600}
.s25c-title{margin:2px 0 2px;font-weight:700;font-size:1.02rem}
.s25c-text{margin:0;color:var(--c-fg)}
.s25c-text a{color:var(--c)}
.s25c-progress{height:4px;border-radius:4px;background:var(--c-line);margin:10px 0 0;overflow:hidden}
.s25c-progress i{display:block;height:100%;background:var(--c);border-radius:4px;transition:width .3s}
.s25c-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.s25c-actions button,.s25c-actions a{font:inherit;font-size:.9rem;font-weight:600;padding:7px 12px;border-radius:10px;cursor:pointer;text-decoration:none;
  border:1px solid color-mix(in srgb,var(--c) 45%,transparent);background:transparent;color:var(--c-fg)}
.s25c-actions .primary{background:var(--c);border-color:var(--c);color:#fff}
.s25c-tools{flex:0 0 auto;display:flex;gap:2px}
.s25c-tools button{border:0;background:transparent;color:var(--c-muted);cursor:pointer;font-size:16px;line-height:1;padding:6px 7px;border-radius:8px}
.s25c-tools button:hover{background:color-mix(in srgb,var(--c-muted) 18%,transparent)}

/* replie : fine barre */
.s25c[data-state=collapsed] .s25c-box{padding:7px 10px;align-items:center;cursor:pointer;box-shadow:none;animation:none}
.s25c[data-state=collapsed] .s25c-avatar{width:28px;height:28px;box-shadow:none}
.s25c[data-state=collapsed] .s25c-avatar svg{width:18px;height:18px}
.s25c[data-state=collapsed] .s25c-text,.s25c[data-state=collapsed] .s25c-actions,.s25c[data-state=collapsed] .s25c-progress,
.s25c[data-state=collapsed] .s25c-title,.s25c[data-state=collapsed] [data-act=collapse]{display:none}
.s25c:not([data-state=collapsed]) .s25c-short,.s25c:not([data-state=collapsed]) [data-act=expand]{display:none}
.s25c-short{font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--c-fg);text-transform:none;letter-spacing:0;font-weight:600}

@media (max-width:600px){
  .s25c{padding:0 8px;font-size:14px}
  .s25c-box{gap:10px;padding:12px 10px 10px}
  .s25c-avatar{width:36px;height:36px}
}
@media (prefers-reduced-motion:reduce){.s25c-box,.s25c[data-level=live] .s25c-avatar{animation:none}}

/* mini-concierge dans les fenetres (connexion, inscription) */
.s25c-mini{display:flex;gap:12px;align-items:flex-start;margin:0 0 16px;padding:12px;border-radius:12px;
  background:color-mix(in srgb,#0891b2 10%,transparent);border:1px solid color-mix(in srgb,#0891b2 35%,transparent)}
.s25c-mini .s25c-avatar{width:38px;height:38px;background:#0891b2}
.s25c-mini p{margin:0;font-size:.93rem}
.s25c-mini b{display:block;color:#0891b2;font-size:.75rem;letter-spacing:.05em;text-transform:uppercase;margin-bottom:2px}
