@tailwind base;
@tailwind components;
@tailwind utilities;

/* Personalizaciones adicionales para Gantt */
.gantt-chart .bar {
  fill-opacity: 0.8;
}

.gantt-chart .bar-progress {
  fill: #4f46e5;  /* Indigo-600 */
}

.gantt-chart .bar-milestone .bar {
  fill: #1e40af;  /* Azul oscuro para checkpoints */
}

/* Importar estilos personalizados de Tom Select */
@import "tom_select_custom.css";

/* =============================================================================
   ESTILOS PARA CONTENIDO DEL EDITOR SUMMERNOTE
   Corrige el contraste de bloques de código <pre>
   ========================================================================== */

/* Asegurar buen contraste en bloques pre generados por Summernote */
.note-editor .note-editable pre,
.summernote-editor .note-editable pre,
.note-editable pre,
pre {
  background-color: #f3f4f6 !important; /* gray-100 */
  color: #111827 !important; /* gray-900 - texto oscuro para buen contraste */
  border: 1px solid #d1d5db !important; /* gray-300 */
  border-radius: 0.375rem !important;
  padding: 1rem !important;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace !important;
  font-size: 0.875rem !important;
  line-height: 1.5 !important;
  overflow-x: auto !important;
}

/* Asegurar que el texto dentro de pre sea legible */
.note-editor .note-editable pre *,
.summernote-editor .note-editable pre *,
.note-editable pre *,
pre * {
  color: #111827 !important; /* gray-900 */
  background-color: transparent !important;
}

/* Estilos para visualización de contenido renderizado (comentarios, descripciones) */
.prose pre,
.comment-content pre,
.description-content pre,
.task-description pre,
.incident-description pre,
.requirement-description pre {
  background-color: #1f2937 !important; /* gray-800 - fondo oscuro para modo lectura */
  color: #f9fafb !important; /* gray-50 - texto claro */
  border: 1px solid #374151 !important; /* gray-700 */
  border-radius: 0.375rem !important;
  padding: 1rem !important;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace !important;
  font-size: 0.875rem !important;
  line-height: 1.5 !important;
  overflow-x: auto !important;
  margin: 1rem 0 !important;
}

.prose pre *,
.comment-content pre *,
.description-content pre *,
.task-description pre *,
.incident-description pre *,
.requirement-description pre * {
  color: #f9fafb !important; /* gray-50 - texto claro */
  background-color: transparent !important;
}

/* Código inline */
.prose code,
.comment-content code,
.description-content code {
  background-color: #f3f4f6 !important;
  color: #dc2626 !important; /* red-600 */
  padding: 0.125rem 0.25rem !important;
  border-radius: 0.25rem !important;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace !important;
  font-size: 0.875em !important;
}

/* En bloques pre, el code inline no debe tener fondo diferente */
.prose pre code,
.comment-content pre code,
.description-content pre code {
  background-color: transparent !important;
  color: inherit !important;
  padding: 0 !important;
}

/*

@layer components {
  .btn-primary {
    @apply py-2 px-4 bg-blue-200;
  }
}

*/