:root {
	--mcj-primary: #26C48C;
	--mcj-dark: #132720;
	--mcj-dark2: #132720;
	--mcj-white: #FFFFFF;
	--mcj-radius: 16px;
	--mcj-shadow: 0 10px 30px rgba(19, 39, 32, 0.12);
}

.mcj-admin, .mcj-pantalla, .mcj-calc, .mcj-gate, .mcj-topbar {
	font-family: inherit;
	box-sizing: border-box;
}

.mcj-admin *, .mcj-pantalla *, .mcj-calc *, .mcj-gate *, .mcj-topbar * {
	box-sizing: border-box;
	font-family: inherit;
}

.mcj-btn {
	appearance: none;
	border: none;
	cursor: pointer;
	border-radius: 999px;
	padding: 12px 22px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.2px;
	transition: transform .15s ease, box-shadow .15s ease, background .15s ease, opacity .15s ease;
}
.mcj-btn:active { transform: scale(0.97); }

.mcj-btn--primary {
	background: linear-gradient(135deg, var(--mcj-primary), #1ea877);
	color: var(--mcj-white) !important;
	box-shadow: 0 8px 20px rgba(38, 196, 140, 0.35);
}
.mcj-btn--primary:hover { box-shadow: 0 10px 26px rgba(38, 196, 140, 0.45); }

.mcj-btn--ghost {
	background: rgba(19, 39, 32, 0.06);
	color: var(--mcj-dark) !important;
}
.mcj-btn--ghost:hover { background: rgba(19, 39, 32, 0.1); }

.mcj-btn:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }