/* ============================================================
 * Conversation Starters מותאמים (agent-conversation-starters.js).
 * סרגל צ'יפים מתחת לתיבת ההודעה במסך הנחיתה, בסגנון הממותג של הפרוקסי
 * (צבעי --brand-*, RTL, מצב כהה). מעוצב כצ'יפים קריאים בדומה לרכיב המובנה
 * אך עם הדגשת-מותג עדינה ועקבית לשאר ההזרקות.
 * ============================================================ */

.agent-starters-bar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 14px 0 18px !important;
  padding: 0 16px !important;
  direction: rtl !important;
}

.agent-starters-bar .agent-starters-button {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  max-width: 22rem !important;
  padding: 10px 16px !important;
  border: 1.5px solid var(--brand-medium, #25408f) !important;
  border-radius: 16px !important;
  background: var(--surface-secondary, #f3f4f6) !important;
  color: var(--brand-dark, #16213f) !important;
  font-family: inherit !important;
  font-size: 0.9rem !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  text-align: center !important;
  cursor: pointer !important;
  box-shadow: 0 1px 2px rgba(37, 64, 143, 0.08) !important;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease !important;
  animation: agent-starters-fade 0.2s ease backwards !important;
}

@keyframes agent-starters-fade {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

.agent-starters-bar .agent-starters-button:hover {
  background: rgba(37, 64, 143, 0.08) !important;
  border-color: var(--brand-medium, #25408f) !important;
  color: var(--brand-medium, #25408f) !important;
}

.agent-starters-bar .agent-starters-button:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 2px var(--brand-light, #7dd2ef) !important;
}

/* ===== Dark mode ===== */
html[data-theme="dark"] .agent-starters-bar .agent-starters-button {
  border-color: var(--brand-light, #7dd2ef) !important;
  background: rgba(125, 210, 239, 0.08) !important;
  color: var(--brand-light, #7dd2ef) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .agent-starters-bar .agent-starters-button:hover {
  background: rgba(125, 210, 239, 0.16) !important;
  border-color: var(--brand-light, #7dd2ef) !important;
  color: var(--brand-light, #7dd2ef) !important;
}

/* ============================================================
 * כרטיס-בחירה בהיסטוריה: ה-starter שנלחץ (במקום טקסט ה-send).
 * צ'יפ בסגנון לחצן-ה-starter, לא-אינטראקטיבי, מיושר לצד המשתמש (RTL).
 * ============================================================ */
.agent-starters-choice-hidden {
  display: none !important;
}

.agent-starters-choice-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important; /* dir=rtl → צמוד לימין (צד המשתמש) */
  gap: 4px !important;
  direction: rtl !important;
  animation: agent-starters-fade 0.2s ease !important;
}

.agent-starters-choice-card .agent-starters-choice-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  max-width: 22rem !important;
  padding: 9px 14px !important;
  border: 1.5px solid var(--brand-medium, #25408f) !important;
  border-radius: 16px !important;
  background: rgba(37, 64, 143, 0.07) !important;
  color: var(--brand-dark, #16213f) !important;
  font-family: inherit !important;
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  box-shadow: 0 1px 2px rgba(37, 64, 143, 0.08) !important;
}

.agent-starters-choice-card .agent-starters-choice-icon {
  display: inline-flex !important;
  flex-shrink: 0 !important;
  color: var(--brand-medium, #25408f) !important;
}

.agent-starters-choice-card .agent-starters-choice-label {
  text-align: right !important;
}

.agent-starters-choice-card .agent-starters-choice-note {
  padding: 0 4px !important;
  font-size: 0.72rem !important;
  font-weight: 400 !important;
  color: var(--brand-dark, #16213f) !important;
  opacity: 0.6 !important;
}

/* ===== Dark mode ===== */
html[data-theme="dark"] .agent-starters-choice-card .agent-starters-choice-chip {
  border-color: var(--brand-light, #7dd2ef) !important;
  background: rgba(125, 210, 239, 0.1) !important;
  color: var(--brand-light, #7dd2ef) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .agent-starters-choice-card .agent-starters-choice-icon {
  color: var(--brand-light, #7dd2ef) !important;
}

html[data-theme="dark"] .agent-starters-choice-card .agent-starters-choice-note {
  color: var(--brand-light, #7dd2ef) !important;
}
