

/* CSS existente - Estilos generales */
.aui-header .aui-header-secondary .aui-nav{    
   padding-top: 10px;    
}    
  
#header .aui-header .aui-header-logo a:hover{      
 background-color:white;         
}      
  
.contenteditor #header {   
position: relative;   
}  
   
ul.aui-nav > li{    
   padding-top: 10px;    
}    
.aui-header-primary .aui-nav > li {    
   padding-top: 10px;    
}    
    
#logo a {    
    height: 100%;    
}    
    
.aui-header .aui-header-logo img{    
  max-height: 50px;    
}    
    
#DIVsep1N3 {    
  width: 100%;    
  margin:0px;    
  padding: 0px;    
  background-color:#CC0000;    
  height:8px;    
}    
    
.wiki-content a:link, .wiki-content a:visited {
    font-size: 12px; 
    font-weight:bold;
}    
    
body {    
    font-family: Arial, Helvetica, sans-serif;    
}    

.wiki-content,    
.wiki-content p,    
.wiki-content table,    
.wiki-content tr,    
.wiki-content td,    
.wiki-content th,    
.wiki-content ol,    
.wiki-content ul,    
.wiki-content li {    
    font-family: Arial, Helvetica, sans-serif;    
}    
    
#title-text a {    
    font-family: Arial, Helvetica, sans-serif;    
    color: #AA2222;    
    font-weight: bold;    
}    
    
.wiki-content h1,    
.wiki-content h2 {    
    font-family: Arial, Helvetica, sans-serif;    
    color: #CC0000;    
}    
    
.wiki-content h3,    
.wiki-content h4 {    
    font-family: Arial, Helvetica, sans-serif;    
    color: #AE3737;    
}    
    
.wiki-content h5,    
.wiki-content h6 {    
    font-family: Arial, Helvetica, sans-serif;    
    color: #5B5B5B;    
}  

/* ============================================= */
/* CSS PARA MODO OSCURO - CONFLUENCE 9.2.4      */
/* ============================================= */

/* Variables principales para modo oscuro */
html[data-color-mode="dark"],
html[data-theme="dark"],
[data-theme="dark"] {
    --ds-surface: #ffffff !important;
    --ds-surface-overlay: #ffffff !important;
    --ds-surface-raised: #ffffff !important;
    --ds-surface-sunken: #f8f9fa !important;
    --ds-background-accent-lime-subtlest: #ffffff !important;
    --ds-background-accent-red-subtlest: #ffffff !important;
    --ds-background-accent-orange-subtlest: #ffffff !important;
    --ds-background-accent-yellow-subtlest: #ffffff !important;
    --ds-background-accent-green-subtlest: #ffffff !important;
    --ds-background-accent-purple-subtlest: #ffffff !important;
    --ds-background-accent-teal-subtlest: #ffffff !important;
    --ds-background-accent-blue-subtlest: #ffffff !important;
    --ds-background-accent-gray-subtlest: #ffffff !important;
    --ds-background-brand-subtlest: #ffffff !important;
    --ds-background-danger-subtlest: #ffffff !important;
    --ds-background-warning-subtlest: #ffffff !important;
    --ds-background-success-subtlest: #ffffff !important;
    --ds-background-information-subtlest: #ffffff !important;
    --ds-background-discovery-subtlest: #ffffff !important;
    --ds-background-neutral: #ffffff !important;
    --ds-background-neutral-subtle: #f8f9fa !important;
    --ds-background-neutral-bold: #ffffff !important;
}

