/* HEADER – DESKTOP */
@media (min-width: 601px) {
  .hamburguer-btn {
    display: none;
  }

  .mobile-menu {
    display: none !important;
  }

  .header-right {
    display: flex;
    align-items: center;
    gap: 1rem;
    position: relative;
  }
}

/* HEADER – MOBILE */
@media (max-width: 600px) {
  .logout-fixed {
    position: fixed;
    bottom: 1rem;
    right: 1rem;
    background-color: var(--color-principal);
    color: white;
    padding: 0.75rem 1.25rem;
    border: none;
    border-radius: 999px;
    z-index: 999;
  }



  .mobile-menu {
    position: absolute;
    top: 60px;
    right: 1rem;
    background: white;
    border: 1px solid #ddd;
    border-radius: 0.75rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.5rem 0;
    z-index: 999;
  }

  .mobile-menu.oculto {
    display: none;
  }

  .mobile-menu button {
    padding: 0.75rem 1.25rem;
    font-size: 1rem;
    background: none;
    border: none;
    text-align: left;
    width: 100%;
    cursor: pointer;
  }

}
/* CHAT INPUT – MOBILE AJUSTES FINOS */
@media (max-width: 600px) {

.send-button {
  position: absolute;
  right: 0.5rem;
  top: 0.25rem;
  bottom: 0.25rem;
  margin: auto;
  width: 42px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: none;
  background-color: var(--color-btn-enviar);
  color: white;
  cursor: pointer;
}


  .chat-input-container {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
  }
}@media (max-width: 600px) {
  .chat-input-area {
    padding: 0.75rem;
  }

  .chat-input-container {
    max-width: 98%;
  }

  #mensaje {
    padding-right: 3.25rem;
  }

  .button {
    width: 42px;
    height: 42px;
    right: 0.5rem;
  }
}

/* Ocultar el favicon por defecto */
.logo-favicon {
  display: none;
}

/* Mostrar el favicon y ocultar el logo grande en pantallas chicas */
@media (max-width: 600px) {
  .logo-chatgpt {
    display: none;
  }
  .logo-favicon {
    display: block;
    height: 32px; /* Puedes ajustar el tamaño */
  }
}

@media (max-width: 600px) {
  .db-selector-btn {
    max-width: 120px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
}

@media (max-width: 600px) {
  .chat-container {
    max-width: 100%;
    padding: 0 1rem; /* Más espacio lateral en pantallas chicas */
  }
}