/*
Theme Name: Giới thiệu và tuyển Dụng cardina
Text Domain: cardina.vn
Version: 0.0.1
Requires PHP: 7.0
Description: theme thuộc quyền sở hữu của cardina
Author: Dương dịu dàng 
Author URI: http://cardina.vn/
*/

body{
	font-size: 14px;
	font-family: Inter, sans-serif;
	line-height: 1.5;
	color: #222;
	margin:0px;
	font-weight: 400;
}
#use-box{
	display:none;
}
.list-order-mb{
	margin: 20px 0px;
}
.order-item{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	background: #ff690054;
	padding: 10px 20px;
	margin-bottom: 1px;
	color: #5d5353;
	gap: 5px;
	font-weight: 500;
}
.order-list-number{
	font-weight: 600;
}
.user-money{
	display: flex;
	justify-content: space-between;
	padding: 0px 20px;

}
.user-money-number{
	font-weight: 700;
	font-size: 16px;
	color: #f17f0f;
}
.user-money-icon{
	display: flex;
	align-items: center;
	gap: 10px;
}
.user-money-icon img{
	width: 25px;
}
/* Nền mờ bao phủ toàn màn hình */
.menu-mb-bgr {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #504c4c69;
    z-index: 9999;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
}

/* Khi menu được kích hoạt (thêm class active) */
.menu-mb-bgr.cccactive {
    opacity: 1;
    visibility: visible;
}
.close-menu img{
	width: 40px;
	cursor: pointer;
}
/* Sidebar bên trong */
.warp-menu-mb {
    position: fixed;
    top: 0;
    left: 0;
    width: 80%; /* 80% chiều rộng màn hình */
    height: 100%;
    background: #fff; /* Màu nền menu */
    box-shadow: 2px 0 10px rgba(0,0,0,0.2);
    transform: translateX(-100%); /* Đẩy menu ra khỏi màn hình bên trái */
    transition: transform 0.3s ease-in-out;
    z-index: 10000;
    max-width: 400px;
}
.use-active{
	display: block !important;
}
.info-li{
	display: flex;
	align-items: center;
	gap: 10px;
}
.info-li img{
	width: 20px;
}
/* Khi menu trượt vào */
.menu-mb-bgr.cccactive .warp-menu-mb {
    transform: translateX(0);
}
.info-user{
	padding: 0px 20px;
	margin-top: 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 13px;
}
/* Nút đóng x */
.close-menu {

}
.mb-hear-mn{
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 15px;
	border-bottom: 1px solid #ccc;
}
.main-menu{
	display: flex;
	align-items: center;
	margin-block-start: 0px;
	margin-block-end: 0px;
}
img{
	width: 100%;
	height: auto;
	object-fit: cover;
	object-position: center;
	display: block;
}
ul{
		padding-inline-start: 0px;
}
.topbar{
	width: 100%;
	padding: 5px 0px;
	background: #fff5e5;
	color: #f17f0f;
}
.container{
	max-width: 1536px;
	margin: 0px auto;
}
.topbar-list{
	display: flex;
	justify-content: space-around;
}
.topbar-list img{
	width: 17px;
}
.topbar-item{
	display: flex;
	align-items: center;
	gap: 10px;
}
.top-head .logo{
	width: 50px;
}
.Doprava-text p{
	margin-block-start: 0px;
	margin-block-end: 0px;
}
.top-head-item{
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 16px;
}
.Doprava{
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;	
}
.language-c{

}
.top-head{
	display: flex;
	grid-template-columns: repeat(3, 1fr);
	padding: 20px 0px;
}
.head{
	background: #F6F6F6;
}
.top-head-s1{
	width: 	25%;
}
.top-head-s3{
}
.top-head-s2{
	width: 	50%;
	justify-content: center;
	align-items: center;
}
.top-head-s3{
	justify-content: flex-end;
}

