/*
 * Correcciones de modo oscuro.
 *
 * PROBLEMA
 *   `app-dark.css` (vendor, 319 KB) redefine los colores base del tema oscuro
 *   pero NO redefine las variables `*-subtle` de Bootstrap 5.3. Como las dos
 *   hojas se cargan siempre y `app.css` las define para tema claro, en modo
 *   oscuro quedan heredados los valores claros:
 *
 *     --bs-light-bg-subtle      #fcfcfd   (casi blanco)
 *     --bs-light-text-emphasis  #495057   (gris oscuro)
 *
 *   Resultado: `alert-light` pinta un fondo casi blanco con texto gris sobre la
 *   interfaz oscura, y queda ilegible. Lo mismo con `alert-secondary` y con las
 *   filas `table-light|warning|danger|success|info`, que el modulo de asistencias
 *   usa para resaltar bajas, alumnos en riesgo y los totales de cada fila.
 *
 * SOLUCION
 *   Redefinir solo esas variables bajo `html[data-bs-theme="dark"]`, que es el
 *   selector que ya usa el tema. No se toca el vendor: si manana se actualiza
 *   `app-dark.css`, este archivo sigue aplicando encima.
 *
 *   Los valores se derivan de los colores que el propio tema oscuro declara
 *   (`--bs-body-bg: #151521`, `--bs-body-color: #c2c2d9`), para que los fondos
 *   sutiles sean variaciones del fondo real y no colores inventados.
 */

html[data-bs-theme="dark"] {
	/* Grises: la base de alert-light, alert-secondary y table-light. */
	--bs-light-bg-subtle: #1e1e2d;
	--bs-light-text-emphasis: #c2c2d9;
	--bs-light-border-subtle: #2d2d43;

	--bs-secondary-bg-subtle: #1e1e2d;
	--bs-secondary-text-emphasis: #a9a9c7;
	--bs-secondary-border-subtle: #2d2d43;

	/* Colores de estado: fondos apenas tenidos sobre el oscuro, con el texto
	   en el tono claro del mismo color para que se lea sin estridencia. */
	--bs-success-bg-subtle: #12241c;
	--bs-success-text-emphasis: #75d99b;
	--bs-success-border-subtle: #1c3d2c;

	--bs-danger-bg-subtle: #2a1519;
	--bs-danger-text-emphasis: #f08a94;
	--bs-danger-border-subtle: #4a2028;

	--bs-warning-bg-subtle: #2b2312;
	--bs-warning-text-emphasis: #f5cd7a;
	--bs-warning-border-subtle: #4a3c1a;

	--bs-info-bg-subtle: #10262b;
	--bs-info-text-emphasis: #7cd6e8;
	--bs-info-border-subtle: #1b4048;
}

/*
 * Las filas `table-*` de Bootstrap 5.3 se pintan con `--bs-table-bg-state`, no
 * con las variables de arriba, asi que hay que darles su propio valor. Sin esto,
 * una fila `table-warning` (alumno dado de baja) o `table-danger` (alumno bajo el
 * umbral) queda con fondo claro y texto claro.
 */
html[data-bs-theme="dark"] .table-light > * {
	--bs-table-bg-state: #1e1e2d;
	--bs-table-color-state: #c2c2d9;
}

html[data-bs-theme="dark"] .table-success > * {
	--bs-table-bg-state: #12241c;
	--bs-table-color-state: #a8e6c1;
}

html[data-bs-theme="dark"] .table-danger > * {
	--bs-table-bg-state: #2a1519;
	--bs-table-color-state: #f5b3ba;
}

html[data-bs-theme="dark"] .table-warning > * {
	--bs-table-bg-state: #2b2312;
	--bs-table-color-state: #f5d99b;
}

html[data-bs-theme="dark"] .table-info > * {
	--bs-table-bg-state: #10262b;
	--bs-table-color-state: #a3e2ef;
}

html[data-bs-theme="dark"] .table-secondary > * {
	--bs-table-bg-state: #1e1e2d;
	--bs-table-color-state: #a9a9c7;
}

/*
 * `text-muted` dentro de un alert claro: con el fondo ya corregido el gris del
 * tema sigue siendo demasiado apagado para un texto que explica una regla
 * (el umbral del 80% que decide quien rinde examen). Se sube el contraste.
 */
html[data-bs-theme="dark"] .alert .text-muted,
html[data-bs-theme="dark"] .alert small.text-muted {
	color: #a9a9c7 !important;
}

