dialog .sp-main-loading{
	min-height:300px;
}
:is(.zr-divContent, .zr-divForm, .zr-dataForm, .zr-hasfilter) :is(.sp-tree li, .sp-select-item, .sp-drop-items li, .sp-suggest .sp-widget-list li.sp-widget-item) {
    margin: 8px 0;
}
/*****************************************  select tree  ***************************/
:is(.zr-divContent, .zr-divForm, .zr-dataForm, .zr-hasfilter) :is(.sp-tree li>span, .sp-select-item>span, .sp-drop-items li>span, .sp-widget-item)
 {
    width: 100%;
    font-size: var(--smallfont);
    cursor: pointer;
    margin: 0;
    text-align: right;
    border-radius: var(--smallradius);
    padding: 0.25rem 0.75rem 0.25rem 0.4rem;
}
.sp-select-items li >img{
  display:none;
}
:is(.zr-divContent, .zr-divForm, .zr-dataForm, .zr-hasfilter) :is(.sp-tree li, .sp-select-item, .sp-drop-items li, .sp-suggest .sp-widget-list li.sp-widget-item) {
    margin: 8px 0;
}
.sp-dialog :is(.zr-divContent, .zr-divForm, .zr-dataForm, .zr-hasfilter) :is(ul.sp-tree, .sp-select-items ul:not(.sp-tree ul), .sp-drop-items>ul), .sp-suggest .sp-widget-list {
    margin-top: 0;
}
/*****************************************  select tree end  ***************************/


.zr-text-red{
  color: var(--error70) !important;
}
.zr-text-green{
  color: var(--approved70) !important;
}
.zr-message-body{
  min-width:500px;
  max-width:var(--maxwidth);
  position:fixed;
  bottom:0;
  left:50%;
  transform:translateX(-50%);
  z-index:40;
}
/*var(--maxwidth) تو مدیا کوئری ها کار نمیکنه*/
@media (min-width: 500px) {
  .sp-dialog {
    max-width: 500px;
  }
}
@media (max-width: 500px) {
  .zr-message-body{
    min-width:100%;
  }
}

body{min-height: 100dvh;}
#divNotify{display:none;}
.zr-msg-warning .sp-btn-edit{
      background-image: none;
}

.zrm-disabled {
  pointer-events: none;
  opacity: 0.6;
  cursor: not-allowed;
  background-color: var(--gray40);
}

.zr-loader{
  width: 100%;
  min-height: 60px;
  background: beige;
  display: none;
  justify-content: center;
  align-items: center;    
  margin-bottom: 16px;
}
.zr-admin-logs-user{
	color:var(--gray90) !important;
}
.zr-admin-logs-user img{
	width:12px;
}

.zr-accep-rules{
	color:var(--gray70); 
}
.zr-accep-rules a{
	color:var(--primary50);
  text-decoration: underline;
  text-underline-offset: 6px;
}
.zr-login-bg {
  width: 100%;
  height: 100svh;
  background: linear-gradient(to bottom, #003556, #00426c, #003556);
  align-items: center;
}
.zr-splash-box {
  gap: 20px;
  align-items: center;
}
.zr-splash-text-box {
}
.zr-splash-text1 {
  white-space: nowrap;
  color: var(--MainWhite);
  font-size: 28px;
}
.zr-splash-text2 {
  white-space: nowrap;
  color: var(--MainWhite);
  font-size: 47px;
}
.zr-splash-img {
  height: 84px;
  object-fit: contain;
}
/*********************************************** login 2 ******************/
.zr-login2-box {
  height: 100dvh;
  overflow-y: auto;
}
.zr-login2-top {
  height: 180px;
  background-color: var(--primary50);
  border-radius: 0 0 32px 32px;
}
.zr-login2-top .zr-splash-img {
  height: 61px;
  object-fit: contain;
}
.zr-login2-top .zr-splash-text1 {
  font-size: 18px;
}
.zr-login2-top .zr-splash-text2 {
  font-size: 31px;
}
.zr-login2-bottom {
  padding: 0 27px 31px 27px;
}
.zr-login2-bottom-img {
  height: 299px;
}
.zr-login2-welcome {
  color: var(--primary70);
}
.zr-login2-desc {
  color: var(--primary70);
}
.zr-login2-inputs {
}
.zr-login-send-sms {
  height: 42px !important;
  width: 100% !important;
  margin-top: 18px ;
  color: var(--MainBlack) !important;
  border-radius: 12px !important;
}
.zr-login2-forget {
  color: var(--primary50);
}
/******************************************************* login 3 ********************/
.zr-login3-login {
  width: 100% !important;
  height: 42px !important;
}
.zr-login3-inactive{
  background-color: var(--gray50) !important;
  pointer-events: none;
  opacity: 0.6;
  cursor: not-allowed !important;
}
.zr-login3-back {
  height: 42px;
  width: 100%;
}
.zr-login3-inputs {
  width: 100%;
  display: flex;
  justify-content: space-around;
  direction: ltr;
}
.zr-login3-sms-inputs {
  width: 42px !important;
  height: 42px !important;
  border-radius: 12px !important;
  background-color: var(--MainWhite) !important;
  border: 1px solid var(--primary60) !important;
  text-align: center !important;
  padding: 0 !important;
}
.zr-login3-counter {
  color: var(--gray60);
  width: 100%;
  background: transparent;
}
.zr-resend-active {
  color: var(--link60);
}










/************************************** empty state *********/
.zr-bottom-btns{
  position: fixed;
  width: 100% !important;
  bottom: 75px;
  right: 0;
  padding: 8px 16px 16px 16px;
  background: var(--MainWhite);
}
.zr-bottom-btns .zr-primary-btn,.zr-bottom-btns .zr-secondary-btn{
  width:45% !important;
  height:40px !important;;
}
.zr-adManage-container{
  align-items: center;
  gap: 24px;
  height: calc(100svh - 150px);
}
.zr-adManage-empty-img{
  width: 64%;
}
.zr-adManage-bottom{
  gap: 18px;
  align-items: center;
}
.zr-adManage-bottom-header{
  color: var(--primary50);
}
.zr-btn-icon{
  width: 20px;
}
.zr-adManage-add-btn{
  width: 90% !important;
  gap: 8px;
  height: 40px;
}
.zr-adManage-add-btn-text{
  color: var(--MainWhite);
}

/************************************** add1 *********/
.zr-adManage-add1-container{
  align-items: center;
  gap: 24px;
}
.zr-adManage-add1-image-container{
  width: 130px;
  height: 130px;
  background-color: yellow;
  border-radius: 50%;
}
.zr-adManage-add1-image{
  border-radius: 50%;
}
.zr-adManage-upload-inner{
  background-color: var(--link50);
  border-radius: 50%;
}
.zr-adManage-upload{
  bottom: 0;
  right: 0;
  z-index: 10;
  width: 33px;
  height: 33px;
  background-color: var(--MainWhite);
  border-radius: 50%;
  padding: 4px;
}
.zr-adManage-select-gender{
  width: 100%;
}
.zr-adManage-gender-btns{
  height: 36px;
  width: 45%;
  transition-duration: 300ms;
}
/************************************** access *********/
.zr-adManage-give-access-container{
  overflow-y: auto;    
  height: calc(100svh - 240px);
  padding-bottom: 16px;
}
.zr-access-lvl1{
  border: 1px solid var(--gray15);
  box-shadow: 0 4px 12px #0D0A2C0F;
  padding: 16px;
  border-radius: 12px;
  margin-top: 8px;
}
.zr-access-title{
  gap: 8px;
  align-items: center;
}
.zr-access-title-text{
  color: #002841;
}
.zr-access-arrow{
  width: 16px;
}
.zr-line-spacer{
  height: 1px;
  display: flex;
  flex: 1;
  background-color: var(--gray60);
}
.zr-access-container-lvl2{
  display: none;
}
.zr-access-lvl2{
  margin-top: 12px;
  gap: 12px;
  padding: 8px 16px;
  border-radius: 8px;
  border: 1px solid var(--gray15);
  box-shadow: 0 4px 12px #0D0A2C0F;
}
.zr-check{
  width: 16px;
  height: 16px;
  border-radius: 4px;
}
.zr-check-inactive{
  background-color: var(--gray5);
  border: 1px solid var(--gray80);
}
.zr-check-semiactive{
  background-color: var(--warning5);
  border: 1px solid var(--warning50);
  background-image: url(/themes/app/images/abshode/dash-orange.svg);
  background-repeat: no-repeat;
  background-position: 2px 6px;
  background-size: 10px; 
}
.zr-check-active{
  background-color: var(--approved70);
  border: 1px solid var(--approved70);
  background-image: url(/themes/app/images/abshode/tick-white.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 10px; 
}
.zr-active-access{
  border: 1px solid var(--approved70);
  background-color: var(--approved5);
}
/********************edit*************/
.zr-adManage-edit{
  padding: 16px 32px;
  border: 1px solid var(--gray15);
  box-shadow: 0 0 12px 0 #0000000A;
  border-radius: 12px;
  margin-top: 8px;
  gap: 16px;
}
.zr-adManage-info-items{
  width: 100%;
}
.zr-adManage-info-left{
  gap: 6px;
}
.zr-adManage-info-left-img{
  width: 16px;
}
.zr-adManage-info-left-txt{
  color: #2A446E;
}
.zr-adManage-info-right{
  color: #2A446E;
}
.zr-adManage-edit-btn{
  width: 100% !important;
  background-color: var(--MainWhite) !important;
  color: var(--primary50) !important;
  border: 1px solid var(--primary50) !important;
}
.zr-adManage-edit-bottom{
  gap: 12px;
  margin-top: 16px;
}
.zr-adManage-edit-bottom-item{
  border-radius: 12px;
  box-shadow: 0 0 12px 0 #0000000A;
  border: 1px solid var(--gray15);
  gap: 8px;
  padding: 16px;
}
.zr-adManage-edit-bottom-icon{
  width: 24px;
}
.zr-adManage-edit-bottom-title{
  color: var(--gray85);
}
/************************ change password ***********/
.zr-addManage-password-container{
    gap: 32px;
    height: 100%;
}
.zr-addManage-password-img{
    width: 80%;
    margin-top: 8px;
    display: flex;
    align-self: center;
}
.zr-addManage-password-desc{
    color: var(--primary85);
}













/***************************************************************************************************** notifications Styles *********************************************/
.zr-footerrate-list li p, .zr-footerrate-list li p b{
  display: inline !important;
}
.zr-card-highlight {
  border: 2px solid #000 !important;
  background: #f9f9f9 !important;
}
.zr-notif-btn{
	min-width: 132px;
    white-space: nowrap;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 24px;
    border: 0;
    font-weight: 400;
    font-size: 10px;
    border-radius: 8px;
    color: #000000;
}
.zr-notif-btn-success{
  background-color: var(--approved20);
}
.zr-notif-btn-error{
  background-color: var(--error20);
}
.zr-notif-btn-warning{
  background-color: var(--warning20);
}
.zr-notif-btn-info{
  background-color: var(--link20);
}




/***************************************************************************************************** Form Styles *********************************************/
.zr-return-btn{
  padding:0;
  max-width: 30px;
  min-width: 30px;
}
.zr-form-btns.zr-primary-btn.sp-none{
	display:none !important;
}
.zr-trade-card-admin-comment{
  background-color: #E5ECF0;
  /*padding: 8px 12px;*/
  border-radius: 8px;
  display:flex;
  margin-bottom: 8px;
}
.zr-trade-card-admin-comment span{
  width:78px;
  font-size:12px;
  font-weight:400;
  color:#3B3B3B;
  white-space: nowrap;
  margin-left: 8px;
}
.zr-trade-card-admin-comment b{
  font-weight:400;
  font-size:14px;
  color:#3B3B3B;
}

.zr-search-input1 .sp-f-row:not(.sp-d-button, .sp-d-checkbox, .sp-d-custom, .sp-d-division, .sp-d-section, .sp-d-label) :is(.sp-form-editor, .sp-f-editor) {
  background-color: #EBEEF3;
  border-radius:12px;
  min-height: 36px;
}
.zr-search-input1 .sp-select-input{
  min-height: 36px !important;
  border-radius: 8px !important;
}
.sp-f-title.zr-search-input2{
  display:none;
}
.zr-search-input1 .sp-select-icon{
  right: 16px !important;
  top: 15px !important;
}
.zr-search-input1 .sp-select-input,.zr-search-input1 .sp-f input.sp-validated{
	padding-right:36px !important;
}


.zr-bezh-input1{
  background:none !important;
}
.zr-bezh-input1 append{
  background-color:var(--InputColor) !important;
}
.zr-bezh-input1 .zr-bezh-input1{
  outline:none !important;
}
.zr-bezh-input1 .zr-bezh-input1 .zr-bezh-input1{
  outline:1px solid #867940 !important;
  border-radius:12px !important;   
  overflow: hidden;
  height: 36px;
}
.zr-bezh-input2{
  margin-bottom: 0 !important;
}

.zr-bezh-dialog .pwa-dialog-header .title p,.zr-bezh-dialog .pwa-dialog-header .close p,.zr-bezh-dialog .pwa-dialog-header .close p i:before{
	color:#867940;
}
.sp-dialog:has(.zr-bezh-dialog){
  background-color:transparent !important;
  border:0.4px solid #867940;
  overflow:hidden;
  border-radius:16px;
}
.zr-bezh-dialog{
  background-color:#EBE7D7 !important;
}
.zr-bezh-dialog .pwa-dialog-header{
  background-color:#EBE7D7 !important;
}
.zr-bezh-dialog .zr-dialog-box{
  border:1px solid #867940 !important;
  margin:4px;
  border-radius: 12px;
}


.zr-card-selected{
  outline:1px solid #00426C;
}
.zr-inactive-btn{
  width: 115px;
  height: 32px;
  font-size: 14px;
  display: flex;
  justify-content: center;
  align-items: center;
  color:  var(--gray60); !important;
  border-radius: 8px;
  background-color: var(--gray40);
}
.zr-without-notif-img {
    max-width: 140px;
}
.zr-sub-input{
  display:flex;
  flex-direction:column;
  width:100%;
  margin-bottom:8px;
  padding:4px;
  gap:4px;
}  
.zr-sub-input span{
  font-size:12px;
  color:#35558A;
}
.zr-notif-container{
  width: 100%;
  height: calc(100svh - 200px);
  overflow: auto;
  padding: 0 12px;
}

body {
  margin: 0;
  overflow-x: hidden;
}

.wrapper {
  transition: transform 0.2s ease;
}

#pullRefresh {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-100%);
  transition: transform 0.2s ease;
  z-index: 9999;
}

.refresh-icon {
  width: 32px;
  height: 32px;
  border: 1px solid #3498db;
  border-top-color: transparent;
  border-radius: 50%;
  animation: none;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}





.sp-dialog-base {
    max-height: calc(100% - 1px);
}
.zr-dialog-box, .zr-page-box{
	max-height: calc(100% - 47px);
}
.zr-btn-overlay{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background: var(--Shopping10);
  height: 100% !important;
  border-radius: 50px !important;
}
.sp-calendar,.sp-time {
  background:  var(--MainWhite);
  border-radius: 12px;
}
.sp-modal-button {
  right: 0px;
  top: -45px;
}
app-dialog .sp-drop-button img, app-dialog .sp-drop-items img{
	border-radius:50%;
}

.zr-fixed-btns{
  position: absolute;
  width: 100%;
  background: white;
  display: flex;
  justify-content: space-between;
  padding: 12px 0 20px 0;
}
app-dialog button.zr-btn-msginfo,app-dialog button.zr-cancel-delete,app-dialog button.sp-btn-cancel,.sp-f-button.sp-btn-cancel:hover{
  min-width:130px !important;
  flex:1;
}


.zr-bottom-navigation-bar .zr-navbar-main > a:nth-of-type(2) {
  position: relative;
}

.zr-bottom-navigation-bar .zr-navbar-main > a:nth-of-type(2) .badge {
  position: absolute;
  top: 5px;
  left: 5px;
  background-color: #B3261E;
  color: var(--MainWhite);
  font-size: 12px;
  font-weight: 500;
  width: 20px;
  height: 20px;
  line-height: 22px;
  text-align: center;
  border-radius: 50%;
  transition-duration: 0.3s;
}
:is(.zr-dialog-box, .zr-page-box) :is(.sp-d-form:not(.sp-d-form .sp-d-form)) {
    padding:  0.6rem 0 0 0;
}
.zr-shortmsg-parent {
  min-width: initial !important;
  margin: 0 8px;
  right: 0;
}

section.sp-dialog-base> main >div >div:last-child{
  padding: 4px 8px;
}
section.sp-dialog-base> main >div >div:last-child > button#Cancel{
  min-width: initial;
}
.zr-error-input{
  position:relative;
}
.zr-error-input input,.zr-error-input div{
  background-color: var(--error10)!important;
}
.zr-error-input:after{
  position: absolute;
  content: '';
  display: block;
  background: url(/themes/manager/images/inputimg/Incorrect.svg);
  width: var(--ValidationWidth);
  height: var(--ValidationHeight);
  right: var(--ValidationRight);
  background-size: 100% 100%;
  margin: auto;
  top: var(--ValidationTop);
}

