@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root {
	--glp1-ink: #1A2537;
	--glp1-ink-2: #12336E;
	--glp1-paper: #F4F7FC;
	--glp1-surface: #FFFFFF;
	--glp1-line: #E6ECF5;
	--glp1-line-2: #D3DEEC;
	--glp1-verde: #2E6BE6;
	--glp1-verde-soft: #EFF5FF;
	--glp1-verde-deep: #12336E;
	--glp1-verde-hover: #1F55C4;
	--glp1-verde-linea: #DCE8FD;
	--glp1-ok: #0E9F6E;
	--glp1-ok-soft: #E7F7F1;
	--glp1-ambar: #B7791F;
	--glp1-ambar-soft: #FDF5E4;
	--glp1-rojo: #D0435C;
	--glp1-rojo-soft: #FDECEF;
	--glp1-muted: #66768E;
	--glp1-muted-2: #94A3B8;
	--glp1-sans: 'Plus Jakarta Sans', system-ui, sans-serif;
	--glp1-mono: 'IBM Plex Mono', ui-monospace, monospace;
}

* {
	box-sizing: border-box;
}

body {
	margin: 0;
	font-family: var( --glp1-sans );
	background: var( --glp1-paper );
	color: var( --glp1-ink );
	font-size: 14px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
}

/* Layout general: menú lateral fijo + contenido a la derecha */
.app {
	display: flex;
	min-height: 100vh;
}

.main {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
}

.wrap {
	padding: 24px 28px 60px;
	width: 100%;
}

/* Íconos SVG (sprite en header.php) */
.glp1-icono {
	width: 18px;
	height: 18px;
	stroke: currentColor;
	fill: none;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
	flex-shrink: 0;
}

.glp1-icono--sm {
	width: 15px;
	height: 15px;
}

/* Menú lateral */
.glp1-menu {
	width: 232px;
	flex: 0 0 232px;
	background: var( --glp1-surface );
	color: var( --glp1-muted );
	border-right: 1px solid var( --glp1-line );
	display: flex;
	flex-direction: column;
	position: sticky;
	top: 0;
	height: 100vh;
}

.glp1-menu__marca {
	padding: 20px 18px 16px;
	border-bottom: 1px solid var( --glp1-line );
	display: flex;
	align-items: center;
	gap: 11px;
}

.glp1-menu__logo-icono {
	width: 36px;
	height: 36px;
	flex: 0 0 auto;
	object-fit: contain;
}

