/* Sistema Interno para la Gestión de Documentos Meritorios · DGOAE UNAM
   Identidad conservada del sistema original: barra superior blanca con logotipo,
   menú lateral azul marino (#081b2c), acento azul institucional (#32426b),
   fondo gris claro y tipografía Lato. */

:root {
	--cn-marino: #081b2c;
	--cn-marino-2: #0f2a42;
	--cn-azul: #32426b;
	--cn-azul-claro: #e8ecf4;
	--cn-menu-texto: #d0d8df;
	--cn-fondo: #eeeeee;
	--cn-borde: #dcdfe4;
	--cn-encabezado: #f7f7f7;
	--cn-ancho-menu: 210px;
	--cn-alto-barra: 64px;
	--bs-body-font-family: 'Lato', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
	--bs-primary: #32426b;
	--bs-primary-rgb: 50, 66, 107;
	--bs-link-color: #32426b;
	--bs-link-color-rgb: 50, 66, 107;
	--bs-link-hover-color: #081b2c;
}

body.cn {
	background: var(--cn-fondo);
	color: #212529;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

/* Botón primario con el azul del sistema */
.btn-primary {
	--bs-btn-bg: var(--cn-azul);
	--bs-btn-border-color: var(--cn-azul);
	--bs-btn-hover-bg: var(--cn-marino-2);
	--bs-btn-hover-border-color: var(--cn-marino-2);
	--bs-btn-active-bg: var(--cn-marino);
	--bs-btn-active-border-color: var(--cn-marino);
	--bs-btn-disabled-bg: var(--cn-azul);
	--bs-btn-disabled-border-color: var(--cn-azul);
}

/* ---------- Barra superior ---------- */
.cn-topbar {
	position: sticky;
	top: 0;
	z-index: 1030;
	height: var(--cn-alto-barra);
	background: #fff;
	border-bottom: 1px solid var(--cn-borde);
	box-shadow: 0 1px 4px rgba(8, 27, 44, .08);
	display: flex;
	align-items: center;
	gap: .75rem;
	padding: 0 1rem;
}
.cn-logo img { height: 44px; width: auto; }
.cn-seccion {
	color: var(--cn-azul);
	font-size: 1.15rem;
	font-weight: 300;
	letter-spacing: .04em;
	text-transform: uppercase;
	border-left: 1px solid var(--cn-borde);
	padding-left: .75rem;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.cn-usuario { color: #000; font-weight: 700; white-space: nowrap; }
.cn-usuario .bi { color: var(--cn-azul); font-size: 1.25rem; vertical-align: -.15em; }
.cn-menu-toggle { color: var(--cn-azul); font-size: 1.6rem; padding: .1rem .4rem; }

/* ---------- Menú lateral ---------- */
.cn-cuerpo { display: flex; flex: 1 0 auto; }
.cn-sidebar { background: var(--cn-marino); }
@media (min-width: 992px) {
	/* offcanvas-lg vuelve transparente el panel en escritorio; se conserva el azul marino */
	.cn-sidebar.offcanvas-lg { background-color: var(--cn-marino) !important; }
	.cn-sidebar {
		width: var(--cn-ancho-menu);
		flex: 0 0 var(--cn-ancho-menu);
		align-self: stretch;
	}
	.cn-sidebar .cn-menu {
		position: sticky;
		top: var(--cn-alto-barra);
		max-height: calc(100vh - var(--cn-alto-barra));
		overflow-y: auto;
	}
}
.cn-sidebar.offcanvas-lg { --bs-offcanvas-width: 260px; --bs-offcanvas-bg: var(--cn-marino); }
.cn-menu { list-style: none; margin: 0; padding: .75rem 0; width: 100%; }
.cn-menu a,
.cn-menu .cn-grupo {
	display: flex;
	align-items: center;
	gap: .55rem;
	color: var(--cn-menu-texto);
	text-decoration: none;
	font-weight: 700;
	font-size: .9rem;
	letter-spacing: .03em;
	padding: .8rem 1rem;
	border-left: 3px solid transparent;
	width: 100%;
	background: none;
	border-top: 0; border-right: 0; border-bottom: 0;
	text-align: left;
}
.cn-menu a:hover,
.cn-menu a:focus-visible,
.cn-menu .cn-grupo:hover { color: #fff; background: rgba(255, 255, 255, .06); }
.cn-menu a.activo { color: #fff; border-left-color: #fff; background: rgba(255, 255, 255, .08); }
.cn-menu .bi { font-size: 1.1rem; }
.cn-menu .cn-grupo .bi-chevron-down { margin-left: auto; font-size: .8rem; transition: transform .2s; }
.cn-menu .cn-grupo[aria-expanded="true"] .bi-chevron-down { transform: rotate(180deg); }
.cn-menu .cn-sub a { font-weight: 400; padding-left: 2.6rem; font-size: .88rem; }

/* ---------- Contenido ---------- */
.cn-main { flex: 1 1 auto; min-width: 0; padding: 1rem; }
@media (min-width: 992px) { .cn-main { padding: 1.25rem 1.5rem; } }
.cn-cabecera { display: block; width: 100%; height: auto; margin-bottom: 1rem; border-radius: .35rem; }

.cn-card {
	background: #fff;
	border: 1px solid var(--cn-borde);
	border-radius: .5rem;
	box-shadow: 0 1px 3px rgba(8, 27, 44, .06);
	margin-bottom: 1.25rem;
}
.cn-card > .card-header {
	background: var(--cn-encabezado);
	color: #000;
	font-weight: 700;
	font-size: .92rem;
	letter-spacing: .03em;
	text-transform: uppercase;
	border-bottom: 1px solid var(--cn-borde);
	padding: .7rem 1rem;
}
.cn-titulo-evento { color: #000; font-weight: 700; text-align: center; font-size: 1.35rem; margin: .25rem 0 1rem; }
.cn-acento { color: var(--cn-azul); font-weight: 700; }
.cn-vacio { text-align: center; color: var(--cn-azul); font-weight: 700; margin: 1rem 0; }
.cn-recomendaciones li { margin-bottom: .35rem; }

/* Tablas */
.cn-tabla { font-size: .82rem; margin-bottom: 0; }
.cn-tabla thead th {
	background: var(--cn-azul-claro);
	color: var(--cn-marino);
	text-transform: uppercase;
	font-size: .74rem;
	letter-spacing: .03em;
	text-align: center;
	white-space: nowrap;
}
.cn-tabla td.cn-acciones { white-space: nowrap; text-align: center; }
.cn-acciones form { display: inline; }
.cn-acciones .btn { padding: .25rem .5rem; }
.cn-total td { background: var(--cn-azul) !important; color: #fff !important; font-weight: 700; }

/* Formularios */
.cn-form .form-label { font-weight: 700; font-size: .9rem; }
.cn-form .input-group-text { background: var(--cn-azul-claro); color: var(--cn-azul); }
.cn-centrado { text-align: center; }
.cn-ayuda { color: var(--cn-azul); line-height: 1; vertical-align: baseline; }
.cn-subtitulo { font-size: 1.05rem; font-weight: 700; color: var(--cn-azul); border-bottom: 1px solid var(--cn-borde); padding-bottom: .35rem; margin: .5rem 0 1rem; }

/* Visor del PDF */
.cn-visor {
	width: 100%;
	max-width: 760px;
	height: 78vh;
	min-height: 520px;
	border: 1px solid var(--cn-borde);
	border-radius: .35rem;
	background: #f4f4f4;
	display: block;
	margin: 0 auto;
}

/* ---------- Páginas públicas ---------- */
.cn-cabecera-publica img { display: block; width: 100%; height: auto; }
.cn-main-publico { flex: 1 0 auto; }
.cn-pie-publico { text-align: center; color: #555; font-size: .85rem; margin-top: 1rem; }
.cn-pie-publico img { display: block; width: 100%; height: auto; margin-bottom: .5rem; }
.cn-publico .cn-card > .card-header { text-align: center; }
.g-recaptcha { display: flex; justify-content: center; margin: 1rem 0; min-height: 78px; }

/* ---------- Pie ---------- */
.cn-pie {
	text-align: center;
	color: #6c757d;
	font-size: .82rem;
	padding: .9rem;
	border-top: 1px solid var(--cn-borde);
	background: #fff;
}

/* Reloj de la página de inicio */
.cn-reloj { font-size: 1.4rem; color: #000; text-align: center; }
.cn-reloj .cn-hora { font-size: 2rem; font-weight: 700; color: var(--cn-azul); font-variant-numeric: tabular-nums; }

@media print {
	.cn-topbar, .cn-sidebar, .cn-pie, .btn { display: none !important; }
}