/* 2023/04/26*/
/*#####Variables#####*/
:root{/*Size Root*/
  --exlargefont:24px;
  --xxlargefont:20px;
  --xlargefont:18px;
  --largefont:16px;
  --normalfont:14px;
  --smallfont:12px;
  --xsmallfont:10px;
  --xxsmallfont:8px;

  --xsmallradius:0.25rem;
  --smallradius:0.5rem;
  --normalradius:0.75rem;
  --largeradius:1rem;
  --xlargeradius:1.25rem;
  --xxlargeradius:1.5rem;
  --exlargeradius:1.75rem;
  --exxlargeradius:2rem;

  --inputxminrp:0.25rem;
  --inputminrp:0.5rem;
  --inputrp:0.75rem;

  --InputFontWeight:300;

  --smallwidth:110px;
  --normallwidth:168px;
  --largewidth:192px;
  --DocBtnWidth:132px;
  --exlarge:245px;

  --TitleIcon:18px;
  --ImageMsg:130px;
  --checkboxheight:20px;
  --marginboxheight:0.75rem;
  --DocumentHeight:432px;
  --menuicon:22px;
  --Widthrightmenu:10.5rem;
  --InputPadding:1.125rem;
  --LineheightCode:1.5rem;
  --MarginHeader:3rem;
  --MargindivContent:0.75rem;
  --widthtitle: 138px;
  --InputHeight:40px;
  --MarginRow:2rem;
  --WidthSrchbtn:10px;
  --Widthbtn:138px;
  --HeightBtn:32px;
  --HeightSelectedBtn:30px;
  --FontBtn:var(--largefont);
  --FontBtnCancel:var(--largefont);
  --FontFormTitle:var(--xxlargefont);
  --FontInput:var(--smallfont);
  --FontRightMenu:16px;
  --Documentwidthtitle:96px;
  --HeaderHeight:0px;
  --TabHeight:40px;
  --Fontcodeinput:13px;
  --Fontrightmenulogo:64px;
  --Heightrightmenulink:48px;
  --Marginrightmenulink: 1.25rem 0.5rem 1.25rem 0;
  --borderradiusrightmenulink:0 1.5rem 1.5rem 0;
  --borderradiusrightmenutitle:1.5rem 0 0 1.5rem;
  --Pagewidthtitle:112px;
  --Imagewidth:200px;
  --Imageheight:192px;
  --MarginRightMenuItem:0.5rem;
  --font-primary:Vazir;
  --ImgDistance:0.75rem;
  --rameinwidth:110px;
}

