/* SAUD AI 3.0 — chat tablet/iPad layout stabilization */
:root { --chat-visual-height: 100dvh; }

#chatView.chat-shell {
  height: var(--chat-visual-height, 100dvh);
  max-height: var(--chat-visual-height, 100dvh);
}

.view-header { position: relative; }
.view-header .chat-brand-mark {
  position: absolute;
  inset-inline-start: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  margin: 0 !important;
  z-index: 1;
  pointer-events: none;
}
html[dir="rtl"] .view-header .chat-brand-mark {
  transform: translate(50%, -50%);
}

/* Message readability: keep Arabic paragraphs natural while isolating embedded LTR text. */
#chatView .chat-message.assistant,
#chatView .chat-message[data-role="assistant"],
#chatView .assistant-message,
#chatView .message.assistant {
  max-width: min(860px, 88%);
}
#chatView .chat-message.assistant .message-content,
#chatView .chat-message[data-role="assistant"] .message-content,
#chatView .assistant-message .message-content,
#chatView .message.assistant .message-content,
#chatView .message-content p,
#chatView .message-content li {
  line-height: 1.8;
  text-align: start;
  unicode-bidi: plaintext;
  overflow-wrap: anywhere;
  word-break: normal;
}
#chatView .message-content ul,
#chatView .message-content ol {
  padding-inline-start: 1.35rem;
  padding-inline-end: 0;
  margin-block: .7rem;
}
#chatView .message-content li + li { margin-top: .38rem; }
#chatView .message-content code,
#chatView .message-content pre,
#chatView .message-content bdi {
  direction: ltr;
  unicode-bidi: isolate;
}

@media (min-width: 769px) and (max-width: 1366px) {
  .view-header {
    min-height: 72px;
    padding-inline: 18px;
  }
  .view-header-start,
  .view-header-actions {
    min-width: 0;
    gap: 8px;
  }
  .chat-brand-mark {
    width: 42px !important;
    height: 42px !important;
  }
  .chat-project-picker-btn {
    max-width: 180px;
  }
  .chat-preset-badge {
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .chat-body,
  .chat-pane,
  .chat-main {
    min-height: 0;
  }
  .chat-input-bar {
    position: relative !important;
    bottom: auto !important;
    flex: 0 0 auto;
    margin-bottom: max(8px, env(safe-area-inset-bottom, 0px));
  }
  .chat-messages {
    padding-bottom: 18px !important;
    scroll-padding-bottom: 18px;
  }
  #chatView .chat-message.assistant,
  #chatView .chat-message[data-role="assistant"],
  #chatView .assistant-message,
  #chatView .message.assistant {
    max-width: 94%;
  }
}

@media (max-width: 980px) {
  .view-header .chat-brand-mark {
    display: none !important;
  }
}