.top-head-s2 input{
	width: 70%;
	height: 30px;
	border-radius: 7px 0px 0px 7px;
	border: solid 1px #c3c3c3;
	position: relative;
	left: 16px;
	padding: 5px 5px 5px 13px;
}
.top-head-s2 svg{
	width: 24px;
	background: #f17f0f;
	padding: 9px;
	border-radius: 0px 7px 7px 0px;
}
.top-head svg, .mb-hear-mn svg{
	width: 	24px;
}
.mb-use-icon{
	display: flex;
	align-items: center;
	gap: 10px;
	color: #f17f0f;
}
.login-head{
	display: flex;
	align-items: center;
	gap: 10px;
	color: #f17f0f;
	font-size: 14px;
	position: relative;
}
.login-head a{
	color: #f17f0f;
	cursor: pointer;
}
a{
	text-decoration: none;
	color: #222;
}
a:hover{
 color:#f17f0f ;
 cursor: pointer;
}
.register-head div,.register-head a{
	padding: 9px 15px;
	background: #f17f0f;
	color: #fff;
	border-radius: 6px;
	border: none;
}
.data-main-nav-item{
	width: fit-content;
	display: flex;
	color: #fff;
	background: #f17f0f;
	align-items: center;
	gap: 10px;	
	padding: 8px 10px;
	width: fit-content;
	border-radius: 6px;
}
.haed-main-nav-item{
	border-radius: 6px;
	max-height:40px;
}
.haed-main-nav-item a{
	padding: 8px 10px;
	width: fit-content;
	border-radius: 6px;
	width: fit-content;
	display: flex;
	gap: 10px;	
	border-radius: 6px;
	border: 0 solid #e5e7eb;
	--tw-text-opacity: 1;
	color: rgb(34 34 34 / var(--tw-text-opacity, 1));
	font-weight: 600;
	align-items: center;

}
.haed-main-nav{
	display: flex;
	font-weight: 500;
	gap: 10px;
}
.botom-head img{
	width: 18px;
	height: 18px;
}
.botom-head{
	padding-bottom: 12px;
	display: flex;
	justify-content: space-between;
}
.haed-main-nav-item:hover{
	background-color: rgb(233 233 233 / var(--tw-bg-opacity, 1));
}
.data-main-nav-item:hover{
		background: #f3ab64;
}
.haed-mini-cart{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	min-width: 276px;
}
.haed-mini-cart a{
	padding: 6px 13px;
	border-radius: 6px;
	background: rgb(16 129 51 / var(--tw-bg-opacity, 1));
	font-weight: 600;
	color: #fff;
}
.decrease{
	display: flex;
	gap: 8px;
	font-size: 12px;
}
.haed-provisional{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}
.decrease-kc{
	color: rgb(16 129 51 / var(--tw-bg-opacity, 1));
	font-weight: 500;
	padding: 0px 3px;
	background: rgb(16 129 51 / 8%);
	border-radius: 6px;
}
.haed-mini-cart .fa-cart-plus{
	font-size: 21px;
	color: #f17f0f;
	margin: 0px 15px 0px 5px;
}

.category-with-img-item{
	display: flex;
	align-content: center;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center; 
}
.icon-after::after {
	content: "";
	position: absolute;
	height: 20px;
	width: 15px;
	margin-left: 11px;
	margin-top: 3px;
	background: url(/wp-content/themes/dailymarket/assets/img/icon/down-arrow-3.png) no-repeat center center;
	background-size: contain;
	transform: rotate(269deg);
}
.see-more{
	color: #f17f0f;
	margin-right: 25px;
}
.category-with-img-backgroud{
	background: rgb(255 245 229 / var(--tw-bg-opacity, 1));
	padding: 15px;
	border-radius: 10px;
	margin-bottom: 5px;

}

.category-with-img-main{
	display: flex;
}

.category-with-img-image{
	width: 25%;
	overflow: hidden;
	border-radius: 10px 0px 0px 10px;
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;

}
.category-with-img-product{
	width: 75%;
	background: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}
.Objevit{
	height: 0px;
	position: absolute;
}
.Objevit span{
top: -18px;
	position: relative;
	background: #f17f0f;
	padding: 7px 10px;
	color: #fff;
	border-radius: 6px;
	right: 18px;
	font-weight: 500;
}
.Objevit a{
	color: #fff;
}
.product-slider{
	width: 100%;
}
.slider-product-wrap{
		margin: 5px;
}
.slider-product-thumbnar{
	border-radius: 13px;
	overflow: hidden;
	max-height: 185px;
	max-width: 185px;
	display: flex;
	justify-content: center;
	align-items: center;
	--tw-bg-opacity: 1;
	background-color: rgb(243 243 243 / var(--tw-bg-opacity, 1));
	height: 185px;
}
.slider-product-thumbnar img{
	width: var(--box-width)!important;
	height: var(--box-width)!important;
	mix-blend-mode: multiply;
	width: 100% !important;
}
.Volume input{
	background: #fffefe00;
	display: none;
}
.add-active input{
	display: block;
}

