/* /lib/json-editor/css/darktheme.css - VERSIÓN FINAL CON CORRECCIÓN DEL MODO CLARO */

/* ==========================================================
   CONFIGURACIÓN BÁSICA DEL CONTENEDOR (DARK MODE)
   ========================================================== */

   div.jsoneditor,
   div.jsoneditor-menu {
     border-color: #4b4b4b; 
     background-color: #2a2a2a; 
   }
   div.jsoneditor-menu button {
       background-color: #2a2a2a;
       color: #e0e0e0 !important;
   }
   
   /* Ajuste crítico para el Panel Derecho (Árbol) */
   div.jsoneditor-tree { 
       color: #e0e0e0 !important;
   }
   
   /* El separador (:) */
   div.jsoneditor td.jsoneditor-separator {
       color: #acacac !important;
   }
   
   
   /* ==========================================================
      ESTILOS ACE EDITOR (Lado Izquierdo) - DARK MODE
      ========================================================== */
   
   /* Fondo y Color de Texto principal para Ace Editor */
   #jsonEditorDarkTheme[data-theme-active="dark"] ~ * .jsoneditor-container .ace_editor,
   #jsonEditorDarkTheme[data-theme-active="dark"] ~ * .jsoneditor-container .ace_content {
       background-color: #2a2a2a !important; 
       color: #e0e0e0 !important;
   }
   
   /* Gutter (Área de números) */
   #jsonEditorDarkTheme[data-theme-active="dark"] ~ * .ace_gutter {
       background-color: #262626 !important; 
       border-right: 1px solid #444 !important; 
   }
   #jsonEditorDarkTheme[data-theme-active="dark"] ~ * .ace_gutter-cell {
       color: #999 !important;
   }
   
   /* Selección y resaltado de línea */
   #jsonEditorDarkTheme[data-theme-active="dark"] ~ * .ace_marker-layer .ace_active-line {
       background-color: #383838 !important;
   }
   #jsonEditorDarkTheme[data-theme-active="dark"] ~ * .ace_marker-layer .ace_selection {
       background-color: #4b4b4b !important;
   }
   
   
   /* ==========================================================
      🛑 SOLUCIÓN DEFINITIVA DE COLORES (Keys & Strings) - DARK MODE 🛑
      ========================================================== */
   
   /* LLAVES (KEYS) - AMARILLO (#FFD700) */
   div#jsonTreeOutput .jsoneditor-tree .jsoneditor-field {
       color: #ffd700 !important;
   }
   html.dark .ace_content .ace_variable {
       color: #ffd700 !important;
   }
   
   
   /* VALORES (STRING) - VERDE BRILLANTE (#00FF88) */
   html.dark .ace_content .ace_string {
       color: #00ff88 !important;
   }
   div#jsonTreeOutput .jsoneditor-tree div.jsoneditor-value.jsoneditor-string {
       color: #00ff88 !important; 
   }
   
   
   /* ==========================================================
      🛑 CORRECCIÓN DE MODO CLARO (LIGHT MODE) - VERDE OSCURO (#006000) 🛑
      ========================================================== */
   
   /* 1. Panel de Árbol (Derecha) - Strings */
   /* Esta regla ya existía y funciona con la librería JSONEditor */
   .jsoneditor:not(.jsoneditor-theme-dark) div.jsoneditor-value.jsoneditor-string {
       color: #006000 !important; 
   }
   
   /* 2. Panel Izquierdo (Ace Editor) - Strings */
   /* NUEVA REGLA: Anula el tema 'textmate' cuando el modo oscuro NO está activo. */
   html:not(.dark) .ace_editor .ace_string {
       color: #006000 !important;
   }
   
   
   /* ==========================================================
      OTROS COLORES DE SINTAXIS (DARK MODE)
      ========================================================== */
   
   /* Números (Morado) */
   div.jsoneditor-value.jsoneditor-number { color: #AE81FF !important; }
   
   /* Booleanos (Naranja) */
   div.jsoneditor-value.jsoneditor-boolean { color: #ff8048 !important; }
   
   /* Null (Azul) */
   div.jsoneditor-value.jsoneditor-null { color: #49a7fc !important; }
   
   
   /* ==========================================================
      OTROS ELEMENTOS DEL EDITOR
      ========================================================== */
      
   /* Fondo del Editor Tree/Text */
   div.jsoneditor-tree,
   div.jsoneditor textarea.jsoneditor-text {
     background-color: #2a2a2a; 
   }
   
   /* Búsqueda y Highlight */
   table.jsoneditor-search div.jsoneditor-frame { background: #383838; }
   tr.jsoneditor-highlight,
   tr.jsoneditor-selected { background-color: #383838; }
   
   div.jsoneditor-field[contenteditable=true]:focus,
   div.jsoneditor-value[contenteditable=true]:focus,
   div.jsoneditor-field.jsoneditor-highlight,
   div.jsoneditor-value.jsoneditor-highlight {
     background-color: #383838;
     border-color: #383838;
   }
   div.jsoneditor-field.jsoneditor-highlight-active,
   div.jsoneditor-value.jsoneditor-highlight-active {
     background-color: #585858;
     border-color: #585858;
   }
   
   div.jsoneditor-tree button:focus {
     background-color: #383838;
   }