/* SuperAgents — superagents-responsive.css
 * Module : responsive
 * Généré depuis index.html
 */

/* ── COMPACT / MOBILE CHAT LAYOUT ─────── */
@media (max-width: 640px) {
  .sidebar { width: 52px; min-width: 52px; }
  .nav-avatar-placeholder { width: 28px; height: 28px; }

  .chat-messages { padding: 10px 8px !important; }
  .chat-input-area { padding: 8px 8px 12px !important; }
  .attached-files-bar { padding: 0 8px; }

  /* Messages take full width */
  .message { max-width: 96% !important; flex-direction: column !important; gap: 4px !important; }
  .message.user { align-items: flex-end; }
  .message.agent { align-items: flex-start; }

  /* Avatar above bubble — small and inline with name */
  .message .msg-avatar {
    width: 24px !important; height: 24px !important;
    font-size: 10px !important; border-radius: 8px !important;
  }
  .message.user .msg-avatar { align-self: flex-end; }
  .message.agent .msg-avatar { align-self: flex-start; }

  /* Bubbles full width */
  .message-bubble {
    padding: 10px 12px !important;
    font-size: 14px !important;
    max-width: 100%;
  }

  /* Media smaller */
  .media-preview-img { max-width: 220px !important; max-height: 150px !important; }
  .media-audio-card { max-width: 260px !important; }

  /* Chat header compact */
  .chat-header { padding: 8px 10px !important; }
  .chat-header .agent-name { font-size: 15px !important; }

  /* Gallery grid */
  .gallery-grid { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .gallery-card-img { height: 100px !important; }
  .media-lib-header { padding: 12px 10px 8px !important; }
  .media-lib-content { padding: 10px 8px !important; }

  /* Stream status compact */
  .stream-status { padding: 6px 10px !important; font-size: 12px !important; }
}