.glp1-menu__marca-texto {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.glp1-menu__logo {
	font-family: var( --glp1-sans );
	font-weight: 700;
	font-size: 16px;
	color: var( --glp1-ink );
	line-height: 1.1;
}

.glp1-menu__sub {
	font-size: 11px;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var( --glp1-muted-2 );
}

.glp1-menu__scroll {
	flex: 1;
	overflow-y: auto;
	min-height: 0;
}

.glp1-menu__nav {
	padding: 14px 12px;
}

.glp1-menu__lista {
	list-style: none;
	margin: 0;
	padding: 0;
}

.glp1-menu__lista li + li {
	margin-top: 2px;
}

.glp1-menu__item {
	display: flex;
	align-items: center;
	gap: 11px;
	padding: 9px 10px;
	border-radius: 7px;
	color: var( --glp1-muted );
	text-decoration: none;
	font-size: 13.5px;
	font-weight: 500;
	transition: background .12s, color .12s;
}

.glp1-menu__item:hover {
	background: var( --glp1-verde-soft );
	color: var( --glp1-verde );
}

.glp1-menu__item--activo {
	background: var( --glp1-verde-soft );
	color: var( --glp1-verde );
	font-weight: 600;
}

.glp1-menu__separador {
	height: 1px;
	background: var( --glp1-line );
	margin: 10px 16px;
}

.glp1-menu__bloque {
	padding: 4px 16px 14px;
}

.glp1-menu__titulo-bloque {
	font-size: 10.5px;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var( --glp1-muted-2 );
	font-weight: 600;
	margin-bottom: 9px;
}

.glp1-menu__ver-todas {
	color: var( --glp1-verde );
	font-size: 12px;
	font-weight: 600;
	text-decoration: none;
	display: inline-block;
}

.glp1-menu__ver-todas:hover {
	text-decoration: underline;
}

/* Pie del menú: usuario con sesión iniciada */
.glp1-menu__pie {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 16px;
	border-top: 1px solid var( --glp1-line );
	flex: 0 0 auto;
}

.glp1-menu__pie b {
	display: block;
	font-size: 13px;
	font-weight: 600;
}

.glp1-menu__pie span {
	display: block;
	font-size: 11.5px;
	color: var( --glp1-muted-2 );
}

/* Próximas citas: lista reutilizada en el menú lateral y en la agenda */
.glp1-proximas {
	list-style: none;
	margin: 0 0 8px;
	padding: 0;
}

.glp1-proximas__item {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	padding: 7px 8px;
	border-radius: 8px;
	text-decoration: none;
	color: inherit;
}

.glp1-proximas__item:hover {
	background: var( --glp1-verde-soft );
}

.glp1-proximas__hora {
	font-family: var( --glp1-mono );
	font-size: 11.5px;
	font-weight: 500;
	color: var( --glp1-verde );
	width: 38px;
	flex: 0 0 auto;
	padding-top: 1px;
}

.glp1-proximas__info b {
	display: block;
	font-size: 12.5px;
	font-weight: 600;
	line-height: 1.35;
}

.glp1-proximas__info span {
	display: block;
	font-size: 11px;
	color: var( --glp1-muted );
	font-weight: 500;
}

.glp1-proximas__vacio {
	font-size: 12px;
	color: var( --glp1-muted );
	padding: 7px 8px;
}

/* Barra superior */
.glp1-topbar {
	background: var( --glp1-surface );
	border-bottom: 1px solid var( --glp1-line );
	padding: 0 28px;
	height: 60px;
	display: flex;
	align-items: center;
	gap: 18px;
	position: sticky;
	top: 0;
	z-index: 20;
}

.glp1-topbar__titulo {
	font-family: var( --glp1-sans );
	font-size: 24px;
	font-weight: 700;
	margin: 0;
	letter-spacing: -.02em;
}

.glp1-topbar__buscar {
	position: relative;
	margin-left: auto;
	width: 240px;
}

.glp1-topbar__buscar input {
	width: 100%;
	padding: 8px 12px 8px 34px;
	border: 1px solid var( --glp1-line-2 );
	border-radius: 9px;
	background: var( --glp1-paper );
	font-family: inherit;
	font-size: 13px;
	color: inherit;
	outline: none;
	transition: border-color .12s, box-shadow .12s, background .12s;
}

.glp1-topbar__buscar input:focus {
	background: var( --glp1-surface );
	border-color: var( --glp1-verde );
	box-shadow: 0 0 0 3px var( --glp1-verde-soft );
}

.glp1-topbar__buscar > .glp1-icono {
	position: absolute;
	left: 11px;
	top: 50%;
	transform: translateY( -50% );
	color: var( --glp1-muted-2 );
}

.glp1-topbar__resultados {
	position: absolute;
	top: calc( 100% + 6px );
	left: 0;
	right: 0;
	z-index: 30;
	background: var( --glp1-surface );
	border: 1px solid var( --glp1-line );
	border-radius: 10px;
	box-shadow: 0 12px 28px rgba( 26, 37, 55, .12 );
	max-height: 320px;
	overflow-y: auto;
	padding: 6px;
}

.glp1-topbar__campana {
	position: relative;
	background: var( --glp1-paper );
	border: 1px solid var( --glp1-line );
	border-radius: 10px;
	width: 36px;
	height: 36px;
	color: var( --glp1-ink );
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	text-decoration: none;
}

.glp1-topbar__campana:hover {
	border-color: var( --glp1-line-2 );
}

.glp1-topbar__notificaciones {
	position: relative;
}

.glp1-topbar__notif-punto {
	position: absolute;
	top: 5px;
	right: 5px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var( --glp1-rojo );
	border: 2px solid var( --glp1-surface );
}

.glp1-topbar__dropdown--notif {
	width: 300px;
}

.glp1-topbar__fecha {
	display: flex;
	align-items: center;
	font-size: 12.5px;
	color: var( --glp1-muted );
	font-variant-numeric: tabular-nums;
}

.glp1-topbar__fecha-icono {
	color: var( --glp1-verde );
	margin-right: 6px;
}

.glp1-topbar__avatar {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var( --glp1-verde-linea );
	color: var( --glp1-verde-deep );
	display: grid;
	place-items: center;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .02em;
	flex: 0 0 auto;
	object-fit: cover; /* la foto de Gravatar llena el círculo sin deformarse */
}

/* Menú de usuario (barra superior) */
.glp1-topbar__usuario-menu {
	position: relative;
}

.glp1-topbar__avatar-btn {
	background: none;
	border: 0;
	padding: 2px 4px 2px 2px;
	display: flex;
	align-items: center;
	gap: 4px;
	border-radius: 20px;
	cursor: pointer;
}

.glp1-topbar__avatar-btn:hover {
	background: var( --glp1-paper );
}

.glp1-topbar__avatar-btn:focus-visible {
	outline: 2px solid var( --glp1-verde );
	outline-offset: 2px;
}

.glp1-topbar__flecha {
	color: var( --glp1-muted-2 );
	transition: transform .15s;
}

.glp1-topbar__avatar-btn[aria-expanded="true"] .glp1-topbar__flecha {
	transform: rotate( 180deg );
}

.glp1-topbar__dropdown {
	position: absolute;
	top: calc( 100% + 10px );
	right: 0;
	width: 260px;
	background: var( --glp1-surface );
	border: 1px solid var( --glp1-line );
	border-radius: 12px;
	box-shadow: 0 14px 34px rgba( 26, 37, 55, .14 );
	padding: 14px;
	z-index: 40;
}

.glp1-topbar__dropdown-cabecera {
	position: relative;
	display: flex;
	justify-content: center;
}

/* La foto se saca del flujo para que no corra el centrado del texto:
   el texto se centra sobre todo el ancho del recuadro, no sobre el
   espacio que queda libre al lado de la foto. */
.glp1-topbar__dropdown-cabecera > .glp1-topbar__avatar {
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY( -50% );
}

.glp1-topbar__dropdown-texto {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 5px;
	min-width: 0;
}

.glp1-topbar__dropdown-texto b {
	font-size: 14px;
	font-weight: 700;
}

.glp1-topbar__dropdown-separador {
	height: 1px;
	background: var( --glp1-line );
	margin: 10px 0;
}

.glp1-topbar__dropdown-item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 8px;
	border-radius: 8px;
	font-size: 13.5px;
	font-weight: 500;
	color: var( --glp1-ink );
	text-decoration: none;
}

