/* =========================================================
   Chatbot Wanapos — styles de la page /chatbot.
   Sépare le rendu markdown des messages AI + utilitaires Alpine.
   ========================================================= */

[x-cloak] { display: none !important; }

/* ─── Suppression du ring de focus par défaut du navigateur ─────────
   Safari/Chrome macOS dessinent un rectangle bleu autour des inputs au
   focus. On le supprime — notre indicateur visuel passe par les
   utilities Tailwind focus:ring-* ou focus-within:border-primary sur
   le wrapper, donc l'utilisateur a déjà un feedback de focus propre. */
textarea,
input[type="text"],
input[type="email"] {
    -webkit-tap-highlight-color: transparent;
}
textarea:focus,
textarea:focus-visible,
input[type="text"]:focus,
input[type="text"]:focus-visible,
input[type="email"]:focus,
input[type="email"]:focus-visible {
    outline: none !important;
}

/* ─── Rendu markdown des messages assistant ─────────────────────── */
.chatbot-md                       { line-height: 1.7; }
.chatbot-md p                     { margin: 0.85em 0; }
.chatbot-md p:first-child         { margin-top: 0; }
.chatbot-md p:last-child          { margin-bottom: 0; }
.chatbot-md ul,
.chatbot-md ol                    { margin: 0.9em 0; padding-left: 1.6em; }
.chatbot-md ul                    { list-style: disc; }
.chatbot-md ol                    { list-style: decimal; }
.chatbot-md li                    { margin: 0.45em 0; padding-left: 0.25em; }
.chatbot-md li > p                { margin: 0.3em 0; }
.chatbot-md strong                { font-weight: 600; color: #111827; }
.chatbot-md em                    { font-style: italic; }
.chatbot-md code                  { background: rgba(0,0,0,0.06); padding: 0.1em 0.35em; border-radius: 4px; font-size: 0.9em; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.chatbot-md pre                   { background: rgba(0,0,0,0.06); padding: 0.75em; border-radius: 8px; overflow-x: auto; margin: 0.75em 0; }
.chatbot-md pre code              { background: transparent; padding: 0; }
.chatbot-md h1,
.chatbot-md h2,
.chatbot-md h3                    { font-weight: 600; margin: 1.1em 0 0.4em; line-height: 1.35; color: #111827; }
.chatbot-md h1                    { font-size: 1.18em; }
.chatbot-md h2                    { font-size: 1.1em; }
.chatbot-md h3                    { font-size: 1.05em; }
.chatbot-md h1:first-child,
.chatbot-md h2:first-child,
.chatbot-md h3:first-child        { margin-top: 0; }
.chatbot-md a                     { color: #604CF3; text-decoration: underline; }
.chatbot-md blockquote            { border-left: 3px solid #E5E7EB; padding-left: 0.85em; color: #6B7280; margin: 0.75em 0; }
.chatbot-md hr                    { border: 0; border-top: 1px solid #E5E7EB; margin: 1.2em 0; }