.minus-slider{
	text-align: center;
	color: #f17f0f;
	background: #f17f0f5c;
	font-size: 20px;
	padding: 10px;
	font-weight: 900;
	border-radius: 50%;
	width: 20px;
	height: 20px;
	line-height: 20px;
	display: none;
}
.add-active .minus-slider{
	display: block;
}
.add-active {
	background: #d3d3d359 !important;
}
.thumr-prd{
	width: 100% !important;
}
input[type="number"].qty:focus {
  outline: none; /* bỏ viền xanh/đen mặc định */
  border: none;  /* nếu trình duyệt thêm viền mặc định */
  box-shadow: none; /* loại bỏ hiệu ứng đổ bóng khi focus */
}

.add-icon{
	width: 20px;
	height: 20px;
	background: #f17f0f;
	padding: 10px;
	border-radius: 50%;
}
.box-Volume{
	display: flex;
	justify-content: space-around;
	width: 100%;
}
.Volume{
	top: -47px;
	position: relative;
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
	margin-bottom: -33px;
	width: 90%;
	border-radius: 18px;
	background: none;
	cursor: pointer;
}
.slider-product-wrap b{
	font-size: 22px;
}
p{
	margin-block-start: 0px;
	margin-block-end: 0px;
}
.odd{
	font-size: 13px;
	line-height: 20px;
	font-weight: 600;
}
.del{
	display: flex;
	align-items: flex-start;
	gap: 2px;
	width: min-content;
	padding: 0px 3px;
	border-radius: 7px;
	line-height: 28px;
	font-size: 22px;
	font-weight: 600;
}

.sale{
		color: #fff;
		background: rgb(224 31 86 / var(--tw-bg-opacity, 1));
}
.price-product b{
	display: flex;
	align-items: flex-end;
	gap: 5px;
	margin: 5px 0px;
}
.ins{
	font-size: 15px;
	font-weight: 300;
	text-align: -webkit-auto;
	text-decoration: line-through;
	color: #605b5b;
}
.time-sale{
	color: rgb(194 0 25 / var(--tw-text-opacity, 1));
	font-weight: 550;
	background-color: rgb(255 243 244 / var(--tw-bg-opacity, 1));
	width: fit-content;
	padding: 3px;
	border-radius: 5px;
}
.weight-wrap{
	display: flex;
	justify-content: space-between;
	margin-top: 5px;
	color: rgb(102 102 102 / var(--tw-text-opacity, 1));
}
.product-name{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}


.h3-border h3{
	border-bottom: 1px solid #ccc;
	padding-bottom: 18px;
	font-size: 18px;
}
.slider-prd-full-width{
	margin-bottom: 60px;
}


.top-footer{
	display: grid;
	grid-template-columns: repeat(5, 1fr);
}
.top-footer-item li{
	list-style-type: none;
	color: #898989;
}
.top-footer-item li a{
	color: #898989;
}
.top-footer-item li a:hover{
	color: #f17f0f;
}

footer:before{
	position: absolute;
	right: 10%;
	width: 100%;
	height: 100%;
	content: "";
	background: url(/wp-content/themes/dailymarket/assets/img/icon/logo-symbol-white.svg?v=2) no-repeat center right / contain;
	transform: rotate(-17deg);
	transform-origin: top right;
	z-index: -1;
}
footer{
	overflow: hidden;
	background-color: #f1f1f1;
	padding: 50px 0px;
	z-index: 10;
	position: sticky;
	margin-top:40px ;
}

.footer-contact{
		display: flex;
		gap: 70px;
		margin: 40px 0px;
}
.footer-contact-item{
	display: flex;
	align-items: center;
	gap: 20px;
}

