:root {
	--brand: #4988cf;
	--brand-dark: #1768ad;
	--brand-soft: #eaf4ff;
	--ink: #101828;
	--muted: #667085;
	--line: #d8e0ea;
	--page: #f4f7fb;
	--surface: #ffffff;
	--danger: #b42318;
	--success: #067647;
	--warning: #b54708;
	--shadow: 0 10px 26px rgba(16, 24, 40, .07);
	--radius: 8px;
	--tap: 40px;
	--sidebar-collapsed: 68px;
	--sidebar-expanded: 280px;
	--content-max: 1180px;
	--content-gutter: 28px;
	--font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	min-height: 100%;
	background: var(--page);
	-webkit-text-size-adjust: 100%;
}

body {
	min-height: 100%;
	margin: 0;
	background: var(--page);
	color: var(--ink);
	font-family: var(--font);
	font-size: 14px;
	line-height: 1.45;
}

a {
	color: var(--brand-dark);
	text-decoration: none;
}

a:hover,
a:focus {
	color: var(--brand);
}

img {
	max-width: 100%;
	height: auto;
	border: 0;
}

ul,
ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

button,
input,
select,
textarea {
	font: inherit;
}

button {
	cursor: pointer;
}

table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
}

.dnone,
[hidden] {
	display: none !important;
}

.app-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.aleft {
	text-align: left !important;
	justify-content: flex-start !important;
}

.aright {
	text-align: right !important;
	justify-content: flex-end !important;
}

.acenter {
	text-align: center !important;
}

.pright {
	margin-left: auto !important;
}

.ml15 {
	margin-left: 15px !important;
}

.msred,
.lred {
	color: var(--danger) !important;
}

.msgreen {
	color: var(--success) !important;
}

.msblue {
	color: var(--brand-dark) !important;
}

.bgred {
	background: var(--danger) !important;
}

.bggreen {
	background: var(--success) !important;
}

.bgblue {
	background: var(--brand) !important;
}

/* Login */

body.bodylog {
	min-height: 100vh;
	display: grid;
	place-items: center;
	padding: 20px;
	background:
		radial-gradient(circle at top right, rgba(73, 136, 207, .16), transparent 26rem),
		var(--page);
}

.formlogin {
	width: min(100%, 390px);
	margin: 0 auto;
	padding: 28px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow);
}

.logologin {
	display: block;
	width: min(100%, 310px);
	height: 82px;
	margin: 0 auto 18px;
	background: url(../img/logogrande.png) center / contain no-repeat;
}

.formlogin h1,
.formlogin h2 {
	margin: 0 0 18px;
	color: var(--ink);
	font-size: 22px;
	font-weight: 800;
	text-align: center;
}

.formlogin .clog {
	display: grid;
	gap: 12px;
}

.formlogin input {
	width: 100%;
	min-height: 48px;
	padding: 0 14px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: #fff;
	color: var(--ink);
	text-align: left;
}

.formlogin input:focus {
	border-color: var(--brand);
	box-shadow: 0 0 0 4px rgba(73, 136, 207, .18);
	outline: 0;
}

.formlogin input[type="submit"],
.bredondo {
	border: 0;
	background: var(--brand);
	color: #fff;
	font-weight: 800;
	text-align: center;
}

/* App navigation */

.app-mobilebar {
	display: none;
}

.app-sidebar-scrim {
	display: none;
}

.app-shellbar {
	position: fixed;
	inset: 0 auto 0 0;
	z-index: 1400;
	width: var(--sidebar-collapsed);
	height: 100vh;
	display: flex;
	flex-direction: column;
	padding: 12px 8px;
	border-right: 1px solid var(--line);
	background: rgba(255, 255, 255, .96);
	box-shadow: 8px 0 28px rgba(16, 24, 40, .06);
	backdrop-filter: blur(16px);
	transition: width .18s ease, transform .18s ease;
}

.app-shellbar.is-expanded,
.app-shellbar:hover {
	width: var(--sidebar-expanded);
}

.app-sidebar-head {
	min-height: 52px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 12px;
}

.app-brand {
	min-width: 0;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 5px 8px;
	border-radius: var(--radius);
	color: var(--ink);
}

.app-brand-mark.minilogo {
	flex: 0 0 38px;
	width: 38px;
	height: 38px;
	background: url(../img/minilogo.png) center / contain no-repeat;
}

.app-brand-text {
	min-width: 0;
	display: grid;
	gap: 1px;
	opacity: 0;
	transform: translateX(-5px);
	pointer-events: none;
	transition: opacity .16s ease, transform .16s ease;
}

.app-shellbar.is-expanded .app-brand-text,
.app-shellbar:hover .app-brand-text {
	opacity: 1;
	transform: translateX(0);
	pointer-events: auto;
}

.app-brand-text strong {
	color: var(--brand-dark);
	font-size: 16px;
	font-weight: 800;
}

.app-brand-text small {
	max-width: 170px;
	overflow: hidden;
	color: var(--muted);
	font-size: 12px;
	font-weight: 600;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.app-sidebar-toggle,
.app-nav-toggle,
.app-mobile-action {
	width: var(--tap);
	height: var(--tap);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: #fff;
	color: var(--brand-dark);
}

.app-line-icon {
	width: 17px;
	height: 17px;
	display: block;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.app-sidebar-toggle .app-line-icon,
.app-nav-toggle .app-line-icon,
.app-mobile-action .app-line-icon {
	width: 16px;
	height: 16px;
}

.app-sidebar-toggle:hover,
.app-sidebar-toggle:focus,
.app-nav-toggle:hover,
.app-nav-toggle:focus,
.app-mobile-action:hover,
.app-mobile-action:focus {
	border-color: var(--brand);
	background: var(--brand-soft);
	outline: 0;
}

.app-shellbar.is-expanded .app-sidebar-toggle span:first-child {
	transform: rotate(180deg);
}

.app-shellbar:not(.is-expanded):not(:hover) .app-sidebar-toggle {
	opacity: 0;
	pointer-events: none;
}

.app-quicknav {
	display: grid;
	gap: 6px;
	overflow: visible auto;
	padding-bottom: 8px;
	scrollbar-width: thin;
}

.app-quicknav a,
.app-sidebar-foot a {
	min-height: 42px;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 0 12px;
	border: 1px solid transparent;
	border-radius: var(--radius);
	color: #344054;
	font-weight: 700;
	white-space: nowrap;
	transition: background .14s ease, color .14s ease, border-color .14s ease;
}

.app-quicknav a:hover,
.app-quicknav a:focus,
.app-quicknav a.is-active,
.app-sidebar-foot a:hover,
.app-sidebar-foot a:focus {
	border-color: rgba(73, 136, 207, .16);
	background: var(--brand-soft);
	color: var(--brand-dark);
	outline: 0;
}

.app-quicknav a.is-featured {
	background: var(--brand);
	color: #fff;
}

.app-quicknav a.is-featured .app-nav-icon,
.app-quicknav a.is-featured small {
	color: #fff;
}

.app-nav-icon {
	flex: 0 0 26px;
	width: 26px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--brand-dark);
	text-align: center;
}

.app-nav-icon .app-line-icon {
	width: 17px;
	height: 17px;
}

.app-nav-label,
.app-quicknav small,
.app-sidebar-foot .app-nav-label {
	opacity: 0;
	transform: translateX(-5px);
	pointer-events: none;
	transition: opacity .16s ease, transform .16s ease;
}

.app-quicknav small {
	margin-left: auto;
	padding: 2px 6px;
	border-radius: 99px;
	background: rgba(73, 136, 207, .1);
	color: var(--muted);
	font-size: 11px;
	font-weight: 800;
}

.app-shellbar.is-expanded .app-nav-label,
.app-shellbar.is-expanded .app-quicknav small,
.app-shellbar.is-expanded .app-sidebar-foot .app-nav-label,
.app-shellbar:hover .app-nav-label,
.app-shellbar:hover .app-quicknav small,
.app-shellbar:hover .app-sidebar-foot .app-nav-label {
	opacity: 1;
	transform: translateX(0);
	pointer-events: auto;
}

.app-sidebar-foot {
	margin-top: auto;
	padding-top: 10px;
	border-top: 1px solid var(--line);
}

.app-sidebar-foot a,
.app-sidebar-foot .app-nav-icon {
	color: var(--danger);
}

/* Layout */

.app-alert-strip,
.app-shellbar ~ .boxc,
.app-shellbar ~ .app-footer {
	width: min(var(--content-max), calc(100% - var(--sidebar-collapsed) - (var(--content-gutter) * 2)));
	margin-left: calc(var(--sidebar-collapsed) + ((100% - var(--sidebar-collapsed) - min(var(--content-max), calc(100% - var(--sidebar-collapsed) - (var(--content-gutter) * 2)))) / 2));
	margin-right: auto;
	transition: margin-left .18s ease, width .18s ease;
}

.app-shellbar.is-expanded ~ .app-alert-strip,
.app-shellbar.is-expanded ~ .boxc,
.app-shellbar.is-expanded ~ .app-footer {
	width: min(var(--content-max), calc(100% - var(--sidebar-expanded) - (var(--content-gutter) * 2)));
	margin-left: calc(var(--sidebar-expanded) + ((100% - var(--sidebar-expanded) - min(var(--content-max), calc(100% - var(--sidebar-expanded) - (var(--content-gutter) * 2)))) / 2));
}

.boxc {
	padding-top: 24px;
	padding-bottom: 24px;
}

.contenedor {
	display: flow-root;
	width: 100%;
}

.contenedor > h1,
.acenter {
	width: 100%;
	margin: 0 0 14px;
	color: var(--ink);
	font-size: 28px;
	font-weight: 800;
	line-height: 1.2;
	text-align: left !important;
}

.contenedor > h2.lisup {
	display: none;
}

.contenedor > h3,
.fgeneralm h3,
.fgeneralmg h3,
.fgeneralmch h3,
.ulg h3,
.ulp h3,
.ulpr h3,
.ulps h3 {
	min-height: 44px;
	margin: 18px 0 12px;
	padding: 0 14px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-radius: var(--radius);
	background: var(--brand);
	color: #fff;
}

.contenedor > h3 p,
.fgeneralm h3 p,
.fgeneralmg h3 p,
.fgeneralmch h3 p,
.ulg h3 p,
.ulp h3 p,
.ulpr h3 p,
.ulps h3 p {
	margin: 0;
	color: inherit;
	font-size: 15px;
	font-weight: 800;
}

.contenedor > h3 span,
.contenedor > h3 span a,
.contenedor > h3 span div {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #fff !important;
}

.app-alert-strip {
	margin-top: 14px;
	padding: 11px 14px;
	display: flex;
	align-items: center;
	gap: 10px;
	border: 1px solid #fedf89;
	border-radius: var(--radius);
	background: #fff8e8;
	color: var(--warning);
	font-weight: 800;
}

/* Actions */

.menusup {
	position: sticky;
	top: 12px;
	z-index: 900;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 18px;
	padding: 10px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: rgba(255, 255, 255, .9);
	box-shadow: 0 4px 14px rgba(16, 24, 40, .04);
	backdrop-filter: blur(12px);
}

.menusup li:first-child {
	margin-right: auto;
}

.menusup a {
	min-width: 44px;
	height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 12px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: #fff;
	color: var(--brand-dark);
	font-size: 18px;
}

.menusup a [class^="icono-"],
.menusup a [class*=" icono-"] {
	font-size: 14px !important;
	line-height: 1;
}

.menusup a:hover,
.menusup a:focus {
	border-color: var(--brand);
	background: var(--brand-soft);
	outline: 0;
}

/* Forms */

.fgeneral,
.fgeneralpop,
.fimportante {
	width: 100%;
	margin: 12px 0 18px;
	padding: 18px;
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 10px 14px;
	align-items: center;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow);
}

.fgeneralpop {
	position: static !important;
}

.fgeneral label,
.fgeneralpop label,
.fimportante label,
.fgeneralm label,
.fgeneralmg label,
.fgeneralmch label {
	grid-column: span 2;
	color: var(--muted);
	font-size: 12px;
	font-weight: 800;
	text-align: left;
	text-transform: uppercase;
}

.fgeneral input,
.fgeneral select,
.fgeneral textarea,
.fgeneralpop input,
.fgeneralpop select,
.fgeneralpop textarea,
.fimportante input,
.fimportante select,
.fimportante textarea,
.fgeneralm input,
.fgeneralm select,
.fgeneralm textarea,
.fgeneralmg input,
.fgeneralmg select,
.fgeneralmg textarea,
.fgeneralmch input,
.fgeneralmch select,
.fgeneralmch textarea {
	grid-column: span 4;
	width: 100%;
	min-width: 0;
	min-height: 44px;
	padding: 0 12px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: #fff;
	color: var(--ink);
	text-align: left;
}

.fgeneral textarea,
.fgeneralpop textarea,
.fimportante textarea {
	grid-column: 1 / -1;
	min-height: 96px;
	padding-top: 10px;
	resize: vertical;
}

.fgeneral p,
.fgeneralpop p,
.fimportante p {
	grid-column: 1 / -1;
	margin: 0;
	color: var(--muted);
}

