@import 'vars.css';

page{
	width: 100%;
	height: 100%;
	color: #2B303A;
	font-size: var(--global-size);
	box-sizing: border-box;
}
view,text,scroll-view{
	box-sizing: border-box;
}
icon{
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

>>> ax-custom-title .title{
	font-size: 18px;
}

#root{
	width: 100%;
	height: 100%;
	background-color: var(--global-background);
	color: var(--font-main);
	overflow: auto;
}

/* 占位符样式 */
.app-placeholder,
.app-placeholder::placeholder{
	color: #ccc;
}

/* 分组标题 */
.app-group-title{
	padding: 10px;
	text-align: center;
	color: var(--font-des);
}

/* 状态栏 */
.app-status-bar{
	min-height: 34px;
	background-color: var(--global-background);
}

/* 弹性盒子模型 */
.app-flex-one{
	flex: 1;
}
.app-flex{
	display: flex;
}
.app-flex.middle{
	align-items: center;
}
.app-flex.c-center{
	align-items: center;
	justify-content: center;
}
.app-flex.c-between{
	align-items: center;
	justify-content: space-between;
}
.app-flex.c-around{
	align-items: center;
	justify-content: space-around;
}
.app-flex.column{
	flex-direction: column;
}

/* 标题栏 */
.app-title-bar{
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 50px;
	padding: 0 15px 0 10px;
	color: #333;
	background-color: var(--global-background);
	font-size: 16px;
}
.app-title-bar .icon-item{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 22px;
	width: 30px;
	height: 30px;
}
.app-title-bar .icon-item.back{
	font-size: 24px;
	transform: scaleX(-100%);
}

/* 隐藏滚动条 */
scroll-view.app-hide-scrollbar >>> ::-webkit-scrollbar,
.app-hide-scrollbar::-webkit-scrollbar{
	display: none;
}

/* 不可选择 */
.app-unselectable{
	user-select: none;
}