@charset "utf-8";
/* CSS Document */
:root{
  --plomo-oscuro: #3f3f3f;
  --plomo-oscuro-2: #2f2f2f;
  --plomo-claro: #aaaaaa;
  --plomo-masclaro: #e4e4e4;
  --blanco: #ffffff;
  --violetblue: #4B4DB2;
  --borde-btn: rgba(0,0,0,0.15);
  --fondo-btn: #ffffff;
  --fondo-btn-hover: rgba(0,0,0,0.03);
}
body{
	font-family: 'Inter', sans-serif;

}
.ui_screen{
	padding: 10px;
}
.ui_title{
	font-size: 36px;
	font-weight: 500;
	color: var(--plomo-oscuro);
}
.sys_inteface_sub_top{
	font-size: 36px;
	font-weight: 500;
	color: #000000;
	font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	padding-bottom: 0px;
	padding-top: 0px;;
}
.sys_inteface_sub_top a{
	text-decoration: none;
	color: inherit;
}
.sys_inteface_sub_top a:hover{
	text-decoration: none;
	color: inherit;
}

.ui_menu{
	margin-top: 2px;
	margin-bottom: 2px;
}
.ui_content{
	margin: 5px;
	border: var(--plomo-claro) 1px solid;
	border-radius: 5px;
	padding: 10px;

}

/* Buttons matching system2 (no icon) */
.ui_menu .sys_inteface_sub_mnu span{ display:inline-block; margin:5px; vertical-align:middle; }
.ui_menu .sys_inteface_sub_mnu span a{
	display:inline-flex;
	align-items:center;
	gap:8px;
	padding:6px 12px;
	border:1px solid var(--borde-btn);
	border-radius:6px;
	background:var(--fondo-btn);
	color:var(--plomo-oscuro);
	text-decoration:none;
	font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	font-size:14px;
	line-height:1.2;
	white-space:nowrap;
}
.ui_menu .sys_inteface_sub_mnu span a:hover,
.ui_menu .sys_inteface_sub_mnu span a:focus{
	background:var(--fondo-btn-hover);
	border-color: rgba(0,0,0,0.22);
	color: var(--plomo-oscuro-2);
}
.ui_menu .sys_inteface_sub_mnu span a:active{
	background: rgba(0,0,0,0.06);
}

/* Active item: visually distinct (matches system2 active style) */
.ui_menu .sys_inteface_sub_mnu span.active > a{
	background: var(--plomo-oscuro);
	color: var(--blanco) !important;
	border-color: transparent;
}
.ui_menu .sys_inteface_sub_mnu span.active > a:hover,
.ui_menu .sys_inteface_sub_mnu span.active > a:focus{
	background: var(--plomo-oscuro-2);
	color: var(--blanco);
}