.fgeneral input:focus,
.fgeneral select:focus,
.fgeneral textarea:focus,
.fgeneralpop input:focus,
.fgeneralpop select:focus,
.fgeneralpop textarea:focus,
.fimportante input:focus,
.fimportante select:focus,
.fimportante textarea:focus {
	border-color: var(--brand);
	box-shadow: 0 0 0 4px rgba(73, 136, 207, .16);
	outline: 0;
}

.gbutton,
.fgeneral input[type="submit"],
.fgeneralpop input[type="submit"],
.fimportante input[type="submit"],
.boton {
	grid-column: span 3 / -1;
	min-width: 140px;
	min-height: 44px;
	border: 0;
	border-radius: var(--radius);
	background: var(--brand);
	color: #fff !important;
	font-weight: 800;
	text-align: center;
}

.gbutton:hover,
.boton:hover {
	background: var(--brand-dark);
}

/* Detail panels */

.dcontenido,
.fgeneralm,
.fgeneralmg,
.fgeneralmch,
.ulp,
.ulg,
.ulpr,
.ulps,
.ufac,
.factura,
.femergente {
	width: 100%;
	margin: 12px 0 18px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: 0 6px 18px rgba(16, 24, 40, .05);
}

.dcontenido {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	padding: 12px;
}

.dcontenido li {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 10px;
	border-radius: var(--radius);
	background: #f8fbff;
}

.dcontenido span {
	color: var(--muted);
	font-weight: 800;
}

.importeg {
	width: 100%;
	margin: 14px 0;
	padding: 18px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	color: var(--success);
	font-size: 32px;
	font-weight: 800;
	text-align: center;
}

/* Lists */

.ulp,
.ulg,
.ulpr,
.ulps,
.ufac {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.ulp li,
.ulg li,
.ulpr li,
.ulps li,
.ufac li {
	width: max-content;
	min-width: 100%;
	border-bottom: 1px solid var(--line);
}

.ulp li:last-child,
.ulg li:last-child,
.ulpr li:last-child,
.ulps li:last-child,
.ufac li:last-child {
	border-bottom: 0;
}

.ulp li.h,
.ulpr li.h,
.ulps li.h {
	background: var(--brand-soft);
	font-weight: 800;
}

.ulp li a,
.ulg li a,
.ulpr li a,
.ulps li a,
.ufac li div {
	min-width: 100%;
	min-height: 42px;
	display: flex;
	align-items: stretch;
	color: var(--ink);
}

.ulp li:not(.h):hover,
.ulg li:not(.h):hover,
.ulpr li:not(.h):hover,
.ulps li:not(.h):hover {
	background: #f8fbff;
}

.ulp span,
.ulg span,
.ulpr span,
.ulps span,
.ufac span {
	min-height: 42px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 8px 10px;
	color: var(--ink);
}

.ulg a {
	align-items: center;
	justify-content: space-between;
	padding: 0 12px;
}

.ulg p,
.ufac p {
	margin: 0;
}

.s10 { width: 10px !important; }
.s20 { width: 20px !important; }
.s30 { width: 30px !important; }
.s40 { width: 40px !important; }
.s45 { width: 45px !important; }
.s50 { width: 50px !important; }
.s55 { width: 55px !important; }
.s60 { width: 60px !important; }
.s65 { width: 65px !important; }
.s75 { width: 75px !important; }
.s80 { width: 80px !important; }
.s90 { width: 90px !important; }
.s100 { width: 100px !important; }
.s160 { width: 160px !important; }
.s260 { width: 260px !important; }
.s300 { width: 300px !important; }
.s400 { width: 400px !important; }
.s500 { width: 500px !important; }
.s600 { width: 600px !important; }
.s700 { width: 700px !important; }
.s800 { width: 800px !important; }
.s900 { width: 900px !important; }

/* Small list panels used in POS/detail views */

.fgeneralm,
.fgeneralmg,
.fgeneralmch {
	padding: 14px;
}

.fgeneralm li,
.fgeneralmg li,
.fgeneralmch li {
	padding: 10px 0;
	border-bottom: 1px solid var(--line);
}

.fgeneralm li:last-child,
.fgeneralmg li:last-child,
.fgeneralmch li:last-child {
	border-bottom: 0;
}

.fgeneralm a,
.fgeneralmg a,
.fgeneralmch a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	color: var(--ink);
}

.fgeneralm p,
.fgeneralmg p,
.fgeneralmch p {
	margin: 0;
	font-weight: 800;
	text-align: right;
}

/* Cards and menu pages */

.menu,
.reportes,
body > nav:not(.app-quicknav) ul {
	width: 100%;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
	gap: 12px;
	margin: 16px 0;
}

.menu li,
.reportes li,
body > nav:not(.app-quicknav) li {
	min-height: 126px;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: 0 6px 18px rgba(16, 24, 40, .05);
}

.menu li:hover,
.reportes li:hover,
body > nav:not(.app-quicknav) li:hover {
	border-color: var(--brand);
}

.menu a,
.reportes a,
body > nav:not(.app-quicknav) a {
	width: 100%;
	height: 100%;
	display: grid;
	place-items: center;
	gap: 8px;
	padding: 18px;
	color: var(--ink);
	text-align: center;
}

.menu p,
.menu span,
.reportes p,
.reportes span,
body > nav:not(.app-quicknav) p,
body > nav:not(.app-quicknav) span {
	margin: 0;
	color: inherit;
}

.menu p,
.reportes p,
body > nav:not(.app-quicknav) span {
	color: var(--brand-dark);
	font-size: 32px;
}

body > nav:not(.app-quicknav) {
	width: min(1120px, calc(100% - 32px));
	min-height: 100vh;
	margin: 0 auto;
	padding: 28px 0;
}

body > nav:not(.app-quicknav) h2 {
	margin: 0 0 18px;
	color: var(--ink);
	font-size: 28px;
	font-weight: 800;
}

/* Messages and dialogs */

.message {
	position: relative;
	width: 100%;
	margin: 10px 0 16px;
	padding: 14px 44px 14px 14px;
	border: 1px solid var(--line);
	border-left: 4px solid var(--brand);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: 0 6px 18px rgba(16, 24, 40, .05);
}

