/* X4 consolidated stylesheet: layout.css */

/* ===== Source: header.css ===== */
/** menu toggle button **/

.toggle-nav, .icon-bar {
	width: 24px;
	flex-direction: column;
	height: 20px;
	justify-content: space-between;
	border-radius: 3px
}

.toggle-nav .bar, .icon-bar .bar {
	height: 3px;
	background: var(--x4-color-text);
	width: 24px;
	border-radius: 1px
}

.toggle-nav .b
ar:nth-child(2), .icon-bar .bar:nth-child(2) {
	width: 86% !important
}

.icon-bar {
	cursor: auto !important
}

.icon-bar .bar {
	background: var(--text-color);
	height: 2px
}

.icon-bar .bar:nth-child(2) {
	width: 20px
}






/** end menu toggle button **/
/** mid header  **/
.mid-header {
	background: var(--header-background);
	padding: 10px 0px
}

.mid-header .logo-wrapper {
	max-width: 248px;
	display: block
}
.mid-header .toggle-nav {
	width: 24px;
	flex-direction: column;
	height: 20px;
	justify-content: space-between;
	border-radius: 3px
}

.mid-header .toggle-nav .bar {
	height: 3px;
	background: var(--primary-color);
	width: 24px;
	border-radius: 3px
}

.mid-header .toggle-nav .bar:nth-child(2) {
	width: 75%
}


@media (max-width:992px) {
	.mid-header .logo-wrapper {
		margin: auto
	}

}

/** end mid header  **/
/** header right **/


.header-right {
	font-size: 14px
}

.header-right .fa-search,.header-right .fa-cart-shopping {
	font-size: 22px
}

.header-right a {
	color: var(--header-color)
}

.header-right a:hover {
	text-decoration: none;
}

/** end header right **/

/** mini cart **/

.mini-cart .no-item {
	text-align: center
}

.mini-cart .no-item p {
	margin: 0 auto
}

.mini-cart>a .count_item {
	position: absolute;
	display: inline-block;
	background: #da3f3f;
	border-radius: 999px;
	width: 20px;
	height: 20px;
	line-height: 20px;
	color: var(--x4-color-white);
	font-size: 12px;
	top: -5px;
	right: 0
}

@media (max-width:575px) {
	.mini-cart>a .count_item {
		font-size: 9px
	}

}
.mini-cart .no-item {
	text-align: center
}

.mini-cart .no-item p {
	margin: 0 auto
}

.mini-cart>a .count_item {
	position: absolute;
	display: inline-block;
	background: #da3f3f;
	border-radius: 999px;
	width: 20px;
	height: 20px;
	line-height: 20px;
	color: var(--x4-color-white);
	font-size: 12px;
	top: -5px;
	right: 0
}

@media (max-width:575px) {
	.mini-cart>a .count_item {
		font-size: 9px
	}

}
@media (max-width: 991px) {
	.mini-cart > a {
		display: flex;
		justify-content: flex-end;
		padding-right: 15px;
	}
}

@media (max-width: 767px) {
	.mini-cart > a {
		position: relative;
	}
	.mini-cart .count_item{
		position: absolute;
		right: -12px;
		top: -5px;
		font-size: 10px;
	}
}
/** end mini-cart **/


/** search **/

#search-header .custom-input-group {
	z-index: 1000
}

#search-header .custom-input-group .input-group-field {
	background: #f1f1f1
}

@media (max-width:991px) {
	#search-header .custom-input-group .input-group-field {
		height: 35px;
		font-size: 12px
	}

}

@media (max-width:991px) {
	#search-header {
		order: 1;
		margin-top: 10px
	}

}

@media (max-width:375px) {
	#search-header .custom-input-group .input-group-field {
		padding-right: 45px
	}

	#search-header .btn {
		padding: 4px 10px
	}

}

#search-header .search-dropdow .search__list {
	display: block !important;
	white-space: nowrap;
	overflow: auto
}

#search-header .search-dropdow .search__list>li {
	display: inline-block
}
.search-overlay {
	position: fixed;
	z-index: -1;
	background: rgba(0, 0, 0, 0.4);
	width: 100%;
	height: 100vh;
	top: 0 !important;
	left: 0;
	opacity: 0;
	visibility: hidden
}

.search-overlay.active {
	opacity: 1;
	z-index: 999;
	visibility: visible
}

.search__list a {
	font-size: 12px;
	color: #6c757d
}

.search__list a:hover {
	color: var(--header-color)
}
/** end search **/

/** subheader **/
.subheader {
	--subheader-padding: 0px;
	background: var(--subheader-background);
	color: var(--subheader-color);
	display: flex;
	align-items: center;
	padding-top: 10px
}

.subheader .toogle-nav-wrapper {
	padding: 16px 0 20px;
	border-radius: 5px 5px 0px 0px;
	border: 1px;
	color: var(--subheader-background);
	background: var(--subheader-color);
	font-weight: 500
}

.subheader .navigation-wrapper {
	font-weight: 400
}

.subheader .toogle-nav-wrapper .icon-bar {
	width: 20px;
	height: 18px;
	margin-left: 15px
}

.subheader .toogle-nav-wrapper .icon-bar .bar {
	background: var(--subheader-background);
	width: 20px
}

@media (max-width:991px) {
	.subheader {
		display: none
	}

}

.subheader .container {
	display: grid;
	grid-template-columns: calc(20% - 24px) 1fr;
	justify-content: space-between;
	align-items: center;
	grid-gap: 15px
}

@media (max-width:1024px) {
	.subheader .container {
		grid-template-columns: calc(25% - 24px) 1fr
	}

}
.subheader .container>* {
	padding-bottom: 8px
}
.shop-policises {
	justify-content: flex-start
}

.shop-policises li {
	display: flex;
	align-items: center
}

.shop-policises li+* {
	margin-left: 15px
}

.shop-policises div {
	width: 40px;
	height: 40px;
	padding: 4px;
	margin-right: 6px;
	display: flex;
	align-items: center;
	justify-content: center
}

@media (max-width:991px) {
	.shop-policises div {
		width: 32px;
		height: 32px
	}

}

.shop-policises .link {
	font-size: 16px
}

@media (min-width:992px) {
	.shop-policises .link {
		color: var(--subheader-color)
	}

	.shop-policises .link:hover {
		color: var(--secondary-color)
	}

}

/** end subheader **/
/** ega-header **/
.header_sticky {
	position: fixed;
	transform: translateY(-120px);
	top: 0px !important;
	left: 0;
	width: 100%;
	z-index: -1;
	transition: transform .3s ease-out;
	box-shadow: 0 0px 5px 1px rgba(0, 0, 0, 0.4);
	opacity: 0;
	background: var(--x4-color-white)
}

.header_sticky.active {
	z-index: 1000;
	transform: translateY(0);
	opacity: 1
}

.header_sticky .mid-header {
	font-size: 14px;
	padding: 0px
}

.header_sticky .mid-header:after {
	content: none !important
}

.header_sticky .toogle-nav-wrapper {
	margin: -5px 0px
}

.header_sticky .toogle-nav-wrapper:hover ~ .sticky-overlay {
	position: fixed;
	width: 100vw;
	height: 100vh;
	z-index: -1;
	background: rgba(0, 0, 0, 0.3);
	left: 0;
	top: 0
}

.header_sticky .toogle-nav-wrapper .navigation-wrapper {
	margin-top: 0
}

.header_sticky .navigation {
	--nav-height: 75vh
}

.header_sticky #search-header {
	order: 0 !important;
	margin: 0 !important
}


.ega-header:not(.header_sticky) {
	top: 0;
	position: sticky;
	position: -webkit-sticky;
	z-index: 1000;
	background: var(--x4-color-white)
}

.ega-header.active {
	box-shadow: 0 0px 5px 1px rgba(0, 0, 0, 0.4)
}

.ega-header .header-wrap {
	height: 65px;
	display: grid;
	grid-template-columns: 150px 1fr 150px;
	align-items: center;
	gap: 15px;
}

.ega-header .header-wrap .header-right {
	display: flex;
	justify-content: flex-end
}

.ega-header .header-wrap .header-right__icons {
	display: grid;
	grid-template-columns: var(--header-grid-template);
	width: 160px;
	text-align: center
}

.ega-header .header-wrap .header-right__icons .icon {
	font-size: 32px
}

.ega-header .header-wrap .header-right__icons .icon-action__search {
	cursor: pointer
}

.ega-header .header-wrap .header-right__icons #icon-account {
	position: relative
}

.ega-header .header-wrap .header-right__icons #icon-account .account-action {
	position: absolute;
	background: var(--x4-color-text);
	border-radius: 5px;
	color: var(--x4-color-white);
	transition-duration: .3s;
	transition-property: all;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	opacity: 0;
	visibility: hidden;
	text-align: left;
	left: 50%;
	transform: translateX(-50%);
	top: calc(100% + 10px);
	width: 95px
}

.ega-header .header-wrap .header-right__icons #icon-account .account-action a {
	display: block;
	padding: 7px 8px
}
.ega-header .header-wrap .header-right__icons #icon-account .account-action a:hover {
	background: #6666;
}
.ega-header .header-wrap .header-right__icons #icon-account .account-action:before {
	background: transparent;
	content: '';
	position: absolute;
	bottom: 100%;
	height: 10px;
	left: 0;
	width: 100%
}

.ega-header .header-wrap .header-right__icons #icon-account .account-action:after {
	background: var(--x4-color-text);
	content: '';
	height: 14px;
	position: absolute;
	transform: rotate(45deg);
	width: 14px;
	z-index: -1;
	left: calc(50% - 7px);
	top: -7px
}

.ega-header .header-wrap .header-right__icons #icon-account:hover .account-action {
	opacity: 1;
	visibility: visible
}


.ega-header .mega-menu-content {
	position: absolute;
	width: 100%;
	top: 100%;
	left: 0;
	margin-top: 13px;
	padding: 5px 58px 10px 40px;
	background-color: var(--x4-color-white);
	border: 1px solid var(--x4-color-border-light);
	border-top: 2px solid #d9121f;
	height: auto;
	margin: 0;
	opacity: 0;
	visibility: hidden;
	z-index: -1;
	-webkit-transition: opacity .2s ease;
	-o-transition: opacity .2s ease;
	transition: opacity .2s ease
}

.ega-header .mega-menu-content .nav-links {
	--col-menu: 3;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(calc(100% / var(--col-menu)), 1fr))
}

.ega-header .mega-menu-content .nav-links__item {
	padding: 5px 10px
}

.ega-header #primary-menu {
	display: flex;
	justify-content: center
}

.ega-header.header_sticky {
	position: fixed
}

.ega-header.header_sticky .header-wrap {
	height: auto;
	padding-top: 30px;
	padding-bottom: 30px;
	justify-items: center
}
.ega-header.header_sticky .ega-form-search {
	width: 650px!important;
	max-width: 100%;
}
.ega-header .ega-form-search .custom-input-group .input-group-field{
	padding-right: 50px !important;
}
@media(min-width: 1200px){
	.ega-header .ega-form-search .custom-input-group .input-group-field{
		padding-right: 75px !important;
	}
}
#ega-smartsearch-search-suggestion{
	width: 640px!important
}
 
.ega-header.header_sticky .ega-header-layer {
	display: none;
	position: absolute;
	content: "";
	background: var(--x4-color-black);
	width: 100%;
	height: 100vh;
	opacity: .6;
	left: 0;
}

.ega-header.header_sticky.active .ega-header-layer {
	display: block
}

header.ega-header .navigation--horizontal {
	width: 100%;
	position: initial;
	justify-content: center;
}

header.ega-header .navigation--horizontal .navigation-arrows {
	display: none
}

header.ega-header .navigation--horizontal .navigation-arrows i {
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer
}

header.ega-header .navigation--horizontal .navigation-arrows i:not(.disabled):hover {
	background: rgba(238, 238, 238, 0.4);
	border-radius: 100%
}

header.ega-header .navigation--horizontal .navigation-arrows i.disabled {
	cursor: not-allowed;
	opacity: 0.3
}

