|  |  |  | @ -6,10 +6,17 @@ $alertContentColor: #646464; | 
			
		
	
		
			
				
					|  |  |  |  | $white: #fff; | 
			
		
	
		
			
				
					|  |  |  |  | // $BgHeaderColor | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | // ? bluee alert Box , error1 | 
			
		
	
		
			
				
					|  |  |  |  | // ? blue alert Box , error1 | 
			
		
	
		
			
				
					|  |  |  |  | $lightBlue: #06bace; | 
			
		
	
		
			
				
					|  |  |  |  | $confirmBtnBgColor: #f6feff; | 
			
		
	
		
			
				
					|  |  |  |  | $blueTitleBgColor: #dfe6e9; | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | // ? green alert Box , error1 | 
			
		
	
		
			
				
					|  |  |  |  | $lightGreen: #3ee924; | 
			
		
	
		
			
				
					|  |  |  |  | $darkGreen: #21ae0b; | 
			
		
	
		
			
				
					|  |  |  |  | $greenTitleBgColor: #91ff5233; | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | $darkRed: #e92424; | 
			
		
	
		
			
				
					|  |  |  |  | $headerBgClr: #dfe6e9; | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | // $errorcolor1: #06bace; | 
			
		
	
		
			
				
					|  |  |  |  | // $errorcolor2: #3ee924; | 
			
		
	
	
		
			
				
					|  |  |  | @ -21,17 +28,17 @@ $headerBgClr: #dfe6e9; | 
			
		
	
		
			
				
					|  |  |  |  | // $toastbgerror: #ffeaea; | 
			
		
	
		
			
				
					|  |  |  |  | // $toastbgsuccess: #c3ffb9; | 
			
		
	
		
			
				
					|  |  |  |  | // $toastsuccesscolor: #21ae0b; | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | // ! common styles | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | // alert box | 
			
		
	
		
			
				
					|  |  |  |  | // * alert box | 
			
		
	
		
			
				
					|  |  |  |  | .swal2-container.swal2-center > .swal2-popup { | 
			
		
	
		
			
				
					|  |  |  |  |   border: solid 2px $alertBorderClr !important; | 
			
		
	
		
			
				
					|  |  |  |  |   border-top-right-radius: 10px !important; | 
			
		
	
		
			
				
					|  |  |  |  |   border-top-left-radius: 10px !important; | 
			
		
	
		
			
				
					|  |  |  |  |   // | 
			
		
	
		
			
				
					|  |  |  |  |   position: relative; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | /* ? کلاس تمامی تایتل ها */ | 
			
		
	
		
			
				
					|  |  |  |  | // * کلاس تمامی تایتل ها | 
			
		
	
		
			
				
					|  |  |  |  | .swal2-title { | 
			
		
	
		
			
				
					|  |  |  |  |   text-align: right !important; | 
			
		
	
		
			
				
					|  |  |  |  |   font-size: 20px !important; | 
			
		
	
	
		
			
				
					|  |  |  | @ -42,7 +49,7 @@ $headerBgClr: #dfe6e9; | 
			
		
	
		
			
				
					|  |  |  |  |   border-top-left-radius: 10px !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | /* ? کلاس متن داخل الرت باکس */ | 
			
		
	
		
			
				
					|  |  |  |  | // * کلاس متن داخل الرت باکس | 
			
		
	
		
			
				
					|  |  |  |  | .swal2-html-container { | 
			
		
	
		
			
				
					|  |  |  |  |   text-align: justify !important; | 
			
		
	
		
			
				
					|  |  |  |  |   line-height: 1.8 !important; | 
			
		
	
	
		
			
				
					|  |  |  | @ -50,7 +57,7 @@ $headerBgClr: #dfe6e9; | 
			
		
	
		
			
				
					|  |  |  |  |   font-size: 16px !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | /* ? کلاس ایکن کنسل یا ضربدر بالا سمت چپ الرت باکس */ | 
			
		
	
		
			
				
					|  |  |  |  | // * کلاس ایکن کنسل یا ضربدر بالا سمت چپ الرت باکس | 
			
		
	
		
			
				
					|  |  |  |  | .swal2-rtl .swal2-close { | 
			
		
	
		
			
				
					|  |  |  |  |   width: 31px !important; | 
			
		
	
		
			
				
					|  |  |  |  |   height: 30px !important; | 
			
		
	
	
		
			
				
					|  |  |  | @ -66,93 +73,102 @@ $headerBgClr: #dfe6e9; | 
			
		
	
		
			
				
					|  |  |  |  |   z-index: 2; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | /* ? کلاس کانفرم باتن */ | 
			
		
	
		
			
				
					|  |  |  |  | // * کلاس کانفرم باتن | 
			
		
	
		
			
				
					|  |  |  |  | .swal2-styled.swal2-confirm { | 
			
		
	
		
			
				
					|  |  |  |  |   transition: all 0.4s !important; | 
			
		
	
		
			
				
					|  |  |  |  |   outline: none !important; | 
			
		
	
		
			
				
					|  |  |  |  |   border-radius: 4px !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | /* ? کلاس هاور کانفرم باتن */ | 
			
		
	
		
			
				
					|  |  |  |  | // * کلاس هاور کانفرم باتن | 
			
		
	
		
			
				
					|  |  |  |  | .swal2-styled.swal2-confirm:hover { | 
			
		
	
		
			
				
					|  |  |  |  |   transform: translateY(-5px) !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | /* ? کلاس کنسل باتن */ | 
			
		
	
		
			
				
					|  |  |  |  | // * کلاس کنسل باتن | 
			
		
	
		
			
				
					|  |  |  |  | .swal2-styled.swal2-cancel { | 
			
		
	
		
			
				
					|  |  |  |  |   transition: all 0.4s !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | /* ? کلاس هاور کنسل باتن */ | 
			
		
	
		
			
				
					|  |  |  |  | // * کلاس هاور کنسل باتن | 
			
		
	
		
			
				
					|  |  |  |  | .swal2-styled.swal2-cancel:hover { | 
			
		
	
		
			
				
					|  |  |  |  |   transform: translateY(-5px) !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | /* ? ایکن اررور  */ | 
			
		
	
		
			
				
					|  |  |  |  | // * ایکن اررور | 
			
		
	
		
			
				
					|  |  |  |  | .swal2-icon.swal2-error { | 
			
		
	
		
			
				
					|  |  |  |  |   border-color: $darkRed !important; | 
			
		
	
		
			
				
					|  |  |  |  |   color: $darkRed !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | // ? error 1 lightBlue | 
			
		
	
		
			
				
					|  |  |  |  | // به اررور های ابی رنگ کلاس هایی دادم که اخرش با 1 تمام میشود | 
			
		
	
		
			
				
					|  |  |  |  | // * به اررور های ابی رنگ کلاس هایی دادم که اخرش با 1 تمام میشود | 
			
		
	
		
			
				
					|  |  |  |  | //  TODO باکس اول از سمت راست در فایل پی اس دی | 
			
		
	
		
			
				
					|  |  |  |  | //  ? تایتل | 
			
		
	
		
			
				
					|  |  |  |  | .title-error-1 { | 
			
		
	
		
			
				
					|  |  |  |  |   color: $lightBlue !important; | 
			
		
	
		
			
				
					|  |  |  |  |   background-color: $headerBgClr !important; | 
			
		
	
		
			
				
					|  |  |  |  |   background-color: $blueTitleBgColor !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | .eroorr:focus { | 
			
		
	
		
			
				
					|  |  |  |  |   outline: none !important; | 
			
		
	
		
			
				
					|  |  |  |  |   box-shadow: 0px 0px 0px black !important; | 
			
		
	
		
			
				
					|  |  |  |  |   border: 0px !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | /* ? دکمه ضربدر بالا سمت چپ */ | 
			
		
	
		
			
				
					|  |  |  |  | // * دکمه ضربدر بالا سمت چپ | 
			
		
	
		
			
				
					|  |  |  |  | .close-button-1 { | 
			
		
	
		
			
				
					|  |  |  |  |   background-color: $lightBlue !important; | 
			
		
	
		
			
				
					|  |  |  |  |   color: $white !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | /* ?  هاور دکمه ضربدر بالا سمت چپ */ | 
			
		
	
		
			
				
					|  |  |  |  | // * هاور دکمه ضربدر بالا سمت چپ | 
			
		
	
		
			
				
					|  |  |  |  | .close-button-1:hover { | 
			
		
	
		
			
				
					|  |  |  |  |   background-color: var(--white) !important; | 
			
		
	
		
			
				
					|  |  |  |  |   background-color: $white !important; | 
			
		
	
		
			
				
					|  |  |  |  |   color: $lightBlue !important; | 
			
		
	
		
			
				
					|  |  |  |  |   border: solid 2px $lightBlue !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | /* ? کانفرم باتن */ | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | // * کانفرم باتن | 
			
		
	
		
			
				
					|  |  |  |  | .confirm-button-1 { | 
			
		
	
		
			
				
					|  |  |  |  |   background-color: var(--white) !important; | 
			
		
	
		
			
				
					|  |  |  |  |   border: solid 2px var(--error-color1) !important; | 
			
		
	
		
			
				
					|  |  |  |  |   color: var(--error-color1) !important; | 
			
		
	
		
			
				
					|  |  |  |  |   text-align: left !important; | 
			
		
	
		
			
				
					|  |  |  |  |   background-color: $confirmBtnBgColor !important; | 
			
		
	
		
			
				
					|  |  |  |  |   border: solid 1px $lightBlue !important; | 
			
		
	
		
			
				
					|  |  |  |  |   color: $lightBlue !important; | 
			
		
	
		
			
				
					|  |  |  |  |   // | 
			
		
	
		
			
				
					|  |  |  |  |   position: absolute !important; | 
			
		
	
		
			
				
					|  |  |  |  |   left: 20px !important; | 
			
		
	
		
			
				
					|  |  |  |  |   margin-bottom: 33px !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | /* ? هاور کانفرم باتن */ | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | // * هاور کانفرم باتن | 
			
		
	
		
			
				
					|  |  |  |  | .confirm-button-1:hover { | 
			
		
	
		
			
				
					|  |  |  |  |   background-color: var(--error-color1) !important; | 
			
		
	
		
			
				
					|  |  |  |  |   color: var(--white) !important; | 
			
		
	
		
			
				
					|  |  |  |  |   background-color: $lightBlue !important; | 
			
		
	
		
			
				
					|  |  |  |  |   color: $white !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | /* !error 2 */ | 
			
		
	
		
			
				
					|  |  |  |  | /* ? کنسل باتن */ | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | // ? error 2 lightBlue | 
			
		
	
		
			
				
					|  |  |  |  | // TODO کنسل باتن | 
			
		
	
		
			
				
					|  |  |  |  | .cancle-button1 { | 
			
		
	
		
			
				
					|  |  |  |  |   background-color: var(--error-color1) !important; | 
			
		
	
		
			
				
					|  |  |  |  |   color: var(--white) !important; | 
			
		
	
		
			
				
					|  |  |  |  |   border: solid 2px var(--error-color1) !important; | 
			
		
	
		
			
				
					|  |  |  |  |   background-color: $lightBlue !important; | 
			
		
	
		
			
				
					|  |  |  |  |   color: $white !important; | 
			
		
	
		
			
				
					|  |  |  |  |   border: solid 1px $lightBlue !important; | 
			
		
	
		
			
				
					|  |  |  |  |   // | 
			
		
	
		
			
				
					|  |  |  |  |   position: absolute !important; | 
			
		
	
		
			
				
					|  |  |  |  |   left: 33% !important; | 
			
		
	
		
			
				
					|  |  |  |  |   margin-bottom: 33px !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | /* ? هاور کنسل باتن */ | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | // TODO هاور کنسل باتن | 
			
		
	
		
			
				
					|  |  |  |  | .cancle-button1:hover { | 
			
		
	
		
			
				
					|  |  |  |  |   background-color: var(--white) !important; | 
			
		
	
		
			
				
					|  |  |  |  |   color: var(--error-color1) !important; | 
			
		
	
		
			
				
					|  |  |  |  |   background: $white !important; | 
			
		
	
		
			
				
					|  |  |  |  |   color: $lightBlue !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | /* !error3 */ | 
			
		
	
		
			
				
					|  |  |  |  | /* ? تایتل */ | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | // ? error3 | 
			
		
	
		
			
				
					|  |  |  |  | // TODO تایتل | 
			
		
	
		
			
				
					|  |  |  |  | .title-error-2 { | 
			
		
	
		
			
				
					|  |  |  |  |   color: var(--error-color2) !important; | 
			
		
	
		
			
				
					|  |  |  |  |   color: $darkGreen !important; | 
			
		
	
		
			
				
					|  |  |  |  |   background-color: $greenTitleBgColor !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | /* ? دکمه ضربدر بالا سمت چپ */ | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | // * دکمه ضربدر بالا سمت چپ | 
			
		
	
		
			
				
					|  |  |  |  | .close-button-2 { | 
			
		
	
		
			
				
					|  |  |  |  |   background-color: var(--error-color2) !important; | 
			
		
	
		
			
				
					|  |  |  |  |   color: var(--white) !important; | 
			
		
	
		
			
				
					|  |  |  |  |   background-color: $lightGreen !important; | 
			
		
	
		
			
				
					|  |  |  |  |   color: $white !important; | 
			
		
	
		
			
				
					|  |  |  |  | } | 
			
		
	
		
			
				
					|  |  |  |  | /* ?  هاور دکمه ضربدر بالا سمت چپ */ | 
			
		
	
		
			
				
					|  |  |  |  | .close-button-2:hover { | 
			
		
	
	
		
			
				
					|  |  |  | 
 |