.message span,
#mensaje span {
	display: block;
	margin: 0 0 4px;
	font-size: 16px !important;
	font-weight: 800;
}

.message-text {
	margin: 0;
	color: var(--muted);
}

.message .close {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--muted);
}

.conf {
	position: fixed;
	inset: 0;
	z-index: 3000;
	display: grid;
	place-items: center;
	padding: 20px;
	background: rgba(15, 23, 42, .55);
}

.conf .contd {
	width: min(420px, 100%);
	padding: 24px;
	border-radius: var(--radius);
	background: #fff;
	box-shadow: var(--shadow);
}

.conf p {
	margin: 0 0 18px;
	color: var(--ink);
	font-size: 18px;
	text-align: center;
}

.conf a {
	width: calc(50% - 6px);
	height: 48px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0 3px;
	border-radius: var(--radius);
	background: var(--brand);
	color: #fff;
}

.conf .app-line-icon {
	width: 18px;
	height: 18px;
}

.conf #cno {
	background: var(--danger);
}

/* Utility/special screens */

.factura,
.femergente {
	width: min(100%, 980px);
	height: auto !important;
	margin: 18px auto;
	padding: 16px;
}

.datoscliente,
.datoscorto,
.cright,
.textshort,
#grafica {
	width: 100% !important;
	max-width: 100%;
}

.ishort {
	width: 100% !important;
	margin: 8px 0 !important;
}

.ftickets {
	max-width: 420px;
	background: #fff;
}

.bolsas {
	width: 100%;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 12px;
}

.bolsas li {
	border: 1px solid var(--line);
	border-radius: var(--radius);
	background: #fff;
}

.bolsas a {
	min-height: 110px;
	display: grid;
	place-items: center;
	padding: 18px;
	color: var(--brand-dark);
	font-size: 34px;
}

.app-footer {
	margin-top: 20px;
	padding-bottom: 20px;
	color: var(--muted);
	font-size: 13px;
	text-align: center;
}

.app-footer p {
	margin: 0;
}

/* Mobile */

