/* Fixes spécifiques pour messages.html */

/* Fix 1: Header ne doit pas cacher le contenu */
body.messages-page {
  padding-top: 0 !important;
}

/* Fix logo: Ajuster le positionnement du logo texte */
body.messages-page .brand {
  margin-left: 16px;
}

/* Main container doit commencer SOUS le header */
body.messages-page main.container {
  padding: 0 !important;
  max-width: 100% !important;
  margin-top: calc(var(--header-height, 64px)) !important;
  position: relative;
  z-index: 1;
}

/* Fix 2: Chat area ne doit pas être caché par header ni bottom nav */
body.messages-page .chat-area {
  padding: 20px !important;
  margin: 0 !important;
  height: calc(100vh - var(--header-height, 64px) - var(--bottom-nav-height, 60px)) !important;
  min-height: calc(100vh - var(--header-height, 64px) - var(--bottom-nav-height, 60px)) !important;
}

/* Fix 3: Bottom nav ULTRA prioritaire - au dessus de TOUT */
body.messages-page .bottom-nav {
  pointer-events: auto !important;
  z-index: 999999 !important;
  position: fixed !important;
  bottom: 16px !important;
}

body.messages-page .bottom-nav-item {
  pointer-events: auto !important;
  cursor: pointer !important;
  position: relative;
  z-index: 1;
}

/* Forcer les SVG et spans à ne PAS bloquer les clics */
body.messages-page .bottom-nav-item svg,
body.messages-page .bottom-nav-item span {
  pointer-events: none;
}

/* Fix 4: Assurer que rien ne bloque la bottom nav */
body.messages-page .chat-area,
body.messages-page .parent-list,
body.messages-page .chat-window,
body.messages-page .chat-placeholder,
body.messages-page .pedia-popup-overlay {
  z-index: 1 !important;
}

/* Sphère Ped'IA doit rester au premier plan (au-dessus du menu hamburger) */
body.messages-page #pedia-floating-container {
  z-index: 100000 !important;
}

/* Fix 5: Mobile responsive - ajuster pour bottom nav */
@media (max-width: 600px) {
  body.messages-page .chat-area {
    height: calc(100vh - var(--header-height, 64px) - var(--bottom-nav-height, 60px)) !important;
    min-height: calc(100vh - var(--header-height, 64px) - var(--bottom-nav-height, 60px)) !important;
    padding: 16px !important;
  }
}

/* Fix 6: Retirer le fond sombre derrière le formulaire sur Android */
body.messages-page #message-form,
body.messages-page .chat-input,
body.messages-page .pedia-enhanced-container,
body.messages-page .chat-actions {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
}