header.ega-header .navigation-wrapper {
	overflow: hidden;
	max-height: 65px;
}

header.ega-header .navigation-wrapper.overflow+.navigation-arrows {
	display: flex;
	align-items: center
}

@media(max-width: 991px){
	.ega-header.header_sticky .header-wrap {
		grid-template-columns: 1fr;
		padding-left: 0px;
		padding-right: 0px
		
	}
	.ega-header.header_sticky #logo,.ega-header.header_sticky .header-right {
		display: none!important
	}

}
@media (max-width:991px) {
	.ega-header .header-wrap {
		padding: 0 15px;
		grid-template-columns: auto 1fr 100px
	}

	.ega-header .header-wrap .header-right__icons {
		width: auto;
		display: inline-grid;
		gap: 15px;
		grid-template-columns: repeat(2, 1fr);
	}

	.ega-header .header-wrap #logo {
		text-align: center
	}
	#ega-smartsearch-search-suggestion, .ega-header.header_sticky .ega-form-search{
		width : 100%!important;
	}

	#ega-smartsearch-search-suggestion{
	width : calc(100% - 30px)!important
	}
}

/** end  ega-header **/
/** navigation **/

.navigation {
	--nav-height: 313px;
	min-height: 100%;
	overflow-x: auto;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	max-width: 100%;
	width: 100%;
	
}

.navigation.overflow {
	overflow: hidden
}

.navigation::-webkit-scrollbar {
	display: none
}

.navigation .list-group-item {
	padding: 1px;
	border-bottom: 0px;
	background: transparent
}

.navigation .list-group-item:hover>a:after {
	filter: brightness(0.9)
}

.navigation .list-group-item>a {
	text-decoration: none;
	white-space: nowrap;
	display: flex;
	align-items: center;
	background: var(--main-menu-bg);
	color: var(--main-menu-color);
	padding: 20px 15px;
	position: relative
}

.navigation .list-group-item>a:hover {
	color: var(--primary-color)
}

.navigation--horizontal .navigation > .menu-item.is-current > .menu-item__link {
	color: var(--primary-color) !important;
	font-weight: 600;
	background: rgba(223, 0, 0, 0.06);
}

.navigation--horizontal .navigation > .menu-item.is-current > .menu-item__link:after {
	width: calc(100% - 30px);
	background-color: var(--primary-color);
}

.navigation--horizontal .submenu a.is-current-link {
	color: var(--primary-color) !important;
}

.navigation .list-group-item>a:after {
	background: var(--main-menu-color);
    background-color: currentColor;
    bottom: calc(1.25rem - 5px);
    content: "";
    height: 2px;
    left: 1rem;
    position: absolute;
	width: 0;
    transition: width .2s ease-in-out;
}
.navigation .list-group-item>a>img {
    max-width: 24px;
    max-height: 24px;
    object-fit: contain;
    margin-right: 4px;
}
@media(min-width: 1024px){
.navigation .list-group-item:hover > a:after {
	width: calc(100% - 30px)
}
}
.navigation .list-group-item>a>span img {
	width: 24px;
	height: 24px;
	object-fit: contain;
	margin-right: 4px;
	animation: pulsate 1s ease-in alternate;
	animation-iteration-count: infinite
}

.navigation .list-group-item>a i, .navigation .list-group-item>a svg {
	margin-left: 6px
}

.header_sticky .navigation .list-group-item>a i, .header_sticky .navigation .list-group-item>a svg {
	transform: rotate(0deg)
}

.navigation .menu-item {
	position: initial
}

@media (min-width:992px) {
	.navigation .menu-item .submenu:hover, .navigation .menu-item a:hover + .submenu {
		display: block;
		z-index: 900
	}

}

.navigation .submenu {
	display: none;
	width: 100%;
	height: 320px;
	padding: 14px 20px;
	border-radius: 0px;
	position: absolute;
	bottom: 0px;
	top: 100%;
	left: 0;
	background: var(--x4-color-white);
	margin-left: 0px;
	box-shadow: rgba(0, 0, 0, 0.06) 0px 5px 8px 0px;
	z-index: 1;
	overflow: auto;
	font-size: 1rem
}

.navigation .submenu__list {
	display: grid;
	/*grid-template-columns: repeat(auto-fill, minmax(calc(100% / var(--col-menu)), 1fr));*/
	grid-template-columns: repeat(var(--col-menu), 1fr);
	grid-gap: 10px  5px;
	padding: 0px;
	list-style: none
}

.navigation .submenu__col {
	display: flex;
	flex-direction: column;
	align-items: start;
	font-size: 1rem
}
.navigation .submenu__col .submenu__item{
	margin-bottom: 4px
}
.submenu__col .submenu__item:not(.submenu__item--main) a{
	color:var(--x4-color-muted);
}
.submenu__col .submenu__item:not(.submenu__item--main) a:hover{
	color:var(--link-color);
}

.navigation .submenu__item--main {
	font-weight: bold;
		margin-bottom: 5px

}

.navigation .submenu.default {
	width: auto;
	bottom: initial;
	left: inherit;
	height: auto;
	width: 250px
}

.navigation .submenu.default .submenu__list {
	display: flex;
	flex-direction: column;
	alig-items: flex-start
}

/** end naviagtion **/

.search-bar{
    position:relative;
    overflow:visible!important;
}

.aajZCb{
    display:none;
    position:absolute;
    top:calc(100% + 6px);
    left:0;
    right:0;
    z-index:99999;
    background:var(--x4-color-white);
    border:1px solid #e5e5e5;
    border-radius:12px;
    box-shadow:0 12px 32px rgba(0,0,0,.12);
    max-height:460px;
    overflow:auto;
    overscroll-behavior:contain;
    box-sizing:border-box;
}

.aajZCb::-webkit-scrollbar{
    width:6px;
}

.aajZCb::-webkit-scrollbar-thumb{
    background:#d5d5d5;
    border-radius:20px;
}

.search-item{
    display:flex;
    align-items:center;
    gap:12px;
    padding:10px 12px;
    color:var(--x4-color-text);
    text-decoration:none;
    transition:background .2s;
}

.search-item:hover{
    background:#fafafa;
}

.search-item+.search-item{
    border-top:1px solid #f3f3f3;
}

.search-item img{
    width:56px;
    height:56px;
    flex-shrink:0;
    object-fit:cover;
    border-radius:8px;
    background:var(--x4-color-white);
}

.search-info{
    flex:1;
    min-width:0;
}

.search-name{
    font-size:14px;
    font-weight:500;
    line-height:1.45;
    color:#222;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.search-meta{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:8px;
    margin:5px 0;
    font-size:12px;
}

.search-brand{
    color:#0d6efd;
    font-weight:600;
    white-space:nowrap;
}

.search-rating{
    color:#f59e0b;
    white-space:nowrap;
}

.search-price-row{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
}

.search-price{
    color:#e60023;
    font-size:15px;
    font-weight:700;
}

.old-price{
    color:#999;
    font-size:12px;
    text-decoration:line-through;
}

.sale{
    padding:2px 6px;
    border-radius:20px;
    background:#e53935;
    color:var(--x4-color-white);
    font-size:11px;
    font-weight:700;
}

.search-all{
    display:block;
    padding:12px;
    text-align:center;
    font-weight:700;
    color:#e53935;
    text-decoration:none;
    border-top:1px solid var(--x4-color-border-light);
    transition:.2s;
}

.search-all:hover{
    background:#fafafa;
}

.search-empty{
    padding:18px;
    text-align:center;
    color:#888;
    font-size:14px;
}

mark{
    padding:0 2px;
    background:#fff2a8;
    color:inherit;
    border-radius:3px;
}


.search-bar{
    position:relative;
}

.search-clear{
    position:absolute;
    right:52px;
    top:50%;
    transform:translateY(-50%);
    width:32px;
    height:32px;
    display:none;
    align-items:center;
    justify-content:flex-end;
    padding-right:10px;
    cursor:pointer;
    color:#999;
    font-size:27px;
    line-height:1;
    z-index:5;
    user-select:none;
    transition:.2s;
    border-radius:18px;
}