@media (max-width: 900px) {
	body {
		padding-top: 64px;
	}

	body.is-menu-open {
		overflow: hidden;
	}

	.app-mobilebar {
		position: fixed;
		inset: 0 0 auto 0;
		z-index: 1500;
		height: 64px;
		display: grid;
		grid-template-columns: 48px 1fr 48px;
		align-items: center;
		gap: 8px;
		padding: 8px 12px;
		border-bottom: 1px solid var(--line);
		background: rgba(255, 255, 255, .96);
		backdrop-filter: blur(16px);
	}

	.app-mobile-brand {
		display: inline-flex;
		align-items: center;
		justify-self: center;
		gap: 10px;
		color: var(--brand-dark);
		font-weight: 800;
	}

	.app-mobile-brand .app-brand-mark.minilogo {
		width: 38px;
		height: 38px;
		flex-basis: 38px;
	}

	.app-sidebar-scrim {
		position: fixed;
		inset: 0;
		z-index: 1390;
		display: block;
		background: rgba(15, 23, 42, .44);
		opacity: 0;
		pointer-events: none;
		transition: opacity .18s ease;
	}

	body.is-menu-open .app-sidebar-scrim {
		opacity: 1;
		pointer-events: auto;
	}

	.app-shellbar {
		width: min(86vw, 318px);
		transform: translateX(-105%);
		box-shadow: 16px 0 46px rgba(15, 23, 42, .22);
	}

	.app-shellbar.is-mobile-open {
		transform: translateX(0);
	}

	.app-shellbar .app-brand-text,
	.app-shellbar .app-nav-label,
	.app-shellbar .app-quicknav small,
	.app-shellbar .app-sidebar-foot .app-nav-label {
		opacity: 1;
		transform: translateX(0);
		pointer-events: auto;
	}

	.app-sidebar-toggle {
		display: none;
	}

	.app-alert-strip,
	.app-shellbar ~ .boxc,
	.app-shellbar ~ .app-footer,
	.app-shellbar.is-expanded ~ .app-alert-strip,
	.app-shellbar.is-expanded ~ .boxc,
	.app-shellbar.is-expanded ~ .app-footer {
		width: calc(100% - 20px);
		margin-left: 10px;
		margin-right: 10px;
	}

	.boxc {
		padding-top: 14px;
	}

	.contenedor > h1,
	.acenter {
		font-size: 23px;
	}

	.menusup {
		top: 74px;
		flex-wrap: nowrap;
		overflow-x: auto;
	}

	.fgeneral,
	.fgeneralpop,
	.fimportante {
		grid-template-columns: 1fr;
		padding: 14px;
	}

	.fgeneral label,
	.fgeneral input,
	.fgeneral select,
	.fgeneral textarea,
	.fgeneralpop label,
	.fgeneralpop input,
	.fgeneralpop select,
	.fgeneralpop textarea,
	.fimportante label,
	.fimportante input,
	.fimportante select,
	.fimportante textarea,
	.gbutton,
	.fgeneral input[type="submit"],
	.fgeneralpop input[type="submit"],
	.fimportante input[type="submit"],
	.boton {
		grid-column: 1 / -1;
	}

	.dcontenido {
		display: grid;
		grid-template-columns: 1fr;
	}

	.dcontenido li {
		justify-content: space-between;
	}

	.ulp,
	.ulpr,
	.ulps,
	.ufac,
	.ulg {
		border: 0;
		background: transparent;
		box-shadow: none;
		overflow: visible;
	}

	.ulp li.h,
	.ulpr li.h,
	.ulps li.h {
		display: none;
	}

	.ulp li,
	.ulpr li,
	.ulps li,
	.ufac li,
	.ulg li {
		width: 100%;
		min-width: 0;
		margin-bottom: 10px;
		border: 1px solid var(--line);
		border-radius: var(--radius);
		background: #fff;
		box-shadow: 0 4px 14px rgba(16, 24, 40, .04);
		overflow: hidden;
	}

	.ulp li a,
	.ulpr li a,
	.ulps li a,
	.ufac li div,
	.ulg li a {
		width: 100%;
		min-width: 0;
		display: grid;
		grid-template-columns: 1fr;
		padding: 12px;
	}

	.ulp span,
	.ulpr span,
	.ulps span,
	.ufac span {
		width: 100% !important;
		min-height: 0;
		justify-content: space-between;
		padding: 6px 0;
		text-align: right;
	}

	.ulp span[data-label]::before,
	.ulpr span[data-label]::before,
	.ulps span[data-label]::before,
	.ufac span[data-label]::before {
		content: attr(data-label);
		color: var(--muted);
		font-weight: 800;
		text-align: left;
	}

	.s10,
	.s20,
	.s30,
	.s40,
	.s45,
	.s50,
	.s55,
	.s60,
	.s65,
	.s75,
	.s80,
	.s90,
	.s100,
	.s160,
	.s260,
	.s300,
	.s400,
	.s500,
	.s600,
	.s700,
	.s800,
	.s900 {
		width: 100% !important;
	}

	.menu,
	.reportes,
	body > nav:not(.app-quicknav) ul {
		grid-template-columns: 1fr 1fr;
	}

	table {
		display: block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

@media (max-width: 480px) {
	.menu,
	.reportes,
	body > nav:not(.app-quicknav) ul {
		grid-template-columns: 1fr;
	}

	.formlogin {
		padding: 22px;
	}
}

@media print {
	.app-mobilebar,
	.app-shellbar,
	.app-sidebar-scrim,
	.menusup,
	.app-footer {
		display: none !important;
	}

	body {
		padding: 0;
		background: #fff;
		color: #000;
	}

	.boxc,
	.app-shellbar ~ .boxc {
		width: 100%;
		margin: 0;
		padding: 0;
	}
}