.footer-contact-item-img{
	width: 34px;
	height: 34px;
	background: #f17f0f;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.footer-contact-item-img img{
	width: 20px;
	height: 20px;
}
.footer-contact-item-text a{
	color: #f17f0f;
	font-size: 16px;
	font-weight: 600;
}
.footer-social-icon-list{
	display: flex;
	gap: 7px;
	margin-top: 10px;
}

.copyright-note{
	font-size: 12px;
	margin-top: 12px;
}
.copyright{
	margin-top: 22px;
}
.data-main-nav-item-sub{
	position: absolute;
	width: 100%;
	box-shadow: -1px 3px 6px 0px #ccc;
	border-radius:0px 0px 5px 5px;
	background: #fff;
	display: none;
}
.head{
	width: 100%;
	position: sticky;
	width: 100%;
	z-index: 999990;
	top: 0px;
}
.tesst:hover .data-main-nav-item-sub{
	display: block;
}
.tesst:hover .down-arrow{
	transform: rotate(180deg);
}
li{
	list-style-type: none;
}

.product-menu-wrap{
	padding-top: 10px;
	width: 100%;
	height: 100%;
	display: flex;
}
.product-menu-main{
	width: 20%;
	height: 100%;
	border-right: 1px solid #ccc;
	overflow-y: scroll;
	max-height: 600px;
}
.product-menu-sub{
	width: 80%;
	overflow-y: scroll;
	max-height: 600px;
}
.product-menu-main li{
	padding: 0px 10px;
}
.product-menu-main .li-active{
	border-left: 3px solid #f17f0f;
}
.product-menu-main li a{
	display: block;
	padding: 10px;
	border-radius: 8px;
}
.product-menu-main .li-active a{
	background: rgb(240 240 240 / var(--tw-bg-opacity, 1));
}

.product-menu-sub::-webkit-scrollbar {
  width: 3px;
  height:4px;
 }

/* Track */
.product-menu-sub::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px #bfbfbf; 
  border-radius: 10px;
}
 
/* Handle */
.product-menu-sub::-webkit-scrollbar-thumb {
  background: #ff7f79; 
  border-radius: 10px;
}

/* Handle on hover */
.product-menu-sub::-webkit-scrollbar-thumb:hover {
  background: #b30000; 
}

.product-menu-main::-webkit-scrollbar {
  width: 4px;
  height:4px;
 }

/* Track */
.product-menu-main::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px #bfbfbf; 
  border-radius: 10px;
}
 
/* Handle */
.product-menu-main::-webkit-scrollbar-thumb {
  background: #f17f0f; 
  border-radius: 10px;
}

/* Handle on hover */
.product-menu-main::-webkit-scrollbar-thumb:hover {
  background:#8d4600; 
}
.product-menu-sub-item{
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 20px;
	margin: 17px;

}
.icon-menu-d{
	width: 50px !important;
	height: auto !important;
}
#alttext{
	display: none !important;
}
.product-menu-sub-wrap{
		display: grid;
		grid-template-columns: repeat(3, 1fr);
}
.product-menu-sub-name{
	font-weight: 400;
	margin-block-start: 4px;

}
.product-menu-sub-item-img img{
	width: 76px;
	height: auto;
}
.next-sub-menu{
	--tw-text-opacity: 1;
	color: rgb(102 102 102 / var(--tw-text-opacity, 1));
}
.product-menu-sub-note{
	margin: 20px;
	color: red;
}
.product-menu-sub-note a{
	text-decoration: underline;
}
.product-menu-sub-list a:hover{
	color: #f17f0f;
}
.product-menu-sub-box{
	display: none;
}
.box-active{
	display: block;
}
.wrap-product-mini-cart{
	position: absolute;
	height: 100vh;
	background: #F6F6F6;
	width: 100%;
	max-width: 276px;
	display: none;
	justify-content: space-between;
	flex-direction: column;
	box-shadow: 0px 20px 8px 2px #edeaea;

}
.haed-mini-cart-wrap:hover .wrap-product-mini-cart{
	display: flex;
}


.haed-mini-cart-wrap:hover .down-arrow-2{
	transform: rotate(180deg);
}
.mini-cart-pay-wrap{
	bottom: 0px;
	position: sticky;
	background: #fff;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	width: 100%;
	text-align: center;
	z-index: 3;
}
.pay-cart-btn{
	background-color: rgb(13 103 41 / var(--tw-bg-opacity, 1));
	color: #fff;
	font-weight: 600;
	padding: 10px;
	margin: 15px;
	border-radius: 6px;
}
.pay-cart-btn:hover{
	background: rgb(112 185 135);
}
.shipping-policy-cart{
	padding-top: 9px;
	color: #f17f0f;
	text-decoration: revert-layer;
}
.shipping-policy-cart:hover{
	color:red;
}
.mini-cart-car-name{
	text-align: center;
	font-weight: 600;
	padding-top: 14px;
}
.mini-cart-prd-quantity{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	min-width: 125px;
}
.mini-cart-quantity{
		display: flex;
}
.mini-cart-prd-quantity b{
	display: flex;
	color: rgb(13 103 41 / var(--tw-bg-opacity, 1));
	font-size: 12px;
	align-items: center;

}
.mini-cart-prd-quantity b svg{
	width: 14px;
}

.mini-cart-prd-quantity input{
	background-color: transparent;
	width: 33px;
	border-style: solid;
	border-width: 0;
	border-color: #e5e7eb;
	text-align: center;
}
.mini-cart-prd-item button{
	width: min-content;
	height: min-content;
	border: none;
	background: #fbf5f547;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 2;
}

.mini-cart-prd-item{
	display: flex;
	position: relative;
	justify-content: space-between;
	height: min-content;
	align-items: center;
	background: #fff;
	margin: 5px 1px;
	padding: 5px;
	gap: 10px;
	min-height: 57px;
}
.mini-cart-prd-price{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}
.prd-price{
	display: flex;
	align-items: flex-end;
	gap: 5px;
	margin: 5px 0px;
}
.mini-cart-prd-img{
	width: 60px !important;
	height: auto !important;
	max-width: 45px;
}
.mini-cart-prd-ins{
	font-size: 10px;
	text-decoration: line-through;
	color: #898989;
}
input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.mini-cart-add{
	background: #f17f0f;
	padding: 1px;
	border-radius: 5px;
}
.mini-cart-minus{
	width: 21px;
	height: 21px;
	background: #f17f0f5c;
	text-align: center;
	color: #f17f0f;
	font-weight: 400;
	border-radius: 5px;
	font-size: 29px;
	line-height: 19px;
}
.mini-cart-prd-del{
	font-weight: 600;
}
.mini-cart-prd-name{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}
.box-product-mini-cart{
	overflow: auto;
}
.menu-footer-mb{
	display: none;
}

.box-product-mini-cart::-webkit-scrollbar {
  width: 4px;
  height:4px;
 }

/* Track */
.box-product-mini-cart::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px #bfbfbf; 
  border-radius: 10px;
}
 
/* Handle */
.box-product-mini-cart::-webkit-scrollbar-thumb {
  background: #f17f0f; 
  border-radius: 10px;
}

/* Handle on hover */
.box-product-mini-cart::-webkit-scrollbar-thumb:hover {
  background:#8d4600; 
}
.mini-cart-prd-item button img{
		width: 8px;
}
.mini-cart-prd-item .close:hover{
	background: #ff3939;
	border-radius: 10px;
}
.sale-cart{
	color: red;
}

.breadcrumb-item::before {
	content: "";
	position: absolute;
	height: 20px;
	width: 15px;
	margin-left: -20px;
	background: url(/wp-content/themes/dailymarket/assets/img/icon/left-arrow.png) no-repeat center center;
	background-size: contain;
}
.breadcrumb-item{
	margin-right: 20px;
}
.breadcrumb-list .breadcrumb-item:first-child::before {
  background: none; 
}
.breadcrumb-list{
	margin: 8px 0px;
}
.orderBy{
	background: #ffd8b2;
	border: 1px solid #f17f0f !important;
}
.orderBy .orderBy-close{
	display: block;
}