.search-bar.has-value .search-clear{
    display:flex;
}

@media (min-width:1200px){
    .search-clear{
        right:72px;
    }
}

input[type="search"]::-webkit-search-cancel-button{
    -webkit-appearance:none;
    appearance:none;
    display:none;
}

input[type="search"]::-ms-clear{
    display:none;
}

/* ===== Source: footer.css ===== */
.addThis_listSharing {
    opacity: 1;
    display: block;
}

.addThis_listing .addThis_item {
    margin-bottom: 5px;
}

.addThis_listing .addThis_item .addThis_item--icon {
    position: relative;
    display: inline-block;
    text-align: center;
    width: 44px;
    height: 44px;
    line-height: 44px;
    color: var(--x4-color-white);
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0,0,0,.11);
    background-size: auto;
    background-repeat: no-repeat;
    background-position: center;
}

.addThis_listing .addThis_item .addThis_item--icon .tooltip-text {
    position: absolute;
    top: 4px;
    right: 55px;
    z-index: 9;
    height: 32px;
    line-height: 26px;
    padding: 3px 10px;
    border-radius: 5px;
    font-size: 11px;
    color: var(--x4-color-white);
    text-align: center;
    white-space: nowrap;
    background: var(--x4-color-black);
    visibility: hidden;
    opacity: 0;
    transition: all .2s linear;
}

.addThis_listing .addThis_item .addThis_item--icon .tooltip-text:after {
    content: "";
    position: absolute;
    left: 100%;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 0;
    height: 0;
    border: 5px solid transparent;
    border-left-color: var(--x4-color-black);
    transition: all .2s linear;
}

.addThis_listing .addThis_item .addThis_item--icon:hover {
    text-decoration: none;
    opacity: .9;
    box-shadow: 0 5px 10px rgba(0,0,0,.15), 0 4px 15px rgba(0,0,0,.13);
}

.addThis_listing .addThis_item .addThis_item--icon:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}

/* Bottom Mobile CTA */
.admin-performance-list-item{
    margin-top:14px!important;
}

.admin-performance-badge{
    --performance-color:#64748b;
    --performance-soft:#eef2f7;
    display:inline-flex;
    align-items:center;
    gap:8px;
    width:max-content;
    max-width:100%;
    padding:7px 9px 7px 7px;
    border:1px solid #dbe3ec;
    border-radius:999px;
    background:#fff;
    color:#64748b;
    font-size:12px;
    line-height:1;
    box-shadow:0 4px 14px rgba(15,23,42,.08);
}

.admin-performance-badge__icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 28px;
    width:28px;
    height:28px;
    border-radius:50%;
    background:var(--performance-soft);
    color:var(--performance-color)!important;
}

.admin-performance-badge strong{
    color:#0f172a;
    font-size:13px;
    font-variant-numeric:tabular-nums;
    white-space:nowrap;
}

.admin-performance-badge__level{
    padding:5px 8px;
    border-radius:999px;
    background:var(--performance-soft);
    color:var(--performance-color)!important;
    font-size:11px;
    font-weight:700;
    white-space:nowrap;
}

