/*********************************************************************************  colors ******************/
.zr-color-accounting5{color:var(--accounting5);}
.zr-color-accounting10{color:var(--accounting10);}
.zr-color-accounting15{color:var(--accounting15);}
.zr-color-accounting20{color:var(--accounting20);}
.zr-color-accounting30{color:var(--accounting30);}
.zr-color-accounting40{color:var(--accounting40);}
.zr-color-accounting50{color:var(--accounting50);}
.zr-color-accounting60{color:var(--accounting60);}
.zr-color-accounting70{color:var(--accounting70);}
.zr-color-accounting80{color:var(--accounting80);}
.zr-color-accounting85{color:var(--accounting85);}
.zr-color-accounting90{color:var(--accounting90);}
.zr-color-accounting95{color:var(--accounting95);}

.zr-color-secondary5{color:var(--secondary5);}
.zr-color-secondary10{color:var(--secondary10);}
.zr-color-secondary15{color:var(--secondary15);}
.zr-color-secondary20{color:var(--secondary20);}
.zr-color-secondary30{color:var(--secondary30);}
.zr-color-secondary40{color:var(--secondary40);}
.zr-color-secondary50{color:var(--secondary50);}
.zr-color-secondary60{color:var(--secondary60);}
.zr-color-secondary70{color:var(--secondary70);}
.zr-color-secondary80{color:var(--secondary80);}
.zr-color-secondary85{color:var(--secondary85);}
.zr-color-secondary90{color:var(--secondary90);}
.zr-color-secondary95{color:var(--secondary95);}

.zr-color-sales5{color:var(--sales5);}
.zr-color-sales10{color:var(--sales10);}
.zr-color-sales15{color:var(--sales15);}
.zr-color-sales20{color:var(--sales20);}
.zr-color-sales30{color:var(--sales30);}
.zr-color-sales40{color:var(--sales40);}
.zr-color-sales50{color:var(--sales50);}
.zr-color-sales60{color:var(--sales60);}
.zr-color-sales70{color:var(--sales70);}
.zr-color-sales80{color:var(--sales80);}
.zr-color-sales85{color:var(--sales85);}
.zr-color-sales90{color:var(--sales90);}
.zr-color-sales95{color:var(--sales95);}

.zr-color-rfid5{color:var(--rfid5);}
.zr-color-rfid10{color:var(--rfid10);}
.zr-color-rfid15{color:var(--rfid15);}
.zr-color-rfid20{color:var(--rfid20);}
.zr-color-rfid30{color:var(--rfid30);}
.zr-color-rfid40{color:var(--rfid40);}
.zr-color-rfid50{color:var(--rfid50);}
.zr-color-rfid60{color:var(--rfid60);}
.zr-color-rfid70{color:var(--rfid70);}
.zr-color-rfid80{color:var(--rfid80);}
.zr-color-rfid85{color:var(--rfid85);}
.zr-color-rfid90{color:var(--rfid90);}
.zr-color-rfid95{color:var(--rfid95);}

.zr-color-production5{color:var(--production5);}
.zr-color-production10{color:var(--production10);}
.zr-color-production15{color:var(--production15);}
.zr-color-production20{color:var(--production20);}
.zr-color-production30{color:var(--production30);}
.zr-color-production40{color:var(--production40);}
.zr-color-production50{color:var(--production50);}
.zr-color-production60{color:var(--production60);}
.zr-color-production70{color:var(--production70);}
.zr-color-production80{color:var(--production80);}
.zr-color-production85{color:var(--production85);}
.zr-color-production90{color:var(--production90);}
.zr-color-production95{color:var(--production95);}

.zr-color-payroll5{color:var(--payroll5);}
.zr-color-payroll10{color:var(--payroll10);}
.zr-color-payroll15{color:var(--payroll15);}
.zr-color-payroll20{color:var(--payroll20);}
.zr-color-payroll30{color:var(--payroll30);}
.zr-color-payroll40{color:var(--payroll40);}
.zr-color-payroll50{color:var(--payroll50);}
.zr-color-payroll60{color:var(--payroll60);}
.zr-color-payroll70{color:var(--payroll70);}
.zr-color-payroll80{color:var(--payroll80);}
.zr-color-payroll85{color:var(--payroll85);}
.zr-color-payroll90{color:var(--payroll90);}
.zr-color-payroll95{color:var(--payroll95);}

.zr-color-branch5{color:var(--branch5);}
.zr-color-branch10{color:var(--branch10);}
.zr-color-branch15{color:var(--branch15);}
.zr-color-branch20{color:var(--branch20);}
.zr-color-branch30{color:var(--branch30);}
.zr-color-branch40{color:var(--branch40);}
.zr-color-branch50{color:var(--branch50);}
.zr-color-branch60{color:var(--branch60);}
.zr-color-branch70{color:var(--branch70);}
.zr-color-branch80{color:var(--branch80);}
.zr-color-branch85{color:var(--branch85);}
.zr-color-branch90{color:var(--branch90);}
.zr-color-branch95{color:var(--branch95);}

.zr-color-tax5{color:var(--tax5);}
.zr-color-tax10{color:var(--tax10);}
.zr-color-tax15{color:var(--tax15);}
.zr-color-tax20{color:var(--tax20);}
.zr-color-tax30{color:var(--tax30);}
.zr-color-tax40{color:var(--tax40);}
.zr-color-tax50{color:var(--tax50);}
.zr-color-tax60{color:var(--tax60);}
.zr-color-tax70{color:var(--tax70);}
.zr-color-tax80{color:var(--tax80);}
.zr-color-tax85{color:var(--tax85);}
.zr-color-tax90{color:var(--tax90);}
.zr-color-tax95{color:var(--tax95);}

.zr-color-message5{color:var(--message5);}
.zr-color-message10{color:var(--message10);}
.zr-color-message15{color:var(--message15);}
.zr-color-message20{color:var(--message20);}
.zr-color-message30{color:var(--message30);}
.zr-color-message40{color:var(--message40);}
.zr-color-message50{color:var(--message50);}
.zr-color-message60{color:var(--message60);}
.zr-color-message70{color:var(--message70);}
.zr-color-message80{color:var(--message80);}
.zr-color-message85{color:var(--message85);}
.zr-color-message90{color:var(--message90);}
.zr-color-message95{color:var(--message95);}

