@import url("https://fonts.googleapis.com/css2?family=Figtree:wght@400;500;600;700&display=swap");
/* ==========================================================================
   Tema GESCOL (Bootstrap 5) - se carga despues de bootstrap.min.css y estilo.css.
   1) Variables  2) Estructura principal (principal.tpl)  3) Paginas legadas
   (clases de estilo.css: curvar, tabla-alycar, grilla-tab, boton...)  4) Responsivo
   Los estilos en linea de las paginas antiguas obligan a usar !important.
   ========================================================================== */

:root {
	--gc-navy: #14304A;
	--gc-acento: #1F5F8B;
	--gc-acento-hover: #16476A;
	--gc-fondo: #F4F5F2;
	--gc-tinta: #1B2430;
	--gc-tenue: #5B6573;
	--gc-tenue-2: #4A5462;
	--gc-borde: #E2E4DF;
	--gc-linea: #ECEEE9;
	--gc-input: #CDD1CA;
	--gc-gris-suave: #F6F7F4;
	--gc-azul-suave: #EEF4F9;
	--gc-rojo: #B42318;
	--gc-verde: #1E6B45;
	--gc-fuente: 'Figtree', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;

	--bs-primary: var(--gc-acento);
	--bs-primary-rgb: 31, 95, 139;
	--bs-link-color: var(--gc-acento);
	--bs-link-color-rgb: 31, 95, 139;
	--bs-link-hover-color: var(--gc-acento-hover);
	--bs-body-font-family: var(--gc-fuente);
	--bs-body-color: var(--gc-tinta);
	--bs-border-color: var(--gc-borde);
}

.btn-primary {
	--bs-btn-bg: var(--gc-acento);
	--bs-btn-border-color: var(--gc-acento);
	--bs-btn-hover-bg: var(--gc-acento-hover);
	--bs-btn-hover-border-color: var(--gc-acento-hover);
	--bs-btn-active-bg: var(--gc-acento-hover);
	--bs-btn-active-border-color: var(--gc-acento-hover);
}


/* ==========================================================================
   2) Estructura principal: lateral + barra superior + iframe de contenido
   ========================================================================== */
html, body.gc-shell { height: 100%; }
body.gc-shell {
	margin: 0;
	display: flex;
	background: var(--gc-fondo);
	color: var(--gc-tinta);
	font-family: var(--gc-fuente);
	font-size: 15px;
	text-align: left;
	overflow: hidden;
}

