/* ============================================================
   VARIABLES & RESET
   ============================================================ */
:root {
  --blue-deep:  #1a2e4a;
  --blue-mid:   #1e3a5f;
  --blue-light: #2a4d7a;
  --blue-pale:  #e8f0fa;
  --accent:     #e07b39;
  --accent-lt:  #fdf0e7;
  --green:      #16a34a;
  --bg:         #f4f5f7;
  --bg-white:   #ffffff;
  --border:     #e0e2e6;
  --text:       #1f2328;
  --text-muted: #6b7280;
  --radius:     10px;
  --shadow:     0 2px 16px rgba(0,0,0,0.07);
  --sidebar-w:  270px;
}
* { box-sizing: border-box; }
html, body { margin:0; padding:0; height:100%; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif; background:var(--bg); color:var(--text); font-size:15px; }
button { font-family:inherit; cursor:pointer; }

/* ============================================================
   LAYOUT
   ============================================================ */
.app { display:flex; height:100vh; max-width:1280px; margin:0 auto; background:var(--bg-white); box-shadow:var(--shadow); overflow:hidden; }

/* ============================================================
   SIDEBAR
   ============================================================ */
.sidebar { width:var(--sidebar-w); flex-shrink:0; background:var(--blue-deep); color:#c9d7e8; display:flex; flex-direction:column; overflow:hidden; }

.sidebar-brand { display:flex; align-items:center; gap:0.6rem; padding:1rem 1rem 0.85rem; border-bottom:1px solid rgba(255,255,255,0.08); }
.brand-icon { font-size:1.4rem; flex-shrink:0; }
.brand-logo { width:34px; height:34px; object-fit:contain; border-radius:6px; background:#fff; padding:2px; flex-shrink:0; }
.brand-name { font-size:1rem; font-weight:700; color:#fff; letter-spacing:0.03em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.sidebar-section { display:flex; flex-direction:column; flex:1; min-height:0; }

.section-header { display:flex; align-items:center; justify-content:space-between; padding:0.65rem 0.75rem 0.3rem; }
.section-label { font-size:0.72rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:rgba(255,255,255,0.4); }
.section-add { background:transparent; border:1px solid rgba(255,255,255,0.2); color:rgba(255,255,255,0.6); border-radius:5px; width:22px; height:22px; font-size:1rem; line-height:1; display:flex; align-items:center; justify-content:center; transition:all 0.15s; }
.section-add:hover { background:var(--accent); border-color:var(--accent); color:#fff; }

.conv-list { flex:1; overflow-y:auto; padding:0.3rem 0.5rem; scrollbar-width:thin; scrollbar-color:rgba(255,255,255,0.1) transparent; }
.conv-list::-webkit-scrollbar { width:4px; }
.conv-list::-webkit-scrollbar-thumb { background:rgba(255,255,255,0.12); border-radius:4px; }

.conv-item { display:flex; align-items:center; padding:0.45rem 0.6rem; border-radius:7px; cursor:pointer; font-size:0.84rem; color:#bccbde; margin-bottom:2px; gap:0.4rem; transition:background 0.12s; }
.conv-item:hover { background:rgba(255,255,255,0.08); color:#fff; }
.conv-item.active { background:rgba(255,255,255,0.14); color:#fff; font-weight:500; }

.conv-title-text { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.conv-delete { background:transparent; color:inherit; border:none; font-size:1.1rem; line-height:1; padding:0.1rem 0.3rem; border-radius:4px; opacity:0; transition:opacity 0.15s; }
.conv-item:hover .conv-delete { opacity:0.5; }
.conv-delete:hover { opacity:1 !important; background:rgba(255,255,255,0.12); }

.conv-empty { padding:1rem; text-align:center; font-size:0.8rem; color:rgba(255,255,255,0.28); line-height:1.6; }

/* Salons */
.room-icon { font-size:0.85rem; flex-shrink:0; }
.online-dot { width:7px; height:7px; border-radius:50%; background:var(--green); flex-shrink:0; }

.sidebar-footer { padding:0.7rem; border-top:1px solid rgba(255,255,255,0.08); display:flex; align-items:center; justify-content:space-between; gap:0.5rem; }
.user-info { display:flex; align-items:center; gap:0.5rem; overflow:hidden; flex:1; min-width:0; }
.user-avatar { width:30px; height:30px; border-radius:50%; background:var(--accent); color:#fff; font-size:0.8rem; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
#username-display { font-size:0.84rem; font-weight:500; color:#c9d7e8; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sidebar-footer-actions { display:flex; gap:0.25rem; flex-shrink:0; }
#admin-btn, #logout-btn { background:transparent; color:rgba(255,255,255,0.35); border:none; font-size:1rem; padding:0.3rem 0.4rem; border-radius:6px; transition:all 0.15s; }
#admin-btn:hover, #logout-btn:hover { color:#fff; background:rgba(255,255,255,0.1); }
#admin-btn { font-size:0.95rem; }

/* ============================================================
   PANNEAU PRINCIPAL
   ============================================================ */
.main-pane { flex:1; display:flex; flex-direction:column; min-width:0; min-height:0; background:var(--bg-white); position:relative; }

header { padding:0.85rem 1.5rem; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.header-left { min-width:0; }
header h1 { margin:0; font-size:1.05rem; font-weight:700; color:var(--blue-mid); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#header-sub { margin:0.1rem 0 0; font-size:0.8rem; color:var(--text-muted); }
.header-right { flex-shrink:0; }
.icon-btn { padding:0.4rem 0.85rem; border:1px solid var(--border); border-radius:7px; background:var(--bg); color:var(--text-muted); font-size:0.82rem; font-weight:500; transition:all 0.15s; }
.icon-btn:hover { background:var(--blue-pale); color:var(--blue-mid); border-color:var(--blue-mid); }
.danger-btn { border-color:#fca5a5; color:#ef4444; background:#fef2f2; }
.danger-btn:hover { background:#ef4444; color:#fff; border-color:#ef4444; }

#messages { flex:1; min-height:0; overflow-y:auto; padding:1.5rem; display:flex; flex-direction:column; gap:0.85rem; scrollbar-width:thin; scrollbar-color:var(--border) transparent; }

/* ============================================================
   ÉCRAN D'ACCUEIL
   ============================================================ */
.welcome-screen { display:flex; flex-direction:column; align-items:center; padding:2rem 1rem 1rem; gap:2rem; max-width:720px; margin:0 auto; width:100%; }
.welcome-hero { text-align:center; }
.welcome-hero h2 { font-size:1.5rem; font-weight:700; color:var(--blue-mid); margin:0 0 0.4rem; }
.welcome-hero p { margin:0; color:var(--text-muted); font-size:0.95rem; }
.welcome-categories { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:0.75rem; width:100%; }
.welcome-cat { background:var(--bg); border:1px solid var(--border); border-radius:var(--radius); padding:0.9rem 1rem; }
.welcome-cat h3 { margin:0 0 0.5rem; font-size:0.78rem; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; color:var(--accent); }
.welcome-cat ul { margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:0.3rem; }
.welcome-cat li { font-size:0.85rem; color:var(--blue-mid); cursor:pointer; padding:0.2rem 0; line-height:1.4; transition:color 0.12s; }
.welcome-cat li:hover { color:var(--accent); text-decoration:underline; }

/* ============================================================
   MESSAGES IA
   ============================================================ */
.msg-wrapper { display:flex; flex-direction:column; gap:0.2rem; }
.msg-wrapper.user      { align-items:flex-end; }
.msg-wrapper.assistant { align-items:flex-start; }

.msg { padding:0.75rem 1rem; border-radius:12px; max-width:82%; line-height:1.6; word-wrap:break-word; position:relative; }
.msg.user      { background:var(--blue-mid); color:#fff; white-space:pre-wrap; border-bottom-right-radius:3px; }
.msg.assistant { background:var(--bg); border:1px solid var(--border); border-bottom-left-radius:3px; }
.msg.error     { background:#fdecea; border-color:#f5c2bd; color:#c62828; }

/* Markdown */
.msg.assistant > *:first-child { margin-top:0; }
.msg.assistant > *:last-child  { margin-bottom:0; }
.msg.assistant p   { margin:0.45rem 0; }
.msg.assistant ul,
.msg.assistant ol  { padding-left:1.4rem; margin:0.4rem 0; }
.msg.assistant li  { margin:0.15rem 0; }
.msg.assistant h1,.msg.assistant h2,.msg.assistant h3,.msg.assistant h4 { margin:1rem 0 0.35rem; font-weight:700; line-height:1.3; color:var(--blue-mid); }
.msg.assistant h1 { font-size:1.15rem; }
.msg.assistant h2 { font-size:1.05rem; }
.msg.assistant h3 { font-size:0.98rem; }
.msg.assistant code { background:#ebebef; padding:0.1rem 0.35rem; border-radius:4px; font-size:0.87em; font-family:ui-monospace,Menlo,Consolas,monospace; color:#c7254e; }
.msg.assistant pre { background:#1e2430; color:#e8eaf0; padding:0.85rem 1rem; border-radius:8px; overflow-x:auto; margin:0.5rem 0; }
.msg.assistant pre code { background:transparent; color:inherit; padding:0; }
.msg.assistant table { border-collapse:collapse; margin:0.5rem 0; width:100%; font-size:0.9em; }
.msg.assistant th,.msg.assistant td { border:1px solid #d0d4db; padding:0.4rem 0.65rem; text-align:left; }
.msg.assistant th { background:var(--blue-pale); color:var(--blue-mid); font-weight:600; }
.msg.assistant tr:nth-child(even) td { background:#f8f9fb; }
.msg.assistant blockquote { border-left:3px solid var(--accent); padding-left:0.75rem; color:#555; margin:0.5rem 0; font-style:italic; }
.msg.assistant strong { color:var(--blue-mid); }

/* Messages de salon */
.msg-ai { border-left:3px solid var(--accent); }
.msg-ai-badge { font-size:0.78rem; font-weight:700; color:var(--accent); text-transform:uppercase; letter-spacing:0.05em; margin-bottom:0.4rem; }
.msg-sender { font-size:0.78rem; font-weight:700; color:var(--blue-light); margin-bottom:0.25rem; }

.msg-meta { font-size:0.72rem; color:var(--text-muted); padding:0 0.4rem; display:flex; align-items:center; gap:0.5rem; }
.copy-btn { background:transparent; border:none; font-size:0.72rem; color:var(--text-muted); padding:0.1rem 0.3rem; border-radius:4px; transition:all 0.15s; cursor:pointer; display:flex; align-items:center; gap:0.25rem; }
.copy-btn:hover { background:var(--bg); color:var(--blue-mid); }
.copy-btn.copied { color:var(--green); }

/* Typing indicator */
.typing-indicator { display:flex; align-items:center; gap:4px; padding:0.75rem 1rem; background:var(--bg); border:1px solid var(--border); border-radius:12px; border-bottom-left-radius:3px; width:fit-content; }
.typing-dot { width:7px; height:7px; border-radius:50%; background:var(--text-muted); animation:bounce 1.4s infinite ease-in-out; }
.typing-dot:nth-child(1) { animation-delay:0s; }
.typing-dot:nth-child(2) { animation-delay:0.2s; }
.typing-dot:nth-child(3) { animation-delay:0.4s; }
@keyframes bounce { 0%,80%,100% { transform:scale(0.7); opacity:0.5; } 40% { transform:scale(1); opacity:1; } }

/* ============================================================
   FOOTER
   ============================================================ */
footer { padding:0.85rem 1.5rem 0.6rem; border-top:1px solid var(--border); background:var(--bg-white); }
.footer-form { display:flex; gap:0.5rem; align-items:flex-end; }
#input, #room-input { flex:1; padding:0.65rem 0.9rem; border:1.5px solid var(--border); border-radius:10px; resize:none; font-family:inherit; font-size:0.95rem; line-height:1.5; min-height:42px; max-height:160px; overflow-y:auto; background:var(--bg); transition:border-color 0.15s; }
#input:focus, #room-input:focus { outline:none; border-color:var(--blue-mid); background:var(--bg-white); }

#send-btn, #room-send-btn { padding:0 1.1rem; height:42px; border:none; background:var(--blue-mid); color:#fff; border-radius:10px; font-size:0.9rem; font-weight:600; transition:background 0.15s; display:flex; align-items:center; gap:0.3rem; white-space:nowrap; }
#send-btn:hover:not(:disabled), #room-send-btn:hover { background:var(--blue-light); }
#send-btn:disabled { opacity:0.45; cursor:not-allowed; }

.ai-room-btn { padding:0 0.9rem; height:42px; border:2px solid var(--accent); background:var(--accent-lt); color:var(--accent); border-radius:10px; font-size:0.88rem; font-weight:700; white-space:nowrap; transition:all 0.15s; }
.ai-room-btn:hover:not(:disabled) { background:var(--accent); color:#fff; }
.ai-room-btn:disabled { opacity:0.45; cursor:not-allowed; }

.footer-hint { font-size:0.72rem; color:var(--text-muted); padding-top:0.35rem; text-align:center; }

/* Bouton joindre */
.attach-btn { height:42px; width:42px; flex-shrink:0; border:1.5px solid var(--border); background:var(--bg); border-radius:10px; font-size:1.1rem; line-height:1; transition:all 0.15s; }
.attach-btn:hover { background:var(--blue-pale); border-color:var(--blue-mid); }

/* Puce de pièce jointe */
.attach-chip { display:flex; align-items:center; justify-content:space-between; gap:0.6rem; background:var(--accent-lt); border:1px solid #f3d6bf; border-radius:8px; padding:0.45rem 0.7rem; margin-bottom:0.5rem; font-size:0.85rem; }
.attach-info { color:var(--accent); font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.attach-meta { color:var(--text-muted); font-weight:400; }
.attach-error { color:#c62828; font-weight:500; }
.attach-remove { background:transparent; border:none; color:var(--accent); font-size:1rem; line-height:1; padding:0.1rem 0.35rem; border-radius:5px; flex-shrink:0; }
.attach-remove:hover { background:rgba(224,123,57,0.15); }

/* Survol pendant le glisser-déposer */
.main-pane.drag-over { outline:3px dashed var(--accent); outline-offset:-8px; background:var(--accent-lt); }
.main-pane.drag-over::after { content:"📎 Déposez le document ici"; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:1.2rem; font-weight:700; color:var(--accent); background:rgba(253,240,231,0.85); pointer-events:none; z-index:50; }

/* Sélecteur de base active (super-admin) */
.sa-company-box { display:flex; align-items:center; gap:0.4rem; background:var(--blue-pale); border:1px solid var(--blue-mid); border-radius:8px; padding:0.25rem 0.5rem; }
.sa-company-label { font-size:0.78rem; font-weight:600; color:var(--blue-mid); white-space:nowrap; }
#sa-company-select { border:none; background:transparent; font-size:0.82rem; font-weight:600; color:var(--blue-mid); font-family:inherit; cursor:pointer; max-width:160px; }
#sa-company-select:focus { outline:none; }

/* ============================================================
   MODAL
   ============================================================ */
.modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.45); display:flex; align-items:center; justify-content:center; z-index:1000; }
.modal { background:var(--bg-white); border-radius:14px; box-shadow:0 8px 32px rgba(0,0,0,0.18); width:440px; max-width:94vw; max-height:85vh; display:flex; flex-direction:column; overflow:hidden; }
.modal-header { display:flex; align-items:center; justify-content:space-between; padding:1.1rem 1.25rem 0.75rem; border-bottom:1px solid var(--border); }
.modal-header h2 { margin:0; font-size:1.1rem; font-weight:700; color:var(--blue-mid); }
.modal-close { background:transparent; border:none; font-size:1.5rem; line-height:1; color:var(--text-muted); border-radius:6px; width:32px; height:32px; display:flex; align-items:center; justify-content:center; transition:all 0.15s; }
.modal-close:hover { background:var(--bg); color:var(--text); }

.modal-tabs { display:flex; padding:0.6rem 1.25rem 0; gap:0.5rem; border-bottom:1px solid var(--border); }
.modal-tab { background:transparent; border:none; border-bottom:2px solid transparent; padding:0.4rem 0.75rem 0.5rem; font-size:0.88rem; font-weight:500; color:var(--text-muted); cursor:pointer; margin-bottom:-1px; border-radius:6px 6px 0 0; transition:all 0.15s; }
.modal-tab.active { color:var(--blue-mid); border-bottom-color:var(--blue-mid); background:var(--blue-pale); }
.modal-tab:hover:not(.active) { color:var(--blue-mid); }

.modal-body { padding:1rem 1.25rem; overflow-y:auto; flex:1; min-height:0; }
.modal-help { margin:0 0 0.75rem; font-size:0.88rem; color:var(--text-muted); }
.modal-label { display:block; font-size:0.82rem; font-weight:600; color:var(--text); margin-bottom:0.3rem; }
.modal-body input[type=text] { width:100%; padding:0.65rem 0.85rem; border:1.5px solid var(--border); border-radius:8px; font-size:0.95rem; font-family:inherit; background:var(--bg); transition:border-color 0.15s; }
.modal-body input[type=text]:focus { outline:none; border-color:var(--blue-mid); background:var(--bg-white); }

.user-select-list { display:flex; flex-direction:column; gap:0.3rem; max-height:240px; overflow-y:auto; }
.user-row { display:flex; align-items:center; gap:0.75rem; padding:0.55rem 0.65rem; border-radius:8px; cursor:pointer; transition:background 0.12s; border:1px solid transparent; }
.user-row:hover { background:var(--blue-pale); border-color:var(--blue-mid); }
.user-row.selectable { position:relative; }
.user-row.selected { background:var(--blue-pale); border-color:var(--blue-mid); }
.user-row-avatar { width:32px; height:32px; border-radius:50%; background:var(--blue-mid); color:#fff; font-size:0.85rem; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.check-mark { margin-left:auto; color:var(--blue-mid); font-weight:700; opacity:0; transition:opacity 0.15s; }
.user-row.selected .check-mark { opacity:1; }

.modal-submit { width:100%; margin-top:1rem; padding:0.7rem; background:var(--blue-mid); color:#fff; border:none; border-radius:8px; font-size:0.95rem; font-weight:600; cursor:pointer; transition:background 0.15s; }
.modal-submit:hover { background:var(--blue-light); }

/* Compteur en ligne dans le header */
.online-label { font-weight:600; }
.online-label.is-online { color:var(--green); }
.cross-badge { font-weight:600; color:var(--accent); }

/* Étiquettes d'entreprise dans les listes de membres */
.user-row-name { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.company-tag { font-size:0.72rem; font-weight:600; color:var(--blue-mid); background:var(--blue-pale); padding:0.12rem 0.5rem; border-radius:10px; white-space:nowrap; flex-shrink:0; }
.company-tag-none { color:var(--text-muted); background:#eceef1; }
.user-group-header { font-size:0.72rem; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; color:var(--accent); padding:0.6rem 0.4rem 0.25rem; border-bottom:1px solid var(--border); margin-bottom:0.2rem; }
.group-cross-hint { font-size:0.82rem; color:var(--accent); background:var(--accent-lt); border:1px solid #f3d6bf; border-radius:8px; padding:0.5rem 0.7rem; margin:0.6rem 0; line-height:1.4; }

/* ============================================================
   PANEL ADMIN
   ============================================================ */
.admin-user-row { display:flex; align-items:center; gap:0.65rem; padding:0.65rem 0; border-bottom:1px solid var(--border); }
.admin-user-row:last-child { border-bottom:none; }
.admin-username { font-weight:600; font-size:0.9rem; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.admin-badges { display:flex; gap:0.3rem; flex-shrink:0; }
.badge { display:inline-flex; align-items:center; padding:0.15rem 0.5rem; border-radius:12px; font-size:0.72rem; font-weight:700; letter-spacing:0.03em; }
.badge-admin { background:var(--blue-pale); color:var(--blue-mid); }
.badge-no-ai { background:#fef2f2; color:#ef4444; }
.admin-toggles { display:flex; gap:0.6rem; flex-shrink:0; }

/* Toggle switch */
.toggle-label { display:flex; align-items:center; gap:0.3rem; cursor:pointer; user-select:none; }
.toggle-label input { position:absolute; opacity:0; width:0; height:0; }
.toggle-track { width:34px; height:19px; border-radius:10px; background:#d1d5db; position:relative; transition:background 0.2s; flex-shrink:0; }
.toggle-label input:checked + .toggle-track { background:var(--blue-mid); }
.toggle-thumb { position:absolute; width:14px; height:14px; border-radius:50%; background:#fff; top:2.5px; left:2.5px; transition:transform 0.2s; box-shadow:0 1px 3px rgba(0,0,0,0.2); }
.toggle-label input:checked + .toggle-track .toggle-thumb { transform:translateX(15px); }
.toggle-text { font-size:0.75rem; color:var(--text-muted); font-weight:500; white-space:nowrap; }

/* ============================================================
   CONSOLE D'ADMINISTRATION (onglets latéraux)
   ============================================================ */
.admin-console { width:880px; max-width:96vw; height:82vh; max-height:82vh; }
.admin-layout { flex:1; display:flex; min-height:0; }
.admin-nav { width:185px; flex-shrink:0; border-right:1px solid var(--border); padding:0.75rem; display:flex; flex-direction:column; gap:0.3rem; background:var(--bg); }
.admin-nav-btn { text-align:left; background:transparent; border:none; border-radius:8px; padding:0.6rem 0.75rem; font-size:0.9rem; font-weight:500; color:var(--text); cursor:pointer; transition:all 0.12s; }
.admin-nav-btn:hover { background:var(--blue-pale); }
.admin-nav-btn.active { background:var(--blue-mid); color:#fff; }
.admin-content { flex:1; overflow-y:auto; padding:1.1rem 1.3rem; min-width:0; min-height:0; }
.admin-pane-title { font-size:0.82rem; font-weight:700; color:var(--blue-mid); text-transform:uppercase; letter-spacing:0.04em; margin:1.2rem 0 0.6rem; }
.admin-pane-title:first-child { margin-top:0; }

/* Formulaire création de membre */
.member-create-form { display:flex; flex-wrap:wrap; gap:0.5rem; align-items:center; background:var(--bg); border:1px solid var(--border); border-radius:10px; padding:0.75rem; }
.member-create-form input[type=text], .member-create-form input[type=password] { flex:1; min-width:140px; padding:0.5rem 0.7rem; border:1.5px solid var(--border); border-radius:7px; font-size:0.9rem; font-family:inherit; background:#fff; }
.member-create-form input:focus, .member-create-form select:focus { outline:none; border-color:var(--blue-mid); }
.nm-company-sel { padding:0.5rem 0.6rem; border:1.5px solid var(--border); border-radius:7px; font-size:0.88rem; font-family:inherit; background:#fff; cursor:pointer; }
.nm-quota-label { display:flex; align-items:center; gap:0.35rem; font-size:0.82rem; color:var(--text-muted); }
.nm-quota-input { width:70px; padding:0.5rem 0.5rem; border:1.5px solid var(--border); border-radius:7px; font-size:0.88rem; font-family:inherit; background:#fff; }
.nm-admin-label { display:flex; align-items:center; gap:0.3rem; font-size:0.85rem; color:var(--text); cursor:pointer; }

/* Liste / cartes de membres */
.member-list { display:flex; flex-direction:column; gap:0.5rem; }
.member-card { border:1px solid var(--border); border-radius:10px; padding:0.65rem 0.8rem; background:#fff; }
.member-head { display:flex; align-items:center; gap:0.6rem; }
.member-id { flex:1; min-width:0; display:flex; flex-direction:column; }
.member-name { font-weight:600; font-size:0.92rem; }
.member-sub { font-size:0.76rem; color:var(--text-muted); }
.member-sub em { font-style:italic; opacity:0.7; }
.member-controls { display:flex; align-items:center; gap:1rem; margin-top:0.6rem; padding-top:0.6rem; border-top:1px dashed var(--border); flex-wrap:wrap; }
.quota-box { display:flex; align-items:center; gap:0.4rem; margin-left:auto; }
.quota-usage { font-size:0.8rem; font-weight:600; color:var(--blue-mid); background:var(--blue-pale); padding:0.2rem 0.55rem; border-radius:12px; white-space:nowrap; }
.quota-input { width:64px; padding:0.35rem 0.45rem; border:1.5px solid var(--border); border-radius:6px; font-size:0.82rem; font-family:inherit; text-align:center; }
.quota-input:focus { outline:none; border-color:var(--blue-mid); }

.kb-company-label-inline { font-size:0.85rem; color:var(--text-muted); font-weight:600; }
.kb-subtabs { padding:0.6rem 0 0; border-bottom:1px solid var(--border); margin-bottom:0.8rem; }

/* ============================================================
   MODALES LARGES (entreprises / KB)
   ============================================================ */
.modal-wide { width:680px; max-width:95vw; }
.modal-subtitle { font-size:0.85rem; font-weight:700; color:var(--blue-mid); margin:1.1rem 0 0.5rem; text-transform:uppercase; letter-spacing:0.04em; }
.kb-empty { color:var(--text-muted); font-size:0.88rem; padding:0.75rem; text-align:center; }

/* Création entreprise */
.create-company-row { display:flex; gap:0.5rem; }
.create-company-row input { flex:1; padding:0.6rem 0.85rem; border:1.5px solid var(--border); border-radius:8px; font-size:0.95rem; font-family:inherit; background:var(--bg); }
.create-company-row input:focus { outline:none; border-color:var(--blue-mid); background:#fff; }

/* Liste entreprises */
.company-list { display:flex; flex-direction:column; gap:0.4rem; }
.company-row { display:flex; align-items:center; padding:0.6rem 0.75rem; background:var(--bg); border:1px solid var(--border); border-radius:8px; gap:0.6rem; }
.company-logo-thumb { width:38px; height:38px; object-fit:contain; border-radius:7px; background:#fff; border:1px solid var(--border); flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:1.2rem; padding:2px; }
.company-logo-placeholder { color:var(--text-muted); }
.company-info { flex:1; display:flex; flex-direction:column; gap:0.1rem; min-width:0; }
.company-name { font-weight:600; font-size:0.92rem; color:var(--text); }
.company-stats { font-size:0.76rem; color:var(--text-muted); }
.company-actions { display:flex; gap:0.3rem; flex-shrink:0; }

.mini-btn { background:var(--bg-white); border:1px solid var(--border); border-radius:6px; padding:0.3rem 0.5rem; font-size:0.8rem; cursor:pointer; transition:all 0.15s; }
.mini-btn:hover { background:var(--blue-pale); border-color:var(--blue-mid); }
.mini-btn.danger:hover { background:#fef2f2; border-color:#ef4444; }

/* Affectation membres */
.assign-list { display:flex; flex-direction:column; gap:0.35rem; max-height:240px; overflow-y:auto; }
.assign-row { display:flex; align-items:center; gap:0.6rem; padding:0.35rem 0; }
.assign-username { flex:1; font-size:0.88rem; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.assign-select { padding:0.4rem 0.6rem; border:1.5px solid var(--border); border-radius:7px; font-size:0.85rem; font-family:inherit; background:var(--bg); cursor:pointer; max-width:200px; }
.assign-select:focus { outline:none; border-color:var(--blue-mid); }

/* KB : sélecteur entreprise + onglets */
.kb-picker-row { display:flex; align-items:center; gap:0.6rem; padding:0.6rem 1.25rem 0; }
.kb-picker-row .modal-label { margin:0; }
#kb-company-select { flex:1; padding:0.5rem 0.75rem; border:1.5px solid var(--border); border-radius:8px; font-size:0.9rem; font-family:inherit; background:var(--bg); cursor:pointer; }
.kb-tab { background:transparent; border:none; border-bottom:2px solid transparent; padding:0.5rem 0.85rem 0.55rem; font-size:0.88rem; font-weight:500; color:var(--text-muted); cursor:pointer; margin-bottom:-1px; border-radius:6px 6px 0 0; }
.kb-tab.active { color:var(--blue-mid); border-bottom-color:var(--blue-mid); background:var(--blue-pale); }
.kb-tab:hover:not(.active) { color:var(--blue-mid); }

/* KB : barre d'outils */
.kb-toolbar { display:flex; align-items:center; gap:0.5rem; margin-bottom:0.75rem; flex-wrap:wrap; }
.kb-tool-btn { background:var(--blue-mid); color:#fff; border:none; border-radius:8px; padding:0.5rem 0.85rem; font-size:0.85rem; font-weight:600; cursor:pointer; transition:background 0.15s; display:inline-flex; align-items:center; gap:0.3rem; }
.kb-tool-btn:hover { background:var(--blue-light); }
.kb-import-btn { background:var(--accent); }
.kb-import-btn:hover { background:#c96c2b; }
.kb-status { font-size:0.82rem; color:var(--text-muted); }

/* KB : table de temps */
.kb-table-wrap { overflow-x:auto; max-height:50vh; overflow-y:auto; border:1px solid var(--border); border-radius:8px; }
.kb-time-table { border-collapse:collapse; width:100%; font-size:0.85rem; }
.kb-time-table th { background:var(--blue-pale); color:var(--blue-mid); font-weight:600; text-align:left; padding:0.5rem 0.6rem; position:sticky; top:0; z-index:1; }
.kb-time-table td { border-top:1px solid var(--border); padding:0.2rem 0.3rem; }
.kb-time-table input { width:100%; border:1px solid transparent; border-radius:5px; padding:0.35rem 0.45rem; font-size:0.85rem; font-family:inherit; background:transparent; }
.kb-time-table input:focus { outline:none; border-color:var(--blue-mid); background:#fff; }
.kb-time-table input:hover { background:var(--bg); }
.kb-time-table td:last-child { width:38px; text-align:center; }

/* KB : statut RAG */
.rag-status { font-size:0.82rem; color:var(--blue-mid); background:var(--blue-pale); border-radius:8px; padding:0.45rem 0.7rem; margin-bottom:0.6rem; }
.rag-status:empty { display:none; }

/* KB : documents */
.kb-doc-list { display:flex; flex-direction:column; gap:0.4rem; }
.kb-doc-row { display:flex; align-items:center; gap:0.6rem; padding:0.6rem 0.75rem; background:var(--bg); border:1px solid var(--border); border-radius:8px; }
.kb-doc-icon { font-size:1.3rem; }
.kb-doc-info { flex:1; display:flex; flex-direction:column; min-width:0; }
.kb-doc-name { font-weight:600; font-size:0.88rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kb-doc-meta { font-size:0.76rem; color:var(--text-muted); }

/* ============================================================
   LOGIN
   ============================================================ */
.login-body { display:flex; align-items:center; justify-content:center; height:100vh; margin:0; background:linear-gradient(135deg,var(--blue-deep) 0%,var(--blue-light) 100%); }
.login-card { background:var(--bg-white); padding:2.5rem 2rem; border-radius:14px; box-shadow:0 8px 32px rgba(0,0,0,0.18); width:380px; max-width:90vw; display:flex; flex-direction:column; gap:0.9rem; }
.login-logo { text-align:center; font-size:2.5rem; }
.login-card h1 { margin:0; font-size:1.3rem; color:var(--blue-mid); text-align:center; font-weight:700; }
.login-card p { margin:0 0 0.5rem; text-align:center; color:var(--text-muted); font-size:0.88rem; }
.login-label { font-size:0.82rem; font-weight:600; color:var(--text); display:block; margin-bottom:0.2rem; }
.login-card input { width:100%; padding:0.7rem 0.9rem; border:1.5px solid var(--border); border-radius:8px; font-size:0.95rem; font-family:inherit; background:var(--bg); transition:border-color 0.15s; }
.login-card input:focus { outline:none; border-color:var(--blue-mid); background:var(--bg-white); }
.login-card button[type=submit] { width:100%; padding:0.75rem; background:var(--blue-mid); color:#fff; border:none; border-radius:8px; font-size:1rem; font-weight:600; margin-top:0.25rem; cursor:pointer; transition:background 0.15s; }
.login-card button[type=submit]:hover { background:var(--blue-light); }
.login-error { color:#c62828; font-size:0.85rem; text-align:center; min-height:1.2rem; background:#fdecea; border-radius:6px; padding:0.4rem 0.6rem; display:none; }
.login-error.visible { display:block; }

/* ============================================================
   IMPRESSION / EXPORT PDF
   ============================================================ */
@media print {
  .sidebar, footer, .header-right, .msg-meta { display:none !important; }
  .app { box-shadow:none; }
  .main-pane { width:100%; }
  #messages { overflow:visible; padding:0; }
  .msg { max-width:100%; page-break-inside:avoid; }
  .msg.user { background:#e8f0fa !important; color:#000 !important; }
}

/* ============================================================
   MOBILE : bouton menu + tiroir latéral (masqués sur desktop)
   ============================================================ */
.mobile-menu-btn {
  display: none;
  position: fixed;
  top: calc(0.55rem + env(safe-area-inset-top, 0px));
  left: 0.6rem;
  z-index: 1200;
  width: 40px; height: 40px;
  border: none; border-radius: 9px;
  background: var(--blue-mid); color: #fff;
  font-size: 1.25rem; line-height: 1;
  box-shadow: 0 2px 8px rgba(0,0,0,0.25);
}
.sidebar-backdrop {
  display: none;
  position: fixed; inset: 0;
  background: rgba(0,0,0,0.45);
  z-index: 1100;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:880px) {
  .admin-console { width:100%; height:100%; max-width:100%; max-height:100%; border-radius:0; }
  .admin-layout { flex-direction:column; }
  .admin-nav { width:100%; flex-direction:row; overflow-x:auto; border-right:none; border-bottom:1px solid var(--border); gap:0.4rem; padding:0.5rem; }
  .admin-nav-btn { white-space:nowrap; flex-shrink:0; }
}

@media (max-width:768px) {
  /* Tiroir latéral */
  .mobile-menu-btn { display:flex; align-items:center; justify-content:center; }
  .app { position:relative; }
  .sidebar {
    position:fixed; top:0; left:0; height:100%; width:84vw; max-width:320px;
    transform:translateX(-100%); transition:transform 0.25s ease; z-index:1150;
    box-shadow:2px 0 16px rgba(0,0,0,0.3);
  }
  .app.sidebar-open .sidebar { transform:translateX(0); }
  .app.sidebar-open .sidebar-backdrop { display:block; }

  .main-pane { width:100%; }
  header { padding-left:3.4rem; }   /* place pour le bouton menu */

  #messages { padding:1rem 0.85rem; }
  .msg { max-width:90%; }
  .welcome-screen { padding:1.5rem 0.5rem 1rem; gap:1.5rem; }
  .welcome-categories { grid-template-columns:1fr; }
  .welcome-hero h2 { font-size:1.25rem; }

  footer { padding:0.7rem 0.85rem calc(0.6rem + env(safe-area-inset-bottom, 0px)); }
  .send-label, .ai-room-btn .send-label { display:none; }
  #send-btn, #room-send-btn { padding:0 0.9rem; }

  /* Modales plein écran */
  .modal { width:100%; max-width:100%; height:100%; max-height:100%; border-radius:0; }
  .modal-wide { width:100%; }

  /* Sélecteur de base : compact */
  .sa-company-label { display:none; }
  #sa-company-select { max-width:120px; }
  .header-right { gap:0.3rem; }
  .icon-btn { padding:0.4rem 0.6rem; }

  /* Cibles tactiles plus grandes */
  .conv-item { padding:0.6rem; font-size:0.9rem; }
  .conv-delete { opacity:0.5; }
}

@media (max-width:420px) {
  header h1 { font-size:0.98rem; }
  #header-sub { font-size:0.72rem; }
  .member-controls { gap:0.6rem; }
  .quota-box { margin-left:0; }
}