/* ELAYOR-FULL-UI-BIDI-FONT-PROFILES-1A-3C2
   Presentation only. Direction never changes author role or answer content. */

:root {
  --elayor-font-cyrl: Arial, system-ui, sans-serif;
  --elayor-font-latn: Arial, system-ui, sans-serif;
  --elayor-font-arab:
    "Noto Sans Arabic", "Segoe UI", Tahoma, Arial, sans-serif;
  --elayor-font-hebr:
    "Noto Sans Hebrew", "Segoe UI", Arial, sans-serif;
  --elayor-font-grek: Arial, system-ui, sans-serif;
  --elayor-font-hans:
    "Noto Sans CJK SC", "Microsoft YaHei", system-ui, sans-serif;
  --elayor-font-jpan:
    "Noto Sans CJK JP", "Yu Gothic", system-ui, sans-serif;
  --elayor-font-kore:
    "Noto Sans CJK KR", "Malgun Gothic", system-ui, sans-serif;
  --elayor-interactive-min: 24px;
}

html[data-elayor-ui-locale] {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

html[data-elayor-ui-locale="ru"] body,
html[data-elayor-ui-locale="ru"] button,
html[data-elayor-ui-locale="ru"] input,
html[data-elayor-ui-locale="ru"] select,
html[data-elayor-ui-locale="ru"] textarea {
  font-family: var(--elayor-font-cyrl);
}

html[data-elayor-ui-locale="lt-LT"] body,
html[data-elayor-ui-locale="lt-LT"] button,
html[data-elayor-ui-locale="lt-LT"] input,
html[data-elayor-ui-locale="lt-LT"] select,
html[data-elayor-ui-locale="lt-LT"] textarea,
html[data-elayor-ui-locale="en"] body,
html[data-elayor-ui-locale="en"] button,
html[data-elayor-ui-locale="en"] input,
html[data-elayor-ui-locale="en"] select,
html[data-elayor-ui-locale="en"] textarea {
  font-family: var(--elayor-font-latn);
}

.message[data-elayor-script="Arab"] {
  font-family: var(--elayor-font-arab);
  line-height: 1.65;
}

.message[data-elayor-script="Hebr"] {
  font-family: var(--elayor-font-hebr);
  line-height: 1.55;
}

.message[data-elayor-script="Grek"] {
  font-family: var(--elayor-font-grek);
}

.message[data-elayor-script="Hans"] {
  font-family: var(--elayor-font-hans);
  line-height: 1.6;
}

.message[data-elayor-script="Jpan"] {
  font-family: var(--elayor-font-jpan);
  line-height: 1.6;
}

.message[data-elayor-script="Kore"] {
  font-family: var(--elayor-font-kore);
  line-height: 1.6;
}

:where(
  .app-layout,
  .chat-main,
  .chat-header,
  .brand-row,
  .brand-text,
  .brand-topline,
  .auth-area,
  .login-box,
  .register-box,
  .reset-request-box,
  .reset-password-box,
  .login-status,
  .status-buttons,
  .chat-input,
  .voice-controls,
  .space-sidebar,
  .space-sidebar-content,
  .space-sidebar-footer,
  .space-folder-card,
  .space-chat-item,
  .space-chat-text,
  .account-panel,
  .account-content,
  .account-actions,
  .system-letters-panel,
  .system-letters-content,
  .system-letter-card,
  .summary-chain-view,
  .summary-chain-inline-item,
  .suggested-folder-box
) {
  min-inline-size: 0;
  max-inline-size: 100%;
}

:where(
  [data-i18n],
  [data-i18n-placeholder],
  [data-i18n-title],
  button,
  label,
  input,
  select,
  textarea,
  .message,
  .system-letter-card,
  .space-awareness-card,
  .plan-card,
  .credit-box
) {
  overflow-wrap: anywhere;
}

:where(button, input, select, textarea, [role="button"]) {
  min-inline-size: 0;
  max-inline-size: 100%;
}

:where(button, [role="button"]) {
  min-block-size: var(--elayor-interactive-min);
}

.voice-language-btn {
  inline-size: 74px !important;
  min-inline-size: 74px !important;
  max-inline-size: 74px !important;
  min-block-size: var(--elayor-interactive-min) !important;
  box-sizing: border-box !important;
  padding-inline: 2px !important;
  font-size: 9px !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
  line-height: 1 !important;
}

#send {
  overflow-wrap: normal !important;
  word-break: normal !important;
}

.brand-topline {
  flex-wrap: wrap;
  row-gap: 5px;
}

.chat-header .brand-tagline,
.chat-header .brand-subline {
  min-inline-size: 0;
  max-inline-size: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}

.login-box,
.register-box,
.reset-request-box,
.reset-password-box {
  grid-template-columns: repeat(auto-fit, minmax(min(170px, 100%), 1fr));
}

