/*For device: tablet, mobile*/
/*Min -> 320px -> 768px ->992px -> 1024px -> 1200 -> Max*/

#menu-logo-mobile{ display:none; }
@media only screen and (min-width: 1200px) {
	.container {
		width: 1200px;
	}
}
	
@media only screen and (max-width: 767px) {
	img.header, .top-banner{
		display:none !important;
	}
	header .top-header .wrap-top .txt{
		display:none;
	}
	
	/* Drawer trượt */
	#wle-top-menu{
		display: flex;
		flex-direction: column;
		position: fixed;
		z-index: 9999999;
		top: 0;
		bottom: 0;
		height: 100%;
		width: 80%;
		max-width: 360px;
		left: -100%;
		transition: left .35s ease;
		box-shadow: 4px 0 28px rgba(0, 0, 0, 0.2);
		background: #ff7800;
		overflow: hidden;
	}
	body.active #wle-top-menu{
		left:0;
	}

	#wle-top-menu .container {
		width: 100%;
		max-width: 100%;
		padding-left: 0;
		padding-right: 0;
		flex: 1;
		min-height: 0;
		display: flex;
		flex-direction: column;
	}

	#wle-top-menu .row.main-bar {
		flex: 1;
		display: flex;
		flex-direction: column;
		float: none;
		margin-left: 0;
		margin-right: 0;
		min-height: 0;
	}

	/* Ô tìm kiếm: full width, đặt trên danh mục */
	#wle-header-main-search-menu {
		order: -1;
		width: 100% !important;
		max-width: 100% !important;
		float: none !important;
		padding: 12px;
		flex-shrink: 0;
		border-bottom: 1px solid rgba(255,255,255,0.22);
	}

	#wle-header-main-search-menu .woodmart-search-form {
		width: 100%;
	}

	#wle-header-main-search-menu .searchform_menu {
		display: flex;
		flex-direction: row;
		align-items: stretch;
		width: 100% !important;
		max-width: 100%;
		height: auto !important;
		margin-left: 0 !important;
		box-sizing: border-box;
	}

	#wle-header-main-search-menu .searchform_menu .s {
		flex: 1 1 auto;
		min-width: 0 !important;
		width: 100% !important;
		max-width: none !important;
		margin-left: 0 !important;
		min-height: 44px;
		padding: 0 12px;
		box-sizing: border-box;
		border-radius: 8px 0 0 8px !important;
		border: 1px solid rgba(255,255,255,0.45) !important;
		background: #fff !important;
		font-size: 15px !important;
	}

	#wle-header-main-search-menu .searchform_menu .searchsubmit {
		flex: 0 0 48px !important;
		width: 48px !important;
		min-height: 44px;
		line-height: 44px !important;
		height: auto !important;
		padding: 0 !important;
		border-radius: 0 8px 8px 0 !important;
		box-sizing: border-box;
		background: rgba(255,255,255,0.95) !important;
		border: 1px solid rgba(255,255,255,0.55) !important;
		border-left: 0 !important;
		color: #ff7800 !important;
	}

	/* Cột menu */
	#wle-top-menu .main-bar > div:first-child{
		flex: 1 1 auto;
		min-height: 0;
		float: none !important;
		width: 100% !important;
		overflow: hidden;
		display: flex;
		flex-direction: column;
	}

	/* Bỏ float / hover mở menu con — chỉ mở khi có .is-open */
	#wle-top-menu ul#main-nav {
		flex: 1 1 auto;
		min-height: 0;
		max-height: none;
		overflow-y: auto;
		overflow-x: hidden;
		display: flex;
		flex-direction: column;
		-webkit-overflow-scrolling: touch;
		float: none !important;
		width: 100% !important;
		padding: 4px 0 24px !important;
		margin: 0 !important;
		list-style: none;
		background: transparent;
	}

	#wle-top-menu ul#main-nav li:hover > ul {
		display: none !important;
	}

	#wle-top-menu ul#main-nav li.menu-item-has-children.is-open > ul {
		display: block !important;
	}

	#wle-top-menu ul#main-nav ul {
		position: static !important;
		width: 100% !important;
		background: transparent;
		box-shadow: none !important;
		display: none;
		opacity: 1 !important;
		visibility: visible !important;
		padding: 0;
		margin: 0;
	}

	#wle-top-menu ul#main-nav li{
		display: block !important;
		float: none !important;
		width: 100%;
		position: relative;
		text-align:left;
		padding: 0;
		margin: 0;
		list-style: none;
		border-bottom: 1px solid rgba(255, 255, 255, 0.14);
	}

	ul#main-nav > li:after, ul#main-nav > li:before{
		background:none;
	}

	ul#main-nav > li:before,
	ul#main-nav > li > ul > li:before,
	ul#main-nav ul ul li:before {
		content: none !important;
		display: none !important;
	}

	ul#main-nav .menu-item-has-children > a:after {
		display: none !important;
		content: none !important;
	}

	ul#main-nav ul ul .menu-item-has-children > a:after {
		transform: none;
		display: none !important;
	}

	ul#main-nav > li a,
	ul#main-nav .sub-menu li > a {
		float:none;
		display: block !important;
		padding: 14px 48px 14px 16px !important;
		line-height: 1.35;
		color: #fff !important;
		font-weight: 600 !important;
		text-decoration: none !important;
		transition: background 0.18s ease, color 0.18s ease;
		box-sizing: border-box;
	}

	ul#main-nav .sub-menu li > a{
		padding-top: 12px !important;
		padding-bottom: 12px !important;
		padding-left: 22px !important;
		padding-right: 44px !important;
		font-size: inherit !important;
		opacity: 1 !important;
		font-weight: 500 !important;
	}

	ul#main-nav > li a:hover {
		background: rgba(255,255,255,0.08) !important;
	}

	ul#main-nav > li ul li{
		display:block !important;
		width:100%;
		border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	}

	ul#main-nav > li.menu-item-has-children > a:focus,
	ul#main-nav .sub-menu .menu-item-has-children > a:focus {
		outline: 2px solid rgba(255,255,255,0.5);
		outline-offset: -2px;
	}

	/* Nút +/- mở cấp con */
	#main-nav .menu-sub-toggle{
		position: absolute;
		top: 22px;
		right: 8px;
		transform: translateY(-50%);
		width: 40px;
		height: 40px;
		margin: 0;
		padding: 0;
		border: 1px solid rgba(255,255,255,0.4);
		background: rgba(255,255,255,0.12);
		color: #fff;
		font-family: Arial, Helvetica, sans-serif;
		line-height: 1;
		font-weight: 700;
		cursor: pointer;
		border-radius: 8px;
		z-index: 3;
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		transition: background 0.2s ease, border-color 0.2s ease;
	}

	#main-nav .menu-sub-toggle:active {
		background: rgba(255,255,255,0.28);
	}

	#main-nav .menu-sub-toggle .symbol {
		position: absolute;
		line-height: 1;
		font-size: 20px;
	}

	#main-nav .menu-sub-toggle .symbol-minus {
		display: none;
	}

	#main-nav li.menu-item-has-children.is-open > .menu-sub-toggle .symbol-plus {
		display: none;
	}

	#main-nav li.menu-item-has-children.is-open > .menu-sub-toggle .symbol-minus {
		display: block;
	}
	
	body.active #menu-mobile-show .fa:before{
		content: "\f00d";
	}
	
	#wle-sidebar-left, #wle-sidebar-center, #wle-sidebar-right{
		width:100%;
	}
	
	footer .widget .content {
		margin-bottom:10px;
	}
	
	#menu-logo-mobile{ display:block; float:left; width:100%; padding:10px 0; }
	#menu-logo-mobile .mlogo{
		height:60px;
		width:auto;
	}
	#menu-logo-mobile .right{
		text-align:right;
	}
	#menu-mobile-show{
		font-size: 20px;
		width: 40px;
		height: 40px;
		border: 1px solid #ff7800;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		line-height: 40px;
		color: #ff7800;
		margin-top: 9px;
		border-radius: 8px;
		cursor: pointer;
	}
}


@media only screen and (max-width: 500px) {
	
}