.gc-sidebar {
	--bs-offcanvas-width: 272px;
	--bs-offcanvas-bg: var(--gc-navy);
	--bs-offcanvas-color: #DCE6EF;
	width: 260px;
	flex-shrink: 0;
	color: #DCE6EF;
}
/* bootstrap deja .offcanvas-lg transparente (!important) en pantallas grandes */
aside.gc-sidebar { background-color: var(--gc-navy) !important; }
.gc-sidebar .offcanvas-header { color: #fff; font-weight: 600; }
.gc-sidebar .offcanvas-body { overflow-y: auto; }

.gc-logo {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	border-radius: 12px;
	padding: 10px 14px;
}
.gc-logo img { width: 100%; max-width: 190px; height: auto; }

.gc-menu { display: flex; flex-direction: column; gap: 2px; }
.gc-item {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	min-height: 44px;
	padding: 0 12px;
	border: 0;
	border-radius: 8px;
	background: transparent;
	color: #DCE6EF;
	font-size: 15px;
	text-align: left;
	text-decoration: none;
}
.gc-item:hover, .gc-item:focus-visible { background: rgba(255,255,255,0.07); color: #fff; }
.gc-item.active, .gc-grupo.abierto > .gc-item { color: #fff; font-weight: 600; }
.gc-item.active { background: rgba(255,255,255,0.12); }
.gc-item .gc-ico { width: 20px; height: 20px; flex-shrink: 0; }
.gc-item .gc-flecha {
	margin-left: auto;
	width: 8px; height: 8px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform .15s;
	opacity: .7;
}
.gc-item[aria-expanded="true"] .gc-flecha { transform: rotate(-135deg); }
.gc-sub {
	display: flex;
	align-items: center;
	min-height: 38px;
	padding: 6px 12px 6px 44px;
	border-radius: 8px;
	color: #C9D6E2;
	font-size: 14px;
	line-height: 1.3;
	text-decoration: none;
}
.gc-sub:hover, .gc-sub:focus-visible { background: rgba(255,255,255,0.07); color: #fff; }
.gc-sub.active { background: rgba(255,255,255,0.12); color: #fff; font-weight: 600; }
.gc-sub.gc-sub2 { padding-left: 60px; font-size: 13px; min-height: 34px; }
.gc-sub.gc-sub2::before { content: ""; width: 5px; height: 5px; margin-right: 8px; border-radius: 50%; background: currentColor; opacity: .6; flex-shrink: 0; }

.gc-anio {
	padding: 12px;
	border-radius: 10px;
	background: rgba(255,255,255,0.06);
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.gc-anio span { font-size: 12px; color: #A9BCCD; }
.gc-anio strong { font-size: 15px; color: #fff; }

.gc-main { flex-grow: 1; min-width: 0; display: flex; flex-direction: column; height: 100vh; height: 100dvh; }
.gc-topbar {
	height: 64px;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 0 24px;
	background: #fff;
	border-bottom: 1px solid var(--gc-borde);
}
.gc-burger {
	width: 44px; height: 44px;
	display: inline-flex; align-items: center; justify-content: center;
	border: 1px solid var(--gc-borde);
	border-radius: 8px;
	color: var(--gc-navy);
}
.gc-migas { min-width: 0; }
.gc-migas .breadcrumb { flex-wrap: nowrap; font-size: 14px; }
.gc-migas .breadcrumb-item { white-space: nowrap; color: var(--gc-tenue); }
.gc-migas .breadcrumb-item a { color: var(--gc-tenue); text-decoration: none; }
.gc-migas .breadcrumb-item.active { color: var(--gc-tinta); font-weight: 600; overflow: hidden; text-overflow: ellipsis; }
.gc-usuario {
	display: inline-flex; align-items: center; gap: 10px;
	border: 0; background: transparent;
	color: var(--gc-tinta); font-size: 14px; font-weight: 600;
	padding: 4px;
}
.gc-avatar {
	width: 40px; height: 40px;
	border-radius: 50%;
	background: #E3ECF3; color: var(--gc-navy);
	display: inline-flex; align-items: center; justify-content: center;
	font-weight: 700; font-size: 14px;
}
.gc-contenido { flex-grow: 1; min-height: 0; }
.gc-contenido iframe { display: block; width: 100%; height: 100%; border: 0; background: var(--gc-fondo); }

@media (min-width: 992px) {
	.gc-sidebar .offcanvas-body { height: 100vh; }
}
@media (max-width: 991.98px) {
	.gc-topbar { padding: 0 12px; }
	.gc-migas .breadcrumb-item:not(.active) { display: none; }
	.gc-migas .breadcrumb-item.active::before { display: none; }
}

/* ==========================================================================
   3) Paginas legadas (se cargan dentro del iframe "principal")
   ========================================================================== */
body:not(.gc-shell) {
	background: var(--gc-fondo) !important;
	color: var(--gc-tinta);
	font-family: var(--gc-fuente);
	font-size: 14px;
	line-height: 1.4;
}
a { color: var(--gc-acento); }
a:hover { color: var(--gc-acento-hover); }

#divcontenedor { margin: 0 !important; padding: 20px !important; }

/* tarjeta contenedora de cada pagina */
table.curvar {
	background: #fff !important;
	border: 1px solid var(--gc-borde) !important;
	border-radius: 14px !important;
	border-collapse: separate !important;
	box-shadow: 0 1px 2px rgba(20,48,74,0.05);
	padding: 12px;
}

.form-titulo, .sac-titulo {
	font-family: var(--gc-fuente);
	font-size: 24px;
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 1.2;
	color: var(--gc-tinta);
}
.form-info, .sac-subtitulo {
	background: var(--gc-azul-suave);
	border: 1px solid #DCE6EF;
	border-radius: 10px;
	color: #33404F;
	font-size: 13px;
}
.requerido, .obligatorio { color: var(--gc-rojo); }
.comentario { color: var(--gc-tenue); font-size: 13px; }

/* formularios en tabla (label | valor) */
table.tabla-alycar {
	background: #fff;
	border: 1px solid var(--gc-borde) !important;
	margin-bottom: 12px;
}
.tabla-alycar td { border-color: var(--gc-linea) !important; }
.tabla-alycar .tabla-alycar-label,
.tabla-alycar .tabla-alycar-label-peq,
.tabla-alycar .tabla-alycar-menu-label,
.tabla-alycar .tabla-alycar-label-total {
	background: var(--gc-gris-suave);
	color: #33404F;
	font-size: 13px;
	font-weight: 600;
	padding: 10px 14px;
	vertical-align: middle;
}
.tabla-alycar .tabla-alycar-label-total { font-size: 15px; }
.tabla-alycar .tabla-alycar-texto,
.tabla-alycar .tabla-alycar-texto-peq,
.tabla-alycar .tabla-alycar-texto-slinea,
.tabla-alycar .tabla-alycar-texto-derecha {
	color: var(--gc-tinta);
	font-size: 14px;
	font-weight: 500;
	padding: 8px 12px;
	vertical-align: middle;
}
.tabla-alycar .tabla-alycar-fila-botones,
.tabla-alycar .tabla-alycar-fila-botones-der,
.tabla-alycar .tabla-alycar-fila-botones-centrado {
	background: #FAFAF8;
	padding: 12px 14px;
}
.tabla-alycar .tabla-alycar-fila-informa-requerida-contrato,
.tabla-alycar .tabla-alycar-fila-informa-requerida-contrato-cabecera,
.tabla-alycar-menu .tabla-alycar-fila-informa-requerida-contrato-cabecera {
	background: var(--gc-azul-suave);
	color: var(--gc-navy);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 10px 14px;
}
.tabla-alycar-input-yellow { background: #FFF6D6 !important; border-color: #D9A400 !important; }

/* grillas de listado */
table.grilla-tab {
	background: #fff;
	border: 1px solid var(--gc-borde) !important;
	margin-bottom: 12px;
}
.grilla-tab .grilla-tab-fila-titulo,
.grilla-tab .grilla-tab-fila-titulo-pequenio,
.grilla-tab .grilla-tab-fila-titulo-rev,
.grilla-tab .grilla-tab-fila-titulo-rev-peq,
.grilla-tab .grilla-tab-fila-titulo-det {
	background: var(--gc-gris-suave);
	color: var(--gc-tenue-2);
	font-size: 13px;
	font-weight: 600;
	border: 0 !important;
	border-bottom: 1px solid var(--gc-linea) !important;
	padding: 10px 12px;
	vertical-align: middle;
}
.grilla-tab .grilla-tab-fila-campo,
.grilla-tab .grilla-tab-fila-campo-btn,
.grilla-tab .grilla-tab-fila-campo-rev-peq {
	color: var(--gc-tinta);
	font-size: 14px;
	border: 0 !important;
	border-bottom: 1px solid var(--gc-linea) !important;
	padding: 10px 12px;
	vertical-align: middle;
}
.grilla-tab .grilla-tab-fila-titulo-pequenio,
.grilla-tab .grilla-tab-fila-titulo-rev-peq { font-size: 12px; padding: 6px 8px; }
.grilla-tab .grilla-tab-fila-campo-pequenio,
.grilla-tab .grilla-tab-fila-campo-det {
	color: var(--gc-tinta);
	font-size: 12px;
	border: 0 !important;
	border-bottom: 1px solid var(--gc-linea) !important;
	padding: 6px 8px;
}
.grilla-tab tr:not([bgcolor]):not([style*="background"]):hover > td.grilla-tab-fila-campo:not([bgcolor]):not([style*="background"]) {
	background: #F4F7FA;
}
.grilla-tab .grilla-tab-fila-campo-seleccionado { background: #FFF6D6; border-color: var(--gc-linea); }

/* campos (por elemento: ValidaFormularioMantenedor() borra el className de los campos) */
body:not(.gc-shell) input:not([type]),
body:not(.gc-shell) input[type="text"],
body:not(.gc-shell) input[type="password"],
body:not(.gc-shell) input[type="email"],
body:not(.gc-shell) input[type="number"],
body:not(.gc-shell) input[type="date"],
body:not(.gc-shell) input[type="tel"],
body:not(.gc-shell) input[type="search"],
body:not(.gc-shell) select,
body:not(.gc-shell) textarea {
	min-height: 36px;
	padding: 6px 10px;
	border: 1px solid var(--gc-input);
	border-radius: 8px;
	background-color: #fff;
	color: var(--gc-tinta);
	font-family: var(--gc-fuente);
	font-size: 14px;
	max-width: 100%;
	transition: border-color .15s, box-shadow .15s;
}
body:not(.gc-shell) select[multiple], body:not(.gc-shell) select[size] { min-height: 0; }
body:not(.gc-shell) input[readonly], body:not(.gc-shell) input[disabled],
body:not(.gc-shell) select[disabled], body:not(.gc-shell) textarea[readonly] {
	background-color: var(--gc-gris-suave);
	color: #33404F;
}
body:not(.gc-shell) input:focus, body:not(.gc-shell) select:focus, body:not(.gc-shell) textarea:focus {
	outline: none;
	border-color: var(--gc-acento);
	box-shadow: 0 0 0 3px rgba(31,95,139,0.18);
}
body:not(.gc-shell) input[type="checkbox"], body:not(.gc-shell) input[type="radio"] {
	width: 18px; height: 18px;
	accent-color: var(--gc-acento);
	vertical-align: middle;
}

/* botones */
.boton, .botondestaca,
body:not(.gc-shell) input[type="button"],
body:not(.gc-shell) input[type="submit"],
body:not(.gc-shell) input[type="reset"],
body:not(.gc-shell) button:not(.btn):not(.btn-close):not([class*="ui-"]):not(.gc-btn-ico) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	height: auto;
	min-height: 36px;
	padding: 6px 16px;
	margin: 2px;
	border: 1px solid var(--gc-input);
	border-radius: 8px;
	background: #fff;
	color: var(--gc-tinta);
	font-family: var(--gc-fuente);
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color .15s, border-color .15s;
}
.boton:hover,
body:not(.gc-shell) input[type="button"]:hover,
body:not(.gc-shell) input[type="submit"]:hover,
body:not(.gc-shell) button:not(.btn):not(.btn-close):not([class*="ui-"]):not(.gc-btn-ico):hover {
	background: #F4F7FA;
	border-color: var(--gc-acento);
}
/* accion principal: botones de grabar/guardar/buscar/ingresar */
.botondestaca,
body:not(.gc-shell) input[type="submit"],
body:not(.gc-shell) input[type="button"][value*="Grabar" i],
body:not(.gc-shell) input[type="button"][value*="Guardar" i],
body:not(.gc-shell) input[type="button"][value*="Buscar" i],
body:not(.gc-shell) input[type="button"][value*="Ingresar" i],
body:not(.gc-shell) input[type="button"][value*="Aceptar" i] {
	background: var(--gc-acento);
	border-color: var(--gc-acento);
	color: #fff;
}
.botondestaca:hover,
body:not(.gc-shell) input[type="submit"]:hover,
body:not(.gc-shell) input[type="button"][value*="Grabar" i]:hover,
body:not(.gc-shell) input[type="button"][value*="Guardar" i]:hover,
body:not(.gc-shell) input[type="button"][value*="Buscar" i]:hover,
body:not(.gc-shell) input[type="button"][value*="Ingresar" i]:hover,
body:not(.gc-shell) input[type="button"][value*="Aceptar" i]:hover {
	background: var(--gc-acento-hover);
	border-color: var(--gc-acento-hover);
	color: #fff;
}
body:not(.gc-shell) input[type="button"][value*="Eliminar" i],
body:not(.gc-shell) input[type="button"][value*="Anular" i] {
	color: var(--gc-rojo);
	border-color: #E8C5C0;
}
.botonProcesando { border-radius: 8px; min-height: 36px; }

/* botones-imagen de ../images/basicos (guardar, buscar, etc.) */
.tabla-alycar-fila-botones a img,
.tabla-alycar-fila-botones-der a img,
.tabla-alycar-fila-botones-centrado a img {
	padding: 4px;
	border-radius: 8px;
	transition: background-color .15s;
}
.tabla-alycar-fila-botones a:hover img,
.tabla-alycar-fila-botones-der a:hover img,
.tabla-alycar-fila-botones-centrado a:hover img { background: var(--gc-azul-suave); }

/* ==========================================================================
   4) Responsivo (el iframe usa su propio ancho para los media queries)
   ========================================================================== */
body:not(.gc-shell) img { max-width: 100%; height: auto; }

@media (max-width: 767.98px) {
	#divcontenedor { padding: 10px !important; }
	table.curvar { padding: 6px; width: 100% !important; float: none !important; }

	/* formularios label|valor: una columna */
	table.tabla-alycar { width: 100% !important; float: none !important; }
	table.tabla-alycar > tbody > tr,
	table.tabla-alycar > tbody > tr > td,
	table.tabla-alycar > tr,
	table.tabla-alycar > tr > td {
		display: block;
		width: auto !important;
	}
	.tabla-alycar .tabla-alycar-label,
	.tabla-alycar .tabla-alycar-label-peq,
	.tabla-alycar .tabla-alycar-menu-label { padding: 8px 12px 4px; border-bottom: 0 !important; }
	.tabla-alycar .tabla-alycar-fila-botones,
	.tabla-alycar .tabla-alycar-fila-botones-der,
	.tabla-alycar .tabla-alycar-fila-botones-centrado { text-align: center !important; }
	.tabla-alycar input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]):not([type="hidden"]),
	.tabla-alycar select,
	.tabla-alycar textarea {
		width: 100% !important;
		min-height: 44px;
		font-size: 16px; /* evita el zoom automatico en iOS */
	}

	/* grillas: desplazamiento horizontal */
	table.grilla-tab {
		display: block;
		width: 100% !important;
		float: none !important;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.form-titulo, .sac-titulo { font-size: 20px; }
	.boton, body:not(.gc-shell) input[type="button"], body:not(.gc-shell) input[type="submit"] { min-height: 44px; }
}

@media print {
	body:not(.gc-shell) { background: #fff !important; }
	table.curvar { border: 0 !important; box-shadow: none; padding: 0; }
	#divcontenedor { padding: 0 !important; }
}


/* ==========================================================================
   5) Componentes del prototipo de diseño (GESCOL-SIGE-Prototipo.html).
   Solo aplican en paginas con <body class="gc-pagina">.
   ========================================================================== */
body.gc-pagina { margin: 0; background: var(--gc-fondo) !important; color: var(--gc-tinta); font-family: var(--gc-fuente); font-size: 15px; }
.gc-pagina .gc-contenedor { padding: 28px 40px 40px; display: flex; flex-direction: column; gap: 20px; box-sizing: border-box; }

/* encabezado de pagina */
.gc-cabecera { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.gc-cabecera h1 { margin: 0; font-size: 30px; font-weight: 700; letter-spacing: -0.01em; }
.gc-cabecera p { margin: 6px 0 0; font-size: 15px; color: var(--gc-tenue); }
.gc-cabecera .gc-acciones { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

/* pestanas segmentadas */
.gc-tabs { display: flex; gap: 4px; padding: 4px; background: #E9EBE6; border-radius: 10px; }
.gc-tabs button, .gc-tabs a { height: 40px; padding: 0 18px; border: none; border-radius: 7px; background: transparent; color: var(--gc-tenue-2); font-size: 14px; font-weight: 500; cursor: pointer; display: inline-flex; align-items: center; text-decoration: none; font-family: inherit; }
.gc-tabs .on { background: #fff; color: var(--gc-tinta); font-weight: 600; box-shadow: 0 1px 2px rgba(20,48,74,0.12); }

/* tarjetas */
.gc-card { background: #fff; border: 1px solid var(--gc-borde); border-radius: 14px; display: flex; flex-direction: column; }
.gc-card-cab { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 28px; border-bottom: 1px solid var(--gc-linea); flex-wrap: wrap; }
.gc-card-cab h2 { margin: 0; font-size: 18px; font-weight: 700; }
.gc-card-cab .gc-cuenta { font-size: 14px; color: var(--gc-tenue); margin-left: 10px; font-weight: 400; }
.gc-card-pie { display: flex; justify-content: flex-end; align-items: center; gap: 12px; padding: 16px 28px; border-top: 1px solid var(--gc-linea); background: #FAFAF8; border-radius: 0 0 14px 14px; flex-wrap: wrap; }
.gc-card-pie .gc-nota { margin-right: auto; font-size: 13px; color: var(--gc-tenue); }
.gc-chip { font-size: 13px; color: var(--gc-tenue); font-family: 'JetBrains Mono', ui-monospace, monospace; background: #F1F2EE; padding: 4px 8px; border-radius: 6px; border: 0; }
.gc-pagina input.gc-chip { height: 28px; width: 150px; padding: 0 8px; border: 0; background: #F1F2EE; }
.gc-obligatorio { color: var(--gc-rojo); }

/* formulario por secciones */
.gc-secciones { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.gc-seccion-form { border: none; margin: 0; padding: 24px 28px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; align-content: start; border-right: 1px solid var(--gc-linea); border-bottom: 1px solid var(--gc-linea); min-width: 0; }
.gc-seccion-form legend { grid-column: 1 / -1; float: none; width: auto; padding: 0; margin: 0 0 4px; font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gc-acento); }
.gc-campo { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.gc-campo.medio { grid-column: span 1; }
.gc-campo > label, .gc-campo > .gc-etiqueta { font-size: 14px; font-weight: 600; color: var(--gc-tinta); margin: 0; }
.gc-campo .gc-ayuda { font-size: 12px; font-weight: 400; color: var(--gc-tenue); }
.gc-control { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.gc-control > br { display: none; }

.gc-pagina input[type="text"], .gc-pagina input[type="password"], .gc-pagina input[type="email"], .gc-pagina input[type="tel"],
.gc-pagina input[type="date"], .gc-pagina input[type="number"], .gc-pagina input[type="search"], .gc-pagina select, .gc-pagina textarea {
	height: 44px; padding: 0 12px; border: 1px solid var(--gc-input); border-radius: 8px; font-size: 15px; background: #fff; color: var(--gc-tinta); box-sizing: border-box; font-family: inherit;
}
.gc-pagina textarea { height: auto; min-height: 96px; padding: 10px 12px; }
.gc-pagina select { padding: 0 10px; }
.gc-control > input[type="text"], .gc-control > input[type="password"], .gc-control > select, .gc-control > textarea { flex: 1 1 160px; min-width: 0; width: 100%; }
.gc-pagina input:focus, .gc-pagina select:focus, .gc-pagina textarea:focus { outline: 3px solid #7FB0D6; outline-offset: 1px; border-color: var(--gc-acento); }
.gc-pagina input[readonly]:not(.gc-chip) { background: #F6F7F4; }

/* interruptor (casillas) */
.gc-switch { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; padding: 0 14px; border: 1px solid var(--gc-borde); border-radius: 10px; font-size: 14px; font-weight: 600; cursor: pointer; margin: 0; }
.gc-switch small { display: block; font-size: 12px; font-weight: 400; color: var(--gc-tenue); }
.gc-switch input[type="checkbox"] { width: 20px; height: 20px; accent-color: var(--gc-acento); flex-shrink: 0; }

/* botones */
.gc-btn { height: 44px; padding: 0 20px; border: 1px solid var(--gc-input); border-radius: 8px; background: #fff; color: var(--gc-tinta); font-size: 15px; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; text-decoration: none; box-sizing: border-box; white-space: nowrap; font-family: inherit; }
.gc-btn:hover { border-color: var(--gc-acento); color: var(--gc-tinta); }
.gc-btn.primario { background: var(--gc-acento); border-color: var(--gc-acento); color: #fff; padding: 0 24px; }
.gc-btn.primario:hover { background: var(--gc-acento-hover); color: #fff; }
.gc-btn.chico { height: 40px; padding: 0 14px; font-size: 14px; }
.gc-btn svg { width: 18px; height: 18px; flex-shrink: 0; }
.gc-btn-ico { width: 40px; height: 40px; border: 1px solid var(--gc-borde); border-radius: 8px; background: #fff; color: var(--gc-acento); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0; text-decoration: none; }
.gc-btn-ico.rojo { color: var(--gc-rojo); }
.gc-btn-ico:hover { background: var(--gc-azul-suave); }
.gc-btn-ico svg { width: 18px; height: 18px; flex-shrink: 0; }
.gc-btn-ico.chico { width: 34px; height: 34px; }

/* tablas */
.gc-tabla-scroll { overflow-x: auto; }
.gc-tabla { width: 100%; border-collapse: collapse; font-size: 14px; }
.gc-tabla th { background: #F6F7F4; color: var(--gc-tenue-2); text-align: left; padding: 12px 16px; font-weight: 600; font-size: 13px; border-top: 1px solid var(--gc-linea); border-bottom: 1px solid var(--gc-linea); }
.gc-tabla td { padding: 12px 16px; border-bottom: 1px solid var(--gc-linea); vertical-align: middle; }
.gc-tabla th:first-child, .gc-tabla td:first-child { padding-left: 28px; }
.gc-tabla th:last-child, .gc-tabla td:last-child { padding-right: 28px; }
.gc-tabla tbody tr:hover td { background: #FAFBF9; }
.gc-tabla .der { text-align: right; }
.gc-tabla .centro { text-align: center; }
.gc-fila-link { cursor: pointer; }
.gc-mono { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 13px; }
.gc-tenue { color: var(--gc-tenue); }
.gc-acciones-fila { display: flex; justify-content: flex-end; gap: 6px; }
.gc-tabla-pie { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 28px; font-size: 14px; color: var(--gc-tenue); flex-wrap: wrap; }

/* avatar, insignias */
.gc-persona { display: flex; align-items: center; gap: 12px; }
.gc-iniciales { width: 36px; height: 36px; border-radius: 50%; background: #E3ECF3; color: var(--gc-navy); display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; flex-shrink: 0; }
.gc-iniciales.grande { width: 48px; height: 48px; background: var(--gc-navy); color: #fff; font-size: 16px; }
.gc-pill { display: inline-block; padding: 4px 10px; border-radius: 999px; background: #F1F2EE; font-size: 13px; font-weight: 600; color: var(--gc-tinta); text-decoration: none; }
.gc-pill.azul { background: #E3ECF3; color: var(--gc-navy); }
.gc-estado { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; background: #F1F2EE; color: #33404F; white-space: nowrap; }
.gc-estado.alerta { background: #FDF1E4; color: #8A3A0A; }
.gc-estado.ok { background: #E6F2EA; color: var(--gc-verde); }
.gc-estado .punto { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }

/* tarjetas de cifras */
.gc-cifras { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; }
.gc-cifra-card { padding: 18px 22px; border-radius: 14px; background: #fff; border: 1px solid var(--gc-borde); display: flex; flex-direction: column; gap: 6px; }
.gc-cifra-card span { font-size: 14px; color: var(--gc-tenue); }
.gc-cifra-card strong { font-size: 28px; font-weight: 700; line-height: 1.15; }
.gc-cifra-card strong small { font-size: 15px; font-weight: 500; color: var(--gc-tenue-2); }
.gc-cifra-card.alerta { background: #FDF1E4; border-color: #F3D3B0; }
.gc-cifra-card.alerta span, .gc-cifra-card.alerta strong { color: #8A3A0A; }
.gc-cifra-card.navy { background: var(--gc-navy); border-color: var(--gc-navy); color: #fff; }
.gc-cifra-card.navy span { color: #A9BCCD; }
.gc-verde { color: var(--gc-verde); }

/* barra de pago (cartola del alumno) */
.gc-barra-pago { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 22px; background: var(--gc-navy); color: #fff; border-radius: 0 0 14px 14px; flex-wrap: wrap; }
.gc-barra-pago span { font-size: 13px; color: #A9BCCD; }
.gc-barra-pago strong { display: block; font-size: 24px; }
.gc-barra-pago .gc-btn { background: #fff; color: var(--gc-navy); border-color: #fff; font-weight: 700; }
.gc-barra-pago .gc-btn.transparente { background: transparent; color: #fff; border-color: rgba(255,255,255,0.35); font-weight: 600; }

@media (max-width: 991.98px) {
	.gc-pagina .gc-contenedor { padding: 16px; }
	.gc-cabecera h1 { font-size: 24px; }
	.gc-seccion-form { padding: 20px 16px; border-right: 0; }
	.gc-card-cab, .gc-card-pie, .gc-tabla-pie { padding-left: 16px; padding-right: 16px; }
	.gc-tabla th:first-child, .gc-tabla td:first-child { padding-left: 16px; }
	.gc-tabla th:last-child, .gc-tabla td:last-child { padding-right: 16px; }
}
@media print {
	body.gc-pagina { background: #fff !important; }
	.gc-pagina .gc-acciones, .gc-pagina .gc-tabs, .gc-pagina .gc-card-pie, .gc-pagina .gc-barra-pago, .gc-no-imprimir { display: none !important; }
}