#editor {
  border-radius: 5px;
  min-height: 120px;
  outline: none;
  overflow-y: auto;
  white-space: pre-wrap;
  word-break: break-word;
}

#toolbar-container{
border: none;
}

/* CSS Vinculado a Spoiler en CAJA BOX*/
.spoiler {
  background-color: #000 !important;
  color: transparent !important;
  cursor: pointer !important;
  padding: 2px 4px !important;
  border-radius: 3px !important;
  transition: all 0.3s ease !important;
}

.spoiler:hover {
  background-color: transparent !important;
  color: inherit !important;
}

/* Estilos para comentarios */
.media {
    margin-bottom: 1.5rem;
}

.media-content .content {
    margin-bottom: 0.5rem;
}

.like-btn:hover, .dislike-btn:hover {
    background-color: #f5f5f5 !important;
}

.reply-btn {
    margin-left: 0.5rem;
}

/* Mensaje de baneo */
#ban-message {
    display: none;
    margin: 1rem 0;
    padding: 1rem;
    background: #fff5f5;
    color: #ff3864;
    border-left: 4px solid #ff3864;
}

/* Para controlar el tamaño de las imágenes dentro de los comentarios */
.comment-raw-content img {
    max-width: 100%; /* Asegura que la imagen nunca sea más ancha que su contenedor */
    height: auto; /* Mantiene la proporción de la imagen */
    display: block; /* Elimina el espacio debajo de la imagen si está en línea */
    /* Puedes añadir una altura máxima si quieres miniaturas más consistentes */
    max-height: 250px; /* Por ejemplo, para que las imágenes no sean excesivamente altas */
    object-fit: contain; /* Asegura que la imagen se ajuste dentro del contenedor sin recortarse */
}

/* Para manejar el desbordamiento de contenido muy largo (cadenas base64) */
.comment-raw-content {
    word-wrap: break-word; /* Rompe palabras largas que desborden */
    overflow-wrap: break-word; /* Estándar más moderno para lo mismo */
    /* Asegúrate de que el contenedor padre también maneje bien el desbordamiento */
    max-width: 100%; /* Para que el span no empuje el contenedor principal */
}

.media-content {
    overflow-x: hidden; /* Evita que el contenido se desborde horizontalmente */
}