/*Main Root*/
:root{
  --MainPrimary:#35558A;
  --MainSecondary:#DCBE5E;
  --MainTertiary:#8A424E;
  --MainQuaternary:#1B4D4D;
  --MainWhite:#FDFDFD;
  --MainBlack:#141414;

  --white:var(--MainWhite);
  --whiteColor: var(--MainWhite);

  --MainThemeColor:var(--MainPrimary);

  --Primary5:#EBEEF3;
  --Primary10:#D7DDE8;
  --Primary15:#C2CCDC;
  --Primary20:#AEBBD0;
  --Primary30:#8699B9;
  --Primary40:#5D77A1;
  --Primary60:#2A446E;
  --Primary70:#203353;
  --Primary80:#152237;
  --Primary85:#101A29;
  --Primary90:#0B111C;
  --Primary95:#05090E;
  --TempPrimary70:#203353;
  --Primary70light: #2033536b;
  --Primary70LIGHT:#2D4774;
  --Primary5light:#8590A3;


  --GrayColor:#EBEEF3;
  --GrayWhite:#FDFDFD;
  --Gray5:#F9F9F9;
  --Gray10:#F3F3F3;
  --Gray15:#EEEEEE; 
  --Gray20:#E8E8E8;
  --Gray30:#DCDCDC;
  --Gray40:#D1D1D1;
  --Gray50:#C5C5C5; 
  --Gray60:#9E9E9E; 
  --Gray70:#767676;
  --Gray80:#4F4F4F;
  --Gray95:#141414;

  --Link5:#E5F2FF;
  --Link20:#99CAFF;
  --Link50:#007AFF;
  --Link60:#0062CC;
  --Link70:#004999;
  --link: var(--Link70);


  --Approved5:#EBF9EE;
  --Approved20:#AEE9BD;
  --Approved30:#85DD9B;
  --Approved50:#34C759;
  --Approved60:#2A9F47;
  --Approved70:#1F7735;

  --InputTextColor:var(--Gray95);

  --Dangerous20:#E19999;


  --Error5:#FFEBEA;
  --Error30:#FF8983;  
  --Error20:#FFB1AC;  
  --Error50:#FF3B30;
  --Error60:#CC2F26;
  --Error70:#99231D;

  --Warning20:#FFD599;
  --Warning50:#FF9500;
  --Warning60:#CC7700;
  --Warning70:#995900;


  --Sunny5:#FCF9EF;
  --Sunny10:#F8F2DF;
  --Sunny15:#F5ECCF;
  --Sunny20:#DDBF5E;
  --Sunny30:#EBD99E;
  --Sunny40:#e4cc7e;
  --Sunny60:#C69B12;
  --Sunny70:#856638;
  --Sunny80:#584C26;

  --Tertiary5:#FAF6F6;
  --Tertiary10:#E8D9DC;
  --Tertiary20:#D0B3B8;
  --Tertiary30:#B98E95;
  --Tertiary60:#6E353E;
  --Tertiary70:#53282F;
  --Tertiary80:#371A1F;
  --Tertiary5light:#9c878d;

  --Quaternary40:#497171;
  --Quaternary80:#0B1F1F;

  --Gold5:#FDFAF1;

  --Production5: #e6EFF7;
  --Production20: #CDDFF0;
  --Production60:#024C90;


  --Primary10Temp:#D7DDE8;

  --secondgradiant:#35558A00;

  --selectedmenu:var(--GrayWhite);


  --secondbgColor:var(--MainSecondary);

  --Lightsecondcolor:#DDBF5Eb8;
  --Lightgreen:#D5EBE8;
  --Lightred:#F6E1E1;

  --symbolparentborder:#90BAE9;
  --symbolparentbg:#90BAE9;



  --gray:var(--Gray20);



  --BlueShadow:#35558Ab8; 
  --red:#DC0000;
  --FirstbgColor:var(--MainThemeColor);
  --darkborder:var(--MainThemeColor);
  --Dark: #101010;
  --dark: var(--Dark);
  --honeycolor: var(--Sunny20);
  --Primary:#B6C1CF;
  --CopperBtn:#C4A0A7; 
  --Copper:#8a424e;  
  --lightCopper:#FFFAFA;
  --DarkCopper:#8a424e;
  --LightFirstcolor:#35558Ab8;
  --bgtitle:var(--MainThemeColor);
  --ShadowColor:#0000003b;
  --hovercolor: #0000003b;
  --PreLoading:#35558a7a;


  --DarkGreen:#1c635b;
  --DarkRed:#6E0000;
  --midnightbtn:#160A5B;

  --violet:#6d222e;
  --RedWhite:#FFEFEF;
  --YellowWhite:#FFFDF5;
  --GreenWhite:#F0FFFB;

  --bodybgcolor: var(--MainWhite);
  --OperationShadow:#00000026;
  --FirstDashboardColor:#35558aba;
  --rightmenucolor:var(--Primary5);
  --blackblue:#00286E;
  --LightBlue: #EFF4FE;
  --bgDoccolor:var(--MainThemeColor);
  --TempbgDoccolor:var(--MainThemeColor);
  --borderDoccolor:var(--MainThemeColor);
  --label:var(--Gray95);
  --TitleColor:var(--Gray95);
  --InputColor:var(--Gray5);
  --DocShadow:#5d77a126;
  --bgForm:var(--Primary5);
  --table-border:var(--Primary15);
  --table-header-border:var(--Primary15);
  --Trbg:var(--Gray15);
  --redDialog:#99231dcc;
  --yellowDialog:#705103c7;
  --GreenDialog:#4D847Ec7;
  --RedDelete:var(--Error70);
  --CancelColor:var(--Gray95);
  --secondary:var(--MainThemeColor);
  --Purewhite:#FFF;
  --DialogBlur:#d7dde833;
  --Dialogbg:var(--MainPrimary);
  --warning:var(--Warning70);
  --BlueBox:var(--Primary5);
  --line: #AEB8C5;
  --primary: #707070;
  --DialogShadow:#101a2980;
  --PlaceholderColor:var(--Primary5);

  --Elephant:#E4ECF9;

  --grayblue:#F2F6F8;

  --Bezh: #f9f3e1;
  --loading: url(/themes/manager/images/zargar-logosmall.gif);
  --sending: url(/themes/manager/images/zargar-logosmall.gif);
  --bgDocImg:url(/themes/manager/images/createdocument/bg-Bluedoc.svg);
}
body, ul, li, a, p, span, h1, h2, h3, h4, h5, h6, input, button ,pre{
  margin: 0;
  padding: 0;
  list-style: none;
  text-decoration: none;
  box-sizing: border-box;
  outline: none;
  border: none;
  font-family: Vazir; 
  color: var(--FontColor);
  font-weight: normal;
  scrollbar-width: thin;
  line-height: 1.5;
}
*{
  font-family: 'Vazir';
}
body ,.zr-divmain{
  min-height: 100vh;
}