.mini-cart-quantity{
	cursor: pointer;
}
.link-cart{
	padding: 0px !important;
	border-radius: 0px !important;
	background: none !important;
	font-weight: 600 !important;
}
.qty{
	width: 40px;
	font-size: 1.125rem;
	line-height: 1.75rem;
	font-weight: 500;
	text-align: center;
	border: none;
}
.qty-btn{
	background: #f17f0f;
	border: none;
	padding: 5px;
	border-radius: 5px;
}
.minus{
	text-align: center;
	color: #f17f0f;
	background: #f17f0f5c;
	font-size: 20px;
	padding: 3px 10px;
	font-weight: 900;
}
.cart-item-l .qty{
		line-height: 19px;
			width: 30px;
}

.log-box{
	position: static;
	background: #504c4c69;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 999999;
	display: none;
	align-items: center;
	justify-content: center;
}
.log-main{
	width: 80%;
	max-width: 335px;
	padding: 20px;
	background: #ffffff;
	border-radius: 9px;
	border: 1px solid #f17f0f;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.log-input{
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 5px 0px;
}
.log-input input{
	padding: 7px;
	border-radius: 5px;
	border: 1px solid #f17f0f;
}
.log-input input:focus{
	  border-color: #f17f0f;
    outline: none;
    box-shadow: 2px 4px 4px 1px #f17f0f54;
}
.log-btn{
	display: flex;
	justify-content: center;
	gap: 20px;
	margin: 10px 0px;
	align-items: center;

}

.log-btn button{
	padding:10px;
	border-radius: 5px;
	font-weight: 600;
	border: 1px solid #f17f0f;
	width: 200px;
	text-align: center;
}
.btn-login-d{
	background: #f17f0f;
	color: #fff;
}
.btn-dk{
	color: #f17f0f;
	background: #fff;
}
.btn-dk a{
	color: #f17f0f;
	
}
.log-note{
	color: red;
	font-size: 15px;
	font-weight: 500;
}
.log-main{
	display: none;
}
.log-active{
	display: block;
}

.top-head-s3{
	display: none;
}

.tk-active{
	display:flex;
}

.VIpgJd-ZVi9od-ORHb-OEVmcd{
	display: none;
}
#goog-gt-tt{
	display: none;
}

.wapr-tk{
	width: 25%;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 15px;
}
.language img{
	width: 30px;
	height: 30px;
}

.language{
	display: flex;
	align-items: center;
	gap: 5px;
}

.language div{
	border-radius: 5px;
	overflow: hidden;
	cursor: pointer;
}
.language-active{
	border: 1px solid #20b082;
}
.head-mobile{
	display: none;
}

.bnt-xsearch{
	width: 0px;
}
.bnt-xsearch img{
	width: 45px;
	right: 36px;
	top: -22px;
	position: relative;
	cursor: pointer;
}

.menu-produc-mb { background: #fff; width: 100%; }
.accordion-menu, .accordion-menu ul { list-style: none; padding: 0; margin: 0; }

.menu-item-wrapper { border-bottom: 1px solid #fff; }

.menu-item-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #ff690054; 
    font-weight: 500;
}

/* Thay đổi span thành link: căn chỉnh lại padding */
.menu-item-link {
    flex-grow: 1;
    padding: 15px;
    text-decoration: none;
    color: #333;
    display: block;
}

/* Vùng chứa nút mũi tên */
.arrow-toggle {
	border-left: 1px solid #ffffff;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	height: -webkit-fill-available;
	width: 50px;
}

/* Hình dáng mũi tên */
.arrow-icon {
    width: 8px; height: 8px;
    border-right: 2px solid #333;
    border-bottom: 2px solid #333;
    transform: rotate(45deg);
    transition: transform 0.4s ease; /* Hiệu ứng xoay mượt */
}

/* Khi active: xoay ngược mũi tên lên trên */
.menu-item-wrapper.active .arrow-icon {
    transform: rotate(-135deg);
}

/* Hiệu ứng thả xuống từ từ (Slide Down) */
.sub-menu { 
    max-height: 0;
    overflow: hidden;
    background: #fff;
    transition: max-height 0.5s ease-in-out; /* Hiệu ứng từ từ */
}

.menu-item-wrapper.active .sub-menu {
    max-height: 1000px; /* Giá trị đủ lớn để chứa nội dung con */
}

.sub-menu li a {
    display: block;
    padding: 12px 25px;
    text-decoration: none;
    color: #555;
    border-bottom: 1px solid #f9f9f9;
    font-size: 14px;
}

.accordion-menu{
	overflow-y: scroll;
	max-height: 100vh;
	font-size: 14px;
}
.accordion-menu ul{
	list-style-type: disc;
	padding-inline-start: 10px;
}

/* width */
.accordion-menu::-webkit-scrollbar {
  width: 3px;
  height:4px;
 }

/* Track */
.accordion-menu::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px #fff; 
  border-radius: 10px;
}
 