.glp1-topbar__dropdown-item:hover {
	background: var( --glp1-verde-soft );
	color: var( --glp1-verde );
}

.glp1-topbar__dropdown-item--peligro {
	color: var( --glp1-rojo );
	justify-content: center;
}

/* El texto solo (sin el ícono) es lo que se centra, para que quede
   alineado con el nombre y el rol de arriba. El ícono se ancla afuera,
   pegado al borde izquierdo del texto, así no le suma ancho al bloque
   que se está centrando. */
.glp1-topbar__dropdown-item__texto {
	position: relative;
}

.glp1-topbar__dropdown-item__texto svg {
	position: absolute;
	right: calc( 100% + 8px );
	top: 50%;
	transform: translateY( -50% );
}

.glp1-topbar__dropdown-item--peligro:hover {
	background: var( --glp1-rojo-soft );
	color: var( --glp1-rojo );
}

/* Tarjetas de contenido */
.glp1-tarjeta {
	background: var( --glp1-surface );
	border: 1px solid var( --glp1-line );
	border-radius: 12px;
	padding: 18px;
}

.glp1-tarjeta h2 {
	font-family: var( --glp1-sans );
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -.01em;
	margin: 0;
}

.glp1-tarjeta__cabecera {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 18px;
	padding-bottom: 14px;
	border-bottom: 1px solid var( --glp1-line );
}

.glp1-tarjeta__cabecera > .glp1-icono {
	color: var( --glp1-verde );
}

.glp1-tarjeta__cabecera > .glp1-form__nota {
	margin-left: auto;
	margin-top: 0;
}

.glp1-form__nota {
	margin: 4px 0 0;
	font-size: 12px;
	color: var( --glp1-muted );
}

.glp1-form__error {
	background: var( --glp1-rojo-soft );
	color: var( --glp1-rojo );
	border-radius: 8px;
	padding: 10px 14px;
	margin: 0 auto 16px;
	max-width: 900px;
	font-size: 13px;
}

/* Formularios: la tarjeta que los contiene ya usa todo el ancho
   disponible, pero los campos en sí quedan mejor en una columna angosta
   en vez de estirarse de punta a punta en pantallas anchas. */
.glp1-form {
	max-width: 900px;
	margin: 0 auto;
}

.glp1-form__seccion {
	border: 0;
	margin: 0 0 28px;
	padding: 0;
}

.glp1-form__seccion:last-of-type {
	margin-bottom: 0;
}