/* Contenedores principales */
html[data-color-mode="dark"] body,
html[data-theme="dark"] body,
[data-theme="dark"] body {
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* Área principal de contenido */
html[data-color-mode="dark"] #main,
html[data-color-mode="dark"] #main-content,
html[data-color-mode="dark"] .aui-page-panel,
html[data-color-mode="dark"] .aui-page-panel-inner,
html[data-color-mode="dark"] .aui-page-panel-content,
html[data-theme="dark"] #main,
html[data-theme="dark"] #main-content,
html[data-theme="dark"] .aui-page-panel,
html[data-theme="dark"] .aui-page-panel-inner,
html[data-theme="dark"] .aui-page-panel-content,
[data-theme="dark"] #main,
[data-theme="dark"] #main-content,
[data-theme="dark"] .aui-page-panel,
[data-theme="dark"] .aui-page-panel-inner,
[data-theme="dark"] .aui-page-panel-content {
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* Contenido wiki - MANTENER colores personalizados de encabezados */
html[data-color-mode="dark"] .wiki-content,
html[data-theme="dark"] .wiki-content,
[data-theme="dark"] .wiki-content {
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* Párrafos y texto general en modo oscuro */
html[data-color-mode="dark"] .wiki-content p,
html[data-color-mode="dark"] .wiki-content div,
html[data-color-mode="dark"] .wiki-content span,
html[data-color-mode="dark"] .wiki-content li,
html[data-theme="dark"] .wiki-content p,
html[data-theme="dark"] .wiki-content div,
html[data-theme="dark"] .wiki-content span,
html[data-theme="dark"] .wiki-content li,
[data-theme="dark"] .wiki-content p,
[data-theme="dark"] .wiki-content div,
[data-theme="dark"] .wiki-content span,
[data-theme="dark"] .wiki-content li {
    color: #000000 !important;
}

/* Encabezados - PRESERVAR colores personalizados existentes */
html[data-color-mode="dark"] .wiki-content h1,
html[data-color-mode="dark"] .wiki-content h2,
html[data-theme="dark"] .wiki-content h1,
html[data-theme="dark"] .wiki-content h2,
[data-theme="dark"] .wiki-content h1,
[data-theme="dark"] .wiki-content h2 {
    color: #CC0000 !important;
}

html[data-color-mode="dark"] .wiki-content h3,
html[data-color-mode="dark"] .wiki-content h4,
html[data-theme="dark"] .wiki-content h3,
html[data-theme="dark"] .wiki-content h4,
[data-theme="dark"] .wiki-content h3,
[data-theme="dark"] .wiki-content h4 {
    color: #AE3737 !important;
}

html[data-color-mode="dark"] .wiki-content h5,
html[data-color-mode="dark"] .wiki-content h6,
html[data-theme="dark"] .wiki-content h5,
html[data-theme="dark"] .wiki-content h6,
[data-theme="dark"] .wiki-content h5,
[data-theme="dark"] .wiki-content h6 {
    color: #5B5B5B !important;
}

/* Tablas */
html[data-color-mode="dark"] .confluenceTable,
html[data-color-mode="dark"] .confluenceTable td,
html[data-color-mode="dark"] .confluenceTable th,
html[data-color-mode="dark"] .wiki-content table,
html[data-color-mode="dark"] .wiki-content td,
html[data-color-mode="dark"] .wiki-content th,
html[data-theme="dark"] .confluenceTable,
html[data-theme="dark"] .confluenceTable td,
html[data-theme="dark"] .confluenceTable th,
html[data-theme="dark"] .wiki-content table,
html[data-theme="dark"] .wiki-content td,
html[data-theme="dark"] .wiki-content th,
[data-theme="dark"] .confluenceTable,
[data-theme="dark"] .confluenceTable td,
[data-theme="dark"] .confluenceTable th,
[data-theme="dark"] .wiki-content table,
[data-theme="dark"] .wiki-content td,
[data-theme="dark"] .wiki-content th {
    background-color: #ffffff !important;
    color: #000000 !important;
    border-color: #e0e0e0 !important;
}

/* Enlaces - PRESERVAR estilo personalizado */
html[data-color-mode="dark"] .wiki-content a:link,
html[data-color-mode="dark"] .wiki-content a:visited,
html[data-theme="dark"] .wiki-content a:link,
html[data-theme="dark"] .wiki-content a:visited,
[data-theme="dark"] .wiki-content a:link,
[data-theme="dark"] .wiki-content a:visited {
    font-size: 12px !important;
    font-weight: bold !important;
    color: #1976d2 !important;
}

html[data-color-mode="dark"] .wiki-content a:hover,
html[data-theme="dark"] .wiki-content a:hover,
[data-theme="dark"] .wiki-content a:hover {
    color: #1565c0 !important;   
}

/* Código */
html[data-color-mode="dark"] .wiki-content code,
html[data-color-mode="dark"] .wiki-content pre,
html[data-theme="dark"] .wiki-content code,
html[data-theme="dark"] .wiki-content pre,
[data-theme="dark"] .wiki-content code,
[data-theme="dark"] .wiki-content pre {
    background-color: #f5f5f5 !important;
    color: #000000 !important;
    border: 1px solid #e0e0e0 !important;
}

/* Paneles informativos */
html[data-color-mode="dark"] .confluence-information-macro,
html[data-color-mode="dark"] .aui-message,
html[data-color-mode="dark"] .panel,
html[data-theme="dark"] .confluence-information-macro,
html[data-theme="dark"] .aui-message,
html[data-theme="dark"] .panel,
[data-theme="dark"] .confluence-information-macro,
[data-theme="dark"] .aui-message,
[data-theme="dark"] .panel {
    background-color: #f8f9fa !important;
    color: #000000 !important;
    border-color: #e0e0e0 !important;
}

/* Formularios */
html[data-color-mode="dark"] input[type="text"],
html[data-color-mode="dark"] input[type="email"],
html[data-color-mode="dark"] input[type="password"],
html[data-color-mode="dark"] textarea,
html[data-color-mode="dark"] select,
html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="password"],
html[data-theme="dark"] textarea,
html[data-theme="dark"] select,
[data-theme="dark"] input[type="text"],
[data-theme="dark"] input[type="email"],
[data-theme="dark"] input[type="password"],
[data-theme="dark"] textarea,
[data-theme="dark"] select {
    background-color: #ffffff !important;
    color: #000000 !important;
    border-color: #e0e0e0 !important;
}

/* Editor de contenido */
html[data-color-mode="dark"] .editor-content,
html[data-color-mode="dark"] .tinymce-editor,
html[data-color-mode="dark"] .ak-editor-content-area,
html[data-theme="dark"] .editor-content,
html[data-theme="dark"] .tinymce-editor,
html[data-theme="dark"] .ak-editor-content-area,
[data-theme="dark"] .editor-content,
[data-theme="dark"] .tinymce-editor,
[data-theme="dark"] .ak-editor-content-area {
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* Comentarios */
html[data-color-mode="dark"] .comment-content,
html[data-color-mode="dark"] .comment-body,
html[data-theme="dark"] .comment-content,
html[data-theme="dark"] .comment-body,
[data-theme="dark"] .comment-content,
[data-theme="dark"] .comment-body {
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* Macros */
html[data-color-mode="dark"] .wysiwyg-macro,
html[data-color-mode="dark"] .confluence-macro,
html[data-theme="dark"] .wysiwyg-macro,
html[data-theme="dark"] .confluence-macro,
[data-theme="dark"] .wysiwyg-macro,
[data-theme="dark"] .confluence-macro {
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* Preservar título personalizado */
html[data-color-mode="dark"] #title-text a,
html[data-theme="dark"] #title-text a,
[data-theme="dark"] #title-text a {
    color: #AA2222 !important;
    font-weight: bold !important;
}

/* Asegurar que los contenedores con sidebar también funcionen */
html[data-color-mode="dark"] .ia-fixed-sidebar #main,
html[data-theme="dark"] .ia-fixed-sidebar #main,
[data-theme="dark"] .ia-fixed-sidebar #main {
    background-color: #ffffff !important;
}

/* Override para elementos con clases específicas de Confluence 9.x */
html[data-color-mode="dark"] .css-1dbjc4n,
html[data-color-mode="dark"] .css-1rynq56,
html[data-theme="dark"] .css-1dbjc4n,
html[data-theme="dark"] .css-1rynq56,
[data-theme="dark"] .css-1dbjc4n,
[data-theme="dark"] .css-1rynq56 {
    background-color: #ffffff !important;
}

/* Para elementos dinámicos que se cargan después */
html[data-color-mode="dark"] [class*="content"],
html[data-theme="dark"] [class*="content"],
[data-theme="dark"] [class*="content"] {
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* ============================================= */
/* MENÚS Y PANEL LATERAL IZQUIERDO              */
/* ============================================= */

/* Panel lateral izquierdo (sidebar) */
html[data-color-mode="dark"] #navigation,
html[data-color-mode="dark"] .ia-splitter-left,
html[data-color-mode="dark"] .acs-side-bar,
html[data-color-mode="dark"] .confluence-sidebar,
html[data-color-mode="dark"] .space-navigation,
html[data-theme="dark"] #navigation,
html[data-theme="dark"] .ia-splitter-left,
html[data-theme="dark"] .acs-side-bar,
html[data-theme="dark"] .confluence-sidebar,
html[data-theme="dark"] .space-navigation,
[data-theme="dark"] #navigation,
[data-theme="dark"] .ia-splitter-left,
[data-theme="dark"] .acs-side-bar,
[data-theme="dark"] .confluence-sidebar,
[data-theme="dark"] .space-navigation {
    background-color: #f8f9fa !important;
    color: #000000 !important;
}

/* Enlaces del panel lateral */
html[data-color-mode="dark"] #navigation a,
html[data-color-mode="dark"] .ia-splitter-left a,
html[data-color-mode="dark"] .acs-side-bar a,
html[data-color-mode="dark"] .confluence-sidebar a,
html[data-color-mode="dark"] .space-navigation a,
html[data-theme="dark"] #navigation a,
html[data-theme="dark"] .ia-splitter-left a,
html[data-theme="dark"] .acs-side-bar a,
html[data-theme="dark"] .confluence-sidebar a,
html[data-theme="dark"] .space-navigation a,
[data-theme="dark"] #navigation a,
[data-theme="dark"] .ia-splitter-left a,
[data-theme="dark"] .acs-side-bar a,
[data-theme="dark"] .confluence-sidebar a,
[data-theme="dark"] .space-navigation a {
    color: #000000 !important;
}

/* Enlaces hover en panel lateral */
html[data-color-mode="dark"] #navigation a:hover,
html[data-color-mode="dark"] .ia-splitter-left a:hover,
html[data-color-mode="dark"] .acs-side-bar a:hover,
html[data-color-mode="dark"] .confluence-sidebar a:hover,
html[data-color-mode="dark"] .space-navigation a:hover,
html[data-theme="dark"] #navigation a:hover,
html[data-theme="dark"] .ia-splitter-left a:hover,
html[data-theme="dark"] .acs-side-bar a:hover,
html[data-theme="dark"] .confluence-sidebar a:hover,
html[data-theme="dark"] .space-navigation a:hover,
[data-theme="dark"] #navigation a:hover,
[data-theme="dark"] .ia-splitter-left a:hover,
[data-theme="dark"] .acs-side-bar a:hover,
[data-theme="dark"] .confluence-sidebar a:hover,
[data-theme="dark"] .space-navigation a:hover {
    color: #1976d2 !important;
    background-color: #e3f2fd !important;
}

/* Texto del panel lateral */
html[data-color-mode="dark"] #navigation span,
html[data-color-mode="dark"] #navigation div,
html[data-color-mode="dark"] #navigation li,
html[data-color-mode="dark"] .ia-splitter-left span,
html[data-color-mode="dark"] .ia-splitter-left div,
html[data-color-mode="dark"] .ia-splitter-left li,
html[data-theme="dark"] #navigation span,
html[data-theme="dark"] #navigation div,
html[data-theme="dark"] #navigation li,
html[data-theme="dark"] .ia-splitter-left span,
html[data-theme="dark"] .ia-splitter-left div,
html[data-theme="dark"] .ia-splitter-left li,
[data-theme="dark"] #navigation span,
[data-theme="dark"] #navigation div,
[data-theme="dark"] #navigation li,
[data-theme="dark"] .ia-splitter-left span,
[data-theme="dark"] .ia-splitter-left div,
[data-theme="dark"] .ia-splitter-left li {
    color: #000000 !important;
}

/* Menú superior */
html[data-color-mode="dark"] .aui-header,
html[data-color-mode="dark"] .aui-header-primary,
html[data-color-mode="dark"] .aui-header-secondary,
html[data-theme="dark"] .aui-header,
html[data-theme="dark"] .aui-header-primary,
html[data-theme="dark"] .aui-header-secondary,
[data-theme="dark"] .aui-header,
[data-theme="dark"] .aui-header-primary,
[data-theme="dark"] .aui-header-secondary {
    background-color: #f8f9fa !important;
    color: #000000 !important;  
}

/* Enlaces del menú superior */
html[data-color-mode="dark"] .aui-header a,
html[data-color-mode="dark"] .aui-nav a,
html[data-theme="dark"] .aui-header a,
html[data-theme="dark"] .aui-nav a,
[data-theme="dark"] .aui-header a,
[data-theme="dark"] .aui-nav a {
    color: #000000 !important;
}

/* Dropdowns y menús desplegables */
html[data-color-mode="dark"] .aui-dropdown2,
html[data-color-mode="dark"] .aui-dropdown2-in-header,
html[data-color-mode="dark"] .aui-list,
html[data-color-mode="dark"] .aui-list-item,
html[data-theme="dark"] .aui-dropdown2,
html[data-theme="dark"] .aui-dropdown2-in-header,
html[data-theme="dark"] .aui-list,
html[data-theme="dark"] .aui-list-item,
[data-theme="dark"] .aui-dropdown2,
[data-theme="dark"] .aui-dropdown2-in-header,
[data-theme="dark"] .aui-list,
[data-theme="dark"] .aui-list-item {
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* Enlaces en dropdowns */
html[data-color-mode="dark"] .aui-dropdown2 a,
html[data-color-mode="dark"] .aui-list a,
html[data-color-mode="dark"] .aui-list-item a,
html[data-theme="dark"] .aui-dropdown2 a,
html[data-theme="dark"] .aui-list a,
html[data-theme="dark"] .aui-list-item a,
[data-theme="dark"] .aui-dropdown2 a,
[data-theme="dark"] .aui-list a,
[data-theme="dark"] .aui-list-item a {
    color: #000000 !important;
}

/* Breadcrumbs */
html[data-color-mode="dark"] .aui-nav-breadcrumbs,
html[data-color-mode="dark"] .aui-nav-breadcrumbs li,
html[data-color-mode="dark"] .aui-nav-breadcrumbs a,
html[data-theme="dark"] .aui-nav-breadcrumbs,
html[data-theme="dark"] .aui-nav-breadcrumbs li,
html[data-theme="dark"] .aui-nav-breadcrumbs a,
[data-theme="dark"] .aui-nav-breadcrumbs,
[data-theme="dark"] .aui-nav-breadcrumbs li,
[data-theme="dark"] .aui-nav-breadcrumbs a {
    color: #000000 !important;
}

/* Árbol de páginas en el panel lateral */
html[data-color-mode="dark"] .plugin_pagetree,
html[data-color-mode="dark"] .plugin_pagetree a,
html[data-color-mode="dark"] .plugin_pagetree li,
html[data-color-mode="dark"] .plugin_pagetree span,
html[data-theme="dark"] .plugin_pagetree,
html[data-theme="dark"] .plugin_pagetree a,
html[data-theme="dark"] .plugin_pagetree li,
html[data-theme="dark"] .plugin_pagetree span,
[data-theme="dark"] .plugin_pagetree,
[data-theme="dark"] .plugin_pagetree a,
[data-theme="dark"] .plugin_pagetree li,
[data-theme="dark"] .plugin_pagetree span {
    color: #000000 !important;
    background-color: transparent !important;
}

/* Menú de usuario */
html[data-color-mode="dark"] #user-menu-link,
html[data-color-mode="dark"] .aui-avatar,
html[data-theme="dark"] #user-menu-link,
html[data-theme="dark"] .aui-avatar,
[data-theme="dark"] #user-menu-link,
[data-theme="dark"] .aui-avatar {
    color: #000000 !important;
}

/* Búsqueda en header */
html[data-color-mode="dark"] #quick-search-query,
html[data-color-mode="dark"] .quick-search-query,
html[data-theme="dark"] #quick-search-query,
html[data-theme="dark"] .quick-search-query,
[data-theme="dark"] #quick-search-query,
[data-theme="dark"] .quick-search-query {
    background-color: #ffffff !important;
    color: #000000 !important;
    border-color: #e0e0e0 !important;
}