.zr-priority-list-bottom > .zr-account-item:first-child:last-child {
    width: 100% !important;
}

.zr-bazar-data  .zr-dashboard-content {
  height: calc(100svh - 326px);
}
.zr-link-text{
    color: var(--link50);
    text-decoration: underline;
    text-underline-offset: 6px;
}
.zr-image-preview{
  width:100%;
}
.zr-image-preview img{
  width:100%;
}
.zr-w100{
	width:100% !important;
}
.zr-upload-image{
  display:flex;
  width:100%;
  border-radius:8px;
  border:1px solid var(--gray50);
  background:var(--gray15);
  gap:8px;
  align-items:center;
  justify-content:center;
  margin:16px 0;
  height:40px;
}
.zr-upload-image img{
  width:24px;

}
.zr-upload-image span{
  color:#002841;
  font-size:14px;
  font-weight:400;    
}

.zr-bank-selected{
	outline:2px solid var(--primary50) !important;
}
form.sp-px-10{
  padding-left: 0 !important;
  padding-right: 0 !important;
}
#Comments,#Comments2{
  min-height: 29px;
  margin-top: 8px;
  overflow: auto;
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
  padding-bottom: 6px;
}
#Comments >span,#Comments2 >span{
  display: flex;
  align-items: center;
  padding: 0 8px;
  background: var(--gray20);
  border-radius: 4px;
  color: var(--gray85);
  font-size: 12px;
  font-weight: 300;
  white-space: nowrap;
}
#ReqInfo2 {
  display:flex;
  width: 100%;
  gap: 10px;
  border-bottom: 1px solid #DCDCDC;
  padding-bottom: 8px;
}
#ReqInfo2 >div{
  width: 100%;
}
#ReqInfo >div{
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  width: 100%;
  gap: 8px;
  border-bottom: 1px solid #DCDCDC;
  padding-bottom: 8px;
}
app-form.sp-px-10{
	padding:0 0.75rem !important
}
.zr-accounting-bg-color .zr-accounting-bg-color{
  background: var(--primary50) !important;
  outline: 1px solid var(--primary50) !important;
  display: flex;
  flex-direction: column;
}
#AddComment .sp-f .sp-validated:not(input, .sp-drop-button){
  padding-right: var(--TextPadding) !important;
}
.zr-accounting-bg-color .sp-f-title label{
  color:#fff !important;
}
.zr-skeleton-place-holder{
  display:inline-block;
  min-width:100px;
  height:20px;
}  
.zr-skeleton-place-holder2{
  display:inline-block;
  min-width:20px;
  height:15px;
}  
.zr-form-hr{
  height:1px;
  width: calc(100% - 32px);
  background:var(--gray30);
  margin: 20px auto 4px auto;
}
.zr-form-btns{
  width:100%;
  margin-top:8px !important;
}
.zr-form-tabs{
  border-bottom: 1px solid var(--gray10);
  display: flex;
  background-color: var(--white);
  height:24px;
  gap:16px;
}
.zr-form-tab{
  border-bottom: 1px solid transparent;
  color:var(--gray70);
  display: flex;
  font-size:14px;
  font-weight:300;
}
.zr-form-tab.zr-active{
  border-bottom: 1px solid var(--primary50);
  color:var(--primary50);
  font-weight:500;
}
.zr-form-text-input1 .zr-form-text-input1 {
  background-color:var(--primary50);
  max-height:34px;
}
.zr-form-text-input1 .zr-form-text-input2.sp-f-title{
  background-color:var(--primary50);
  margin-bottom:0;
  color:var(--MainWhite);
  min-width: 125px;
  max-width: 125px;
}
.zr-form-text-input1 .zr-form-text-input2 .sp-f-label{
  color:var(--MainWhite) !important;
}
.zr-form-text-input1 .zr-form-text-input1 label img{
  height: 100%;
  padding:5px 4px;
}
.zr-form-text-input1 .sp-drop-button{
  border:none;
  background-color:transparent;
  margin:0;
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
}
.zr-form-text-input1  .sp-drop-button:after {
  left:4px;
}
.zr-form-text-input1 .sp-drop-show .sp-drop-button{
  outline:none !important;
}

.zr-form-text-input2 label{
  text-align: center;
}

.zr-pwa-dialog{
  /*background-color:var(--primary50);*/
  border-radius: 12px;
}
.pwa-dialog-header{
  display: flex;
  min-height:48px;
  position:relative;   
  justify-content: center;
  align-items: center;
}
.pwa-dialog-header .title p{
  color:var(--MainWhite);
  font-size:18px;
  font-weight:500;
}
.pwa-dialog-header .close {
  position: absolute;
  right: 10px;
  top: 10px;
  display: flex;
  gap: 12px;
  color: white;
  font-size: 14px;
  border: 1px solid grey;
  padding: 4px 10px;
  border-radius: 8px;
}
.pwa-dialog-body{
  padding-top:12px;
  background-color:var(--MainWhite);
  border-radius:12px;
}
.zr-dataForm form{
  margin:0 !important;
  padding:0 !important;
}
.zr-form-btns.zr-primary-btn{
  width:48%;
  height: 36px !important;
  font-size: 14px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  color: #0e1213 !important;
  border-radius: 8px !important;
  background-color: var(--secondary30) !important;
}
.zr-form-btns.zr-secondary-btn{
  width:48%;
  height: 36px !important;
  font-size: 12px;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  border: 1px solid var(--gray70) !important;
  color: var(--gray70) !important;
  border-radius: 8px !important;
  background-color: var(--MainWhite) !important;
}
.zr-shortmsg-parent{
	min-width:350px !important;
}
.zr-form-link{
	font-size:10px;
  color:var(--link50);
  font-weight:400;
}