.glp1-form__leyenda {
	font-family: var( --glp1-sans );
	font-weight: 700;
	color: var( --glp1-verde );
	font-size: 16px;
	margin: 0 0 14px;
	padding: 0 0 9px;
	width: 100%;
	border-bottom: 1px solid var( --glp1-line );
}

.glp1-form__leyenda span {
	font-size: 12px;
	font-weight: 400;
	color: var( --glp1-muted );
	font-family: var( --glp1-sans );
}

.glp1-form__leyenda .glp1-icono {
	margin-right: 8px;
	vertical-align: -3px;
}

.glp1-form__fila {
	display: flex;
	gap: 12px;
}

.glp1-form__fila > .glp1-form__campo,
.glp1-form__fila > input {
	flex: 1;
	min-width: 0;
}

.glp1-form__campo {
	margin-bottom: 15px;
}

.glp1-form__campo:last-child {
	margin-bottom: 0;
}

.glp1-form__campo label {
	display: block;
	font-size: 12.5px;
	font-weight: 600;
	color: #42536B;
	margin-bottom: 6px;
}

.glp1-form__campo label em {
	font-style: normal;
	color: var( --glp1-muted-2 );
	font-weight: 400;
}

.glp1-form__campo input,
.glp1-form__campo select,
.glp1-form__campo textarea {
	width: 100%;
	padding: 9px 11px;
	border: 1px solid var( --glp1-line-2 );
	border-radius: 9px;
	background: var( --glp1-surface );
	font-family: inherit;
	font-size: inherit;
	color: inherit;
	outline: none;
	transition: border-color .12s, box-shadow .12s;
}

.glp1-form__campo input:focus,
.glp1-form__campo select:focus,
.glp1-form__campo textarea:focus {
	border-color: var( --glp1-verde );
	box-shadow: 0 0 0 3px var( --glp1-verde-soft );
}

.glp1-form__campo input[readonly] {
	background: var( --glp1-paper );
	color: var( --glp1-muted );
}

.glp1-form__campo textarea {
	min-height: 82px;
	resize: vertical;
	line-height: 1.6;
}

.glp1-form__hint {
	font-size: 11.5px;
	color: var( --glp1-muted );
	margin: 5px 0 0;
}

.glp1-form__acciones {
	display: flex;
	gap: 10px;
	padding-top: 18px;
	border-top: 1px solid var( --glp1-line );
}

/* Botones */
.glp1-boton {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	background: var( --glp1-surface );
	border: 1px solid var( --glp1-line-2 );
	border-radius: 9px;
	padding: 8px 14px;
	font-size: 13px;
	font-weight: 600;
	color: var( --glp1-ink );
	text-decoration: none;
	cursor: pointer;
	transition: border-color .12s, color .12s;
}

.glp1-boton:hover {
	border-color: var( --glp1-verde );
	color: var( --glp1-verde );
}

.glp1-boton--principal {
	background: var( --glp1-verde );
	border-color: var( --glp1-verde );
	color: #FFFFFF;
}

.glp1-boton--principal:hover {
	background: var( --glp1-verde-hover );
	border-color: var( --glp1-verde-hover );
	color: #FFFFFF;
}

.glp1-boton:disabled {
	opacity: .6;
	cursor: default;
}

.glp1-boton--sm {
	padding: 5px 11px;
	font-size: 12.5px;
	border-radius: 8px;
}

/* Indicadores del panel */
.glp1-kpi-grid {
	display: grid;
	grid-template-columns: repeat( 4, minmax( 0, 1fr ) );
	gap: 16px;
}

.glp1-kpi-grid--3 {
	grid-template-columns: repeat( 3, minmax( 0, 1fr ) );
}

.glp1-kpi {
	background: var( --glp1-surface );
	border: 1px solid var( --glp1-line );
	border-radius: 12px;
	padding: 16px;
}

.glp1-kpi__etiqueta {
	font-size: 12px;
	font-weight: 500;
	color: var( --glp1-muted );
	margin-bottom: 9px;
}

.glp1-kpi__valor {
	font-family: var( --glp1-mono );
	font-size: 25px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: -.03em;
}

.glp1-kpi__icono {
	width: 34px;
	height: 34px;
	border-radius: 9px;
	background: var( --glp1-verde-soft );
	color: var( --glp1-verde );
	display: grid;
	place-items: center;
	margin-bottom: 11px;
}

/* Layout de dos columnas: formulario + paneles laterales */
.glp1-dos-columnas {
	display: grid;
	grid-template-columns: minmax( 0, 1.7fr ) minmax( 0, 1fr );
	gap: 20px;
	align-items: start;
}