/*
 * Encabezado fijo de las planillas: `--bs-body-bg` lo resuelve en ambos temas,
 * pero al scrollear las filas pasan por debajo y el borde se pierde.
 */
html[data-bs-theme="dark"] #pl_tabla thead th,
html[data-bs-theme="dark"] #pl_toolbar {
	background: #1e1e2d;
}

/*
 * Separador de grupo dentro de un submenu del sidebar.
 *
 * Lo emite `common/modulos/index.php` cuando un item del menu tiene
 * `enlace = '---'`: no es un link sino una linea divisoria. Se usa en el
 * submenu Valutazioni de /insegnanti para separar las calificaciones
 * tradicionales de las de PLIDA, que son dos esquemas de evaluacion distintos.
 *
 * Va aca y no en `app.css` porque ese archivo es el tema base y se reemplaza al
 * actualizarlo. El color se toma de la variable de Bootstrap para que funcione
 * en modo claro y oscuro sin una regla por tema.
 */
.sidebar-wrapper .menu .submenu .submenu-item.submenu-separador {
	height: 0;
	margin: 0.35rem 2rem;
	padding: 0;
	border-top: 1px solid var(--bs-border-color, rgba(120, 130, 155, .28));
	opacity: .7;
	pointer-events: none;
}

/* ---------------------------------------------------------------------------
 * Variables ESTRUCTURALES de superficie y borde.
 *
 * Mismo problema que las `*-subtle` de arriba, pero con las variables que
 * definen bordes y fondos secundarios: `app-dark.css` tampoco las redefine, asi
 * que en modo oscuro conservan el valor CLARO de `app.css`:
 *
 *     --bs-border-color   #dee2e6   (gris casi blanco)
 *     --bs-secondary-bg   #e9ecef   (gris muy claro)
 *     --bs-tertiary-bg    #f8f9fa   (casi blanco)
 *
 * Sintomas observados en /docentes: el separador entre etapas de la grilla de
 * calificaciones era invisible en oscuro (borde claro sobre fondo claro heredado)
 * y las celdas calculadas y las barras de las estadisticas quedaban con fondo
 * casi blanco.
 *
 * Los valores se derivan de los que el propio tema oscuro declara
 * (`--bs-body-bg: #151521`) y de la superficie que usa para tarjetas y menues
 * (`#1e1e2d`), para no inventar colores nuevos.
 * ------------------------------------------------------------------------ */

html[data-bs-theme="dark"] {
	/* Bordes: visibles sobre #151521 sin llegar a competir con el texto. */
	--bs-border-color: #3f4154;
	--bs-border-color-translucent: rgba(255, 255, 255, .12);

	/* Fondos de superficie, un escalon por encima del fondo del cuerpo. */
	--bs-secondary-bg: #1e1e2d;
	--bs-tertiary-bg: #252537;

	/* Variantes RGB, que Bootstrap usa con rgba(). */
	--bs-secondary-bg-rgb: 30, 30, 45;
	--bs-tertiary-bg-rgb: 37, 37, 55;
}

/* ---------------------------------------------------------------------------
 * Paneles laterales (offcanvas) en tema oscuro.
 *
 * PROBLEMA
 *   app-dark.css redefine las variables del offcanvas bajo
 *   `html[data-bs-theme="dark"] .offcanvas...` pero deja `--bs-offcanvas-bg:
 *   #fff`. Todo panel lateral sale BLANCO sobre la interfaz oscura, con el texto
 *   del tema oscuro (gris claro) encima: los datos secundarios quedan casi
 *   invisibles. Afecta a cualquier offcanvas del sistema (por ejemplo el de
 *   admincp/pages/settings_afip.php y el detalle de debitos Payway).
 *
 * SOLUCION
 *   Mismo selector que el vendor, cargado despues, con la superficie de tarjetas
 *   del propio tema (#1e1e2d) y el borde claro de este archivo.
 * ------------------------------------------------------------------------ */

html[data-bs-theme="dark"] .offcanvas,
html[data-bs-theme="dark"] .offcanvas-xxl,
html[data-bs-theme="dark"] .offcanvas-xl,
html[data-bs-theme="dark"] .offcanvas-lg,
html[data-bs-theme="dark"] .offcanvas-md,
html[data-bs-theme="dark"] .offcanvas-sm {
	--bs-offcanvas-bg: #1e1e2d;
	--bs-offcanvas-color: var(--bs-body-color);
	--bs-offcanvas-border-color: #3f4154;
}