/* ################################################################################      COLLEAGUE APP       ######################################################################## */
#divMain{ 
  height: calc(100vh - 86px);
  /* background: #ff00005e;*/
}
/***************************************************************************************************************************************** components *********************************************/
:root{
  --maxwidth : 500px;
}
.zr-green {
  background-color: var(--approved10);
  border: 0.4px solid var(--approved30);
  color: var(--approved70);
}
.zr-red {
  background-color: var(--error10);
  border: 0.4px solid var(--error30);
  color: var(--error70);
}
.zr-grey {
  background-color: var(--gray10);
  border: 0.4px solid var(--gray30);
  color: var(--gray70);
}
.zr-secondary-btn {
  width: 115px;
  height: 32px;
  font-size: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--gray70);
  color: var(--gray70);
  border-radius: 8px;
  background-color: var(--MainWhite);
}
.zr-bordered-secondary-btn {
  font-size: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--primary50);
  color: var(--primary50);
  border-radius: 8px;
  background-color: var(--MainWhite);
  padding: 4px 16px;
}
.zr-primary-btn {
  width: 115px;
  height: 32px;
  font-size: 14px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #0e1213; /* این رنگ در متغیرها نبود */
  border-radius: 8px;
  background-color: var(--secondary30);
}
.zr-active-btn {
  width: 115px;
  height: 32px;
  font-size: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--MainWhite);
  border-radius: 8px;
  background-color: var(--primary50);
}
.zr-primary-btn-grey {
  font-size: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--primary40);
  border-radius: 8px;
  background-color: var(--primary10);
  padding: 8px 16px;
}

.zr-checkbox-input {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 24px;
  height: 24px;
  border: 1px solid var(--gray90);
  border-radius: 6px;
  display: inline-block;
  position: relative;
}
.zr-checkbox-input:checked::after {
  content: "✔";
  color: #4caf50; /* این رنگ در متغیرها نبود */
  font-size: 20px;
  position: absolute;
  left: 2px;
  top: -2px;
}
.zr-rotate180 {
  transform: rotate(180deg);
}
.zr-tag-warn {
  font-size: 10px;
  font-weight: 300;
  background-color: var(--warning5);
  align-items: center;
  border-radius: 4px;
  color: var(--warning70);
  padding: 0 4px;
  display: inline-block;
}
.zr-tag-edited {
  font-size: 10px;
  font-weight: 300;
  background-color: var(--secondary10);
  align-items: center;
  border-radius: 4px;
  color: #4B421F;
  padding: 0 4px;
  display: inline-block;
}
.zr-tag-error {
  font-size: 10px;
  font-weight: 300;
  align-items: center;
  border-radius: 4px;
  padding: 0 4px;
  display: inline-block;
  background-color: var(--error5);
  color: var(--error70);
}
.zr-tag-success {
  font-size: 10px;
  font-weight: 300;
  background-color: var(--approved5);
  align-items: center;
  border-radius: 4px;
  color: var(--approved70);
  padding: 0 4px;
  display: inline-block;
}
.zr-tag-waiting {
  font-size: 10px;
  font-weight: 400;
  background-color: var(--secondary5);
  align-items: center;
  border-radius: 4px;
  color: var(--secondary70);
  padding: 0 4px;
  display: inline-block;
  border: 0.6px solid var(--secondary30);
}
.zr-tag-watery {
  font-size: 10px;
  font-weight: 400;
  background-color: var(--link5);
  align-items: center;
  border-radius: 4px;
  color: var(--link70);
  padding: 0 4px;
  display: inline-block;
}
#zr-orders-history .zr-dashboard-content {
  margin-top: 12px;
}
.zr-trade-data .zr-dashboard-content {
  height: calc(100svh - 660px);
  transition-duration: 300ms;
}
.zr-trade-data .zr-dashboard-content.zr-expanded-trade-data-height {
  height: calc(100svh - 280px) !important;
}
.zr-right-app-bar {
  display: flex;
  justify-content: center;
  align-items: center;
}
.zr-right-app-bar img {
  width: 24px;
}
.zr-tiny-rounded-square {
  width: 12px;
  height: 12px;
  border-radius: 4px;
  display: inline-block;
  background-color: var(--secondary40);
}
.zr-custom-hr {
  border: none;
  height: 0.6px;
  background: var(--gray50);
  border-radius: 50%;
  display: flex;
  flex: 1;
}
.zr-progress-container{
  width: 100%;
  min-height: 6px;
  height: 6px;
  border-radius: 10px;
  overflow: hidden;
  background-color: var(--gray40);
  position: relative;
  margin-bottom: 8px;
  display: flex;
  direction:ltr;
}
.zr-progress-bar{
  background-color: var(--approved70);
  height: 100%;
}
.ripple-btn {
  position: relative;
  overflow: hidden;
}

.ripple {
  position: absolute;
  display: inline-block;
  border-radius: 50%;
  background: rgba(151, 151, 151, 0.6); /* این رنگ در متغیرها نبود */
  transform: scale(0);
  animation: ripple-animation 600ms linear;
  pointer-events: none;
  z-index: 20;
}

@keyframes ripple-animation {
  to {
    transform: scale(4);
    opacity: 0;
  }
}

.zr-transparent-btn-purple {
  height: 32px;
  font-size: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--primary50);
  color: var(--primary50) !important;
  border-radius: 8px;
  padding: 0 4px;
}
.zr-transparent-btn-red {
  height: 32px;
  font-size: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--error70);
  color: var(--error70) !important;
  border-radius: 8px;
  padding: 0 4px;
}
.zr-tag-blue-bordered {
  height: 32px;
  font-size: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--link30);
  color: var(--link80);
  border-radius: 4px;
  padding: 0 4px;
  background-color: #e5f2ff;
}

.zr-secondary-btn-blue {
  height: 24px;
  font-size: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--link70);
  color: var(--link70);
  border-radius: 8px;
  background-color: #e5f2ff;
  padding: 0 12px;
} 

/****************************************************************************** bottom navigation bar ******************************/
.zr-bottom-navigation-bar {
  width: 100%;
  max-width:var(--maxwidth);
  height: 84px;
  position: fixed;
  z-index: 34;
  bottom: 0;
  right: 0;
  left: 0;
  margin: 0 auto;
}
.zr-navbar-main {
  background: linear-gradient(to right, var(--primary50), var(--primary60));
  margin: 8px 12px;
  max-width: 100%;
  height: 68px;
  border-radius: 32px;
  align-items: center;
  padding: 0 12px;
}
.zr-navbar-main > a {
  width: 60px;
  height: 60px;
  align-items: center;
}
.zr-navbar-main > a > span {
  color: var(--MainWhite); 
  font-size: 12px;
  font-weight: 500;
  display: none;
}
.zr-navbar-main > a > img {
  width: 24px;
}
.zr-navbar-main > a.zr-active > span {
  display: initial !important;
}
.zr-navbar-main > a > img:last-of-type {
  display: none;
}
.zr-navbar-main > a.zr-active > img:last-of-type {
  display: initial !important;
}
.zr-navbar-main > a.zr-active > img:first-of-type {
  display: none !important;
}


/************************************************************************************************ main menu ******************************/
.zr-main-menu {
  position: fixed;
  display: flex;
  height: calc(100svh - 56px);
  width: calc(100vw - 24px);
  background-color: var(--primary50);
  border-radius: 24px;
  padding: 24px 24px 0 24px;
  flex-direction: column;
  z-index: 10000;
  
  top: 50%;
  left: 50%;
  max-width: var(--maxwidth);
  transform: translate(-50%, -50%);      
  transition: transform 500ms ease, opacity 500ms ease;
  opacity: 1;
}
.zr-main-menu.zr-hide {
  transform: translate(calc(-50% + 100vw), -50%); /* بره بیرون از سمت راست */
  opacity: 0;
  pointer-events: none;
}
.zr-menu-top {
  max-height: 56px;
  display: flex;
  flex: 1;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
}
.zr-menu-top-right {
  width: calc(100% - 30px);
  height: 40px;
  display: flex;
  gap: 12px;
}
.zr-menu-top-right img {
  width: 40px;
  height: 40px;
}
.zr-menu-top-right li {
  display: flex;
  flex-direction: column;
}
.zr-menu-top-right li b {
  color: #fdfdfd;
  font-size: 14px;
  font-weight: 700;
}
.zr-menu-top-right li span {
  color: var(--gray40);
  font-size: 12px;
  font-weight: 400;
}
.zr-menu-top-left span {
  display: flex;
  width: 32px;
  height: 32px;
  background-color: var(--primary70);
  border-radius: 50%;
  align-items: center;
  justify-content: center;
}
.zr-menu-top-left span img {
  display: flex;
  width: 21px;
  height: 21px;
  background-color: var(--primary70);
  border-radius: 50%;
}
.zr-main-menu .zr-custom-hr {
  max-height: 2px;
  width: 100%;
}
.zr-menu-center {
  display: flex;
  flex: 1;
  margin: 16px 0;
  flex-direction: column;
  max-height: calc(100% - 225px);
  overflow-y: auto;
}
.zr-menu-center li {
  display: flex;
  gap: 8px;
  height: 48px;
  margin: 12px 0;
  width: 100%;
  align-items: center;
  border-radius: 8px;
  padding-right: 8px;
}
.zr-menu-active {
  background-color:var(--primary40);
}
.zr-menu-center li img {
  height: 24px;
  width: 24px;
}
.zr-menu-center li span {
  font-size: 16px;
  font-weight: 400;
  color: #fdfdfd;
}
.zr-menu-bottom1 {
  height: 48px;
  margin: 24px 20px 0 20px;
  display: flex;
  gap: 8px;
  align-items: center;
}
.zr-menu-bottom1 img {
  height: 24px;
  width: 24px;
}
.zr-menu-bottom1 span {
  font-size: 16px;
  color: #fdfdfd;
}
.zr-menu-bottom{
  min-height:24px;
  display:flex;
  gap:4px;
  margin-bottom: 4px;
}
.zr-menu-bottom-item{
  background:var(--primary70);
  align-items:center;
  border-radius: 20px;     
  gap: 8px;
}
.zr-designed-by{
  min-height:38px;
}
.zr-manager-logo{
  min-height:72px;
}
.zr-manager-logo img{
  height: 40px;
  object-fit: contain;
}
.zr-manager-logo >div{
  align-items: center;
}
.zr-manager-logo >div >span{    
  color: #fff;
  font-size: 12px;
  font-weight: 500;
}
.zr-manager-logo >div >span:last-child{    
  font-size: 20px;
}

.zr-designed-by img{    
  height: 22px;
  width: 22px;
}
.zr-designed-by >span{    
  color: #fff;
  font-size: 12px;
  font-weight: 500;
}
.zr-designed-by >span>b{    
  color: #DCBE5E;
  font-size: 12px;
  font-weight: 500;
}
/******************************************************************************************** dashboard *********************************************/

.zr-center {
  max-width: var(--maxwidth);
  margin: 0 auto;
  margin-bottom: 84px;
  height:100%;
  width: calc(100% - 32px);
}
.zr-app-bar {
  height: 60px;    
  max-width: var(--maxwidth);
  margin: 44px auto 12px auto;
  align-items: center;
  position: sticky;
  top: 0;
  background-color: var(--white);
  width: calc(100% - 32px);
}
.zr-left-app-bar img {
  width: 32px;
}
.zr-center-app-bar {
  align-items: center;
}
.zr-center-app-bar img {
  width: 24px;
}
.zr-center-app-bar span {
  color: var(--primary85); /* این متغیر وجود ندارد و بدون تغییر باقی ماند */
}
.zr-right-app-bar {
  width: 32px;
}
.zr-inventory {
  min-height: 100px;
  background-color: var(--white);
}
.zr-inventory-title {
  height: 24px;
  border-bottom: 1px solid var(--gray10);
}
.zr-inventory-img{
	width:23px;
}