.glp1-panel-lateral {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

/* Aviso: se está completando una cita ya agendada */
.glp1-aviso {
	background: var( --glp1-ambar-soft );
	border: 1px solid #F2E2BD;
	border-radius: 12px;
	padding: 13px 16px;
	margin-bottom: 18px;
	font-size: 13px;
	color: #8A6217;
}

/* Panel de cálculo en vivo */
.glp1-calc {
	background: var( --glp1-verde-soft );
	border-color: var( --glp1-verde-linea );
}

.glp1-calc h3 {
	display: flex;
	align-items: center;
	gap: 7px;
	font-family: var( --glp1-sans );
	font-size: 13.5px;
	font-weight: 700;
	margin: 0 0 12px;
	color: var( --glp1-verde-deep );
}

.glp1-calc__fila {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	padding: 7px 0;
	font-size: 13px;
	border-bottom: 1px solid var( --glp1-verde-linea );
}

.glp1-calc__fila:last-child {
	border-bottom: 0;
}

.glp1-calc__fila span {
	color: #4C6FA8;
	font-weight: 500;
}

.glp1-calc__fila b {
	font-family: var( --glp1-mono );
	font-weight: 500;
	color: var( --glp1-verde-deep );
	font-size: 15px;
}

/* Listas de datos término/valor (ej. control anterior) */
.glp1-dl {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 9px 18px;
	font-size: 13px;
	margin: 0;
}

.glp1-dl dt {
	color: var( --glp1-muted-2 );
	font-size: 12.5px;
	font-weight: 500;
}

.glp1-dl dd {
	margin: 0;
	font-weight: 600;
}

/* Listas simples (ej. controles de hoy, pacientes que requieren atención) */
.glp1-lista {
	list-style: none;
	margin: 0;
	padding: 0;
}

.glp1-lista li {
	display: flex;
	align-items: center;
	gap: 13px;
	padding: 12px 0;
	border-bottom: 1px solid var( --glp1-line );
}

.glp1-lista li:last-child {
	border-bottom: 0;
}

.glp1-lista__hora {
	font-family: var( --glp1-mono );
	font-size: 13px;
	font-weight: 500;
	color: var( --glp1-verde );
	width: 46px;
	flex: 0 0 auto;
}

.glp1-lista__info b {
	font-weight: 600;
	display: block;
}

.glp1-lista__info span {
	font-size: 11.5px;
	color: var( --glp1-muted-2 );
}

.glp1-lista__right {
	margin-left: auto;
	display: flex;
	align-items: center;
	gap: 9px;
}

/* Cabecera de la ficha del paciente */
.glp1-ficha-cabecera {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	padding-bottom: 18px;
	margin-bottom: 18px;
	border-bottom: 1px solid var( --glp1-line );
}

.glp1-ficha-cabecera h2 {
	font-family: var( --glp1-sans );
	font-size: 21px;
	font-weight: 700;
	letter-spacing: -.02em;
	margin: 0 0 6px;
}

.glp1-ficha-cabecera__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
	align-items: center;
	font-size: 12.5px;
	font-weight: 500;
	color: var( --glp1-muted );
}

.glp1-ficha-cabecera__meta span + span::before {
	content: '·';
	margin-right: 7px;
	color: var( --glp1-line-2 );
}

.glp1-ficha-cabecera__distintivos {
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
	margin-top: 8px;
}

.glp1-ficha-cabecera__acciones {
	margin-left: auto;
	display: flex;
	gap: 8px;
}

.glp1-topbar__avatar--grande {
	width: 56px;
	height: 56px;
	font-size: 17px;
}

/* Distintivos (estado, dosis, alergia, uso previo) */
.glp1-pill {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 11.5px;
	padding: 3px 10px;
	border-radius: 20px;
	background: var( --glp1-paper );
	color: var( --glp1-muted );
	font-weight: 600;
	white-space: nowrap;
}

.glp1-pill--dosis {
	font-family: var( --glp1-mono );
	background: var( --glp1-verde );
	color: #FFFFFF;
	font-weight: 500;
}

.glp1-pill--rojo {
	background: var( --glp1-rojo-soft );
	color: var( --glp1-rojo );
}

.glp1-pill--ambar {
	background: var( --glp1-ambar-soft );
	color: var( --glp1-ambar );
}

.glp1-pill--ok {
	background: var( --glp1-ok-soft );
	color: var( --glp1-ok );
}