/* Handle */
.accordion-menu::-webkit-scrollbar-thumb {
  background: #f17f0f; 
  border-radius: 10px;
}


/* Track */
.product-loop-search::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px #fff; 
  border-radius: 10px;
}
 
/* Handle */
.product-loop-search::-webkit-scrollbar-thumb {
  background: #f17f0f; 
  border-radius: 10px;
}
.product-loop-search::-webkit-scrollbar {
  width: 3px;
  height:4px;
 }
.nemnu-search-header .logo{
	width: 50px;
}
.top-nemnu-search{
	display: flex;
	padding: 20px 0px;
}
.nemnu-search{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #504c4c69;
	z-index: 999999;
	opacity: 0;
	transition: all 0.3s ease-in-out;
	opacity: 1;
	visibility: hidden;  
}
.s-active{
	visibility: visible;
}
.nemnu-search-header{
	background: #fff;
	border-bottom: 1px solid #ccc;	

}
.product-loop-search{
	background: #fff;
	padding: 20px 10px;
	border-radius: 0px 0px 5px 5px;
	display: flex;
	align-items: flex-start;
	overflow-y: scroll;
	max-height: 100vh;
	font-size: 14px;

}
.search-tag{
	padding: 0px 10px;
	border-top: 1px solid #ccc;
	width: fit-content;
	min-width: 196px;

}
.search-title{
	font-weight: 600;
	font-size: 18px;
	top: -15px;
	position: relative;
	width: fit-content;
	padding: 0px 20px 0px 0px;
	background: #fff;
}
.search-loop{
	border-top: 1px solid #ccc;
	width: -webkit-fill-available;
	padding: 0px 20px;
	border-left: 1px solid #ccc;
	height: -webkit-fill-available;
}
.tag-search{
	cursor: pointer;
	display: flex;
	align-items: center;
	width: fit-content;
	padding: 5px 10px;
	margin: 3px 0px;
	font-size: 11px;
	font-size: 12px;
	gap: 5px;
}
.tag-img{
	width: 20px;
}
.title-tag{
	font-size: 18px;
	font-weight: 600;
	margin: 20px 0px;
}
.prd-loop-saerch{
	display: flex;
	justify-items: stretch;
	gap: 14px;
	justify-content: flex-start;
	flex-direction: row;
	flex-wrap: wrap;
}
.product-loop-search .item{
	max-width: 195px;
}
.bnt-none{
	display: none;
	cursor: pointer;
	z-index: 1000;
}
.line-heading{
	text-align: center;
	width: 150px;
	background: #f17f0f;
	height: 2px;
	margin: 30px auto;
}

/* reponsive 1480px */
@media (max-width: 1550px) {
	.container {
		max-width: 1415px;
		margin: 0px auto;
	}
	.cooking-recipes-img{
		max-height: 180px;
	}

}

/* reponsive 1300px */
@media (max-width: 1300px) {
	.container {
		max-width: 1255px;
	}
	.top-head{
		padding: 10px 0px;
	}
	.top-head-s2 input{
		height: 20px;
	}
	.top-head-s2 svg{
		padding: 4px;
	}
	.register-head div, .register-head a{
		padding: 6px 10px;
	}
	.banner-wrap{
		margin: 10px 0px;
	}
}

/* reponsive 1040px */
@media(max-width: 1040px) {
	.container {
		max-width: 1000px;
	}
	.haed-main-nav{
		gap: 5px;
	}
	.haed-mini-cart{
		min-width: 265px;
	}
	.Volume{
		left: -4px;
	}
	.slider-prd-full-width .Volume{
		width: 85%;
		left: -12px;
	}
	.category-with-img-image img{
		height: 100%;
	}
	.cooking-recipes-img{
		max-height: 125px;
	}
}
.menu-produc-mb{
	display: none;
}
.menu-mb-sider{
	display: block;
}