.login-box button,
.register-box button,
.reset-request-box button,
.reset-password-box button {
  white-space: normal;
}

.account-actions,
.system-letter-actions,
.suggested-folder-actions,
.summary-chain-inline-actions,
.system-letters-toolbar {
  flex-wrap: wrap;
}

.account-actions > *,
.system-letter-actions > *,
.suggested-folder-actions > *,
.summary-chain-inline-actions > *,
.system-letters-toolbar > * {
  min-inline-size: min(120px, 100%);
}

.message[dir="rtl"],
.message[dir="ltr"],
.message[dir="auto"] {
  text-align: start;
  unicode-bidi: plaintext;
}

html[dir="rtl"] .space-sidebar {
  border-inline-start: 1px solid rgba(255, 255, 255, 0.07);
  border-inline-end: 0;
}

html[dir="rtl"] :where(
  .space-footer-link,
  .space-archive-toggle,
  .chat-context-item,
  .chat-context-subitem,
  .folder-context-item,
  .suggested-folder-choice,
  .message-conclusion-menu-item
) {
  text-align: start;
}

html[dir="rtl"] .space-chat-item {
  padding-inline-start: 38px !important;
  padding-inline-end: 10px !important;
}

html[dir="rtl"] .space-chat-menu-trigger {
  inset-inline-start: 9px;
  inset-inline-end: auto;
}

html[dir="rtl"] .password-field input {
  padding-inline-start: 86px;
  padding-inline-end: 13px;
}

html[dir="rtl"] .password-toggle {
  inset-inline-start: 7px;
  inset-inline-end: auto;
}

html[dir="rtl"] .system-letters-panel {
  inset-inline-start: 18px;
  inset-inline-end: auto;
}

html[dir="rtl"] .account-panel {
  inset-inline-start: auto;
  inset-inline-end: 18px;
}

html[dir="rtl"] .mobile-space-toggle {
  inset-inline-start: 10px !important;
  inset-inline-end: auto !important;
}

html[dir="rtl"] .message.user {
  align-self: flex-end;
}

html[dir="rtl"] .message.bot {
  align-self: stretch;
}

.seo-index-block {
  inset-inline-start: 0 !important;
  inset-inline-end: auto !important;
}

.elayor-visual-qa-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  gap: 10px;
  inline-size: 100%;
  min-inline-size: 0;
  margin-block: 12px;
}

.elayor-visual-qa-probe {
  min-inline-size: 0;
  max-inline-size: 100%;
  padding: 9px 10px;
  border: 1px solid rgba(157, 133, 255, 0.24);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  overflow-wrap: anywhere;
  white-space: normal;
}

@media (max-width: 1100px) {
  .chat-header .mobile-space-toggle {
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden !important;
    text-overflow: ellipsis;
    text-align: center;
    padding-inline: 2px !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    font-size: 10px !important;
    line-height: 1.15 !important;
  }
}

@media (max-width: 720px) {
  .chat-header {
    padding-inline: 12px;
  }

  .brand-topline {
    align-items: flex-start;
  }

  .chat-input {
    grid-template-columns: minmax(56px, 88px) minmax(0, 1fr)
      74px !important;
  }

  #send {
    min-inline-size: 0 !important;
    padding-inline: 8px !important;
    white-space: normal;
  }

  .voice-controls {
    inline-size: 74px !important;
    min-inline-size: 74px !important;
    max-inline-size: 74px !important;
  }

  .voice-language-btn {
    inline-size: 100% !important;
    min-block-size: var(--elayor-interactive-min) !important;
    max-inline-size: 100% !important;
    box-sizing: border-box !important;
    padding-inline: 2px !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: keep-all !important;
  }

  .account-panel,
  .system-letters-panel {
    inset-inline: 10px;
    inline-size: auto;
    max-inline-size: none;
  }

  html[dir="rtl"] .account-panel,
  html[dir="rtl"] .system-letters-panel {
    inset-inline: 10px;
  }
}

@media (max-width: 280px) {
  .chat-header .brand-row {
    align-items: flex-start;
  }

  .chat-header .brand-icon {
    inline-size: 32px;
    block-size: 32px;
  }

  .chat-input {
    grid-template-columns: 72px minmax(0, 1fr) 74px !important;
    grid-template-rows: auto auto 44px 56px !important;
    gap: 4px !important;
    padding-inline: 4px !important;
  }

  #send {
    grid-column: 1 / 4 !important;
    grid-row: 3 !important;
  }

  .voice-controls {
    grid-column: 3 / 4 !important;
    grid-row: 4 !important;
  }

  .chat-header .mobile-space-toggle {
    inline-size: 72px !important;
    min-inline-size: 72px !important;
    padding-inline: 1px !important;
    font-size: 8.5px !important;
  }
}