/* Pestañas (historia clínica) */
.glp1-tabs {
	display: flex;
	gap: 2px;
	border-bottom: 1px solid var( --glp1-line );
	margin: -18px -18px 18px;
	padding: 0 18px;
	background: var( --glp1-paper );
}

.glp1-tab {
	background: none;
	border: 0;
	border-bottom: 2px solid transparent;
	padding: 11px 14px;
	margin-bottom: -1px;
	font-size: 13px;
	font-weight: 600;
	font-family: inherit;
	color: var( --glp1-muted );
	cursor: pointer;
}

.glp1-tab:hover {
	color: var( --glp1-ink );
}

.glp1-tab--activa {
	color: var( --glp1-verde );
	border-bottom-color: var( --glp1-verde );
}

.glp1-tpane {
	display: none;
}

.glp1-tpane--activa {
	display: block;
}

/* Indicadores de evolución */
.glp1-evo {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
}

.glp1-evo > div {
	flex: 1;
	min-width: 120px;
	background: var( --glp1-verde-soft );
	border-radius: 10px;
	padding: 13px 15px;
}

.glp1-evo__etiqueta {
	font-size: 11px;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: #4C6FA8;
	margin-bottom: 6px;
	font-weight: 600;
}

.glp1-evo__valor {
	font-family: var( --glp1-mono );
	font-size: 18px;
	font-weight: 500;
	color: var( --glp1-verde-deep );
}

/* Grillas de dos columnas iguales (ej. datos personales / antecedentes) */
.glp1-grid-2col {
	display: grid;
	grid-template-columns: minmax( 0, 1fr ) minmax( 0, 1fr );
	gap: 16px;
}

/* Alerta flotante de próximo control (global.js) */
.glp1-alerta-flotante {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 80;
	width: 328px;
	max-width: calc( 100vw - 48px );
	background: var( --glp1-surface );
	border: 1px solid var( --glp1-line );
	border-left: 4px solid var( --glp1-ambar );
	color: var( --glp1-ink );
	border-radius: 12px;
	padding: 15px 17px;
	display: flex;
	gap: 13px;
	align-items: flex-start;
	box-shadow: 0 14px 34px rgba( 26, 37, 55, .14 );
	transform: translateY( 150% );
	transition: transform .32s cubic-bezier( .2, .9, .3, 1 );
}

.glp1-alerta-flotante--visible {
	transform: translateY( 0 );
}

.glp1-alerta-flotante__icono {
	width: 34px;
	height: 34px;
	border-radius: 10px;
	background: var( --glp1-ambar-soft );
	display: grid;
	place-items: center;
	font-size: 16px;
	flex: 0 0 auto;
}

.glp1-alerta-flotante__cuerpo {
	min-width: 0;
}

.glp1-alerta-flotante__cuerpo b {
	display: block;
	font-weight: 600;
	font-size: 14px;
	margin-bottom: 2px;
}

.glp1-alerta-flotante__cuerpo p {
	margin: 0 0 8px;
	font-size: 12.5px;
	color: var( --glp1-muted );
	line-height: 1.5;
}

.glp1-alerta-flotante__enlace {
	font-size: 12.5px;
	font-weight: 600;
	color: var( --glp1-ambar );
	text-decoration: none;
}

.glp1-alerta-flotante__enlace:hover {
	text-decoration: underline;
}

.glp1-alerta-flotante__cerrar {
	margin-left: auto;
	background: none;
	border: 0;
	color: var( --glp1-muted-2 );
	font-size: 17px;
	line-height: 1;
	padding: 0;
	cursor: pointer;
}

/* Fecha grande de la barra de navegación de la agenda */
.glp1-agenda-fecha {
	font-size: 19px;
	font-weight: 700;
	letter-spacing: -.02em;
	margin-left: 8px;
}

/* Grilla de la agenda por franjas horarias */
.glp1-agenda-grid {
	display: grid;
	grid-template-columns: 64px 1fr;
	border-top: 1px solid var( --glp1-line );
}

.glp1-agenda-grid__hora {
	font-family: var( --glp1-mono );
	font-size: 11.5px;
	color: var( --glp1-muted-2 );
	padding: 9px 12px 0 0;
	text-align: right;
	border-right: 1px solid var( --glp1-line );
	border-bottom: 1px solid var( --glp1-line );
	min-height: 62px;
}