.zr-color-Shopping5{color:var(--Shopping5);}
.zr-color-Shopping10{color:var(--Shopping10);}
.zr-color-Shopping15{color:var(--Shopping15);}
.zr-color-Shopping20{color:var(--Shopping20);}
.zr-color-Shopping30{color:var(--Shopping30);}
.zr-color-Shopping40{color:var(--Shopping40);}
.zr-color-Shopping50{color:var(--Shopping50);}
.zr-color-Shopping60{color:var(--Shopping60);}
.zr-color-Shopping70{color:var(--Shopping70);}
.zr-color-Shopping80{color:var(--Shopping80);}
.zr-color-Shopping85{color:var(--Shopping85);}
.zr-color-Shopping90{color:var(--Shopping90);}
.zr-color-Shopping95{color:var(--Shopping95);}

.zr-color-WebApi5{color:var(--WebApi5);}
.zr-color-WebApi10{color:var(--WebApi10);}
.zr-color-WebApi15{color:var(--WebApi15);}
.zr-color-WebApi20{color:var(--WebApi20);}
.zr-color-WebApi30{color:var(--WebApi30);}
.zr-color-WebApi40{color:var(--WebApi40);}
.zr-color-WebApi50{color:var(--WebApi50);}
.zr-color-WebApi60{color:var(--WebApi60);}
.zr-color-WebApi70{color:var(--WebApi70);}
.zr-color-WebApi80{color:var(--WebApi80);}
.zr-color-WebApi85{color:var(--WebApi85);}
.zr-color-WebApi90{color:var(--WebApi90);}
.zr-color-WebApi95{color:var(--WebApi95);}

.zr-color-quaternary5{color:var(--quaternary5);}
.zr-color-quaternary10{color:var(--quaternary10);}
.zr-color-quaternary15{color:var(--quaternary15);}
.zr-color-quaternary20{color:var(--quaternary20);}
.zr-color-quaternary30{color:var(--quaternary30);}
.zr-color-quaternary40{color:var(--quaternary40);}
.zr-color-quaternary50{color:var(--quaternary50);}
.zr-color-quaternary60{color:var(--quaternary60);}
.zr-color-quaternary70{color:var(--quaternary70);}
.zr-color-quaternary80{color:var(--quaternary80);}
.zr-color-quaternary85{color:var(--quaternary85);}
.zr-color-quaternary90{color:var(--quaternary90);}
.zr-color-quaternary95{color:var(--quaternary95);}

.zr-color-tertiary5{color:var(--tertiary5);}
.zr-color-tertiary10{color:var(--tertiary10);}
.zr-color-tertiary15{color:var(--tertiary15);}
.zr-color-tertiary20{color:var(--tertiary20);}
.zr-color-tertiary30{color:var(--tertiary30);}
.zr-color-tertiary40{color:var(--tertiary40);}
.zr-color-tertiary50{color:var(--tertiary50);}
.zr-color-tertiary60{color:var(--tertiary60);}
.zr-color-tertiary70{color:var(--tertiary70);}
.zr-color-tertiary80{color:var(--tertiary80);}
.zr-color-tertiary85{color:var(--tertiary85);}
.zr-color-tertiary90{color:var(--tertiary90);}
.zr-color-tertiary95{color:var(--tertiary95);}

.zr-color-link5{color:var(--link5);}
.zr-color-link10{color:var(--link10);}
.zr-color-link15{color:var(--link15);}
.zr-color-link20{color:var(--link20);}
.zr-color-link30{color:var(--link30);}
.zr-color-link40{color:var(--link40);}
.zr-color-link50{color:var(--link50);}
.zr-color-link60{color:var(--link60);}
.zr-color-link70{color:var(--link70);}
.zr-color-link80{color:var(--link80);}
.zr-color-link85{color:var(--link85);}
.zr-color-link90{color:var(--link90);}
.zr-color-link95{color:var(--link95);}

.zr-color-approved5{color:var(--approved5);}
.zr-color-approved10{color:var(--approved10);}
.zr-color-approved15{color:var(--approved15);}
.zr-color-approved20{color:var(--approved20);}
.zr-color-approved30{color:var(--approved30);}
.zr-color-approved40{color:var(--approved40);}
.zr-color-approved50{color:var(--approved50);}
.zr-color-approved60{color:var(--approved60);}
.zr-color-approved70{color:var(--approved70);}
.zr-color-approved80{color:var(--approved80);}
.zr-color-approved85{color:var(--approved85);}
.zr-color-approved90{color:var(--approved90);}
.zr-color-approved95{color:var(--approved95);}

.zr-color-warning5{color:var(--warning5);}
.zr-color-warning10{color:var(--warning10);}
.zr-color-warning15{color:var(--warning15);}
.zr-color-warning20{color:var(--warning20);}
.zr-color-warning30{color:var(--warning30);}
.zr-color-warning40{color:var(--warning40);}
.zr-color-warning50{color:var(--warning50);}
.zr-color-warning60{color:var(--warning60);}
.zr-color-warning70{color:var(--warning70);}
.zr-color-warning80{color:var(--warning80);}
.zr-color-warning85{color:var(--warning85);}
.zr-color-warning90{color:var(--warning90);}
.zr-color-warning95{color:var(--warning95);}

.zr-color-error5{color:var(--error5);}
.zr-color-error10{color:var(--error10);}
.zr-color-error15{color:var(--error15);}
.zr-color-error20{color:var(--error20);}
.zr-color-error30{color:var(--error30);}
.zr-color-error40{color:var(--error40);}
.zr-color-error50{color:var(--error50);}
.zr-color-error60{color:var(--error60);}
.zr-color-error70{color:var(--error70);}
.zr-color-error80{color:var(--error80);}
.zr-color-error85{color:var(--error85);}
.zr-color-error90{color:var(--error90);}
.zr-color-error95{color:var(--error95);}

.zr-color-gray5{color:var(--gray5);}
.zr-color-gray10{color:var(--gray10);}
.zr-color-gray15{color:var(--gray15);}
.zr-color-gray20{color:var(--gray20);}
.zr-color-gray30{color:var(--gray30);}
.zr-color-gray40{color:var(--gray40);}
.zr-color-gray50{color:var(--gray50);}
.zr-color-gray60{color:var(--gray60);}
.zr-color-gray70{color:var(--gray70);}
.zr-color-gray80{color:var(--gray80);}
.zr-color-gray85{color:var(--gray85);}
.zr-color-gray90{color:var(--gray90);}
.zr-color-gray95{color:var(--gray95);}
.zr-color-white{color: var(--MainWhite);}
/*********************************************************************************  colors-end ******************/

