/* 
 * CSS für Konversationsdarstellung im CMS
 * Styling für Darstellung verschiedener Gesprächstypen (KI-Dialoge, Interviews, Meetings, etc.)
 */

.conversation {
  margin: 20px 0;
  padding: 15px;
  background: #f9f9f9;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* Basis-Stil für alle Nachrichten */
.message {
  margin: 15px 0;
  padding: 15px;
  border-radius: 5px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

/* Erster/Haupt-Gesprächspartner (blauer Akzent) */
.message-primary {
  background: #e2f0ff;
  border-left: 4px solid #007bff;
}

/* Zweiter Gesprächspartner (grauer Akzent) */
.message-secondary {
  background: #f1f1f1;
  border-left: 4px solid #555;
}

/* Dritter Gesprächspartner (grüner Akzent) */
.message-tertiary {
  background: #e8f5e9;
  border-left: 4px solid #28a745;
}

/* Vierter Gesprächspartner (oranger Akzent) */
.message-quaternary {
  background: #fff3e0;
  border-left: 4px solid #fd7e14;
}

/* Systemmeldungen/Hinweise */
.message-system {
  background: #f8f9fa;
  border-left: 0;
  padding: 10px 15px;
  font-style: italic;
  color: #6c757d;
  text-align: center;
  border-top: 1px dashed #ced4da;
  border-bottom: 1px dashed #ced4da;
}

/* Name/Bezeichnung des Autors */
.message-author {
  font-weight: bold;
  margin-bottom: 8px;
  font-size: 0.95em;
}

/* Zeitstempel */
.message-timestamp {
  text-align: right;
  font-size: 0.8em;
  color: #6c757d;
  margin-top: 8px;
}

/* Alte Klassen für Abwärtskompatibilität */
.user-message {
  margin: 15px 0;
  padding: 15px;
  border-radius: 5px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
  background: #e2f0ff;
  border-left: 4px solid #007bff;
}

.ai-message {
  margin: 15px 0;
  padding: 15px;
  border-radius: 5px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
  background: #f1f1f1;
  border-left: 4px solid #555;
}

/* Formatierung von Elementen innerhalb der Konversation */
.conversation pre {
  background: #282c34;
  color: #abb2bf;
  padding: 15px;
  border-radius: 5px;
  overflow-x: auto;
  margin: 10px 0;
  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
  font-size: 14px;
}

.conversation code {
  background: #eee;
  padding: 2px 4px;
  border-radius: 3px;
  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
  font-size: 0.9em;
}

.conversation blockquote {
  border-left: 3px solid #ddd;
  padding-left: 15px;
  color: #555;
  font-style: italic;
  margin: 10px 0 15px 0;
}

.conversation h1, .conversation h2 {
  color: #333;
  margin-top: 25px;
  margin-bottom: 15px;
}

.conversation h2 {
  font-size: 1.4em;
  margin-top: 30px;
}

.conversation ol, .conversation ul {
  margin-left: 20px;
  margin-bottom: 15px;
}

.conversation p {
  margin-bottom: 15px;
  line-height: 1.6;
} 