﻿/* ==========================================================================
   ESTILOS MODERNIZADOS OPENGNSYS (COMPACT / HIGH-DENSITY UI)
   ========================================================================== */

body {
    background-color: #f9fafb;
	/*font-family: OpenSans-Light, Verdana, sans-serif, Arial;*/
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    color: #374151;
    margin: 0;
    padding: 5px 10px;
}

/* --- PANTALLA DE ACCESO (LOGIN) --- */
.acceso { font-size: 12px; }
.acceso h1 {
    margin: 40px auto 0px auto;
    padding: 10px 15px;
    width: 570px;
    background: #4b5563;
    font-size: 18px;
    color: #ffffff;
    border-radius: 6px 6px 0 0;
}
.acceso h2 {
    margin: 0px auto;
    padding: 6px 15px;
    width: 570px;
    background: #6b7280;
    font-size: 16px;
    color: #f3f4f6;
}
.acceso form {
    margin: 0px auto;
    width: 600px;
    height: 327px;
    background-color: #ffffff;
    background-image: url('./images/login.jpg');
    background-size: cover;
    border-radius: 0 0 6px 6px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
.acceso fieldset {
    padding-top: 57px;
    margin-left: 350px;
    border: none;
}
.acceso div { margin-top: 12px; height: 25px; }
.acceso label { float: left; font-weight: 500; }
.acceso select { margin-top:5px; }
.acceso input {
    float: right;
    margin-right: 20px;
    width: 130px;
    padding: 4px;
    border: 1px solid #d1d5db;
    border-radius: 3px;
}
.acceso button {
	float: right;
	width: 130px;
    margin: 20px 20px 0px 0px;
    padding: 5px 12px;
    background-color: #3b82f6;
    color: white;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}
.acceso button:hover { background-color: #2563eb; }

/* --- PIE DE PÁGINA --- */
.pie {
    margin: 10px auto;
    padding: 5px;
    width: 580px;
    font-size: 11px;
    color: #6b7280;
}
.pie button { font-size: 11px; padding: 2px 6px; border: 1px solid #d1d5db; background: #fff; border-radius: 3px; cursor: pointer; }
.pie span { float: right; }
.acercade { color: #374151; }

/* --- TIPOGRAFÍA GENERAL --- */
.textos { color: #b91c1c; font-size: 14px; }
.texto_arbol { color: #374151; font-size: 14px; }

table.texto_arbol {
    top: 20px !important;       /* Margen superior */
    left: 10px !important;      /* Margen izquierdo */
    /* calculamos el 100% del frame menos los márgenes para que encaje perfecto */
    width: calc(100% - 20px) !important; 
}
table.texto_arbol td[width="1024px"] {
    width: auto !important;
    white-space: nowrap; /* Mantiene el nombre del equipo/aula en una sola línea */
}

/* ==========================================================================
   ILUSIÓN ÓPTICA DE PANELES (SHADOW OVERLAYS PARA FRAMES)
   ========================================================================== */
body::before {
    content: "";
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    pointer-events: none; /* FUNDAMENTAL: Permite que los clics del ratón traspasen la sombra */
    z-index: 9999;
    /* Sombra superior (simulando que el menú está por encima) 
       y sombra derecha (simulando que el panel derecho está por encima) */
    /*box-shadow: inset -6px 6px 12px -8px rgba(0,0,0,0.5);*/
	/* Sombra superior (simulando menú superior encima) 
       y sombra IZQUIERDA (simulando que el árbol de navegación está por encima) */
    box-shadow: inset 10px 10px 15px -10px rgba(0,0,0,0.4);
}
/* EXCEPCIÓN PARA EL FRAME IZQUIERDO (Árbol de navegación)
   Le quitamos el valor horizontal (0px) para que solo conserve la sombra superior.
   Se detecta automáticamente si el frame es estrecho o si contiene el árbol XML. */
   
@media (max-width: 650px) {
    body::before {
        box-shadow: inset 0px 10px 15px -10px rgba(0,0,0,0.4);
    }
}

body:has(.texto_arbol)::before {
    box-shadow: inset 0px 10px 15px -10px rgba(0,0,0,0.4);
}

/* Clase para desactivar sombras y fondos en páginas anidadas (iframes/modales) */
body.no-sombra::before {
    display: none !important;
}
body.no-sombra {
    background-color: transparent !important;
}

/* Estilos para la ventana modal */
.modal-bg { display: none; position: fixed; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.6); }
.modal-content { background-color: #fefefe; margin: 5% auto; padding: 15px; border: 1px solid #888; width: 80%; max-width: 800px; height: 75%; border-radius: 8px; box-shadow: 0 4px 8px rgba(0,0,0,0.2); position: relative; }
.modal-close { color: #aaa; float: right; font-size: 28px; font-weight: bold; cursor: pointer; line-height: 15px; margin-bottom: 10px; }
.modal-close:hover, .modal-close:focus { color: black; text-decoration: none; }
.modal-iframe { width: 100%; height: calc(100% - 30px); border: none; }

/* --- MENÚS CONTEXTUALES (ARREGLADO PARA JS NATIVO) --- */
.menu_contextual {
    position: absolute; /* Vital para que el JS no lo rompa */
    z-index: 1000;
	border-radius: 6px;
}
.menu_contextual table {
	min-width: 120px; /* Ancho mínimo */
    width: auto !important; /* Permite que el contenido dicte el ancho */
    background-color: #ffffff;
    border: 1px solid #9ca3af;
    border-collapse: collapse;
    box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.4); /* Sombra dura estilo SO */
	border-radius: 6px; /* Suave redondeo moderno */
    margin: 0;
	border-collapse: separate; 
    border-spacing: 0;
	overflow: hidden;
}
.menu_contextual td, .menu_contextual span {
    color: #1f2937;
    font-size: 13px; /* Letra pequeña y compacta */
    padding: 0px 0px;
    cursor: pointer;
	white-space: nowrap;
}
.menu_contextual tr[id]:hover td {
    background-color: #738da9 !important; /* Azul de selección */
    color: #0369a1;
}
.menu_contextual tr[id]:hover span {
    color: #ffffff !important; 
}
/* Evitamos que el cursor cambie a la manita cuando pasamos por el separador */
.menu_contextual tr:not([id]) td {
    cursor: default;
}

/* --- MENÚ PRINCIPAL --- */
.menupral {
    background-color: #f3f4f6;
    font-size: 14px;
    border-collapse: collapse;
}
.menupral td { 
	border: 0px solid #d1d5db; 
	padding: 3px 1px; 
	color: #374151; 
	height: 33px;
	font-weight: 500; 
	overflow:hidden;
	border-radius: 6px 6px 0 0;
}
.menupral td a { color: inherit; align-items: center; height: 100%; padding: 2px 4px; }
.menupral td[onclick]:hover {
	background-color: #738da9 !important; 
	color: #ffffff !important; 
	cursor: pointer;
}
.menupral td.activo {
    background-color: #a1acb9 !important;
    color: #ffffff !important;
}
/* Ajuste micrométrico para los iconos del menú */
.menupral td img {
    vertical-align: bottom;
}
.menupral td img.separator {
    vertical-align: middle;
}
/* Mejora específica para selectores en la barra de menú */
.menupral select.estilodesple {
    margin: 0 5px;
	top:-1px;
    height: 22px; /* Altura fija para que no deforme la barra */
    cursor: pointer;
    background-color: #ffffff;
    vertical-align: middle;
}
/* --- ELEMENTOS DE FORMULARIO (COMPACTOS) --- */
.input_nodo, .cajatexto, .formulariodatos, .estilodesple {
    border: 1px solid #9ca3af;
    color: #1f2937;
    font-size: 12px;
    padding: 2px 4px;
    border-radius: 4px;
    background-color: #ffffff;
}
.input_nodo:focus, .cajatexto:focus, .formulariodatos:focus, .estilodesple:focus {
    outline: none;
    border-color: #3b82f6;
	background-color: #efefef;
}

/* --- CAJAS Y MARCOS --- */
.marcorelieve { border: 1px solid #d1d5db; background-color: #ffffff; }
.marco { border: 1px solid #d1d5db; color: #374151; font-size: 12px; padding: 6px; background: #fff; }
.filtros { border: 1px solid #d1d5db; background-color: #ffffff; padding: 6px; }
.filtros td { font-size: 11px; color: #4b5563; padding: 2px; }

/* --- CABECERAS Y TÍTULOS (REDUCIDOS) --- */
.supercabeceras { color: #ef4444; font-size: 20px; font-weight: 700; }
.sobrecabeceras { color: #4f46e5; font-size: 18px; font-weight: 600; }
.cabeceras {
    color: #374151;
    font-size: 18px;
    font-weight: 600;
    margin: 5px 0 2px 0; /* Menos aire arriba y abajo */
}
.subcabeceras {
    color: #0ea5e9;
    font-size: 16px;
    font-weight: 600;
}
.presentaciones { color: #6b7280; font-size: 14px; }
.notas { color: #9ca3af; font-size: 10px; font-style: italic; }

/* --- TABLAS PRINCIPALES (ALTA DENSIDAD) --- */
/* Añadimos 'table' delante de las clases para no afectar a celdas o enlaces sueltos */
table.tabla_datos, table.tabla_listados, table.tabla_listados_sin, table.tabla_busquedas, table.tabla_meses, table.tabla_reservas, table.tabla_parametros, .tablaprogramacion table {
    border-collapse: collapse;
    margin: 8px auto;
    background-color: #ffffff;
    border: 1px solid #d1d5db;
    box-shadow: 0 3px 8px rgba(0,0,0,0.4);
}

/* Cabeceras de tablas */
table.tabla_datos th, table.tabla_listados th, table.tabla_listados_sin th, table.tabla_busquedas th, table.tabla_meses th, table.tabla_reservas th, table.tabla_parametros th, .tablaprogramacion th {
    background-color: #738da9;
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    padding: 4px 6px;
    text-align: center;
    border-bottom: 1px solid #9ca3af;
    border-right: 1px solid #4b5563;
}

/* Celdas de tablas */
table.tabla_datos td, table.tabla_listados td, table.tabla_listados_sin td, table.tabla_busquedas td, table.tabla_meses td, table.tabla_reservas td, table.tabla_parametros td, .tablaprogramacion td {
    background-color: #ffffff;
    color: #1f2937;
    font-size: 14px;
    padding: 3px 5px;
    /*border-bottom: 1px solid #e5e7eb;
    border-right: 1px solid #f3f4f6;*/
}

/* table.tabla_listados_sin tr:nth-child(even) td */
/* Efecto cebra para leer mejor las filas largas */
table.tabla_datos tr:nth-child(even) td, table.tabla_listados tr:nth-child(even) td {
    background-color: #eef4f9;
    border-bottom: 1px solid #e5e7eb;
    box-shadow: none;
	width: auto !important;
	white-space: nowrap;
}

table#tabla_conf.tabla_listados_sin tr {
	border-bottom: 1px solid #e5e7eb;
	box-shadow: none;
}

/* ==========================================================================
   AJUSTES ESPECÍFICOS PARA EL ÁRBOL XML (PROCEDIMIENTOS Y TAREAS)
   ========================================================================== */
table.tabla_listados_sin {
    width: auto !important; /* Evita que ocupe el 100% del frame */
    min-width: 50%;
    margin: 20px auto; /* Lo centra limpiamente */
}

/* Neutralizamos las mini-tablas internas que dibujan las ramas */
table.tabla_listados_sin table td {
    border: none !important; /* Quita las odiosas líneas horizontales negras/grises */
    padding: 0px 2px !important; /* Elimina la indentación exagerada y junta los elementos */
    background-color: transparent !important;
    box-shadow: none !important; /* Elimina los marcos fantasma alrededor de los nombres */
}

/* Quitamos el efecto cebra dentro del árbol para que el fondo sea limpio */
table.tabla_listados_sin table tr:nth-child(even) td {
    background-color: transparent !important;
}


/* Diferenciación visual elegante para las filas de backup (.ant) */
.tabla_datos tr.fila_backup td {
    color: #999999;          /* Gris un poco más claro para restarle protagonismo */
    font-style: italic;      /* Cursiva para indicar que es una versión anterior */
}

/* Colores de tablas específicas */
.tabla_meses th, .tabla_reservas th { background-color: #738da9; color: white; }
.tabla_busquedas th { background-color: #738da9; color: white; }
.tabla_parametros th { background-color: #738da9; color: white; }
.tablaprogramacion th { background-color: #738da9; }

/* --- ENLACES EN TABLAS --- */
a.tabla_listados_sin:link, a.tabla_listados_sin:visited { color: #002d91; text-decoration: none; }
a.tabla_listados_sin:hover { text-decoration: underline; color: #1d4ed8; }

/* --- OTROS COMPONENTES --- */
.recuadros {    
    background-color: #f0f9ff;
    border: 1px solid #bae6fd;
    color: #0c4a6e;
    padding: 6px;
    font-style: italic;
}

.tablaipes { background-color: #d1fae5; font-size: 10px; padding: 2px; }

.cajacomandos, .salidacomandos {
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 11px;
    padding: 6px;
    border: 1px solid #6b7280;
}
.cajacomandos { background-color: #e6eff7; color: #0f172a; }
.salidacomandos { background-color: #1e293b; color: #10b981; }

.opciones_ejecucion { border: 1px solid #d1d5db; padding: 8px; background-color: #ffffff; font-size: 12px; }

.botonprogramacion {
    background-color: #f3f4f6;
    border: 1px solid #9ca3af;
    color: #1f2937;
    padding: 3px 8px;
    font-size: 11px;
    cursor: pointer;
}
.botonprogramacion:hover { background-color: #e5e7eb; }

.mensajebrowser {
    border: 1px solid #fcd34d;
    background-color: #fffbeb;
    color: #92400e;
    font-size: 12px;
    padding: 8px;
    margin: 10px 0;
}

/* Ayuda enlaces */
.help_menu { text-decoration: none; color: #4b5563; font-weight: 600; }
.help_menu:hover { color: #1d4ed8; }

/* Consejo del día */
.consejo {
    margin: 10px auto;
    text-align: justify;
    padding: 10px 15px;
    max-width: 50em;
    background-color: #eff6ff;
    border-left: 3px solid #3b82f6;
    color: #1e3a8a;
    font-size: 11px;
}
.consejo > div { text-align: center; font-weight: bold; margin-bottom: 5px; }

.editor-container { margin: 15px 0; width: 95%; }
.editor-textarea {
	width: 100%; font-family: 'Courier New', monospace; 
    font-size: 12px; background: #2d2d2d; color: #f8f8f2; 
    padding: 10px; border-radius: 5px; border: 1px solid #111;
    line-height: 1.5; resize: vertical; field-sizing: content;
}
.btn-save {
	font-size: 12px; 
    background: #298570; color: white; border: none; padding: 5px 10px;
    border-radius: 4px; cursor: pointer; font-weight: bold; margin-top: 5px;
}
.btn-save:hover { background: #206152; }
.btn-og-aceptar, .btn-og-cancelar {
    padding: 8px 16px;
    font-family: Arial, sans-serif;
    font-size: 13px;
    font-weight: bold;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    transition: all 0.2s ease;
    margin: 5px;
}

.btn-og-aceptar {
    background-color: #059669; /* Verde OpenGnsys Moderno */
    color: white;
}

.btn-og-aceptar:hover {
    background-color: #047857;
}

.btn-og-cancelar {
    background-color: #f1f5f9; /* Gris neutro */
    color: #475569;
    border: 1px solid #cbd5e1;
}

.btn-og-cancelar:hover {
    background-color: #e2e8f0;
}
/* Ocultar menú de Sincronización */
div[name*="sincroniza"], tr[name*="sincroniza"] {
    display: none !important;
}
/* Ocultar la opción de Particionar y Formatear del menú contextual */
tr[onclick*="Configurar.php"] {
    display: none !important;
}