.glp1-agenda-grid__slot {
	border-bottom: 1px solid var( --glp1-line );
	padding: 7px 10px;
	min-height: 62px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

/* Tarjeta de una cita dentro de la grilla */
.glp1-cita {
	background: var( --glp1-verde-soft );
	border: 1px solid var( --glp1-verde-linea );
	border-left: 3px solid var( --glp1-verde );
	border-radius: 9px;
	padding: 9px 12px;
	display: flex;
	align-items: center;
	gap: 10px;
}

.glp1-cita b {
	font-weight: 600;
	font-size: 13px;
	display: block;
}

.glp1-cita span {
	font-size: 11.5px;
	color: #3A5C9B;
}

.glp1-cita__acciones {
	margin-left: auto;
	display: flex;
	align-items: center;
	gap: 7px;
	flex-wrap: wrap;
}

.glp1-cita--libre {
	background: transparent;
	border: 1px dashed var( --glp1-line-2 );
	border-left: 1px dashed var( --glp1-line-2 );
	color: var( --glp1-muted-2 );
	font-size: 12.5px;
	font-weight: 500;
	justify-content: center;
}

/* Calendario mensual */
.glp1-mes {
	display: grid;
	grid-template-columns: repeat( 7, 1fr );
	gap: 3px;
	font-size: 12px;
	text-align: center;
}

.glp1-mes__dow {
	font-size: 10px;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var( --glp1-muted-2 );
	padding-bottom: 6px;
	font-weight: 600;
}

.glp1-mes__dia {
	display: block;
	padding: 7px 0;
	border-radius: 9px;
	font-family: var( --glp1-mono );
	position: relative;
	color: inherit;
	text-decoration: none;
}

.glp1-mes__dia:hover {
	background: var( --glp1-verde-soft );
}

.glp1-mes__dia--fuera {
	color: var( --glp1-muted-2 );
	opacity: .4;
	pointer-events: none;
}

.glp1-mes__dia--hoy {
	background: var( --glp1-verde );
	color: #FFFFFF;
	font-weight: 600;
}

.glp1-mes__dia--hoy:hover {
	background: var( --glp1-verde-hover );
}

.glp1-mes__dia--seleccionado {
	box-shadow: inset 0 0 0 2px var( --glp1-verde );
}

.glp1-mes__dia--tiene::after {
	content: '';
	position: absolute;
	bottom: 3px;
	left: 50%;
	transform: translateX( -50% );
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var( --glp1-verde );
}

.glp1-mes__dia--hoy.glp1-mes__dia--tiene::after {
	background: #FFFFFF;
}

/* Filtros de listados */
.glp1-filtros {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	margin-bottom: 16px;
}

.glp1-filtros__buscar {
	position: relative;
	flex: 1;
	min-width: 220px;
	max-width: 340px;
}

.glp1-filtros__buscar input,
.glp1-filtros select {
	padding: 9px 12px;
	border: 1px solid var( --glp1-line-2 );
	border-radius: 9px;
	background: var( --glp1-surface );
	font-family: inherit;
	font-size: 13px;
	color: inherit;
	outline: none;
	transition: border-color .12s, box-shadow .12s;
}

.glp1-filtros__buscar input {
	width: 100%;
	padding-left: 34px;
}

.glp1-filtros__buscar .glp1-icono {
	position: absolute;
	left: 11px;
	top: 50%;
	transform: translateY( -50% );
	color: var( --glp1-muted-2 );
}

.glp1-filtros__buscar input:focus,
.glp1-filtros select:focus {
	border-color: var( --glp1-verde );
	box-shadow: 0 0 0 3px var( --glp1-verde-soft );
}

.glp1-filtros__nuevo {
	margin-left: auto;
}

/* Tabla de listados (DataTables) */
.glp1-tabla {
	border-collapse: collapse;
}

.glp1-tabla thead th {
	text-align: left;
	font-size: 11px;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var( --glp1-muted-2 );
	font-weight: 600;
	padding: 11px 14px;
	border-bottom: 1px solid var( --glp1-line );
	white-space: nowrap;
}

.glp1-tabla tbody td {
	padding: 12px 14px;
	border-bottom: 1px solid var( --glp1-line );
	vertical-align: middle;
	font-size: 13px;
}

.glp1-tabla tbody tr:last-child td {
	border-bottom: 0;
}

.glp1-tabla tbody tr:hover {
	background: var( --glp1-verde-soft );
}

/* Columna "Cambio": bajar de peso es la buena noticia, y ese resultado se
   marca en verde-éxito aunque el color de marca del sistema sea el azul. */
.delta-dn {
	color: var( --glp1-ok );
	font-weight: 600;
}

.delta-up {
	color: var( --glp1-rojo );
	font-weight: 600;
}

.delta-cero {
	color: var( --glp1-muted );
	font-weight: 600;
}

/* DataTables trae su propio look por defecto; se pisa lo mínimo para que combine */
.dataTables_wrapper .dataTables_processing {
	background: var( --glp1-surface );
	color: var( --glp1-ink );
	border: 1px solid var( --glp1-line );
	border-radius: 9px;
}

.dataTables_wrapper .dataTables_info {
	color: var( --glp1-muted );
	font-size: 12.5px;
	padding-top: 12px;
}

.dataTables_wrapper .dataTables_paginate {
	padding-top: 12px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
	border-radius: 6px;
	padding: 4px 10px;
	margin-left: 2px;
	border: 1px solid transparent;
	color: var( --glp1-ink ) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
	background: var( --glp1-verde ) !important;
	border-color: var( --glp1-verde ) !important;
	color: #FFFFFF !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
	background: var( --glp1-verde-soft ) !important;
	border-color: var( --glp1-verde-soft ) !important;
	color: var( --glp1-verde-deep ) !important;
}

/* SweetAlert2 trae su propio look por defecto (ícono naranja circular,
   botones redondeados genéricos); se pisa para que combine con el resto
   del sistema. El ícono, título y texto de la confirmación de cerrar
   sesión se arman a mano vía el parámetro "html" (no title/icon de
   SweetAlert2) para poder usar la misma caja cuadrada de ícono que ya
   usa el resto del sistema (menú lateral, KPIs) en vez del círculo fijo
   que impone el ícono nativo. */
.swal2-popup {
	font-family: var( --glp1-sans );
	border-radius: 16px;
	padding: 28px 24px 24px;
}

.glp1-swal__icono {
	width: 52px;
	height: 52px;
	border-radius: 14px;
	background: var( --glp1-rojo-soft );
	color: var( --glp1-rojo );
	display: grid;
	place-items: center;
	margin: 0 auto 16px;
}

.glp1-swal__icono .glp1-icono {
	width: 24px;
	height: 24px;
}

.glp1-swal__titulo {
	margin: 0 0 6px;
	font-size: 19px;
	font-weight: 700;
	color: var( --glp1-ink );
	text-align: center;
}

.glp1-swal__texto {
	margin: 0;
	font-size: 13.5px;
	color: var( --glp1-muted );
	text-align: center;
	line-height: 1.5;
}

.swal2-actions {
	margin-top: 22px;
	gap: 10px;
}

.swal2-confirm,
.swal2-cancel {
	margin: 0;
	padding: 8px 16px;
	border-radius: 9px;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	box-shadow: none !important;
	display: inline-flex;
	align-items: center;
	gap: 7px;
}

.swal2-confirm {
	background: var( --glp1-rojo );
	border: 1px solid var( --glp1-rojo );
	color: #FFFFFF;
}

.swal2-confirm:hover {
	background: #B5364C;
	border-color: #B5364C;
}

.swal2-cancel {
	background: var( --glp1-surface );
	border: 1px solid var( --glp1-line-2 );
	color: var( --glp1-ink );
}

.swal2-cancel:hover {
	border-color: var( --glp1-verde );
	color: var( --glp1-verde );
}

@media ( max-width: 860px ) {
	.glp1-menu {
		position: fixed;
		left: -232px;
	}

	.wrap {
		padding: 18px;
	}

	.glp1-form__fila {
		flex-direction: column;
		gap: 0;
	}

	.glp1-filtros__buscar {
		max-width: none;
		flex-basis: 100%;
	}

	.glp1-filtros__nuevo {
		margin-left: 0;
	}

	.glp1-dos-columnas {
		grid-template-columns: minmax( 0, 1fr );
	}

	.glp1-grid-2col {
		grid-template-columns: minmax( 0, 1fr );
	}

	.glp1-ficha-cabecera {
		flex-direction: column;
	}

	.glp1-ficha-cabecera__acciones {
		margin-left: 0;
	}

	.glp1-agenda-grid {
		grid-template-columns: 48px 1fr;
	}

	.glp1-cita {
		flex-direction: column;
		align-items: flex-start;
	}

	.glp1-cita__acciones {
		margin-left: 0;
	}

	.glp1-kpi-grid,
	.glp1-kpi-grid--3 {
		grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
	}

	.glp1-topbar__buscar {
		width: 140px;
	}

	.glp1-topbar__fecha {
		display: none;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	* {
		transition: none !important;
	}
}