/* قسمت جدید داشبورد ادمین */
.zr-inventory-title>div >img {
  width: 40px;
  padding: 0 10px;
}
.zr-inventory-title >span {
  border-bottom: 1px solid var(--primary50);
  color: var(--primary50);
}

.zr-inventory-update{
    color: var(--gray70);
}
.zr-inventory-container{
    width: 100%;
    height: calc(100svh - 222px);
    z-index: 10;
    top: 24px;
    overflow-y: auto;
    padding:16px 0;
    gap: 8px;
    background-color: var(--MainWhite);
    display: none;
}
.zr-inventory-box{
    border: 1px solid var(--gray10);
    box-shadow: 0 0 12px 0 #0000000A;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    margin-bottom: 8px;
}
.zr-inventory-title-item{
    background: linear-gradient(to left,#D4C7CD, #E1D8DC);
    border-radius: 8px;
    padding: 16px 8px;
    gap: 8px;
    margin: 4px;
}
.zr-inventory-title-item-left{
    width: 24px;
}
.zr-inventory-title-item-left >img{
  width: 24px;
  padding: 0;
  border-radius: 50%;
}
.zr-inventory-title-item-right{
    flex: 1;
    gap: 12px;
}
.zr-inventory-title-item-right-top span{
    color: var(--gray90);
}
.zr-inventory-title-item-right-top img{
    height: 24px;
    width: 24px;
}
.zr-inventory-title-item-right-bottom >div {
    gap: 8px;
    align-items: baseline;
}
.zr-inventory-title-item-right-bottom >div >*{
    color: var(--gray85);
}
.zr-inventory-item{
    background:linear-gradient(to left,var(--gray10),var(--gray10),var(--gray15),var(--gray15),var(--gray20),var(--gray20));
    margin: 8px 12px;
    border-radius: 12px;
    border: 1px solid var(--gray15);
    padding: 12px;
    gap: 8px;
}
.zr-inventory-item-top{
    align-items: center;
}
.zr-inventory-item-top-left {
    align-items: center;
    gap: 12px;
}
.zr-inventory-item-top-left >span{
    color: var(--gray85);
}
.zr-inventory-item-top-left >div{
    background-color: #EEE8EB;
    border-radius: 8px;
    width: 32px;
    height: 32px;
    padding: 4px;
}
.zr-inventory-item-top-title{
  color: var(--gray85);
  font-size:14px;
  font-weight:500;
}
.zr-inventory-item-bottom > div {
    gap: 8px;
    align-items: baseline;
}
.zr-inventory-item-bottom > div > *{
    color:var(--gray85);
}

/* پایان */
















.zr-inventory-cards {
  height: 120px;
  gap: 8px;
  padding: 8px 0 12px 0;
}
.zr-inventory-cards > div {
  flex: 1;
  border: 1px solid var(--gray10);
  border-radius: 12px;
  box-shadow: 0 0 12px 0 #0000000a;
}
.zr-inventory-cards > div > div {
  flex: 1;
  border-radius: 8px;
  margin: 4px;
}
.zr-inventory-melted {
  background: linear-gradient(to left, var(--secondary5), var(--secondary5), var(--secondary10), var(--secondary10), var(--secondary10), var(--secondary15));
  padding: 0 8px;
}
.zr-inventory-common-top img {
  width: 24px;
  height: 24px;
  border-radius:4px;
}
.zr-inventory-melted .zr-inventory-common-top span {
  color: var(--secondary70);
}
.zr-inventory-common-bottom {
  align-self: flex-end;
  line-height: 20px;
}
.zr-inventory-common-bottom b {
  color: var(--gray85);
}
.zr-inventory-melted .zr-inventory-common-bottom span {
  color: var(--secondary70);
}
.zr-inventory-rial {
  background: linear-gradient(to left, var(--primary5), var(--primary5), var(--primary10), var(--primary10), var(--primary15), var(--primary15));
  padding: 0 8px;
}
.zr-inventory-rial .zr-inventory-common-bottom span {
  color: var(--primary50); /* وجود ندارد */
}
.zr-inventory-rial .zr-inventory-common-top span {
  color: var(--primary50); /* وجود ندارد */
}
.zr-last-update {
  height: 40px;
  padding-bottom: 12px;
  background-color: var(--white);
}
.zr-last-update-container {
  height: 100%;
  border: 1px solid var(--gray10);
  border-radius: 8px;
  margin: 0 16px;
  padding-right: 12px;
  align-items: center;
  background-color: var(--primary5);
}
.zr-spacer {
  flex: 1;
}
.zr-last-update-container span {
  color: var(--primary85); /* وجود ندارد */
  font-size: var(--smallfont);
  font-weight: 400;
}
.zr-last-update-container img {
  width: 40px;
  padding: 0 10px;
  height: 100%;
}
.zr-dashboard-data {
  /*margin: 0 16px;*/
}
.zr-dashboard-tabs {
  border-bottom: 1px solid var(--gray10);
  display: flex;
  background-color: var(--white);
  align-items: center;
}
.zr-dashboard-tab {
  width: 42px;
  height: 26px;
  border: none;
  background: transparent;
  cursor: pointer;
  border-bottom: 1px solid transparent;
  color: var(--gray70);
  font-size: var(--normalfont);
  font-weight: 300;
  margin-left: 12px;
}
.zr-dashboard-tab[aria-selected="true"] {
  border-bottom: 1px solid var(--MainBlack); /* وجود ندارد */
  font-weight: 500;
  color: var(--primary50); /* وجود ندارد */
}
.zr-dashboard-panel {
  display: none;
  width: 100%;
  padding: 0;
}
.zr-tab-active {
  display: block;
}
.zr-dashboard-panel .zr-dashboard-top {
  height: 50px;
  padding: 12px 0;
  background-color: var(--white);
}
.zr-dashboard-top > div:first-child {
  flex: 1;
  height: 100%;
}
.zr-dashboard-top > div:first-child span {
  color: var(--gray70);
  font-size: var(--smallfont);
  font-weight: 400;
}
.zr-dashboard-top > div:nth-child(2) {
  width: 92px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.zr-dashboard-top > div:nth-child(2) span {
  font-size: var(--smallfont);
  font-weight: 400;
  color: var(--quaternary50);
}
.zr-dashboard-top > div:nth-child(2) i {
  font-style: normal;
  color: var(--tertiary50);
}
.zr-dashboard-top > div:nth-child(2) span::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-left: 2px;
  color: var(--quaternary50);
}
.zr-dashboard-top > div:nth-child(2) span:first-child::before {
  background-color: var(--quaternary50);
}
.zr-dashboard-top > div:nth-child(2) span:last-child::before {
  background-color: var(--tertiary50);
}
.zr-dashboard-top > div:nth-child(3) {
  width: 72px;
  height: 100%;
  align-items: center;
}
.zr-dashboard-top > div:nth-child(3) span {
  color: var(--gray70);
  font-size: var(--smallfont);
  font-weight: 400;
}
.zr-dashboard-row {
  min-height: 60px;
  padding: 8px;
}
.zr-dashboard-row > div:first-child {
  display: flex;
  flex: 1;
  align-items: center;
  gap: 4px;
}
.zr-dashboard-row > div:first-child img {
  width: 36px;
  height: 36px;
  border-radius: 50%;
}
.zr-dashboard-row > div:first-child span {
  color: var(--gray90);
  font-size: var(--normalfont);
  font-weight: 500;
}
.zr-dashboard-row > div:nth-child(2) {
  display: flex;
  width: 92px;
  height: 100%;
  justify-content: space-between;
  align-items: end;
}
.zr-dashboard-row > div:nth-child(2) span {
  color: var(--gray90);
  font-size: var(--normalfont);
  font-weight: 500;
  display: flex;
  direction: ltr;
  align-items: center;
}
.zr-dashboard-row > div:nth-child(2) span::before {
  content: "";
  display: flex;
  width: 8px;
  height: 8px;
  background-color: var(--primary50); /* وجود ندارد */
  border-radius: 50%;
  margin: 0 2px 4px 0;
}
.zr-dashboard-row > div:nth-child(2) span:last-child::before {
  background-color: var(--tertiary50);
}
.zr-dashboard-row > div:last-child {
  display: flex;
  width: 72px;
  justify-content: flex-end;
  align-items: center;
}
.zr-dashboard-row > div:last-child span {
  width: 48px;
  height: 23px;
  align-items: center;
  border-radius: 8px;
  font-size: var(--smallfont);
  font-weight: 400;
}
.zr-dashboard-btns {
  display: flex;
  height: 50px;
  align-items: center;
}
.zr-buy-btn {
  width: 163px;
  height: 34px;
  background-color: var(--quaternary50);
  line-height: 33px;
  text-align: center;
  border-radius: 12px;
  color: var(--approved5);
}
.zr-sell-btn {
  width: 163px;
  height: 34px;
  background-color: var(--tertiary50);
  line-height: 33px;
  text-align: center;
  border-radius: 12px;
  color: var(--approved5);
}
.zr-isActive {
  border: 1px solid var(--gray20);
  border-radius: 12px;
}
.zr-dashboard-hr {
  border: none;
  border-top: 1px solid var(--gray20);
  margin: 0 16px;
}
.zr-dashboard-content {
  height: calc(100svh - 478px);
  overflow: auto;
  margin-bottom: 30px;
}

/****************************************************************************************************************************************************************** trade ************************/
.zr-place-order {
  margin: 12px 20px 0 20px;
}
.zr-order-type {
  width: 100%;
  height: 42px;
  border-radius: 16px;
  background-color: var(--gray15);
  padding: 4px;
  gap: 12px;
  max-width: 350px;
  margin: 0 auto;
}
.zr-btn-grey {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--gray80);
}
.zr-trade-form {
  height: 300px;
  margin-top: 12px;
}
.zr-trade-price {
  height: 60px;
  border: 1px solid var(--gray20);
  border-radius: 12px;
}
.zr-trade-price .zr-dashboard-row > div:nth-child(2) {
  align-items: center;
}
.zr-trade-price .zr-dashboard-row {
  width: 100%;
}
.zr-form-input {
  border: 1px solid var(--primary50);
  min-height: 34px;
  border-radius: 8px;
  margin: 16px 0 8px 0;
  background-color: var(--primary50);
  color: #fff;
  overflow: hidden;
}
.zr-form-input.zr-sell-active{
  border: 1px solid var(--tertiary50);
  background-color: var(--tertiary50);
}
.zr-form-input > span {
  width: 115px;
  min-height: 100%;
  align-items: center;
  font-size: 14px;
  font-weight: 400;
}
.zr-form-input > div {
  background-color: var(--MainWhite);
  flex: 1;
  border-radius: 8px 0 8px 8px;
  overflow: hidden;
}
.zr-form-input input {
  flex: 1;
  color: var(--gray90);
  padding: 0 8px;
}
.zr-input-form-unit {
  color: var(--gray70);
  padding-left: 16px;
  align-items: center;
  font-size: 12px;
}
.zr-form-hint {
  width: 100%;
  height: 14px;
}
.zr-form-hint img {
  height: 14px;
  width: 14px;
  margin-left: 4px;
}
.zr-form-hint span {
  font-size: 10px;
  color: var(--warning80);
}
.zr-trade-bottom-row {
  min-height: 32px;
  width: 100%;
  margin-top: 8px;
}
.zr-trade-bottom-row > div {
  align-items: center;
  gap: 4px;
}
.zr-trade-bottom-row > div img {
  width: 20px;
}
.zr-trade-bottom-row > div span {
  font-size: 14px;
  font-weight: 400;
  color: var(--gray90);
}
.zr-trade-register {
  margin-top: 24px;
}
.zr-trade-register .zr-primary-btn {
  width: 251px;
  height: 40px;
  border-radius: 12px;
}
.zr-trade-data {
  margin-top: 20px;
}
.zr-trade-data .zr-dashboard-tab {
  width: 110px;
}
.zr-trade-data .zr-dashboard-top .zr-last-update {
  width: 100%;
}
.zr-trade-data .zr-dashboard-top .zr-last-update-container {
  margin: 0;
}
.zr-dashboard-tabs > span {
  padding: 0 16px;
  height: 22px;
  align-items: center;
  left: 0;
}
.zr-dashboard-tabs > span > img {
  width: 16px;
}
.zr-trade-card {
  display:flex;
  min-height: 68px;
  border-radius: 12px;
  margin-bottom: 12px;
  /*
  background-color: var(--MainWhite);
  border: 1px solid var(--gray15);
  */  
  background-color: var(--gray10);
  border: 1px solid var(--gray40);
  padding: 8px 12px;
}
.zr-trade-card-top {
  height: 24px;
  margin-top: 8px;
  margin-bottom: 12px;
  gap: 4px;
}
.zr-trade-card-top > img {
  width: 24px;
}
.zr-trade-card-top b {
  font-size: 16px;
  font-weight: 500;
  color: var(--quaternary50);
}
.zr-trade-card-top > div {
  width: 24px;
  height: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.zr-trade-card-top > div img {
  width: 16px;
  height: 16px;
}
.zr-trade-card-bottom {
  height: 16px;
  margin-bottom: 12px;
}
.zr-trade-card-bottom span {
  font-size: 12px;
  font-weight: 400;
  color: var(--gray70);
  align-items: center;
}
.zr-trade-card-bottom span b {
  font-size: 14px;
  font-weight: 400;
  color: var(--gray85);
}
.zr-trade-card-more {
  display: none;
}
.zr-trade-card-more-top {
  height: 68px;
  border-top: 1px solid var(--gray30);
}
.zr-trade-card-more-top ul {
  display: flex;
  justify-content: space-between;
}
.zr-trade-card-more-top ul li span {
  color: var(--gray70);
  font-size: 12px;
  font-weight: 400;
}
.zr-trade-card-more-top ul li b {
  color: var(--gray85);
  font-size: 14px;
  font-weight: 400;
}
.zr-trade-card-more-bottom {
  min-height: 84px;
  border-top: 1px solid var(--gray30);
  padding: 12px 0;
}
.zr-trade-card-more-bottom span {
  width: 220px;
  height: 100%;
  font-size: 12px;
  color: var(--gray70);
}
.zr-trade-card-more-bottom b {
  height: 100%;
  font-size: 14px;
  font-weight: 400;
  color: var(--gray85);
}

/*************************************************************************************************************************************************** wallet ********************/
.zr-inventory-charts-container {
  gap: 24px;
  height: 140px;
}
.zr-inventory-chart {
  width: 140px;
  height: 100%;
  display: flex;
  align-items: center;
}
.zr-inventory-data {
  flex: 1;
  max-width: 50%;
}
.zr-inventory-data li {
  display: flex;
  justify-content: space-between;
}
.zr-inventory-data li div {
  display: flex;
  gap: 4px;
  align-items: center;
}
.zr-wallet-btns {
  margin: 12px 20px 0 20px;
  gap: 24px;
  height: 34px;
}
.zr-wallet-btns > div {
  flex: 1;
  height: 100%;
  gap: 4px;
  font-size: 14px;
  font-weight: 400;
}
.zr-wallet-btns > div > img {
  width: 18px;
}
.zr-wallet-data-container {
  margin-top: 12px;    
  height: calc(100svh - 420px);
  overflow: auto;
}
.zr-wallet-data {
  margin: 8px 20px;
  height: 60px;
  border-radius: 12px;
  box-shadow: 0 0 12px 0 #0000000A;
  border: 1px solid var(--gray15);
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 12px;
}
.zr-wallet-data > div {
  display: flex;
  align-items: center;
  gap: 8px;
}
.zr-wallet-data img {
  width: 24px;
  border-radius: 4px;
}
.zr-wallet-data span {
  color: var(--gray85);
  font-size: 16px;
  font-weight: 400;
}
.zr-wallet-data b {
  color: var(--gray85);
  font-size: 24px;
  font-weight: 700;
}
.zr-wallet-data i {
  color: var(--gray70);
  font-size: 10px;
  font-weight: 400;
  font-style: normal;
}


/********************************************************************************************************************************** deposit ****************/
.zr-deposit-inventory {
}
.zr-deposit-request-container {
  margin-top: 12px;
  width: 100%;
}
.zr-deposit-request-container .zr-form-input {
  background-color: var(--primary50);
  border-color: var(--primary50);
}
.zr-deposit-btns {
  margin: 24px 0 0 0;
  height: 40px;
  display: flex;
  gap: 24px;
}
.zr-deposit-btns > * {
  flex: 1;
  height: 100%;
}
.zr-deposit-data {
  margin-top: 24px;
}
.zr-deposit-data .zr-dashboard-tab {
  width: initial;
}
.zr-deposit-data .zr-dashboard-content {
  margin-top: 12px;
  height: calc(100svh - 615px);
  overflow: auto;
  margin-bottom: 30px;
}
.zr-deposit-data .zr-expanded-deposit-data-height {
  height: calc(100vh - 200px);
}



.zr-deposit-data .zr-primary-btn {
  width: initial;
  height: initial;
  padding: 4px 8px;
  font-size: 10px;
  font-weight: 400;
}
.zr-deposit-data .zr-trade-card-top {
  gap: 8px;
}
.zr-deposit-data .zr-trade-card-bottom span {
  display: flex;
  gap: 4px;
  align-items: center;
}
.zr-deposit-data .zr-trade-card-bottom span b {
  font-size: 12px;
}
.zr-deposit-data .zr-trade-card-bottom span img {
  width: 16px;
}
.zr-time-date {
  height: 20px;
  font-size: 12px;
  display: flex;
  align-items: center;
  color: var(--gray85);
}
.zr-diposit-statistics {
  height: 42px;
  display: flex;
  margin: 8px 0;
}
.zr-diposit-statistics > div {
  display: flex;
  flex: 1;
  height: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}
.zr-diposit-statistics > div:nth-child(2) {
  border-inline: 0.6px solid var(--gray40);
}
.zr-diposit-statistics .zr-top {
  display: flex;
  align-items: center;
  gap: 4px;
}
.zr-diposit-statistics .zr-top span {
  color: var(--secondary85);
  font-size: 12px;
  font-weight: 400;
}
.zr-diposit-statistics .zr-bottom {
  color: var(--gray70);
  font-size: 14px;
  font-weight: 400;
}

.zr-deposit2-top-tip {
  width: 210px;
  margin: 0 auto;
  font-size: 16px;
  font-weight: 400;
  color: var(--gray85);
  text-align: center;
}
.zr-deposit2-request-container img {
  height: 72px;
  margin: 12px auto 24px auto;
} 
.zr-deposit2-request-container .zr-form-input {
  background-color: var(--primary50);
  border-color: var(--primary50);
}
.zr-deposit2-inventory {
  padding: 0 16px;
}
/************************************************************************************************************************************************** withdraw ***************************/
.zr-remittance-row{
border-top: 1px solid var(--gray30); height:initial; padding:4px 0;
}
.withdraw-top-container {
  height: 231px;
}
.zr-deposit-request-container > img {
  height: 144px;
}
.zr-withdraw-btns .zr-primary-btn {
  flex: 1;
  margin: 12px 36px 0 36px;
  height: 40px;
  border-radius: 12px;
}
.zr-trade-card-top .zr-active-btn {
  height: 24px;
  width: initial;
  padding: 0 12px;
  color: var(--primary5);
  font-size: 10px;
  font-weight: 400;
}
.zr-withdraw-data .zr-dashboard-content {
  height: calc(100svh - 497px);
}
.zr-withdraw-data .zr-expanded-deposit-data-height {
  height: calc(100svh - 237px);
}
.withdraw2-top-container .zr-deposit-request-container {
  border: 1px solid var(--gray30);
  border-radius: 16px;
  background: linear-gradient(to left , var(--gray5), var(--gray10));
  padding: 16px;
}
.withdraw2-top-container .zr-primary-btn,.withdraw2-top-container .zr-inactive-btn {
  width: 251px;
  margin: 8px auto 0 auto;
  height: 30px;
}
.withdraw2-box-row1 {
  height: 24px;
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
}
.withdraw2-box-row1 > div {
  display: flex;
  flex: 1;
  grid-area: 4px;
}
.withdraw2-box-row1 > div span {
  color: var(--gray90);
  font-size: 14px;
  font-weight: 400;
}
.withdraw2-box-row1 > span {
  color: var(--gray90);
  font-size: 10px;
  font-weight: 400;
}
.withdraw2-box-row1 img {
  height: 24px;
  width: 24px;
}
.withdraw2-box-row2 {
  height: 40px;
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
}
.withdraw2-box-row2 > div:first-child {
  color: var(--gray90);
  font-size: 16px;
  font-weight: 400;
}
.withdraw2-box-row2 > div b {
  color: var(--gray95);
  font-size: 18px;
  font-weight: 400;
}
.withdraw2-box-row2 > div span {
  color: var(--gray70);
  font-size: 12px;
  font-weight: 400;
}
.withdraw2-box-row3 > li {
  height: 20px;
  padding: 0 4px;
  display: flex;
  justify-content: space-between;
}
.withdraw2-box-row3 > li > div {
  display: flex;
  align-items: center;
  gap: 4px;
}
.withdraw2-box-row3 > li > div > span {
  color: var(--primary85);
  font-size: 12px;
}
.withdraw2-box-row3 > li > span {
  color: var(--gray90);
  font-size: 14px;
}
.withdraw2-box-row3 .zr-custom-hr {
  margin: 4px;
}

.zr-withdraw2-data .zr-trade-card {
  min-height: 96px;
}
.zr-withdraw2-data .zr-dashboard-content.zr-expanded-deposit-data-height {
  height: calc(100svh - 245px);
}
/*
.zr-withdraw2-data  .zr-dashboard-content {
  height: calc(100svh - 558px);
}*/
.zr-withdraw2-data .zr-trade-card-more > div {
  display: flex;
  justify-content: space-between;    
  height: 16px;
  margin-bottom: 12px;
}
.zr-withdraw2-data .zr-trade-card-more > div > span {
  font-size: 12px;
  font-weight: 400;
  color: var(--gray85);
}
.zr-withdraw2-data .zr-withdraw2-tab2-card {
  min-height: 68px;
}
.zr-btn-container {
  min-height: 32px;
}
.zr-btn-container .zr-primary-btn-grey {
  flex: 1;
  font-style: normal;
  font-size: 14px;
}

.zr-add-withdrawal{
  height:300px;
  width:100%;
  overflow-x:auto;
}
.zr-add-withdrawal .zr-priority-list-bottom{
  flex-direction: row;
  margin-top: 0;
}
.zr-add-withdrawal .zr-acc-expanded-row {
  gap: 8px;
  margin-bottom: 8px;
}
.zr-add-withdrawal .zr-account-item {
  min-width:270px;
  width:90%;
}
.zr-add-withdrawal .zr-add-new{
  width:110px;
  padding:4px;
}
.zr-add-withdrawal .zr-expanded-data .zr-add-new{
  border: 0.4px solid var(--error30);
}
.zr-add-withdrawal .zr-expanded-data .zr-add-new span{
  color: var(--error70);
}
.zr-add-withdrawal .zr-expanded-data {
  padding-right: 8px;
}

/******************************************************************************************************************* support ************************/

.zr-support-data .zr-dashboard-tab {
  width: initial;
}
.zr-support-data .zr-bordered-secondary-btn {
  min-height: 24px;
  gap: 4px;
}
.zr-support-data .zr-dashboard-content {
  margin-top: 12px;
}
.zr-support-data .zr-trade-card-top b {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/*********************************************************************** deposite details **********************************************************/
.zr-deposite-account-count{
  width: 120px;
  height: 24px; 
  background-color: var(--gray10);
  border-radius: 8px 8px 0 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
} 
.zr-deposite-account-count i{
  font-size: 12px;
  color: var(--gray90);
  font-weight: 400;
  font-style: normal;
}
.zr-deposite-account-count b{
  font-size: 12px;
  color: var(--gray90);
  font-weight: 400;
}

.deposite-details-all{
  display: flex;
  gap: 12px;
  width: 100%;
  overflow-x: auto;
  padding:0 2px 16px 2px;
}

.deposite-details-all .zr-deposit-request-container{
  min-width: 283px;
}
.deposite-details-all .withdraw2-box-row1 {
  display: flex;
  flex-direction: column;
  height: initial;
  gap: 12px;
  margin-bottom: 16px;
}
.deposite-details-all .withdraw2-box-row1 >div{
  display: flex;
  justify-content: space-between;
}
.deposite-details-all .withdraw2-box-row1>div >div:first-child{
  display: flex;
  align-items: center;
  gap: 4px;
}

.deposite-details-all .withdraw2-box-row1 >div>div:first-child >img{
  width: 16px;
}
.deposite-details-all .zr-secondary-btn-blue {
  width: 110px;
  padding: 0;
}
.deposite-details-all .zr-secondary-btn-blue img{
  width: 16px;
}
.deposite-details-all .zr-secondary-btn-blue b{
  color: var(--link70);
  font-size: 12px;
  font-weight: 400;
  margin-right: 4px;
}
.deposite-details-all .withdraw2-box-row1>div:nth-child(2) {
  align-self: flex-end;
}
.deposite-details-all .withdraw2-box-row2 {
  height: initial;
  gap: 8px;
  display: flex;
  flex-direction: column;
  margin-bottom: 8px;
}
.deposite-details-all .withdraw2-box-row2 >div{
  height: 20px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.deposite-details-all .withdraw2-box-row2 >div:first-child img{
  width: 16px;
}
.deposite-details-all .withdraw2-box-row2 >div:first-child span{
  color: var(--gray90);
  font-size: 14px;
  font-weight: 400;
}
.deposite-details-all .withdraw2-box-row2 >div:nth-child(2) {
  align-self: flex-end;
}
.deposite-details-all .withdraw2-box-row2 >div:nth-child(2) b{
  color: var(--MainBlack);
  font-size: 18px;
  font-weight: 400;
}
.deposite-details-all .withdraw2-box-row2 >div:nth-child(2) span{
  color: #767676;
  font-size: 12px;
  font-weight: 400;
}

.deposite-details-all .withdraw2-box-row3 {
  height: initial;
  gap: 8px;
  display: flex;
  flex-direction: column;
  margin-bottom: 16px;
}
.deposite-details-all .withdraw2-box-row3 >div:first-child{
  display: flex;
  gap: 1px;
}
.deposite-details-all .withdraw2-box-row3 >div:first-child> li{
  flex: 1;
  height: 42px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}
.deposite-details-all .withdraw2-box-row3 >div:first-child> li >div{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.deposite-details-all .withdraw2-box-row3 >div:first-child> li >div span{
  font-size: 10px;
  font-weight: 400;
}
.deposite-details-all .withdraw2-box-row3 >div:first-child> li:first-child >div span{
  color: #383217;
}
.deposite-details-all .withdraw2-box-row3 >div:first-child> li:nth-child(2){
  border-inline: 1px solid var(--gray50);
}
.deposite-details-all .withdraw2-box-row3 >div:first-child> li:nth-child(2) >div span{
  color: #103C1B;
}
.deposite-details-all .withdraw2-box-row3 >div:first-child> li:nth-child(2) >div i{
  background-color: var(--approved70);
}
.deposite-details-all .withdraw2-box-row3 >div:first-child> li:nth-child(3) >div span{
  color: #001420;
}
.deposite-details-all .withdraw2-box-row3 >div:first-child> li:nth-child(3) >div i{
  background-color: var(--primary50);
}
.deposite-details-all .withdraw2-box-row3 >div:first-child> li > span{
  font-size: 14px;
  font-weight: 400;
  color: var(--gray90);
}


.zr-deposite-details-data .zr-trade-card{
  min-height: 68px;
}
.zr-deposite-details-data   .zr-dashboard-content {
  height: calc(100svh - 605px) ;
}
.zr-deposite-details-data   .zr-dashboard-content.zr-expanded-deposit-data-height {
  height: calc(100svh - 239px) ;
}
.zr-deposite-details-data .zr-trade-card-bottom span b{
  font-size: 14px;
}
.zr-deposite-details-data .zr-trade-card-bottom span:nth-child(2) b{
  font-size: 16px;
}
.zr-deposite-details-data .zr-trade-card-bottom span{
  color: var(--gray85);
  font-size: 10px;
}
.zr-deposite-details-data .zr-trade-card-more >div >span:first-child {
  font-size: 12px;
  font-weight: 400;
  color: #767676;
}
.zr-deposite-details-data .zr-trade-card-more >div >span:last-child {
  font-size: 14px;
  font-weight: 400;
  color: var(--gray85);
  direction: ltr;
}
.zr-deposite-details-data .zr-trade-card-more >div >.zr-primary-btn-grey {
  flex: 1;
  height: 32px;
  font-size: 14px;
  font-weight: 400;
  color: var(--primary70);
}
/************************************************************************************* contact us *********************************************/
.zr-contact-container{
  gap: 32px;
  height: calc(100svh - 195px);
  overflow: auto;
  padding-bottom: 32px;
}
.zr-contact-header{
}
.zr-contact-desc{
}
.zr-contact-info{
    gap: 8px;
}
.zr-contact-info-item{
    min-height: 32px;
    gap: 8px;
    background-color: var(--gray15);
    border-radius: 24px;
    padding: 16px;
}
.zr-contact-info-title{
    height: 24px;
    align-items: center;
    gap: 8px;
}
.zr-contact-address{
    font-style: normal;
}
.zr-contact-icon{
    width: 24px;
}
.zr-contact-phone-box{
  width:80%;
  display:flex;
  justify-content:space-between;
  align-self: flex-end;
  direction: ltr;
}
.zr-contact-map{
  max-width: 100%;
  overflow: hidden;
  min-height: 400px;
  border-radius: 16px;
}

/*******************************************  Slider  ******************/
.zrs-slider {
  position: relative;
  width: 90%;
  min-height: 250px;
  max-width: 800px;
  overflow: hidden;
  border-radius: 12px;
  direction: ltr;
  margin: 0 auto;
}

.zrs-slides {
  display: flex;
  transition: transform 0.5s ease-in-out;
  height: 90%;
}

.zrs-slide {
  min-width: 100%;
  max-height: 100%;
  box-sizing: border-box;
  display: flex;
}

.zrs-slide img {
  width: 100%;
  max-height: 100%;
  display: block;
  border-radius: 12px;
}
.zrs-slide-bottom{
  position:relative;
  height:10%;
}
.zrs-prev, .zrs-next {
  position: absolute;
  bottom: -11px;
  transform: translateY(-50%);
  background: transparent;
  border: none;
  font-size: 24px;
  border-radius: 50%;
  cursor: pointer;
  z-index: 10;
  width: 24px;
  height: 24px;
}

.zrs-prev { left: 10px; }
.zrs-next { right: 10px; }

.zrs-dots {
  text-align: center;
  position: absolute;
  bottom: 10px;
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 8px;
  direction:ltr;
}

.zrs-dot {
  width: 4px;
  height: 4px;
  background: #ccc;
  border-radius: 2px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.zrs-dot.zrs-active {
  width: 16px;
  border-radius: 2px;
  background: #000;
}





/* ################################################      Admin APP       ######################################################################## */

/*************************************************************************************** components *********************************************/

.zr-tag-blue-bordered {
  height: 32px;
  font-size: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--link30);
  color: var(--link80);
  border-radius: 4px;
  padding: 0 4px;
  background-color: #e5f2ff;
}
.zr-progressBar {
  max-width: 500px;
  max-height: 10px;
  border-radius: 20px;
  margin-bottom: 8px;
}

.zr-secondary-btn-blue {
  height: 24px;
  font-size: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--link70);
  color: var(--link70);
  border-radius: 8px;
  background-color: #e5f2ff;
  padding: 0 12px;
} 

/*********************************************************** admindDashboard *********************************************/
.zr-admin-inventory{

}
.zr-admin-inventory .zr-inventory-cards {
  overflow-x: auto;
  height: auto;
}
.zr-admin-inventory .zr-inventory-cards > div{
  width: 220px;
  height: 120px;
  flex: none;
}
.zr-admin-inventory .zr-inventory-cards > div>div{
  background: linear-gradient(to left , var(--gray10) ,var(--gray10),var(--gray15),var(--gray15),var(--gray20),var(--gray20));
  padding: 0 8px;
}
.zr-weight-balance{
  margin-top: 12px;
  height: auto;
}
.zr-weight-balance .zr-inventory-cards{
  height: auto;
}
.zr-weight-balance .zr-inventory-title{
  position: relative;
}
.zr-weight-balance select {
  position: absolute;
  left: 0;
  bottom: 0;
}
.zr-balance-cards .zr-inventory-common-top{
  min-height: 24px;
}
.zr-balance-cards >div{
  min-height: 112px;
}
.zr-balance-cards >div >div{
  background: linear-gradient(to left , #EAEFEF ,#EAEFEF,var(--Shopping10),var(--Shopping10),#C0D0D0,#C0D0D0);
  padding: 0 8px;
}
.zr-balance-row{
  display: flex;
  justify-content: space-between;
  padding: 0 8px;
}
.zr-balance-row>span{
  color: var(--gray90);
  font-size: 12px;
  font-weight: 400;
}
.zr-balance-row>div>span{
  color: var(--gray70);
  font-size: 10px;
  font-weight: 300;
}
.zr-balance-row>div>b{
  color: var(--gray90);
  font-size: 14px;
  font-weight: 400;
}
.zr-balance-cards .zr-sell-card >div{
  background: linear-gradient(to left , #F2EEEE ,#F2EEEE,var(--branch10),var(--branch10),#D9CBCD,#D9CBCD);

}
.zr-balance-cards .zr-sell-card .zr-inventory-common-top >span{
  color: var(--tertiary50);
}
.zr-balance-rial-body{
  height: 112px;
  width: 100%;
  margin-top: 12px;
  gap: 16px;
}
.zr-balance-rial-body >div{
  display: flex;
  flex-direction: column;
  flex: 1;
  border: 1px solid var(--production5);
  border-radius: 12px;
  background-color: #FDFDFD;
}
.zr-balance-title{
  margin: 4px;
  height: 40px;
  border-radius: 8px;
  display: flex;
  justify-content: center;
  gap: 8px;
  align-items: center;
}
.zr-balance-title img{
  width: 20px;
  height: 20px;
}
.zr-balance-title span{
  color: #203353;
  font-size: 16px;
  font-weight: 400;
}
.zr-balance-deposit .zr-balance-title{
  background: linear-gradient(to right,var(--approved10),var(--approved5),var(--approved5));
}
.zr-balance-withdraw .zr-balance-title{
  background: linear-gradient(to right,var(--error10),var(--error5),var(--error5));
}
.zr-balance-body{
  display: flex;
  justify-content: space-around;
  flex-direction: column;
  align-items: flex-end;
  margin: 0 8px 4px 8px;
  flex: 1;
}
.zr-balance-body-row{
}
.zr-balance-deposit .zr-balance-body-row b{
  color: var(--approved80);
  font-size: 16px;
  font-weight: 400;
}
.zr-balance-deposit .zr-balance-body-row span,.zr-balance-withdraw .zr-balance-body-row span{
  color: var(--gray70);
  font-size: 10px;
  font-weight: 300;
}
.zr-balance-withdraw .zr-balance-body-row b{
  color: var(--error80);
  font-size: 16px;
  font-weight: 400;
}
.zr-trade-status-box{
  height: 40px;
  display: flex;
  flex: 1;
  max-width: 190px;
  background-color: #C7CECF;
  border-radius: 40px;
  position: relative;
  gap: 4px;
  margin: 4px;
  align-items: center;
  justify-content: center;
}
.zr-trade-open , .zr-trade-close{
  height: calc(100% - 8px);
  display: flex;
  flex: 1;
  justify-content: center;
  align-items: center;
  margin: 4px ;
  border-radius: 32px;
}
.zr-trade-active{
  position: absolute;
  background-color: var(--approved80);
  width: 47%;
  height: 32px;
  right: 4px;
  border-radius: 32px;
  background-color: #ECEFEF;
  display: flex;
  justify-content: center;
  align-items: center;
  transition-duration: 600ms;
}


/***************************************************************** adminTradesSettings *********************************************/

.zr-custom-select {
  width:98%;
  height:100%;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: url(/themes/app/images/abshode/arrow-down.svg) no-repeat left center;
  background-size: 15px;
  padding-left: 24px;
  padding-right: 22px;
  text-align: center;
}
.zr-trades-settings-data {
  margin-top:16px;
}
.zr-trades-settings-data .zr-dashboard-tabs{
  display: flex;
  justify-content: space-between;
}
.zr-trades-settings-data .zr-dashboard-tab{
  margin-left: 0;
  font-size: 14px;
}
.zr-trades-settings-data .zr-trade-card{
  min-height: 48px;
  padding: 0 12px;
}
.zr-trades-settings-data .zr-trade-card-top {
  align-items: center;
}
.zr-trades-settings-data .zr-trade-card-top b{
  color: var(--primary70);
  font-size: 14px;
}
.zr-trades-settings-data .zr-trade-card-top img{
  width: 20px;
  height: 20px;
}
.zr-settings-more-title{
  color: var(--primary70);
  font-size: 14px;
  font-weight: 400;
}
.zr-confirm-req-setting {
  flex: 1;
  display: flex;
  justify-content: flex-end;
}
.zr-confirm-req-setting .zr-trade-status-box{
  height: 42px;
  border-radius: 16px;
  background-color: #E5ECF0;
  max-width: 220px;

}
.zr-trades-settings-data .zr-trade-card-more{
  display: flex;
  flex-direction: column;
  margin-bottom: 10px;
}
.zr-setting-more-top{
  display: flex;
  align-items: center;
}
.zr-confirm-req-setting .zr-trade-active{
  background-color: var(--primary70);
  color: #E5ECF0;
  height: 34px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 400;
}
.zr-confirm-req-setting .zr-trade-open,.zr-confirm-req-setting .zr-trade-close{
  color: var(--gray80);
  font-size: 12px;
  font-weight: 300;
}
.zr-auto-settings{
  display: none;
}
.zr-auto-settings .zr-form-input{
  border: 1px solid var(--primary50);
  background-color: var(--primary50);
  height: 34px;
  margin: 12px 0 0 0;
}
.zr-trades-settings-data .zr-dashboard-content {
  height: calc(100svh - 260px);
}
.zr-auto-settings input{
  width: 100%;
  background: var(--MainWhite);
}
.zr-time-trade-limit-box{
  height: 124px;
}
.zr-time-trade-limit-box >span{
  height: 32px;
  display: flex;
  align-items: center;
  color: var(--primary70);
  font-size: 14px;
  font-weight: 500;
}
.zr-time-trade-limit-box .zr-auto-settings{
  display: flex;
  flex-direction: column;
}
.zr-time-trade-limit-box .zr-input-form-unit{
  padding: 0;
}
.zr-time-trade-limit-box .zr-form-input img{
  width: 35px;
  height: 100%;
  padding: 6px 8px;
}
.zr-priority-list{
  margin-top: 28px;
}
.zr-priority-list-top{
  height: 24px;
  align-items: center;
}
.zr-priority-list-top >span:first-child{
  font-size: 14px;
  font-weight: 500;
  color: var(--primary70);
}
.zr-add-new{
  height: 24px;
  gap: 4px;
}
.zr-add-new img{
  width: 16px;
}
.zr-priority-list-bottom{
  margin-top: 12px;
  display: flex;
  gap: 8px;
  flex-direction: column;
}
.zr-priority-list-item{
  width: 100%;
  min-height: 32px;
  background-color: var(--MainWhite);
  border: 1px solid var(--gray15);
  border-radius: 12px;
  padding: 0 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.zr-priority-list-item >span{
color: var(--primary70);
    font-size: 12px;
    font-weight: 400;
    margin: 8px 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.zr-priority-list-item >div {
  display: flex;
  gap: 8px;
  align-items: center;
}
.zr-priority-list-item >div >img{
  width: 32px;
  height: 32px;
  padding: 8px;
}
.zr-default-desc{
  margin-top: 0;
}


/******************************************************************** adminWalletSettings *********************************************/
.zr-price-setting li{
  align-items: center;
}
.zr-price-setting > li >span{
  font-size:16px;
  color:var(--primary70);
  font-weight:400;
}
.zr-price-setting li:first-of-type .zr-trade-status-box{
  background-color: #B2C6D3;
}
.zr-price-setting li:first-of-type .zr-trade-status-box .zr-trade-active{
  background-color: #E5ECF0;
  font-weight: 700;
}
.zr-price-setting li:last-of-type  .zr-trade-status-box{
  background-color: var(--Shopping10);
}
.zr-price-setting  li:last-of-type .zr-trade-status-box .zr-trade-active{
  background-color: #EAEFEF;
  font-weight: 700;
}
.zr-spacer-16{
  display: inline-block;
  min-height: 16px;
}
.zr-change-password {
  margin-top: 32px;
}
.zr-change-password .zr-auto-settings{
  display: initial;
}
.zr-change-password .zr-auto-settings .zr-form-input{
  display: initial;
  margin: 24px 0 0 0;
}
.zr-wallet-settings-btns  {
  margin: 32px 0 0 0;
}
.zr-wallet-settings-btns  >div{
  border-radius: 12px;
}


/****************************************************************************** adminAccountManagement *********************************************/
.zr-account-item{
  width: 100%;
  min-height: 76px;
  background-color: var(--MainWhite);
  border: 1px solid var(--gray15);
  border-radius: 12px;
  padding: 12px ;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}
.zr-account-top{
  height: 24px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 4px;
  align-items: center;
}
.zr-account-top >div {
  display: flex;
  gap: 4px;
  align-items: center;
}
.zr-account-top >div >img{
  height: 16px;
  width: 16px;
}
.zr-account-top >img{
  height: 20px;
  width: 20px;
}
.zr-account-top span{
  color: var(--gray90);
  font-size: 14px;
  font-weight: 400;
}
.zr-account-bottom{
  height: 16px;
  width: 100%;
  margin-top: 12px;
  display: flex;
  justify-content: space-between;
}
.zr-account-bottom >span{
  color: var(--gray70);
  font-size: 12px;
  font-weight: 400;
}
.zr-account-bottom >div{
  display: flex;
  gap: 4px;
}
.zr-account-bottom >div>span{
  color: var(--gray70);
  font-size: 12px;
  font-weight: 300;
}
.zr-account-bottom >div>b{
  color: var(--gray85);
  font-size: 14px;
  font-weight: 400;
}
.zr-account-more{
  margin-top: 12px;
  display: none;
}

.zr-account-expanded {
  display: block;
}

.zr-acc-expanded-row img {
  width: 16px;
  box-sizing: content-box;
}

.zr-acc-expanded-row {
  display: flex;
  gap: 12px;
  margin-bottom: 12px;
}

.zr-line {
  flex: 1;
  height: 1px;
  background-color: #203353;
  margin: 0 8px;
}

.zr-acc-top {
  align-items: center;
  gap: 8px;
}
.zr-acc-top img{
  width:20px;
}
.zr-expanded-data {
  display: flex;
  align-items: center;
  padding-right: 24px;
  justify-content: flex-end;
  width: 100%;
  gap: 8px;
}
.zr-expanded-data span{
  font-size: 14px;
  font-weight: 400;
  color: var(--gray90);
  direction: ltr;
}
.zr-align-left {
  align-self: flex-end;
}

.zr-copy {
  width: 24px !important;
}
.zr-account-mangement-data .zr-dashboard-content {
  height: calc(100svh - 250px);
}
.zr-saved-account .zr-account-item{
  min-height: 48px;
}

/************************************************************************* adminRates *********************************************/

.zr-select-rate-type{
  display: flex;
  margin: 12px 24px;
}
.zr-select-rate-type li{
  width: 100%;
  justify-content: center;
}
.zr-select-rate-type li .zr-trade-status-box{
  max-width: initial;
  height: 42px;
  background-color: #E5ECF0;
  border-radius: 16px;
}
.zr-select-rate-type .zr-trade-active {
  background-color: #002841;
  color: #E5ECF0;
  border-radius: 12px;
}
.zr-select-rate-type .zr-trade-close,
.zr-select-rate-type .zr-trade-open {
  font-size: 14px;
  font-weight: 300;
  color: #4F4F4F;
}
.zr-rates-data .zr-dashboard-tabs .zr-secondary-btn{
  width: 91px;
  height: 24px;
  font-size: 10px;
  color: #00426C;
  position: absolute;
}
.zr-rates-data .zr-dashboard-tabs >span{
  padding: 0 8px;
}
.zr-rates-data .zr-dashboard-btns .zr-primary-btn,
.zr-rates-data .zr-dashboard-btns .zr-secondary-btn{
  width: 110px;
  font-size: 10px;
  height: 24px;
}
.zr-rates-data .zr-dashboard-btns .zr-secondary-btn{
  border-color: #00426C;
  color: #00426C;
}
.zr-rates-data .zr-dashboard-btns >div{
  display: flex;
  padding: 6px 12px;
  border-radius: 4px;
}
.zr-rates-data .zr-dashboard-content {
  height: calc(100svh - 315px);
}
.zr-go-left{
  right: calc(53% - 4px);
}
.zr-select-icon-btn{
  height:48px;
  width:100%;
  border:1px solid #C2CCDC;
  border-radius:8px;
  background:#F3F3F3;
  position:relative;
  overflow:hidden;
}
.zr-select-icon-img{
  width:24px;
}
.zr-select-icon-title{
  font-size:14px;
  font-weight:400;
  color:#203353;
}
.zr-select-icon-overlay{
  position: relative;
  z-index: 10;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  height: 100%;
}
.zr-select-icon-btn-back{
  width: 130%;
  height: 59px;
  background: #F9F9F9;
  position: absolute;
  transform: rotate(-8deg);
  top: -35px;
  left: -42px;
}
/************************************************************************************ adminRequests *********************************************/
.zr-admin-all .zr-requests-row.zr-req-btns span{
  color:black;
  max-width: 95px;
}
.zr-admin-all .zr-trade-card {
  min-height: initial;
}
.zr-requests .zr-dashboard-tab{
  width: initial;
  display: flex;
  gap: 4px;
}
.zr-requests .zr-requests-item{
  /*min-height:236px;*/
}
.zr-requests .zr-dashboard-tab b{
  background-color: #B3261E;
  color: var(--MainWhite);
  font-size: 12px;
  font-weight: 500;
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 22px;
  border-radius: 50%;
  margin-bottom: 2px;
}
.zr-requests .zr-dashboard-content{
  height: calc(100vh - 300px);
  margin-top: 8px;
  gap: 8px;
  display: flex;
  flex-direction: column;
  overflow: auto;
}
.zr-requests-item{
  display: flex;
  border: 1px solid var(--gray40);
  border-radius: 12px;
  /*height: 236px;*/
  background-color: var(--gray10);
  flex-direction: column;
  padding: 8px 0;
}
.zr-requests-item>div{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.zr-requests-item>div:first-child{
  padding-bottom: 12px;
  flex: 4;
  gap:8px;
}
.zr-requests-item>div:last-child{
  padding-top: 12px;
  border-top: 1px solid var(--gray30);
  flex: 3;
  gap:8px;
}
.zr-requests-row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 12px;
}
.zr-requests-row >div>span{
  color: var(--gray70);
  font-size: 12px;
  font-weight: 400;
}
.zr-requests-row>div> b{
  color: var(--gray85);
  font-size: 14px;
  font-weight: 400;
}
.zr-requests-row.zr-title div {
  display: flex;
  gap: 4px;
  align-items: center;
}
.zr-requests-row.zr-title div img{
  width: 18px;
  height: 18px;
}
.zr-requests-row.zr-title div span{
  color: var(--primary70);
  font-size: 14px;
}
.zr-requests-row.zr-title .zr-tag-warn{
  height: 23px;
  line-height: 23px;
}
.zr-requests-row.zr-highlight{
  background-color: var(--error5);
  padding: 0 4px;
  border-radius: 8px;
}
.zr-requests-row.zr-highlight div {
  display: flex;
  gap: 4px;
  align-items: center;
  padding: 4px;
  border-radius: 8px;
}
.zr-requests-row.zr-highlight div img{
  width: 16px;
  height: 16px;
}
.zr-requests-row.zr-highlight  span{
  color: var(--error70);
  font-size: 12px;
}
.zr-requests-row.zr-req-btns {
  gap: 12px;
}
.zr-requests-row.zr-req-btns span{
  width: initial;
  flex: 1;
  height: 24px;
  font-size: 10px;
  max-width: 130px;
  align-items: center;
}
.zr-sell-reqs .zr-requests-item{
  /*min-height: 200px;*/
}
.zr-sell-reqs .zr-requests-item >div{
  flex: 1;
}
.zr-deposte-reqs .zr-requests-item .zr-title img{
  width: 24px;
  height: 24px;
}
.zr-requests-row.zr-deposite-time div{
  display: flex;
  gap: 4px;
}
.zr-requests-row.zr-deposite-time img{
  width: 16px;
}
.zr-deposte-reqs .zr-requests-item{
  /*min-height: 160px;*/
}
.zr-deposte-reqs .zr-requests-item >div:last-child{
  display: none;
}
.zr-deposte-reqs .zr-requests-item>div:first-child {
  padding-bottom: 0;
}
.zr-deposite-tags{
  height: 24px;
  line-height: 24px;
}
.zr-withdraw-reqs .zr-requests-item{
  height: initial;
}.zr-withdraw-reqs .zr-requests-item >div >div{
  margin: 6px 12px;
}

/*********************************************************************** admin and colleague Reports *********************************************/
.zr-reports-data .zr-dashboard-tabs {
  justify-content: flex-start;
  gap: 16px;
}
.zr-reports-pages .zr-dashboard-content{
  height: calc(100svh - 291px);
}
.zr-reports-pages .zr-dashboard-tab{
  width:initial;
}
.zr-reports-pages .zr-trade-card-top{
  margin-top:0;
}
.zr-reports-pages .zr-trade-card-bottom{
  margin-bottom: 0;
}
.zr-reports-pages .zr-trade-card-more{
  margin-top: 8px;
}
.zr-reports-pages .zr-trade-card {
  background-color: var(--gray10);
  border: 1px solid var(--gray40);
}
.zr-reports-pages .zr-trade-card-more-top {
  height: 58px;
  border-top: 1px solid var(--gray30);
  justify-content: space-evenly;
}
.zr-reports-pages .zr-trade-card-admin-comment {
  padding:4px;
}

/********************************************************************** adminRequestDeposite *********************************************/
.zr-deposite-req-item{
  border: 1px solid var(--gray40);
  height: 310px;
  border-radius: 16px;
  background: linear-gradient(to left,var(--gray10),var(--gray15));
  margin-top: 12px;
  padding: 16px;
}
.zr-deposit-req-row{
  height: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 12px 0;
}
.zr-deposit-req-row:first-of-type{
  margin-top:0;
}
.zr-deposit-req-row>div{
  display: flex;
  align-items: center;
  gap: 4px;
}
.zr-deposit-req-row img{
  height: 24px;
  width: 24px;
}
.zr-deposit-req-row b{
  color: var(--primary70);
  font-size: 14px;
  font-weight: 500;
}
.zr-deposit-req-row i{
  color: var(--gray85);
  font-size: 14px;
  font-weight: 400;
  font-style: normal;
}
.zr-deposit-req-row span{
  color: var(--gray70);
  font-size: 12px;
  font-weight: 400;
  font-style: normal;
}
.zr-deposit-req-row .zr-bold{
  font-size: 18px;
  font-weight: 400;
}
.zr-deposit-req-box{
  height: 90px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 12px;
}
.zr-deposit-req-row2{
  height: 20px;
  display: flex;
  justify-content: space-between;
}
.zr-deposit-req-row2>div{
  display: flex;
  align-items: center;
  gap: 4px;
}
.zr-deposit-req-row2 b{
  font-size: 14px;
  font-weight: 400;
  color: var(--gray90);
}
.zr-deposit-req-row2 span{
  font-size: 10px;
  font-weight: 400;
}
.zr-deposit-req-row2 i{
  background-color: var(--primary50);
}
.zr-deposit-req-row2:last-of-type i{
  background-color: var(--approved70);
}
.zr-deposit-req-row2:last-of-type span{
  color: var(--approved85);
}
.zr-deposite-req-item .zr-custom-hr{
  margin: 0;
  flex: none;
}
.zr-deposit-req-box .zr-progressBar{
  margin: 8px 0 0 0;
}
.zr-deposite-req-item .zr-primary-btn,.zr-deposite-req-item .zr-secondary-btn {
  display: inline-block;
  width: 80%;
  margin: 24px 2% 0 2%;
  text-align: center;
  line-height: 30px;
  font-size: 14px;
  color: var(--primary70);
}
.zr-deposite-req-item .zr-inactive-btn{
  display: inline-block;
  width: 80%;
  margin: 24px 2% 0 2%;
  text-align: center;
  line-height: 30px;
  font-size: 14px;
}
.zr-dashboard-tab .zr-counter{
  background-color: #B3261E;
  width: 16px;
  height: 16px;
  color: var(--MainWhite);
  font-size: 11px;
  font-weight: 500;
  display: inline-block;
  border-radius: 50%;
  line-height: 18px;
}
.zr-req-deopsite-data  .zr-dashboard-content{
  height: calc(100svh - 610px);
}
.zr-req-deopsite-data .zr-expanded-deposit-data-height {
  height: calc(100vh - 260px);
}
.zr-req-deopsite-data .zr-account-more{
  margin-top: 0;
}
.zr-req-deopsite-data .zr-account-item .zr-tag-warn{
  font-weight: 400;
  height: 24px;
  line-height: 24px;
}
.zr-deposite-transaction .zr-account-bottom >span{
  color: var(--gray85);
  font-size: 14px;
}
.zr-deposite-transaction .zr-account-bottom>div{
  display: flex;
  align-items: center;
}
.zr-deposite-transaction .zr-account-bottom>div >b{
  color: var(--gray85);
  font-size: 16px;
}
.zr-deposite-transaction .zr-account-bottom>div >span{
  color: var(--gray85);
  font-size: 10px;
}
.zr-deposite-transaction .zr-account-bottom .zr-trx-btn-container{
  display: flex;
  flex: 1;
  height: 24px;
}
.zr-deposite-transaction .zr-account-bottom .zr-trx-btn{
  display: flex;
  height: 24px;
  font-size: 10px;
  flex: 1;
}
.zr-deposite-transaction .zr-account-bottom .zr-trx-btn{
  display: flex;
  height: 24px;
  font-size: 10px;
  flex: 1;
}
.zr-deposite-transaction .zr-trx-btn-container  {
  gap: 12px;
}

.zr-deposite-transaction .zr-account-more .zr-account-more-row {
  display: flex;
  justify-content: space-between;
  margin-top: 12px;
  align-items: center;
}

.zr-deposite-transaction .zr-account-more .zr-account-more-row span{
  color: var(--gray70);
  font-size: 12px;
  font-weight: 400;
}

.zr-deposite-transaction .zr-account-more .zr-account-more-row b{
  color: var(--gray85);
  font-size: 14px;
  font-weight: 400;
  /* direction: ltr; */
}
.zr-deposite-transaction .zr-account-more .zr-account-more-row .zr-primary-btn-grey{
  color: var(--primary70);
  flex: 1;
  font-size: 14px;
}
.zr-deposite-transaction .zr-account-item{
  margin-bottom: 12px;
}
.zr-deposit-wrapper{height:calc(100svh - 195px);overflow:auto;}
.zr-link-btn span{
  color:var(--link70);
  font-size: 14px;
}
.zr-link-btn {
  border-bottom: 1px solid var(--link70);
  padding: 8px;
  display: flex;
  gap:4px;
  justify-content: center;    
  max-width: 80%;
  margin: auto;
}
.zr-badge-counter{
  background-color: #B3261E;
  color: var(--MainWhite) !important;
  font-size: 12px;
  font-weight: 500;
  width: 20px;
  height: 20px;
  line-height: 22px;
  text-align: center;
  border-radius: 50%;
}
.zr-warn-close-req{
  display:flex;
  flex-direction: column;
}
.zr-warn-close-req >b{
  color:#1C0D10;
  font-size:16px;
  font-weight:700;
  margin-top: 8px;
}
.zr-warn-close-req-row{
  border-bottom:1px solid #eee;
  padding-bottom:8px;
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
}
.zr-warn-close-req-row >span{
  color:#767676;
  font-size:12px;
  font-weight:400;
}
.zr-warn-close-req-row >span> b{
  color:#272727;
  font-size:16px;
  font-weight:400;
}

/********************************************************************************** adminWithdrawDetails *********************************************/

.zr-withdraw-details-progress-bar{
    margin: 0 !important;
}
/* مربوط به صفحه جزییات برداشت ادمین 15 / 10 / 1404 تغییر دادم */
.zr-withdraw-details-data .zr-dashboard-content{
    height: calc(100svh - 590px);
}
.zr-withdraw-details-data .zr-dashboard-content.zr-expanded-deposit-data-height{
    height: calc(100svh - 255px);
}
.zr-height-auto{
    height: auto !important;
}
.zr-show-account-details{
    height: 170px;
    width: 100%;
    display: none;
}
.zr-show-account-details .zr-acc-expanded-row {
    display: flex;
    gap: 4px;
    margin-bottom: 8px;
}
.zr-show-account-details .zr-expanded-data {
    padding-right: 0;
}
.zr-show-account-details .zr-expanded-data span{
    font-size: 12px;
}
.admin-withdraw-details-top-container .deposite-details-all .zr-deposit-request-container {
    min-width: 283px;
}