/*********************************************************************************  advance search - slots  ******************/
:root{
  --gap-slots:16px;
  --base-transition-duration:100ms;
}
body{
  background-color: #f8fafa;
}
.ma-wrapper {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.w1{
  width: 33.33%;
}
.w2{
  width: 66.66%;
}
.w3{
  width: 100%;
}
.h0{
  height: 0;    
  display: none !important;
}
.h2{
  /* height: 33.33%; */
  flex: 2;
}
.h4{
  /* height: 66.66%;     */
  flex: 4;
}
.h3{
  /* height: 50%; */
  flex: 3;
}
.h6{
  /* height: 100%; */
  flex: 6;
}

.dotted-bg{
  background-image: radial-gradient(var(--gray30) 2px, transparent 2px);
  background-size:20px 20px;
}
.widget{
  position: relative;
  width: 120px;
  height: 80px;
  background-color: crimson;
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.widget.inactive{
  background-color: grey;
}
.handle{
  position: absolute;
  top: 10px;
  right: 10px;
  width: 20px;
  height: 20px;
  background-color: aqua;
  border-radius: 4px;
}
.hovered{
  border: 1px solid var(--secondary70) !important;
  background-color:var(--secondary5) !important;
  box-shadow: 1px 1px 5px 0px #96853e99;
}
.active-slot{
  background-color:var(--link5) !important;
  border-radius:16px;
}
.hovered-slot{
  background-color:var(--secondary5) !important;
  box-shadow: 1px 1px 5px 0px #96853e99;
}
.slot-column{
  display: flex;
  gap: var(--gap-slots);
  flex-direction: column;
}
.slot-all{
  display: flex;
  flex: 1;
  overflow: hidden;
  gap: var(--gap-slots);
  padding: 8px;
}
.slot-box{
  display: flex;
  overflow: hidden;
  flex-direction: column;
  gap: var(--gap-slots);
  background-color: var(--gray5);
  box-shadow:0 0 8px 0 #00000017;
  border: 1px solid var(--link20);
  border-radius: 16px;
}
.slot{
  justify-content: center;
  align-items: center;
  display: flex;
  overflow: hidden;
  flex: 1;
}
.slot.active{
  background-color: rgba(132, 0, 255, 0.582);
}
.slot-more{
  position: absolute;
  top: 12px;
  left: 12px;
  display: flex;
  z-index:2;
}
.slot-more-btn{
  min-width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid var(--link30);
  background-color: var(--MainWhite);
  cursor: pointer;
}
.slot-more-btn.red{
  border: 1px solid var(--error30);
  padding: 1px;
}
.slot-more-btn.red:hover{
  background-color: var(--error5);
}
.slot-more-btn.plum{
  border: 1px solid var(--Melted30);
}
.slot-more-btn.plum:hover{
  background-color: var(--Melted5);
}
.add-items-box{
  border-radius: 8px;
  background-color: var(--gray5);
  width: 50%;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--gray50);
  padding: 32px;
  gap: 16px;
  align-items: center;
}
.add-items-box:hover{
  border:1px solid var(--link50);
  background-color: var(--link5);
}
.add-items-box:hover .add-items-msg{
	color:var(--gray80);
}
.add-items-box:hover .add-items-btn{
  background-color:var(--link50);
}
.add-items-box:hover .add-items-btn-txt{
  color:var(--MainWhite);
}
.add-items-box:hover .add-items-btn-img-hover{
  display:block;
}
.add-items-box:hover .add-items-btn-img{
  display:none;
}
.add-items-msg{
  color: var(--gray60);
  text-align: center;
}
.add-items-btn{
  border: 1px solid var(--link60);
  border-radius: 8px;
  padding: 4px 8px;
  background-color: var(--gray5);
  display: flex;
  align-items: center;
  gap: 4px;
}
.add-items-btn-img,.add-items-btn-img-hover{
  width: 14px;
  height: 14px;
}
.add-items-btn-img-hover{
  display:none;
}
.bottom-slot-box{
  display: flex;
  align-items: center;
  gap: var(--gap-slots);
}
.btn-icon{
  width: 16px;
}
.btn-title{
	white-space:nowrap;
}
.bottom-slot-box .btn{
  flex: 1;
}
.btn{
  display: flex;
  border-radius: 8px;
  padding: 4px 8px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  cursor:pointer;
}
.btn-transparent{
  color: #96853e;
  background-color: transparent;
  font-size: 16px;
  font-weight: 500;
}
.btn-solid-blue{
  color: var(--MainWhite);
  background-color: var(--link60);
  font-size: 16px;
  font-weight: 500;
}
.btn-secondary{
  color: var(--gray70);
  background-color: transparent;
  border: 1px solid var(--gray70);
  font-size: 14px;
  font-weight: 500;
}
.btn-primary{
  color: var(--MainWhite);
  background-color: var(--Shopping50);
  font-size: 14px;
  font-weight: 500;
}
.slot-more-toggle-btn img,.slot-more-btn img{
  display: none;
  padding: 2px;
}
.slot-more-toggle-btn:not(.active) img:first-child,.slot-more-btn:not(.active) img:first-child{
  display: initial;
}
.slot-more-toggle-btn.active img:nth-child(2),.slot-more-btn.active img:nth-child(2){
  display: initial;
}

.slot-more-all-btns{
  position: absolute;
  left: 36px;
  top: 0;
  display: flex;
  gap: 8px;
  flex-direction: row-reverse;
  width: 0;
  overflow: hidden;
  transition: width calc(var(--base-transition-duration) * 1.5);
}
.slot-more-all-btns.open-more{
  width: 210px;
}
.slot-more-all-btns .slot-more-btn.active{
  background-color: var(--link60);
}

.has-data{
  /*background-color: #96853e;*/
}
.has-data .add-items-box{
  display: none;
}
.title{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.title >div{
  min-width: 200px;
}
.action-btns{
  display: flex;
  gap: 8px;
}
.action-btns >.btn{
  min-width: 130px;
}
.btn-icons{
  width: 11px;
}
.title-middle{
  display: flex;
  gap: 8px;
}
.title-middle-img{
  width: 32px;
}
.title-middle-txt{
  font-size: 20px;
  color: var(--Shopping60);
}
.filter-bar{
  display: flex;
  width: 100%;
  gap: 8px;
  padding:0 8px;
}
.select-filter-type{
  min-width: 150px;
  min-height: 42px;
}
.select-filter-type{
  border-radius: 12px;
  padding: 4px 8px;
}
.filter-box{
  display: flex;
  justify-content: space-between;
  flex: 1;
  background-color: var(--MainWhite);
  padding: 4px 8px;
  border-radius: 12px;
}
.not-make-page .slot-box{
  border:none;
}
.filter-content{
  display: flex;
  align-items: center;
}
.filter-count-box{
  display: flex;
  align-items: center;
  gap: 8px;
}
.img-w-16{
  width: 16px;
}
.sp-align-center{
  align-items: center;
}
.ma-custom-select {
  width: 180px;
  position: relative;
  /*direction: rtl;*/
  user-select: none;
}
.ma-selected {
  height: 42px;
  border: 1px solid #c8a94b;
  border-radius: 10px;
  padding: 0 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  background: var(--MainWhite);
  color: #666;
  transition: .2s;
}
.ma-selected:hover {
  background: #faf8f0;
}
.ma-arrow {
  transition: .25s;
  font-size: 18px;
}
.ma-custom-select.active .ma-arrow {
  transform: rotate(180deg);
}
.ma-options {
  position: absolute;
  top: 48px;
  left: 0;
  width: 100%;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 10px;
  list-style: none;
  padding: 5px 0;
  margin: 0;
  display: none;
  box-shadow: 0 5px 15px rgba(0, 0, 0, .1);
  z-index: 100;
}
.ma-custom-select.active .ma-options {
  display: block;
}
.ma-options li {
  padding: 10px 15px;
  cursor: pointer;
  color: var(--secondary60);
  font-size: 18px;
  font-weight: 500;
}
.ma-options li:hover {
  background: #f3f3f3;
}
.ma-selected-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ma-filter-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 12px;
  border: 1px solid var(--gray50);
  border-radius: 8px;
  background: var(--MainWhite);
}
.ma-filter-item span{
  color: var(--gray70);
  font-size: 16px;
  font-weight: 500;
  white-space: nowrap;
}
.ma-remove {
  cursor: pointer;
  line-height: 1;
}
.ma-filter-count-box {
  gap: 8px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
}
.ma-selected-title{
  color:var(--secondary60);
  font-size:18px;
  font-weight:500;
}
/*********************************************************************************  advance search - slots-end  ******************/

/*********************************************************************************  advance search - menu  ******************/
.zr-more-menu {
  position: fixed;
  width: 240px;
  background-color: var(--MainWhite);
  top: 68px;
  left: 211px;
  z-index: 100;
  border-radius: 8px;
  box-shadow: 0 0 10px 1px #9797977a;
  padding: 16px 12px;
  display:none;
}
.zr-more-items {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.zr-menu-item {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
}
.zr-menu-item:hover {
  background-color: var(--link5);
}

.zr-menu-item-img {
  width: 24px;
}
.zr-menu-item-title {
  color: var(--Shopping70);
  font-size:14px;
}
.zr-arrow {
  position: absolute;
  width: 20px;
  height: 20px;
  background-color: var(--MainWhite);
  top: -7px;
  left: 25px;
  transform: rotate(45deg);
  border-radius: 4px;
  z-index: 2;
}
/*********************************************************************************  advance search - menu-end  ******************/
/*********************************************************************************  advance search - template-setting  ******************/
.zr-template-right {
  display: flex;
  max-width: 250px;
  flex: 1;
  overflow: hidden;
  flex-direction: column;
  align-items: center;
  gap: 30px;
}

.zr-template-list {
  display: flex;
  flex: 1;
  overflow: hidden;
  flex-direction: column;
  gap: 36px;
  width: 100%;
  align-items: center;
  padding: 20px 0;
}

.zr-template-item {
  background-color: var(--Dialogbg, #00426C) ;
  width: 100%;
  display: flex;
  padding: 16px;
  margin-right: 20px;
  border-radius: 0 16px 16px 0;
  color: var(--MainWhite);
  cursor: pointer;
  position: relative;
}

.zr-template-item.active::before,
.zr-template-item:hover::before {
  content: "";
  position: absolute;
  width: 40px;
  height: 20px;
  left: 10px;
  top: -20px;
  background: var(--Dialogbg, #00426C) ;
  border-bottom-left-radius: 20px;
  box-shadow: -20px 0px 0px 0px var(--gray5);
}

.zr-template-item.active::after,
.zr-template-item:hover::after {
  content: "";
  position: absolute;
  width: 40px;
  height: 20px;
  left: 10px;
  bottom: -20px;
  border-top-left-radius: 20px;
  box-shadow: -20px 0px 0px 0px var(--gray5);
}

.zr-template-item.active,
.zr-template-item:hover {
  background-color: var(--gray5);
  color: var(--Shopping70);
}
.zr-template-box {
  display: flex;
  overflow: hidden;
  flex: 1;
  background-color: var(--gray5);
  border-radius: 24px;
  flex-direction: column;
  padding: 24px 16px;
  gap: 16px;
}

.template-title {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 12px;
}

.zr-flex-line {
  flex: 1;
  height: 1px;
  background-color: var(--Shopping10);
}

.zr-template-preview-box {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: max-content;
  height:100%;
  gap: 16px;
}

.zr-template-preview-item {
  background-color: var(--MainWhite);
  display: flex;
  flex-direction: column;
  gap: 12px;
  border-radius: 12px;
  padding: 12px;
  position: relative;
  height: fit-content;
}
.zr-template-preview-item-bottom {
  display: flex;
  flex: 1;
  min-height: 165px;
  border-radius: 8px;
  position: relative;
}

.zr-template-preview-item-bottom-inner {
  background-color: var(--Shopping5);
  display: flex;
  border-radius: 8px;
  flex: 1;
  position: relative;
  align-items: center;
  justify-content: center;
}

.zr-preview-img-box {
  width: 195px;
  height: 122px;
  box-shadow: 2px 2px 8px 0 #0000002a;
}

.slot-more.slot-more-preview {
  flex-direction: column;
  direction: ltr;
  z-index: 10;
  top: 4px;
  left: 4px;
}

.slot-more-preview .slot-more-all-btns.open-more {
  height: 150px;
}

.slot-more-preview .slot-more-all-btns {
  left: 0;
  top: 24px;
  flex-direction: column;
  gap: 4px;
  width: 210px;
  height: 0;
  transition: height calc(var(--base-transition-duration) * 1.5);
}
.slot-more-preview  .slot-more-btn{
  min-width: 20px;
  height: 20px;
  display: flex;
}

.zr-more-icon {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1px solid var(--link30);
  background-color: var(--MainWhite);
  display: flex;
  align-items: center;
  justify-content: center;
}
.zr-more-icon img{
  width: 60%;
}
.zr-more-preview-btn{
  display: flex;
  gap: 8px;
  align-items: center;
  cursor: pointer;
}

.zr-more-title {
  color: var(--link50);
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
}
/*
.zr-preview-bg-layer{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #ffffffb3;
  z-index: 5;
  display: none;
}
.zr-preview-bg-layer.active{
  display: unset;
}
*/
.is-default{
  position: absolute;
  right: 4px;
  top: 4px;
  background-color: var(--Shopping5);
  border: 1px solid var(--Shopping20);
  padding: 4px 8px;
  border-radius: 50px;
  font-size: 10px;
  font-weight: 500;
}
.mr-template-card-more {
  position: relative;
  z-index: 10;
}
.mr-template-card-more-btn {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 1px solid var(--link50);
  background-color: var(--MainWhite);
  box-sizing: content-box;
  cursor: pointer;
}
.mr-template-card-more-btn:hover,.slot-more-btn:hover{
  background-color: var(--link5);
}
.is-open .mr-template-card-more-btn {
  background-color: var(--link50);
}
.is-open .mr-template-card-more-btn .mr-template-card-more-img{
  display: none;
}
.is-open .mr-template-card-more-btn .mr-template-card-more-img.light{
  display: block;
}
.mr-template-card-more-menu {
  position: absolute;
  top: 30px;
  padding: 8px 4px;
  min-height: 100px;
  background-color: var(--MainWhite);
  border-radius: 12px;
  z-index: 10;
  left: 0;
  border: 1px solid var(--link5);
  display: none;
  flex-direction: column;
  gap: 4px;
}
.is-open .mr-template-card-more-menu{
  display: flex;
}
.mr-template-card-more-item {
  display: flex;
  gap: 8px;
  flex-direction: row-reverse;
  padding: 12px;
  border-radius: 8px;
  cursor: pointer;
}
.mr-template-card-more-img.light{
  display: none;
}
.mr-template-card-more-item:hover {
  background-color: var(--link50);
}
.mr-template-card-more-item.delete:hover {
  background-color: var(--error60);
}
.mr-template-card-more-item:hover .zr-more-title {
  color: var(--MainWhite);
}
.mr-template-card-more-item.inactive:hover{
  background-color:var(--gray50);
  cursor:not-allowed;
}
.mr-template-card-more-item.inactive:hover .zr-more-title{
  color:var(--MainWhite);
}
.mr-template-card-more-item:hover .mr-template-card-more-item-img {
  display: none;
}
.mr-template-card-more-item:hover .mr-template-card-more-item-img.light {
  display: block;
}
.mr-template-card-more-item-img {
  min-width: 16px;
  width: 16px;
  height: 16px;
}
.mr-template-card-more-item-img.light {
  display: none;
}
.delete .zr-more-title{
  color: var(--error60);
}
.zr-template-preview-item-top {
  display: flex;
  justify-content: space-between;
}
.mr-item-overlay,.mr-item-overlay-bottom{
  position: absolute;
  visibility: hidden;
  opacity: 0;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  z-index: 8;
  bottom: 0;
  background: #ffffff0d;
  backdrop-filter: blur(1px);
  transition: 0.2s ease;
}
.mr-item-overlay-bottom{
  background: #ffffffb5;
  backdrop-filter: blur(2px);
  z-index: 2;
}
.is-open .mr-item-overlay{
  visibility: visible;
  opacity: 1;
}
.mr-preview-btns-box{
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 7;
  display: none;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-direction: column;
}
.mr-preview-btn{
  width: 60%;
  min-height: 36px;
}
.zr-template-preview-item:hover .mr-item-overlay-bottom {
  visibility: visible;
  opacity: 1;
}
.zr-template-preview-item:hover .mr-preview-btns-box {
  display: flex;
}
:is(.btn-primary,.btn-secondary):hover{
  border: 1px solid var(--link50);
  background-color: var(--link5);
  color: var(--link50);
}

/*********************************************************************************  advance search - template-setting-end  ******************/

/*********************************************************************************  advance search - template-add-template  ******************/
.zr-select-template-type-box{
  background-color: var(--gray5);
  min-height: 166px;
  border-radius: 12px;
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: space-evenly;
  overflow: hidden;
  gap: 8px;
  padding: 0 16px;
}
.zr-select-template-type-items{
  max-height: 76px;
  display: flex;
  flex: 1;
  overflow: hidden;
  justify-content: space-between;
  gap: 4px;
}
.zr-template-type-item{
  display:flex;
  flex:1;
  overflow:hidden;
  background-color:var(--gray10);
  border-radius:8px;
  border:1px solid var(--gray10);
  gap:4px;
  padding:8px 4px;
  cursor:pointer;
  position:relative;
}
.zr-slot{
  background-color:var(--Shopping15);
  display:flex;
  border-radius:4px;
}
.zr-slot-1{
  flex:1;
}
.zr-slot-2{
  flex:2;
}
.zr-template-type-item.active{
  background-color:var(--link5);
  border:1px solid var(--link50);
}
.zr-template-type-item.active .zr-slot{
  background-color:var(--link30);  	
}
.zr-template-type-item-check{
  width:14px;
  height:14px;
  position:absolute;
  top:4px;
  right:4px;
  display:none;
}
.zr-template-type-item.active .zr-template-type-item-check{
  display:unset;
}

/*********************************************************************************  advance search - template-add-template-end  ******************/

/*********************************************************************************  advance search - template-add-widget  ******************/
.dialog-content{
  flex: 1;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 0 20px;
}
.dialog-title-txt{
  color: var(--MainWhite);
}
.dialog-title .close {
  cursor: pointer;
}
.dialog-title .close >span{
  color: var(--MainWhite);
}
.dialog-close-img{
  width: 10px;
}

.icon-container{
  width: 64px;
  height: 64px;
  padding: 20px;
  border-radius: 8px;
  border: 1px solid var(--gray10);
}
.ma-items-box{
  display: grid;
  grid-template-columns: repeat(8,1fr);
  gap: 16px;
}
.ma-item{
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--Shopping50);
  justify-content: center;
  align-items: center;
  padding: 10px 12px;
  gap: 12px;
  cursor: pointer;
  position:relative;
}
.ma-item.active{
  border: 1px solid var(--link50);
  background-color: var(--link5);
}
.ma-item.inactive {
  filter: grayscale(100%);
  opacity: 0.6;
  pointer-events: none;
  cursor: not-allowed;
}
.ma-item-img{
  width: 32px;
}
.mr-warn-box{
  position:absolute;
  left:8px;
  top:8px;
  width:24px;
  height:22px;
}
.mr-warn-img{
  width:100%;
  height:100%;
}
.mr-warn-box:hover :is(.mr-warn-text,.mr-warn-pointer,.mr-warn-text-box){
  visibility:visible;
}
.mr-warn-text-box{    
  visibility:hidden;
  position: fixed;
  background-color: var(--warning60);
  padding: 12px 16px;
  border-radius: 8px;
}
.mr-warn-text{
  visibility:hidden;
  color:var(--MainWhite);
  white-space: nowrap;
  font-size:14px;
  font-weight:300;
}
.mr-warn-pointer{    
  position: absolute;
  width: 16px;
  height: 16px;
  transform: rotate(45deg);
  background-color: var(--warning60);
  border-radius: 3px;
  bottom: -6px;
  z-index: -1;
  visibility:hidden;
}
.ma-item-title{
  color: var(--Shopping50);
  font-size: 14px;
  font-weight: 500;
}
.dialog-action-btns{
  display: flex;
  min-height: 100px;
}
.btn-outline{
  border: 1px solid var(--gray70);
  color: var(--gray70);
}
.btn-inactive{
  background-color: var(--gray50);
  color: var(--MainWhite);
}
.btn-active{
  background-color: var(--Shopping50);
  color: var(--MainWhite);
}
.sp-justify-end{
  justify-content: end;
}
.ma-dialog{
  display: flex;
  width: 100%;
  height: 100%;
  border-radius: 20px;
  background-color: var(--Shopping50);
  overflow: hidden;
  flex-direction: column;
}
.ma-dialog-title{
  min-height: 42px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 32px;
}
.ma-dialog-content{
  flex: 1;
  overflow: hidden;
  border-radius: 20px;
  background-color: var(--MainWhite);
  border: 2px solid var(--Shopping50);
  /* padding:24px 32px; */
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.ma-dialog-title-txt{
  color: var(--MainWhite);
  font-size:14px;
  font-weight:500;
}
.ma-dialog-title .close {
  cursor: pointer;
}
.ma-dialog-title .close >span{
  color: var(--MainWhite);
}
.ma-dialog-close-img{
  width: 10px;
}
.ma-dialog.ma-dialog-select-widget{
  background-color: var(--secondary70);
  width:788px;
  height:100%;
}
.ma-dialog-select-widget .ma-dialog-content{
  border: 2px solid var(--secondary70)
}
.zr-iconic-item{
  display:flex;
  flex:1;
  overflow:hidden;
  gap:16px;
  flex-direction: column;
}
.ma-widget-arrow{
  display: flex;
  flex: 1;
  position: absolute;
  top: 20px;
  right: 187px;
  height: 10px;
  width: 249px;
  z-index: 5;
}
.ma-widget-top{
  display:flex;
  flex:1;
  max-height:50px;
  align-items:center;
  justify-content:center;
}
.ma-widget-bottom{
  display:flex;
  flex:1;
  overflow:hidden;
  flex-direction:column;
  align-items: center;
}
.ma-widget-circle-no{
  display:flex;
  width:32px;
  height:32px;
  border:1px solid var(--Shopping50);
  align-items:center;
  justify-content:center;
  font-size:14px;
  font-weight:500;
  color:var(--Shopping50);
  border-radius:50%;
}
.zr-multiselect-item{
  display:flex;
  justify-content:space-between;
}
.zr-advanceSearch-dialog-body{
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 8px;
  /*max-height: 222px;*/
  overflow: auto;
  /*padding-block:8px;*/
}
.zr-hr{
  width: 100%;
  min-height: 1px;
  display: flex;
  background-color: var(--secondary60);
}
.ma-widget-bottom-item{
  border: 1px solid var(--secondary60);
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 4px;
  gap: 4px;
  /*min-width: 113px;
  min-height: 100px;*/
  position:relative;
}
.ma-widget-bottom-item-title{
  color:var(--secondary60);
  font-size:14px;
  font-weight:500;
}
.ma-widget-bottom-item-img{
  max-width: 60%;
  max-height: 50%;
  border-radius: 8px;
  object-fit: contain;
}
.ma-widget-add .ma-widget-bottom-item-img{
  width:40px;
}


/**** slider *****/
.ma-widget-slider .swiper-slide img{
  width: unset !important;
  margin: unset !important;
  height: unset !important;
  object-fit: unset !important;
  display: unset  !important;
}
.ma-widget-slider .slider-container {
  width: 1000px;
  height:500px;
  margin: auto;
  position: relative;
}

.ma-widget-slider .swiper {
  width: 850px;
  margin: auto;
  height:100%;
}

.ma-widget-slider .swiper-slide {
  border-radius: 25px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.ma-widget-slider .my-next,
.ma-widget-slider .my-prev {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1px solid var(--link30);
  background: white;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 100;
}

.ma-widget-slider .my-prev {
  right: 0;
}

.ma-widget-slider .my-next {
  left: 0;
}

.ma-widget-slider .my-next::after,
.ma-widget-slider .my-prev::after {
  font-size: 22px;
  color: #2d7777;
  font-weight: bold;
}

.ma-widget-slider .my-next::after {
  content: "";
  width:10px;
  height:16px;
  background-image: url('/themes/mobile/images/advancesearch/arrow-right-blue.svg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain; 
  transform:rotate(180deg);
}

.ma-widget-slider .my-prev::after {
  content: "";
  width:10px;
  height:16px;
  background-image: url('/themes/mobile/images/advancesearch/arrow-right-blue.svg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain; 
}

.ma-widget-slider .my-next.swiper-button-disabled,
.ma-widget-slider .my-prev.swiper-button-disabled {
  opacity: 0.3;
  cursor: not-allowed;
  pointer-events: none;
}

.ma-widget-slider .swiper-pagination {
  bottom: 0 !important;
  position: relative;
  text-align: right;
}

.ma-widget-slider .swiper-pagination-bullet {
  width: auto;
  height: auto;
  background: transparent;
  opacity: 1;
  margin: 0 8px !important;
  font-size: 16px;
  color: #555;
}

.ma-widget-slider .swiper-pagination-bullet-active {
  width: 30px !important;
  height: 30px !important;
  line-height: 35px !important;
  border-radius: 50% !important;
  background: #255f5f;
  color: white;
  text-align: center;
}

/**** slider-end *****/
.ma-widget-dialog-item{
  min-width:unset;
  flex:1;
}
.zr-advanceSearch-dialog-body-list {
  display: grid;
  flex: 1;
  overflow: auto;
  gap: 8px;
  grid-template-columns: repeat(3, 1fr);
  align-items: center;
  max-height: 222px;
}
.ma-widget-dialog-item-list {
  min-width: unset;
}
.ma-widget-bottom-item-list {
  border: 1px solid var(--secondary60);
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 10px 12px;
  gap: 12px;
  /*min-width: 113px;
  min-height:100px;*/
}
/*******range iconic******/
.zr-amount-range{
  display: flex;
  width: 100%;
  flex-direction: column;
  margin: 24px 0;
}
.range-container {
  position: relative;
  width: 100%;
  height: 30px;
}
.range-container input[type="range"] {
  position: absolute;
  left: 0;
  top: 10px;
  width: 100%;
  pointer-events: none; /* جلوگیری از تداخل */
  -webkit-appearance: none;
  background: none;
  z-index:10;
  padding-right: 0 !important;
}
.range-container input[type="range"]::-webkit-slider-thumb {
  pointer-events: all; /* فقط برای خود thumb فعال */
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--Shopping50);
  border: 2px solid white;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);
  -webkit-appearance: none;
}

.range-container input[type="range"]::-moz-range-thumb {
  pointer-events: all;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--Shopping50);
  border: 1px solid white;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);
}

.slider-track {
  position: absolute;
  top: 18px;
  left: 0;
  height: 4px;
  width: 100%;
  border-radius: 2px;
  background: #ddd;
  z-index: 9;
  --slider-gradient-direction: to left;
}

.slider-track::before {
  content: "";
  position: absolute;
  height: 100%;
  /*background: #007bff;*/
  border-radius: 2px;
  left: 0;
  right: 0;
}
.zr-iconic-range-input-title{
  color: var(--secondary70);
  font-size: 16px;
  white-space: nowrap;
  min-width: 100px;
  text-align: center;
}
.zr-iconic-range-input-box{
  display: flex;
  align-items: center;
  position: relative;
  border: 1px solid var(--secondary60);
  border-radius: 12px;
  background-color: var(--MainWhite);
  width:100%;
  overflow:hidden;
}
.zr-iconic-range-input{
  background-color: transparent !important;
  text-align: center !important;
  padding-left: 60px !important;
}
#FieldDialog .zr-iconic-range-input{
  padding-left: 0 !important;
}
.zr-iconic-range-input-label{
  position: absolute;
  left: 4px;
  font-size: 12px;
  color: var(--gray70);
}
.ma-range-box{
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 8px;
}
.w2 .ma-range-box{
  flex-direction: row;
}
.h6 .ma-range-detector{
  max-height:30%;
}
.h4 .ma-range-detector{
  max-height:50%;
}
.h3 .ma-range-detector{
  max-height:70%;
}
/***************/
.ma-list01-body{
  padding: 32px 80px;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  overflow-y: auto;
  gap:16px;
}
.ma-field-body{
  padding: 32px 80px;
  overflow-y: auto;
  width: 70%;
}
.zr-iconic-checkbox-title{
  color:var(--secondary60);
  font-size:18px;
}
.swiper-slide img.ma-widget-bottom-item-img{
  width:60px !important;
}
.ma-field-box{
  display:flex;
  flex-direction:column;
  gap:8px;
  width:100%;
  background-color:var(--secondary5);
  border:1px solid var(--secondary60);
  border-radius:12px;
  padding:12px;
  align-items: flex-start;
}
/*********************************************************************************  advance search - template-add-widget-end  ******************/
.ma-slot-data-box{
  position: absolute;
  width: 100%;
  height: 100%;
  display: none;
  flex: 1;
  overflow: hidden;
  flex-direction: column;
  padding: 12px;
  gap: 12px;
}
.has-data .ma-slot-data-box{
  display: flex;
}

.dotted-bg.has-data{
  background: unset;
}
.ma-slot-data-title{
  display: flex;
  align-items: center;
  gap: 16px;
}
.ma-slot-title-txt{
  font-size: 18px;
  font-weight: 500;
  color: var(--secondary60);
}
.ma-greedy-line{
  height: 2px;
  background-color: var(--secondary60);
  flex: 1;
}
.ma-slot-data-parent{
  display: flex;
  flex: 1;
  overflow: hidden;
}
.ma-slot-data-body{
  display: grid;
  flex: 1;
  gap: 12px;
  overflow-y: auto;
}
.ma-slot-data-body > div{
  background-color: var(--MainWhite);
  border: 1px solid var(--secondary60);
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-evenly;
  cursor: pointer;
}
.h2 .ma-slot-data-body{
  grid-auto-rows: 100%;
}
.h3 .ma-slot-data-body{
  grid-auto-rows: calc(50% - 12px);
}
.h4 .ma-slot-data-body{
  grid-auto-rows: calc(33.33% - 12px);
}
.h6 .ma-slot-data-body{
  grid-auto-rows: calc(20% - 12px);
}

.w1 .ma-slot-data-body{
  grid-template-columns: repeat(3,1fr);
}
.w2 .ma-slot-data-body{
  grid-template-columns: repeat(6,1fr);
}

.ma-widget-add{
  border: 1px dashed var(--secondary60) !important;
  background-color: var(--secondary5);
}
.ma-widget-delete , .ma-widget-move{
  position:absolute;
  top: 4px;
  width:32px;
  height:32px;
  padding:4px;
}
.ma-widget-delete {
  left:4px;
}
.ma-widget-move{
  right:4px;
}
.item-selected{
  border: 2px solid var(--link70) !important;
  position:relative;
}
.item-selected:after {
  content: '\f058';
  position: absolute;
  width: 20px;
  height: 20px;
  font-size: 17px;
  top: 3px;
  right: 12px;
  font-family: 'FontAwesome';
  color: var(--link70);
}
.item-selected .ma-widget-bottom-item-title{
  color: var(--link70) !important;
}
.ma-check{
  width:20px;
  height:20px;
  cursor:pointer;
  pointer-events: none;
}
.ma-overlay{
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  z-index: 99;
  bottom: 0;
  background: #ffffff0d;
  backdrop-filter: blur(1px);
}
.ma-dialog .ma-widget-bottom-item{
  min-width:113px;
  min-height: 118px;
}
.zr-advanceSearch-dialog-body-list .ma-widget-bottom-item{
  min-height: 113px;
}
.ma-dialog .zr-advanceSearch-dialog-body :is( .ma-widget-dialog-item, .ma-widget-bottom-item){
  min-width:unset;
}
.mr-template-title-box{
  display:flex;
  flex:1;
  align-items:center;
  justify-content:center;
}
.mr-template-title{
  font-size:16px;
  font-weight:500;
  color:var(--Shopping60);  
  white-space: nowrap;
}
.mr-spacer-1{
  display:flex;
  flex:1;
}
.mr-spacer-line-2{
  display:flex;
  flex:2;
  height:1px;
  background-color:var(--Shopping20);
}

/*######## language #########*/
.mr-language-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  height: calc(100% - 50px);
}
.mr-language-item {
  border-radius: 20px;
  box-shadow: 0 4px 12px 0 #00000040;
  border: 1px solid #EBEEF3;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 16px 24px;
  min-width: 388px;
  cursor: pointer;
}
.mr-language-item:hover {
  box-shadow: 0 4px 12px 0 #0000008c;
  transition-duration:0.3s;
}
.mr-language-img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
}
.mr-language-title {
  font-size: 18px;
  font-weight: 700;
  color: #203353;
}
.mr-btn-register{
  align-self: center;
  min-height: 40px;
  min-width: 287px;
}
.mr-btn-register:hover{
  box-shadow:0 4px 12px 0 #0000008c;
  transition-duration:0.3s;
}
.mr-language-item.selected{
  box-shadow:0 4px 12px 0 #0000008c;
  border: 2px solid #acadafb5;
}
/*######## language end #########*/
.mr-empty-state{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:24px;
}
.mr-empty-state-img{
  max-height:250px;
  min-height:25px;
}
.mr-empty-box{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:8px;	
}
.mr-empty-title{
  font-size:14px;
  font-weight:500;
  color:var(--Shopping50);
}
.mr-empty-description{
  font-size:14px;
  font-weight:400;
  color:var(--Shopping50);
  text-align: center;
}
.advance-result-double-flange-box{
  position:absolute;
  top: 16px;
  right: 16px;
}
.mr-double-flange-img{
  height: 16px;
  width: unset;
  object-fit: cover;
}
.zr-popup-weight {
  min-width: 100px;
  min-height: 50px;
  transform: translate(1px, -7px);
}
.zr-popup-weight ul {
    max-height: 220px;
    overflow: auto;
    min-height: 60px;
}
.mr-weight-title{
  font-size:14px;
  color:var(--primary70);
}
.mr-weight-title2{
  font-size:14px;
  color:var(--primary70);
  font-weight:700;
}
.mr-weight-unit{
  font-size:10px;
  color:var(--primary70);
}
.mr-align-base{
  align-items: baseline;
}
.mr-badge-text{
  position: absolute;
  color: var(--MainWhite);
  min-width: 98px !important;
  top: 11px;
  transform: rotate(-19deg);
  right: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
}
.mr-badge-sold{
  top: 15px;
  transform: rotate(-18deg);
}
.mr-corner-badge-text{
  color: white;
  transform: rotate(-46deg);
  top: 17px;
  position: absolute;
  font-size: 12px;
  width: 80%;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  right: 16px;
  line-height: 11px;
}
.mr-corner-badge-text-production{
  font-size: 10px;
  top: 12px;
  right: 17px;
}
/*############################################# media query ####################################*/
@media (max-height: 800px) {
  .h4 .ma-range-detector {
    max-height: 80%;
  }
}
@media (max-width: 1400px) {
  .ma-slot-title-txt{
    font-size:12px;
  }
  .ma-widget-bottom-item-title{
    font-size:10px;  
  }
  .zr-iconic-range-input-title{
    font-size:14px;    
  }
  .ma-selected {
    height: 32px;
  }
  .ma-custom-select {
    width: 140px;
  }
  .ma-selected-title,.ma-options li{
    font-size:14px;
  }
  .ma-options{
    top: 38px;
  }
  .ma-greedy-line{
    height: 1px;
  }
  .ma-slot-data-box {
    padding: 4px 8px;       
    gap: 6px;
  }
  .ma-filter-item span {
    /*font-size: 12px;*/
  }
  .ma-filter-item {
    padding: 2px 8px;
  }
  .item-selected:after {
    top: 0px;
    right: 2px;
  }
  .slot-more {
    top: 2px;
    left: 4px;
  }
  .ma-slot-data-title{
  	min-height:24px;
  }
  .zr-advanceSearch-dialog-body{
    padding:0;
  }
  .range-container {
    min-height: 20px;
  }
  .range-container {
    min-height: 12px;
  }
  .range-container input[type="range"] {
    top: -3px;
  }
  .slider-track {
    top: 4px;
  }
  .ma-range-box {
    gap: 4px;
  }
  .advance-result-item.sp-skeleton {
    height: 272px !important;
  }
  .body-Smarttray-Smarttray, .body-cart-cart {
    top: 137px !important;
  }
}
@media (max-width: 1700px) {
  .advance-result-item{
    min-height: 340px;
    width:calc(25% - 1.06rem) !important;
  }
  
}
/*############################################# media query ####################################*/