/* reponsive 840px */
@media(max-width: 885px) {
	.head-mobile{
		display: block;
		border-bottom: 1px solid #ccc;
		position: sticky;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 60px; /* Tùy chỉnh chiều cao của bạn */
	  transition: transform 0.3s ease-in-out; /* Tạo hiệu ứng trượt mượt mà */
	  z-index: 1000;
	  background: #fff;
	}
	.container{
		max-width: 775px;
	}
	.head{
		display: none;	
	}
	.top-head{
		justify-content: space-between;
		align-items: center;
	}
	.top-head svg,.mb-hear-mn svg{
	padding: 3px;
	border: 1px solid #f17f0f;
	border-radius: 50%;
	cursor: pointer;
	}
	.topbar{
		display: none;
	}
	.nav-hidden {
  transform: translateY(-100%);
	}
	.menu-footer-mb{
		display: flex;
		justify-content: space-around;
		align-items: center;
		position: fixed;
		bottom: 0px;
		z-index: 9999;
		width: 100%;
		background: #fff;
		padding: 8px 0px;
		border-top: 1px solid #ccc;
		
	}
	.item-menu-footer-mb{
		display: flex;
		flex-direction: column;
		align-items: center;
		color: #969696;
		cursor: pointer;
	}
	.item-menu-footer-mb svg{
		width: 26px;
	}
	.item-menu-footer-mb:hover{
		color: #f17f0f; 
	}
	.Volume {
		left: 0px;
	}
	.slider-prd-full-width .Volume{
		width: 90%;
		left: 0px;
	}
	.slider-product-thumbnar{
		max-height: 165px;
		max-width: 165px;
	}
	.category-with-img-product,.category-with-img-image{
		width: 50%;
	}
	.top-footer{
		display: grid;
		grid-template-columns: repeat(4, 1fr);
	  gap: 15px;
	}
	.wapr-tim-kiem{
		max-width: 100%;
	}
	.top-nemnu-search .top-head-s1{
		width: 15%;
	}
	.top-nemnu-search .top-head-s2{
		width: 80%;
	}
	.prd-loop-saerch{
		gap: 5px;
	}
}


/* reponsive 770px */
@media(max-width: 770px) {
	.container {
		max-width: 750px;
	}
}

/* reponsive 430px */
@media(max-width: 450px) {
	.container{
		max-width: 400px;
	}
	.category-with-img-main{
		flex-direction: column;
		gap: 10px;
	}
		.category-with-img-product, .category-with-img-image {
		width: 100%;
		border-radius: 10px;
	}
	.Volume{
		left: -5px;
	}
	.top-footer{
		grid-template-columns: repeat(2, 1fr);
		padding: 0px 5px;
	}
	.footer-contact{
		flex-direction: column;
		gap: 20px;
	}
	.wapr-tk{
		width: 30%;
	}
	.search-none{
		display: none;
	}
	.product-loop-search{
		flex-direction: column;
		gap: 20px;
	}
	.search-tag{
		border-top: none;
		min-width: 100%;
		margin: 0px;
	}
	.search-loop {
		border-top: none;
		padding: 0px;
		border-left: none;
		top: -80px;
		position: relative;
	}
	.gr-ctgr{
		display: ruby;
	}
	.search-tag{
		position: relative;
		top: -80px;
	}
	.bnt-xsearch img{
			top: -4px;
			right: 0px;
	}
	.bnt-xsearch {
		width: 100%;
		display: flex;
		flex-direction: row-reverse;
	}
	.wapr-tim-kiem{
			max-width: 100%;
	}
	.prd-loop-saerch{
		justify-content: center
	}
}


@media(max-width: 390px){
	.container {
		max-width: 375px;
	}
	.cart-item-r .product-thumbnail img {
		position: relative;
		right: 12px;
	}
	.prd-loop-saerch {
		justify-content: center;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
	}
}

@media(max-width: 375px) {
	.container {
		max-width: 350px;
	}
	.top-head .logo {
	width: 40px;
	}
	.slider-product-wrap .product-name{
		width: 150px;
	}
	.product-loop-search .item{
		max-width: 150px;
	}
	.Volume {
		left: 0px;
	}
}


