/* ========================================
   FLEETZ - CONTROLLO TASTIERA SMARTPHONE
   ======================================== */

/* ===== PREVENZIONE FOCUS AUTOMATICO ===== */

/* Input message - nessun focus automatico */
.message-input,
.chat-input,
input[type="text"].message-text-input {
  /* NON ricevere focus all'apertura chat */
  pointer-events: auto !important;
  
  /* Focus solo su click esplicito */
  outline: none !important;
  border: 2px solid transparent !important;
  
  /* Previeni focus automatico dai browser */
  -webkit-user-select: none !important;
  -webkit-touch-callout: none !important;
  -webkit-tap-highlight-color: transparent !important;
  
  /* Stile default senza focus */
  background-color: rgba(255, 255, 255, 0.1) !important;
  color: #ffffff !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  font-size: 16px !important; /* Previene zoom iOS */
  
  /* Transizione smooth */
  transition: all 0.2s ease !important;
}

/* Focus volontario dell'utente */
.message-input:focus,
.chat-input:focus,
input[type="text"].message-text-input:focus {
  /* Solo quando l'utente clicca */
  background-color: rgba(255, 255, 255, 0.95) !important;
  color: #000000 !important;
  border-color: #22c55e !important;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.2) !important;
  
  /* Transform per indicare attivazione */
  transform: scale(1.02) !important;
}

/* ===== CONTROLLO TASTIERA MOBILE ===== */

/* Quando chat si apre - tastiera chiusa */
.chat-container.just-opened {
  /* Forza chiusura tastiera se aperta */
  height: 100vh !important;
  height: 100dvh !important;
}

/* Quando tastiera deve aprirsi - solo su input focus */
.keyboard-should-open {
  /* Permetti ridimensionamento per tastiera */
  height: calc(100vh - var(--keyboard-height, 0px)) !important;
  height: calc(100dvh - var(--keyboard-height, 0px)) !important;
}

/* ===== PREVENZIONE AUTOFOCUS ===== */

/* Tutti gli input in chat - nessun autofocus */
.chat-page input[type="text"],
.chat-page input[type="email"],  
.chat-page input[type="password"],
.chat-page textarea,
.chat-container input[type="text"],
.message-input-bar input,
.message-input,
.chat-input {
  /* Rimuovi autofocus */
  outline: none !important;
  
  /* Focus solo volontario */
  pointer-events: auto !important;
  touch-action: manipulation !important;
  
  /* Previeni focus automatico */
  -webkit-user-select: none !important;
  -webkit-touch-callout: none !important;
  -webkit-tap-highlight-color: transparent !important;
}

/* Classe speciale per input appena aperti */
.no-auto-focus,
input[data-prevent-focus="true"] {
  /* Blocca completamente il focus automatico */
  pointer-events: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}

/* Ripristina pointer-events al click */
.no-auto-focus:active,
input[data-prevent-focus="true"]:active {
  pointer-events: auto !important;
}

/* Override autofocus HTML attribute */
input[autofocus],
textarea[autofocus] {
  /* Disabilita completamente autofocus */
  pointer-events: none !important;
}

input[autofocus]:not(.intentional-focus),
textarea[autofocus]:not(.intentional-focus) {
  /* Rendi autofocus inefficace */
  opacity: 0.8 !important;
}

/* Quando utente clicca intenzionalmente */
input.user-clicked,
textarea.user-clicked {
  pointer-events: auto !important;
  opacity: 1 !important;
}

/* ===== GESTIONE CLICK ESPLICITO ===== */

/* Pulsante per attivare input */
.activate-input-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  
  background-color: rgba(34, 197, 94, 0.2) !important;
  border: 2px solid #22c55e !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  color: #22c55e !important;
  
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

.activate-input-button:hover {
  background-color: rgba(34, 197, 94, 0.3) !important;
  transform: scale(1.05) !important;
}

/* ===== INDICATORI STATO TASTIERA ===== */

/* Chat senza tastiera */
.keyboard-closed .message-input-container {
  background-color: rgba(0, 0, 0, 0.5) !important;
  backdrop-filter: blur(10px) !important;
}

/* Chat con tastiera */
.keyboard-open .message-input-container {
  background-color: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: none !important;
  border-top: 2px solid #22c55e !important;
}

/* ===== MOBILE SPECIFIC ===== */

/* iPhone iOS */
@supports (-webkit-touch-callout: none) {
  .message-input {
    /* Previeni zoom automatico */
    font-size: 16px !important;
    
    /* Fix iOS keyboard behavior */
    -webkit-user-select: text !important;
    user-select: text !important;
  }
}

/* Android */
@media screen and (max-width: 768px) and (hover: none) {
  .message-input {
    /* Android keyboard fix */
    ime-mode: auto !important;
    
    /* Input method editor */
    composition-start: auto !important;
  }
  
  /* Quando tastiera è attiva su Android */
  .android-keyboard-active .message-input {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 1000 !important;
  }
}

/* ===== ACCESSIBILITY ===== */

/* Screen readers */
.message-input[aria-label] {
  /* Mantieni accessibilità */
  outline: 2px solid transparent !important;
  outline-offset: 2px !important;
}

.message-input:focus[aria-label] {
  outline-color: #22c55e !important;
}

/* ===== DEBUGGING ===== */
.debug-keyboard .message-input::before {
  content: "KB: " attr(data-keyboard-state);
  position: absolute;
  top: -20px;
  left: 0;
  background: red;
  color: white;
  font-size: 10px;
  padding: 2px 4px;
  display: var(--debug-keyboard, none);
}