.admin-performance-badge.is-excellent{--performance-color:#15803d;--performance-soft:#dcfce7;border-color:#bbf7d0}
.admin-performance-badge.is-fast{--performance-color:#1d4ed8;--performance-soft:#dbeafe;border-color:#bfdbfe}
.admin-performance-badge.is-normal{--performance-color:#b45309;--performance-soft:#fef3c7;border-color:#fde68a}
.admin-performance-badge.is-slow{--performance-color:#b91c1c;--performance-soft:#fee2e2;border-color:#fecaca}

@media(max-width:767px){
    .admin-performance-badge{
        gap:6px;
        padding-right:7px;
        font-size:11px;
    }
}

@media(prefers-color-scheme:dark){
    .admin-performance-badge{
        border-color:#334155;
        background:#1e293b;
        box-shadow:0 4px 16px rgba(0,0,0,.28);
    }

    .admin-performance-badge strong{
        color:#e2e8f0!important;
    }
}

.mobile-cta{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:999;
    display:none;
    background:var(--x4-color-white);
    border-top:1px solid #e9e9e9;
    box-shadow:0 -2px 12px rgba(0,0,0,.08);
    padding-bottom:env(safe-area-inset-bottom);
}

.mobile-cta ul{
    display:flex;
    margin:0;
    padding:0;
    list-style:none;
}

.mobile-cta li{
    flex:1;
}

.mobile-cta li+li{
    border-left:1px solid #f2f2f2;
}

.mobile-cta a{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    height:58px;
    text-decoration:none;
    color:#555;
    font-size:11px;
    font-weight:500;
    transition:.25s;
}

.mobile-cta i{
    font-size:20px;
    margin-bottom:5px;
    transition:.25s;
}

.mobile-cta a img{
    width:20px;
    height:20px;
    margin-bottom:5px;
    object-fit:contain;
    display:block;
}
/* ===== Brand Colors ===== */

/* Phone */
.mobile-cta .phone i{
    color:#28A745;
}

/* Zalo */
.mobile-cta .zalo i{
    color:#0068FF;
}

/* Telegram */
.mobile-cta .telegram i{
    color:#229ED9;
}

/* Messenger */
.mobile-cta .messenger i{
    color:#0084FF;
}

.mobile-cta .whatsapp i{
    color:#25D366;
}

.mobile-cta .sms i{
    color:#FF9800;
}

.mobile-cta .phone i{
    color:#28A745;
}

/* Hover */
.mobile-cta a:hover,
.mobile-cta a:focus{
    background:#fafafa;
}

.mobile-cta a:hover i,
.mobile-cta a:focus i{
    transform:translateY(-2px) scale(1.08);
}

.mobile-cta a:active{
    background:#f2f2f2;
}

@media (max-width:991px){
    .mobile-cta{
        display:block;
    }

    body{
        padding-bottom:58px;
    }
}


.order-lookup-modal{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;padding:15px;background:rgba(0,0,0,.55)}
.order-lookup-box{position:relative;width:100%;max-width:520px;max-height:85vh;overflow-y:auto;border-radius:12px;background:var(--x4-color-white);padding:22px;color:var(--x4-color-text);box-shadow:0 12px 40px rgba(0,0,0,.25)}
.order-lookup-box h3{margin:0 35px 18px 0;font-size:22px;color:#222}
.order-lookup-close{position:absolute;top:8px;right:12px;border:0;background:transparent;color:#777;font-size:32px;line-height:1;cursor:pointer}
.order-lookup-info{padding:12px 15px;border-radius:8px;background:var(--x4-color-surface-soft)}
.order-lookup-info>div{display:flex;justify-content:space-between;gap:15px;padding:5px 0}
.order-lookup-info span{color:#777}.order-status{color:#159447}
.order-lookup-products{margin-top:15px;border-top:1px solid var(--x4-color-border-light)}
.order-lookup-product{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--x4-color-border-light)}
.order-product-image{flex:0 0 72px;width:72px;height:72px;border:1px solid var(--x4-color-border-light);border-radius:8px;overflow:hidden;background:var(--x4-color-white)}
.order-product-image img{display:block;width:100%;height:100%;object-fit:contain}
.order-product-detail{min-width:0;flex:1}.order-product-name{display:block;color:#222;font-weight:600;line-height:1.4}.order-product-name:hover{color:#d70018}
.order-product-detail span{display:block;margin-top:5px;color:var(--x4-color-muted)}
.order-lookup-total{display:flex;justify-content:space-between;margin-top:15px;font-size:18px}
.order-lookup-total strong{color:#d70018}.order-lookup-error,.order-lookup-empty{padding:15px;border-radius:8px;background:#fff2f2;color:#c62828}
.order-lookup-notice{margin-top:15px;padding:10px 12px;border-radius:8px;background:#fff8e1;color:#7a5a00;font-size:14px;line-height:1.5}
@media(max-width:575px){.order-lookup-box{padding:18px 15px}.order-lookup-box h3{font-size:20px}.order-product-image{flex-basis:64px;width:64px;height:64px}}