html {
  scroll-behavior: smooth;
}

a, button,select {
  cursor: pointer;
}

button:disabled {
  cursor: not-allowed !important;
}

input,select,textarea{
  border:0;
  outline:0;
}
::placeholder {
  font-size: 12px;
  font-weight: normal;
  color: var(--PlaceholderColor);
}

input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

select{
  height: var(--InputHeight) !important;
}
.sp-color-darkblue {
  color: var(--Primary70);
}
.sp-color-gray{
  color:#C0C0C0;
}
.zr-login-box{
  width: clamp(50%,460px,60%);
  margin: 0 auto;
  max-width: 460px;
}
.zr-logo-parent {
  margin-bottom: clamp(1.5rem,50%,4.5rem);
}
.zr-login-parent::after{
  content: "";
  background: radial-gradient(79.03% 121.69% at 39.84% 17.12%, #35558A 0%, #35558A 15.32%, #35558A 27.43%, #35558A 41.53%, #152237 55.14%, #152237 67.89%, #152237 79.59%, #152237 89.85%, #152237 97.58%);
  position: absolute;
  transform: rotate(-180deg);
  width: 50%;
  height: 100%;
  z-index: -2;
  left: 0;
  background-size: 200%;
}
.zr-login-parent::before{
  content: "";
  background: rgba(255, 255, 255, 0.04);
  backdrop-filter: blur(150px);
  /* transform: rotate(-180deg); */
  width: 50%;
  height: 100%;
  position: absolute;
  z-index: -1;
  left: 0;
  background-size: 200%;
}
.zr-login-logo{
  max-width: 220px;
}

.zr-login-submit{
  background: linear-gradient(270deg, #CAB982 19.88%, #E0CC8D 49.31%, #CAB982 76.98%);
  color: var(--Primary95);
  max-width: 340px;
  height: 42px;
  padding: 0 0 0.25rem;
  margin-top:clamp(1.5rem,50%,5.5rem) !important;
}
:is(.zr-login-submit , .zr-btn-app , .zr-btn-preview):is(:hover,:focus){
  background: var(--Link5) !important;
  outline: 1px solid var(--Link50) !important;
  color: var(--Link50) !important;
  --Primary95: var(--Link50) !important;
}

.sp-row, .sp-r {
  justify-content: space-between;
  flex: 1;
  margin-right: 0px;
  margin-left: 0px;
}
.sp-f-row:not(.sp-d-custom,.sp-d-section,.sp-d-division,.sp-d-checkbox,.sp-d-button,.sp-f-result) {
  background: var(--MainThemeColor);
  outline: 0.5px solid var(--MainThemeColor);
  direction: rtl;
  border-radius: var(--inputrp);
  margin-bottom: var(--MarginRow);
  margin-top: var(--MarginRow);
  width: auto;
  position: relative;
}

.sp-main-loading:after {
  border-radius: var(--xxlargeradius);
  background-size: clamp(100px,200px,50%) clamp(100px,200px,50%);
  z-index: 32;
}

.sp-main-loading:before {
  border-radius: var(--xxlargeradius);
  background: var(--secondgradiant);
  backdrop-filter: blur(3px) brightness(1) saturate(1);
  -moz-backdrop-filter: blur(3px) brightness(1) saturate(1);
  z-index: 30;
}
.sp-f-title, [class*="sp-f-row"] .sp-f-title {
  line-height: 36px;
  display: flex;
  width: auto;
  min-width: var(--widthtitle);
  text-align: right;
  align-items: revert;
  border-radius: 0 var(--inputrp) var(--inputrp) 0;
  font-size: var(--FontFormTitle);
  padding: 0 1.5rem 0 0;
  justify-content: right;
  font-weight: 400;
  color: var(--white);
  white-space: nowrap;
  vertical-align: middle;
}
.sp-f-row:not(.sp-d-button,.sp-d-checkbox,.sp-d-custom,.sp-d-division,.sp-d-section) :is(.sp-form-editor, .sp-f-editor) {
  background-color: var(--InputColor);
  border-radius: var(--inputrp) 0rem var(--inputrp) var(--inputrp);
  outline: 1px solid var(--borderDoccolor);
}
.sp-form-editor, .sp-f-editor {
  padding: 0;
  width: calc(100% - var(--widthtitle));
  flex-direction: row;
}
.sp-captchaImg{
  max-height:var(--InputHeight);
  max-width:120px;
}
.sp-f :is(input[type=text],input[type=password],input[type=number],textarea), :is(input[type=text],input[type=password],input[type=number],textarea), .sp-f-editor>.sp-f-label, .sp-form select, .sp-f select, .sp-form-select, .sp-f-select {
  border: 0;
  margin: 0;
  padding: 0;
  text-align: left;
  border-radius: var(--inputrp) 0 var(--inputrp) var(--inputrp);
  width: 100%;
  padding-left: 0.75rem;
  line-height: 40px;
  vertical-align: middle;
  font-family: 'vazir';
  font-size: var(--xxlargefont);
  font-weight: var(--InputFontWeight);
  background-color: var(--InputColor);
  transition: none !important;
  color: var(--Primary95);
  align-self: center;
}
.sp-form :is(input[type=text] , input[type=password]), .sp-form input[type=password], .sp-form input[type=number], .sp-form textarea, .sp-f input[type=text], .sp-f input[type=password], .sp-f input[type=number], .sp-f textarea, .sp-f-editor>.sp-f-label, .sp-drop-button {
  color: var(--Primary95);
}
.sp-form :is(input[type=text] , input[type=password]), .sp-form input[type=password], .sp-form input[type=number], .sp-form textarea, .sp-f input[type=text], .sp-f input[type=password], .sp-f input[type=number], .sp-f textarea {
  min-height: var(--InputHeight);
  font-size: var(--FontInput);
}

.sp-invalidated.sp-f-row:not(.sp-d-custom,.sp-d-section,.sp-d-division,.sp-d-checkbox,.sp-d-button,.sp-f-readonly) {
  --borderDoccolor: var(--Error30);
  --bgDoccolor: var(--Dangerous20);
  --InputColor: var(--Error5);
  --TitleColor: var(--Primary95);
  --white: var(--Primary95);
}
.sp-invalidated .sp-error-message, .sp-invalidated .sp-f-message {
  display: flex !important;
  background-color: var(--Error5);
  backdrop-filter: blur(2px);
  -moz-backdrop-filter: blur(2px);
  color: var(--Gray95) !important;
  position: absolute;
  outline:1px solid var(--Error50);
  width: 100%;
  font-size: var(--smallfont);
  height: 2.25rem;
  justify-content: center;
  border-radius: var(--inputrp);
  top: calc(100% + 0.5rem);
  left: -36px;
  min-width: 200px;
  width: 200px;
  margin: 0 !important;
  display: flex;
  z-index: 5;
  filter: drop-shadow(-2px 2px 10px rgba(112, 112, 117, 0.3));
  flex-flow: column;
  text-align: center;
  font-weight: 600;
  animation: hiddenAnimation 2s 2s forwards;
}
.sp-invalidated .sp-f-message::before {
  content: "";
  display: block;
  position: absolute;
  width: 14px;
  height: 14px;
  bottom: calc(100% - 6px);
  left: 15px;
  background: var(--Error5);
  line-height: 1rem;
  border-top-right-radius: 5px;
  border: 1px solid red;
  border-left: 0;
  border-bottom: 0;
  transform: rotate(-45deg);
}
.sp-f-row:not(.sp-g-cell .sp-f-row).sp-invalidated:not(.sp-d-checkbox,.sp-f-readonly)::after {
  position: absolute;
  content: '';
  display: block;
  background: url(/themes/manager/images/inputimg/Incorrect.svg);
  width: 32px;
  height: 32px;
  right: calc(100% + 4px);
  background-size: 100% 100%;
  margin: auto;
  top: calc(50% - 12px);
}
.sp-f-row:not(.sp-d-custom,.sp-d-section,.sp-d-division,.sp-d-checkbox,.sp-d-button,.sp-f-result) {
  background: var(--bgDoccolor);
  outline: 0.5px solid var(--borderDoccolor);
}
.sp-form .sp-invalidated .sp-form-message, .sp-f .sp-invalidated .sp-f-message {
  display: block;
}
.sp-f-message {
  display: none;
}
.sp-validated.sp-f-row:not(.sp-d-custom,.sp-d-section,.sp-d-division,.sp-d-checkbox,.sp-d-button,.sp-f-readonly) {
  --borderDoccolor: var(--Approved60);
  --bgDoccolor: var(--Approved5);
  --TitleColor: var(--Gray95);
  --InputColor: var(--Gray5);
  --white: var(--Approved70);
}
.sp-f-row:not(.sp-g-cell .sp-f-row).sp-validated:not(.sp-d-checkbox,.sp-f-readonly)::after {
  position: absolute;
  content: '';
  display: block;
  background: url(/themes/manager/images/inputimg/Correct.svg);
  width: 32px;
  height: 32px;
  right: calc(100% + 4px);
  background-size: 100% 100%;
  margin: auto;
  top: calc(50% - 14px);
  animation: hiddenAnimation 0s 2s forwards;
}
@keyframes ShowAnimation {
  from{opacity:0;visibility: hidden;}
  to{opacity:1;visibility:visible;}
}

@keyframes hiddenAnimation {
  100% {opacity:0;visibility: hidden;}
}

.sp-form-check:before, .sp-f-check:before, .sp-form-radio:before, .sp-f-radio:before {
  height: var(--checkboxheight);
  width: var(--checkboxheight);
  border: 1px solid var(--MainPrimary);
  background-color: var(--InputColor) !important;
  border-radius: 4px;
  position: initial;
  margin: auto -2px;
}
.sp-f-check:checked:before {
  border: 1px solid var(--Approved70);
  --InputColor: var(--Approved5);
}
.sp-f-check:checked:after {
  left: 2px;
  top: 2px;
  display: inline-block;
  transform: rotate(45deg);
  height: calc(var(--checkboxheight) - 7px);
  width: 7px;
  border-bottom: 2px solid var(--Approved70);
  border-right: 2px solid var(--Approved70);
  border-radius: 1px;
}
.zr-loginImg{
  max-width:500px;
}
.zr-loginImg-parent{
  margin-bottom:7.5rem;
}
.zr-loginImg-title{
  background: linear-gradient(270deg, #CAB982 19.88%, #E0CC8D 49.31%, #CAB982 76.98%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
  font-size: 40px;
}
.zr-login-desc{
  color:#F3F3F3;
}

.zr-verifyImg{
  max-width: 685px;
  max-height: 370px;
  object-fit: cover;
}
.zr-code-parent{
  column-gap:1.25rem;
} 
.zr-code-input {
  font-size: 32px;
  color: var(--Primary60);
  width: 42px;
  height: 42px;
}
.sp-f-link{
  color: var(--Link70);
}

.sp-f-row:not(.sp-d-checkbox,.zr-role-section .sp-d-checkbox,.sp-d-section,.sp-f-readonly):hover *, .sp-f-row:not(.zr-role-section .sp-d-section,.sp-f-readonly):hover, .sp-f-row:not(.zr-role-section .sp-d-section,.sp-f-readonly):focus, .sp-f-row:focus-within, .zr-cheque-remainder .sp-f-append .sp-f-group:focus-within, .sp-f-row:not(.sp-f-readonly):focus-within, .sp-f-row:not(.sp-f-readonly):focus-within, .zr-edited-form .sp-f-row:not(.sp-f-readonly):focus-within, :is(.sp-validated,.sp-invalidated,.zr-edited-row).sp-f-row:not(.sp-d-custom,.sp-d-section,.sp-d-division,.sp-d-checkbox,.sp-d-button,.sp-f-readonly):hover, :is(.sp-validated,.sp-invalidated,.zr-edited-row).sp-f-row:not(.sp-d-custom,.sp-d-section,.sp-d-division,.sp-d-checkbox,.sp-d-button,.sp-f-readonly):focus-within, .zr-edited-form .sp-f-row:not(.sp-d-checkbox,.sp-d-division,.sp-d-button,.sp-invalidated,.sp-f-readonly):hover, .zr-CurrentDocument .sp-f-row:focus-within, .zr-CurrentDocument :is([class*="sp-f-row"]:focus-within .sp-f-title){
  --bgDoccolor: var(--Link5);
  --TempbgDoccolor: var(--Link5);
  --borderDoccolor: var(--Link50);
  --TitleColor: var(--Link50) !important;
  --InputColor: var(--Gray5);
  --Gray95: var(--InputTextColor);
  --white: var(--Link50);
}
.zr-code-input:is(:focus,:hover,:focus-within){
  --Primary60:var(--Link70) !important;
  --secondary:var(--Link70) !important;
  background:var(--Link5);
}
.sp-f-row.sp-d-checkbox:focus-within :is(.sp-form-editor, .sp-f-editor), .sp-f-row.sp-d-checkbox :is(.sp-form-editor, .sp-f-editor):focus-within, .sp-f-row.sp-d-checkbox:hover :is(.sp-form-editor, .sp-f-editor), .sp-f-row.sp-d-checkbox :is(.sp-form-editor, .sp-f-editor):hover {
  --TitleColor: var(--Link50);
  --MainThemeColor: var(--Link50);
  --InputColor: var(--Link5);
  --Approved5: var(--Link5);
  --Approved70: var(--Link50);
}
.sp-f-row.sp-d-checkbox span {
  color: var(--TitleColor);
}
.zr-userocde-parent{
  /* margin: clamp(1rem,7rem,50%) 0 clamp(1rem,9rem,50%);*/
  margin: clamp(1rem,2.5rem,50%) 0 clamp(1rem,1.5rem,50%);
}
.sp-invalid-message{
  color: var(--Error70);
}
.zr-code-input.sp-invalidated{
  color: var(--Error70);
  border-color: var(--Error70);
  outline: 1px solid;
}
input:-webkit-autofill ,input:-moz-autofill,input:-o-autofill , input:-khtml-autofill , input:focus:-webkit-autofill,input:focus:-moz-autofill, input:focus:-o-autofill ,input:focus:-khtml-autofill {
  -webkit-text-fill-color: white !important;
  -webkit-box-shadow: 0 0 0px 1000px white inset;
  -moz-text-fill-color: white !important;
  -moz-box-shadow: 0 0 0px 1000px white inset;
  -o-text-fill-color: white !important;
  -o-box-shadow: 0 0 0px 1000px white inset;
  -khtml-text-fill-color: white !important;
  -khtml-box-shadow: 0 0 0px 1000px white inset;
  -webkit-text-fill-color: white !important;
  -webkit-box-shadow: 0 0 0px 1000px white inset;
  -moz-text-fill-color: white !important;
  -moz-box-shadow: 0 0 0px 1000px white inset;
  -o-text-fill-color: white !important;
  -o-box-shadow: 0 0 0px 1000px white inset;
  -khtml-text-fill-color: white !important;
  -khtml-box-shadow: 0 0 0px 1000px white inset;
}


.zr-btn-app , .zr-btn-preview{
  width: 164px;
  height: 40px;
  justify-content: center;
  outline: 1px solid var(--Primary70);
  border-radius: 0.5rem;
  background: transparent;
  color: var(--Primary70);
  font-weight: 500;
  font-size: 14px;
}
.zr-btn-app::before{
  content:"";
  width:34px;
  height:24px;
  background: url(/themes/manager/icons/login/LoginApp.svg) no-repeat center transparent;
  margin-left:0.75rem;
}
.zr-btn-app:is(:focus,:hover)::before{
  background: url(/themes/manager/icons/login/LoginAppFocus.svg) no-repeat center transparent;
}
.zr-btn-preview::before  {
  content: "";
  width: 24px;
  height: 24px;
  background: url(/themes/manager/icons/baseinformations/PriceBoardBlue.svg) no-repeat center;
  background-size: 100% 100%;
  margin-left: 0.5rem;
}
.zr-btn-preview:is(:focus,:hover)::before {
  background: url(/themes/manager/icons/baseinformations/PriceBoardFocus.svg) no-repeat center;
  background-size: cover;
}


@media screen and (max-width: 1366px) {
  :root{
    --MarginRow: 1rem;
  }
  .zr-logo-parent {
    margin-bottom: 1.5rem;
  }
  .zr-login-submit{
    margin-top: 2.5rem  !important;
  }
  .sp-my-8 {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important;
  }
  .zr-loginImg-parent {
    margin-bottom: 3.5rem;
  }
  .zr-loginImg {
    max-width: 400px;
  }
  .sp-font-exlarge {
    font-size: 20px;
  }
  .zr-btn-app {
    width: 164px;
    height: 32px;
  }
  .zr-btn-app::before {
    width: 28px;
    height: 20px;
    margin-left: 0.25rem;
    background-size: 100% 100% !important;
  }
}

@media screen and (max-width: 1366px) {



}





@media screen and (max-width: 640px)
{
  .zr-logo-parent ~ .sp-row
  {
    display: none;
  }
  .zr-btn-preview 
  {
    display: none !important;
  }
  .zr-login-submit
  {
    display: none !important;
  }
  .zr-loginImg-parent
  {
    display: none !important;
  }
  .zr-forgot-pass
  {
    display: none !important;
  }
  .zr-loginLeft
  {
    display: none !important;
  }
  .zr-login-parent::after
  {
    display:none;
  }
  .zr-btn-app
  {
    margin-top:22px;
  }
}