/*
 * 系统默认手机底栏 mfoot_box
 * 主题覆盖：Public/xy_mfoot.css 或 xiaoyucms/{主题}/css/xy_mfoot.css
 */
:root{
	--xy-mfoot-bg:#f8f8f8;
	--xy-mfoot-border:#e8e8e8;
	--xy-mfoot-color:#555;
	--xy-mfoot-hover:#0c4d89;
	--xy-mfoot-hover-bg:rgba(12,77,137,.07);
	--xy-mfoot-wa:#128C7E;
	--xy-mfoot-wa-bg:rgba(18,140,126,.08);
	--xy-mfoot-top-bg:#555;
	--xy-mfoot-top-hover:linear-gradient(135deg,var(--xy-skin-primary,#FF9E16) 0%,#e88a0a 100%);
	--xy-mfoot-z:1030;
	--xy-mfoot-height:50px;
}

.mfoot_box{display:none;}

.footer-bar{margin-bottom:56px;}

@media screen and (max-width:768px){
	body{padding-bottom:56px;}
	.mfoot_box{
		display:block;
		position:fixed;
		left:0;
		right:0;
		bottom:0;
		background:var(--xy-mfoot-bg);
		border:none;
		border-top:1px solid var(--xy-mfoot-border);
		border-radius:0;
		min-height:var(--xy-mfoot-height);
		margin:0;
		box-shadow:none;
		z-index:var(--xy-mfoot-z);
	}
	.mfoot_box .navbar-collapse{display:none;}
	.mfoot_inner{
		display:flex;
		align-items:stretch;
		height:var(--xy-mfoot-height);
	}
	.mfoot_nav{
		flex:1;
		display:flex;
		align-items:center;
		justify-content:center;
		position:relative;
		border-right:1px solid var(--xy-mfoot-border);
		float:none;
		width:auto;
		background:transparent;
	}
	.mfoot_nav:last-child{border-right:none;}
	.mfoot_nav a{
		display:flex;
		flex-direction:column;
		align-items:center;
		justify-content:center;
		color:var(--xy-mfoot-color);
		padding:5px 2px;
		height:100%;
		width:100%;
		text-decoration:none;
		-webkit-tap-highlight-color:transparent;
		transition:color .28s ease,background .28s ease;
	}
	.mfoot_box.navbar-default .mfoot_nav a{
		color:var(--xy-mfoot-color);
		background:transparent;
	}
	.mfoot_nav:not(.mfoot_nav_top) a:hover,
	.mfoot_nav:not(.mfoot_nav_top) a:focus{
		color:var(--xy-mfoot-hover);
		background:var(--xy-mfoot-hover-bg);
		text-decoration:none;
	}
	.mfoot_box.navbar-default .mfoot_nav:not(.mfoot_nav_top) a:hover,
	.mfoot_box.navbar-default .mfoot_nav:not(.mfoot_nav_top) a:focus{
		color:var(--xy-mfoot-hover);
		background:var(--xy-mfoot-hover-bg);
	}
	.mfoot_nav .fa,
	.mfoot_nav .w105-iconfont{
		font-size:18px;
		line-height:1;
		margin-bottom:3px;
		transition:transform .28s ease,color .28s ease;
	}
	.mfoot_nav:not(.mfoot_nav_top) a:hover .fa,
	.mfoot_nav:not(.mfoot_nav_top) a:focus .fa,
	.mfoot_nav:not(.mfoot_nav_top) a:hover .w105-iconfont,
	.mfoot_nav:not(.mfoot_nav_top) a:focus .w105-iconfont{
		transform:translateY(-2px);
	}
	.mfoot_label{
		font-size:10px;
		font-weight:700;
		line-height:1.2;
		display:block;
		letter-spacing:.02em;
		transition:color .28s ease;
	}
	.mfoot_nav:first-child a:hover,
	.mfoot_nav:first-child a:focus,
	.mfoot_box.navbar-default .mfoot_nav:first-child a:hover,
	.mfoot_box.navbar-default .mfoot_nav:first-child a:focus{
		color:var(--xy-mfoot-wa);
		background:var(--xy-mfoot-wa-bg);
	}
	.mfoot_nav:first-child a:hover .fa,
	.mfoot_nav:first-child a:focus .fa{
		color:var(--xy-mfoot-wa);
	}
	.mfoot_nav_top a{padding:0;}
	.mfoot_top_btn{
		display:flex;
		align-items:center;
		justify-content:center;
		width:34px;
		height:34px;
		border-radius:50%;
		background:var(--xy-mfoot-top-bg);
		color:#fff;
		transition:background .28s ease,transform .28s ease,box-shadow .28s ease;
	}
	.mfoot_nav_top a:hover .mfoot_top_btn,
	.mfoot_nav_top a:focus .mfoot_top_btn{
		background:var(--xy-mfoot-top-hover);
		transform:translateY(-2px);
		box-shadow:0 4px 12px rgba(255,158,22,.35);
	}
	.mfoot_top_btn .fa,
	.mfoot_top_btn .w105-iconfont{
		margin-bottom:0;
		font-size:15px;
		color:#fff;
	}
}