@font-face {
  font-family: Yekan Bakh;
  src:
    url("../fonts/YekanBakh-Fa-En06Bold.eot"),
    url("../fonts/YekanBakh-Fa-En06Bold.woff") format("woff"),
    url("../fonts/YekanBakh-Fa-En06Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: Yekan Bakh;
  src:
    url("../fonts/YekanBakh-Fa-En07Heavy.eot"),
    url("../fonts/YekanBakh-Fa-En07Heavy.woff") format("woff"),
    url("../fonts/YekanBakh-Fa-En07Heavy.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: Yekan Bakh;
  src:
    url("../fonts/YekanBakh-Fa-En04Regular.eot"),
    url("../fonts/YekanBakh-Fa-En04Regular.woff") format("woff"),
    url("../fonts/YekanBakh-Fa-En04Regular.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: Yekan Bakh;
  src:
    url("../fonts/YekanBakh-Fa-En05Medium.eot"),
    url("../fonts/YekanBakh-Fa-En05Medium.woff") format("woff"),
    url("../fonts/YekanBakh-Fa-En05Medium.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: Yekan Bakh;
  src:
    url("../fonts/YekanBakh-Fa-En03Light.eot"),
    url("../fonts/YekanBakh-Fa-En03Light.woff") format("woff"),
    url("../fonts/YekanBakh-Fa-En03Light.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
}
@font-face {
  font-family: Yekan Bakh;
  src:
    url("../fonts/YekanBakh-FaNum06Bold.eot"),
    url("../fonts/YekanBakh-FaNum06Bold.woff") format("woff"),
    url("../fonts/YekanBakh-FaNum06Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: Yekan Bakh;
  src:
    url("../fonts/YekanBakh-FaNum07Heavy.eot"),
    url("../fonts/YekanBakh-FaNum07Heavy.woff") format("woff"),
    url("../fonts/YekanBakh-FaNum07Heavy.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: Yekan Bakh;
  src:
    url("../fonts/YekanBakh-FaNum04Regular.eot"),
    url("../fonts/YekanBakh-FaNum04Regular.woff") format("woff"),
    url("../fonts/YekanBakh-FaNum04Regular.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: Yekan Bakh;
  src:
    url("../fonts/YekanBakh-FaNum05Medium.eot"),
    url("../fonts/YekanBakh-FaNum05Medium.woff") format("woff"),
    url("../fonts/YekanBakh-FaNum05Medium.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: Yekan Bakh;
  src:
    url("../fonts/YekanBakh-FaNum03Light.eot"),
    url("../fonts/YekanBakh-FaNum03Light.woff") format("woff"),
    url("../fonts/YekanBakh-FaNum03Light.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
}

@font-face {
  font-family: Roboto;
  src: url("../fonts/Roboto-Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: Roboto;
  src: url("../fonts/Roboto-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: Roboto;
  src: url("../fonts/Roboto-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: Roboto;
  src: url("../fonts/Roboto-Light.ttf") format("truetype");
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: Roboto;
  src: url("../fonts/Roboto-Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
}

@font-face {
  font-family: Almarai;
  src: url("../fonts/Almarai-Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: Almarai;
  src: url("../fonts/Almarai-ExtraBold.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: Almarai;
  src: url("../fonts/Almarai-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: Almarai;
  src: url("../fonts/Almarai-Light.ttf") format("truetype");
  font-weight: light;
  font-style: normal;
}

.FA_language {
  font-family:
    Yekan Bakh,
    "Font Awesome 5 Free",
    Roboto,
    Almarai !important;
}
.EN_language {
  font-family:
    Roboto,
    "Font Awesome 5 Free",
    Yekan Bakh,
    Almarai !important;
  direction: ltr !important;
}
.AR_language {
  font-family:
    Almarai,
    "Font Awesome 5 Free",
    Yekan Bakh,
    Roboto !important;
}

.container {
  text-align: center;
}
.content {
  padding-top: 50px !important;
  margin-top: 0 !important;
}
.main-header.navbar.navbar-expand.navbar-white.navbar-light {
  display: flex;
  gap: 10px;
}
.main-header ul.navbar-nav {
  flex-grow: 1;
  font-weight: bold;
}
#header_nav .navbar-nav .nav-link {
  color: #212529;
}
#header_nav .navbar-nav .nav-link:hover {
  color: #6100ff;
}
.main-sidebar {
  position: fixed !important;
}
.EN_language .main-sidebar {
  text-align: left;
}
.AR_language .main-sidebar,
.EN_language .main-sidebar {
  font-size: 0.92rem;
}
.EN_language .main-sidebar .fas.fa-angle-left {
  left: auto;
  right: 1rem;
  rotate: 180deg;
}
.main-sidebar .brand-link {
  text-align: center;
  padding: 4px;
}
.layout-navbar-fixed.layout-fixed .wrapper .sidebar {
  margin-top: calc(3.5rem + 5px);
}
.dropdown-toggle,
#businessList .dropdown-item {
  white-space: nowrap;
  padding: 4px 5px;
  color: #343a40;
  display: flex;
  align-items: center;
  gap: 5px;
  margin: auto;
  justify-content: space-around;
  width: 100%;
  line-height: 1;
  cursor: pointer;
}
#languages-menue .dropdown-toggle {
  line-height: unset;
}
.EN_language #Dropdown,
.AR_language #Dropdown {
  align-items: baseline;
}
.dropdown-menu.show {
  display: block;
  font-size: 14px;
  border: none;
  background-color: #f9fafb;
  border-radius: 8px;
  padding: 5px;
  margin-top: 10px;
  left: 0 !important;
  width: 100%;
}
.EN_language .dropdown-menu.show {
  text-align: left;
  right: 0;
  left: unset !important;
}
.navDropDowns .dropdown:hover {
  border-color: #6100ff;
}
.dropdown-toggle:hover {
  text-decoration: none;
  color: black;
}
#right-befor::before {
  float: right !important;
}
.main-sidebar .nav-sidebar .nav-item .nav-link.active {
  background-color: #dee2e6;
  color: #212529;
}
.EN_language .main-sidebar .nav-sidebar .nav-item .nav-link {
  direction: ltr !important;
}

.customLTR {
  text-align: left !important;
  direction: ltr !important;
}

.form-group {
  position: relative;
}
.input-group label.error,
.form-group label.error {
  background: #dc3545;
  width: 100%;
  text-align: center;
  max-width: 175px;
  border-radius: 5px !important;
  color: white;
  font-weight: normal;
  font-size: 14px;
  padding: 3px 0;
  margin-top: 2px;
  box-shadow: 0 0 3px 0 #000000bd;
  position: absolute;
}
#productImg {
  max-width: 120px;
  border-radius: 8px;
  box-shadow: rgb(149 157 165 / 66%) 0px 8px 24px;
}
#shopImg {
  max-width: 100px;
  border-radius: 8px;
  box-shadow: rgb(149 157 165 / 66%) 0px 8px 24px;
}
.removeProductImage {
  width: 50% !important;
  margin: 0 auto !important;
  text-align: right !important;
}
/* #shopForm label.error {
  background: #dc3545;
  width: 100%;
  text-align: center;
  max-width: 175px;
  border-radius: 5px;
  color: white;
  font-weight: normal;
  font-size: 14px;
  padding: 3px 0;
  margin-top: 2px;
  box-shadow: 0 0 3px 0 #000000bd;
  position: absolute;
} */
#userForm .profileInfo {
  display: inline-block;
  margin-inline: 10px;
}
.FA_language .input-group input::placeholder,
.AR_language .input-group input::placeholder {
  text-align: right;
}
/* Chrome, Edge, Safari */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}
.login-page,
.register-page {
  background: linear-gradient(
    135deg,
    rgb(50 57 80 / 25%),
    rgb(137 126 121 / 19%)
  );
}
.login-page .card,
.register-page .card {
  background: linear-gradient(135deg, #e9ecef, #ffffffde);
}
#registerationForm::before {
  content: "";
  position: absolute;
  top: -2px;
  left: 0;
  height: 2px;
  width: 100%;
  background: linear-gradient(to right, #35c3c1, #00d6b7);
  /* background: linear-gradient(to right, #07baa9, #1a92bb); */
}
#loginForm::before {
  content: "";
  position: absolute;
  top: -2px;
  left: 0;
  height: 2px;
  width: 100%;
  background: linear-gradient(to right, #35c3c1, #00d6b7);
  /* background: linear-gradient(to right, #9a73ff, #7c3bff);; */
}
#loginForm .input-group.mb-3 {
  margin-block: 30px !important;
}
.login-box-msg {
  padding: 0 !important;
  font-size: 16px;
}
#registerationForm .btn.btn-block.btn-flat,
.login-card-body .btn.btn-block.btn-flat {
  background: linear-gradient(to right, #35c3c1, #00d6b7);
  /* background: linear-gradient(to right, #9a73ff, #7c3bff); */
  border: 0;
  color: #fff;
  cursor: pointer;
  border-radius: 5px;
}

#registerationForm .btn.btn-block.btn-flat:hover,
.login-card-body .btn.btn-block.btn-flat:hover {
  background: linear-gradient(to right, #279b99, #00957f);
  transition: all 0.5s;
}
#registerationForm .input-group input,
#loginForm .input-group input {
  border-radius: 0.25rem;
}
.login-card-body .input-group .form-control,
.register-card-body .input-group .form-control {
  border-right: 1px solid #ced4da;
}
.login-card-body .input-group .input-group-text,
.register-card-body .input-group .input-group-text {
  border-left: 1px solid #ced4da;
  border-radius: 5px;
}
.EN_language .login-card-body .input-group,
.EN_language .register-card-body .input-group,
.EN_language input,
.EN_language select,
.EN_language textarea {
  direction: ltr !important;
  text-align: left;
}

input:is(
  [type="password"],
  [type="email"],
  [type="number"],
  [name="username"],
  [name="phone"],
  [name="otpCode"]
) {
  direction: ltr !important;
}

#registerationForm a,
.login-card-body a {
  color: #17a2b8;
  font-size: 14px;
  font-weight: 400;
  display: block;
  margin-bottom: 5px;
}
#registerationForm a:hover,
.login-card-body a:hover {
  color: #0a7383;
  text-decoration: none;
}
.login-card-body,
.register-card-body {
  background-color: transparent !important;
}
.login_bottom_fix {
  padding: 0;
  display: flex;
  justify-content: space-between;
  margin-top: 1rem;
  text-align: center;
  align-items: center;
}
.login_bottom_fix p {
  margin-bottom: 0;
}
.login_bottom_fix p:first-child {
  border-left: 1px solid #ced4da;
  width: 50%;
  text-align: right;
}
.EN_language .login_bottom_fix p:first-child {
  border-left: none;
  border-right: 1px solid #ced4da;
  text-align: left;
}

#profile-edit-pass {
  width: 100%;
  margin-right: auto;
  margin-bottom: 0 !important;
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
  --bs-table-accent-bg: unset;
}
table {
  width: 100% !important;
}
.table.table-bordered.dataTable th,
table.table-bordered.dataTable td {
  border-left-width: 1px;
}
.text-right {
  text-align: center !important;
}
.productListTable .btn-info,
.productListTable .btn-danger {
  color: white !important;
}
.custom-product-form {
  margin: auto;
}
#productForm .card-body-top-fix {
  display: grid;
  grid-template-columns: 2fr 2fr 1fr;
  gap: 10px;
}
.custom-product-form #userForm .form-group,
#adminForm .form-group {
  margin: 15px 10px;
  padding: 5px;
  vertical-align: top;
}
.EN_language .custom-product-form #userForm .form-group,
.EN_language #adminForm .form-group {
  direction: ltr !important;
}
.EN_language .custom-product-form #userForm .form-group label,
.EN_language #adminForm .form-group label {
  direction: ltr !important;
}
.EN_language #productForm .card-body-top-fix,
.EN_language #userForm .card-body-top-fix,
.EN_language #adminForm .card-body,
.EN_language #shopForm .card-body-top-fix {
  text-align: left;
}
#shopForm .card-body-top-fix {
  align-items: center;
  padding: 10px 15px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 10%;
}
#shopForm .form-group label {
  display: block;
}
#shopForm .form-group .custom-control-label {
  cursor: pointer;
}
.EN_language .form-group .custom-control-label {
  direction: ltr !important;
}
#shopForm .form-group .custom-control.custom-radio {
  display: inline-block;
}
.progress-bar-striped.data-loader {
  background: linear-gradient(90deg, #00000087 30%, #00000026 50%, #0000 60%)
    #f8f9fa;
  animation-name: loaderAnimation;
  animation-duration: 2s;
  animation-iteration-count: infinite;
}
.variationProduct {
  position: relative;
}
.add-var-product {
  cursor: pointer;
  color: green;
  font-size: 19px;
  padding: 6px 4px 1px 5px;
  border-radius: 7px;
  background: #ededed;
  margin-right: 7px;
}
.add-var-product:hover {
  color: #007bff;
}
.variationProduct .fa-minus-square.remove-var-product {
  position: absolute;
  top: 64px;
  font-size: 19px;
  cursor: pointer;
  color: #c51f1f;
  right: -6px;
}
.variationProduct .fa-minus-square.remove-var-product:hover {
  color: #007bff;
}
.var-product-actions {
  position: relative;
}
.HproductImage {
  text-align: center;
}
.HproductImage img {
  width: 50px;
}
.project-actions {
  display: flex;
  justify-content: space-evenly;
  border-bottom: none !important;
  gap: 5px;
}
#shop-table .shopActionTable {
  padding: 16px 10px;
}
#shopIndexTable img {
  width: 50px;
}
.add-shop #business_type {
  display: inline-block;
  margin-top: auto;
}
.add-shop #businessStatus {
  display: inline-block;
}
#package-select .form-control {
  appearance: auto !important;
  -webkit-appearance: auto !important;
  /* width: 70%; */
}
.sidebar .nav-treeview {
  display: none;
  background-color: #494e53 !important;
  margin: 5px;
  border-radius: 5px;
  font-size: 14px;
  padding-left: 0 !important;
}
.sidebar .nav-treeview .nav-item i.far.fa-circle.nav-icon {
  font-size: 12px;
}
.main-sidebar.elevation-4 img {
  width: 75%;
  transition: 0.3s;
  position: relative;
  left: 0;
}
.sidebar-collapse .main-sidebar.elevation-4 img {
  left: 150px;
  transition: 0.3s;
}
.EN_language.sidebar-collapse .main-sidebar.elevation-4 img {
  left: -25px;
  transition: 0.3s;
}
.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused,
.sidebar-mini.sidebar-collapse .main-sidebar:hover img {
  left: 0;
  transition: 0.3s;
}
.main-footer {
  background-color: #2a0369;
  padding: 10px;
  margin-bottom: 0px;
}
.footer-bottom {
  width: 100%;
  text-align: center;
}
.footer-bottom p {
  color: #f2eff5;
  font-size: 14px;
  font-weight: 300;
  white-space: nowrap;
  margin: 10px 0 8px !important;
  word-spacing: 1px;
}
.dataTables_length label,
.dataTables_filter label {
  font-weight: 400 !important;
}
.packages {
  margin: 10px 0;
}
.package_type {
  padding: 40px 0;
  width: 100%;
  max-width: 1200px;
  margin: auto;
}
.package_type p {
  margin: 18px 2px;
}
.package_tariffs {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 30px;
  align-items: center;
}
.package_items.items {
  box-shadow: rgb(237 226 255) 2px 5px 35px -5px;
  background:
    linear-gradient(white, white) padding-box,
    linear-gradient(120deg, #f4ecff, #ebdfff) border-box;
  border-radius: 8px;
  border: 1px solid transparent;
  margin: 8px;
  width: 30%;
  padding: 22px;
  position: relative;
  height: fit-content;
}
.buy_btn {
  padding: 10px;
  width: 50%;
  border-radius: 8px;
  background-color: #6100ff;
  border: #9553ff 1px solid;
  font-size: 20px;
  color: white;
  margin-bottom: 15px;
}
.buy_btn:hover {
  background-color: #9553ff;
}
.package_name {
  font-size: 22px;
  font-weight: bold;
}
.product_number {
  font-size: 22px !important;
  display: inline-block;
}
.product,
.upto {
  font-size: 17px;
}
.price_num {
  font-size: 30px !important;
  color: #6207ff !important;
}
.package_price p {
  display: inline-block;
  font-size: 22px;
  margin: auto 0 20px 4px;
  color: #3a098a;
}
.EN_language .package_price {
  direction: ltr !important;
}
.package_items.selected {
  background:
    linear-gradient(to bottom, white, #bbfff2) padding-box,
    linear-gradient(to bottom, #e9fbfb, #23f2cb) border-box;
  overflow: hidden;
}
.package_items.selected .price_num {
  color: #00b48f !important;
}
.package_items.selected .package_price p {
  color: #007760;
}
#modal_body {
  white-space: pre-wrap;
}
.card-title {
  float: right;
  font-size: 18px;
  padding: 0 !important;
  margin: 3px 0 !important;
}
.EN_language .card-title {
  position: relative;
  bottom: 2px;
}
#active-package .alert {
  font-size: 15px;
}
.EN_language #active-package .alert {
  text-align: left;
  direction: ltr !important;
}
.alert.no-package {
  background-color: #ffedc2;
  color: #e8a11d;
}
#active-package .alert i {
  margin-left: 5px;
}
.alert.has-package {
  background-color: #d6f5db;
  color: #486f4e;
}
.active-banner {
  position: absolute;
  top: -7px;
  left: -33px;
  width: 0;
  height: 0;
  border-left: 50px solid transparent;
  border-right: 50px solid transparent;
  border-bottom: 50px solid #00b895;
  transform: rotate(315deg);
}
.active-banner span {
  position: absolute;
  transform: translate(50%, 100%);
  color: white;
  font-size: 15px;
}
.EN_language .active-banner span {
  transform: translate(-50%, 100%);
}

.percent p {
  white-space: nowrap;
  font-size: 13.5px;
  margin: 0;
}
.EN_language .percent p {
  direction: ltr !important;
}
.progressBar {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.percent {
  position: relative;
  margin-top: -30px;
}

.percent svg {
  position: relative;
  width: 100%;
  transform: rotate(-90deg);
}

.percent svg circle {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: white;
  stroke-width: 10;
  stroke-linecap: round;
}

.percent svg circle:last-of-type {
  stroke-dasharray: 625px;
  stroke-dashoffset: calc(625px - (625px * var(--percent)) / 100);
  stroke: #00b895;
}
.percent:nth-child(1) svg circle:last-of-type {
  stroke: #ff9b3e;
}

.dataTables_length label,
.dataTables_filter label {
  width: 50%;
}

#userForm .card-body,
#adminForm .card-body {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.EN_language #userForm .card-body {
  text-align: left;
}
#shop-table .shopActionTable,
#HproductActions {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 1px;
}
#product_action {
  max-width: 180px;
}
.table td {
  vertical-align: middle;
}
.dataTable .custom-switch {
  padding-left: 0;
}
.toggle_pass {
  padding-left: 10px;
  position: relative;
  left: 5px;
}
.toggle_pass::after {
  content: "";
  display: inline-block;
  width: 2px;
  height: 36px;
  position: absolute;
  background-color: #ced4da;
  top: -10px;
  bottom: 0;
  right: 25px;
}
.EN_language .toggle_pass {
  padding-right: 10px;
  position: relative;
  right: 12px;
  order: 2;
}
.EN_language .toggle_pass::after {
  content: "";
  display: inline-block;
  width: 2px;
  height: 36px;
  position: absolute;
  background-color: #ced4da;
  top: -10px;
  bottom: 0;
  left: 0;
  right: 0px;
}
.row {
  margin-inline: 0;
}
.reset-pass.login-page {
  background: linear-gradient(
    135deg,
    rgb(50 57 80 / 0%),
    rgb(137 126 121 / 11%)
  );
}
.add-shop #shopImg {
  max-width: 110px;
  border-radius: 8px;
  box-shadow: rgb(149 157 165 / 35%) 0px 8px 24px;
  border: 1px solid #dcdcdc6b;
  padding: 12px;
}
.add-product #productImg {
  max-width: 110px;
  border-radius: 8px;
  box-shadow: rgb(149 157 165 / 35%) 0px 8px 24px;
  border: 1px solid #dcdcdc6b;
  padding: 12px;
}

a:not([href]):not([tabindex]) {
  color: white;
}

.first-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  padding: 15px;
  padding-top: 30px;
  text-align: right;
}
.first-row-box {
  padding: 10px 20px;
  margin: 0;
  background-color: white;
  border-radius: 8px;
}
.box-title h5,
.reports-title h5,
.reports-description h6 {
  font-weight: bold;
}
.first-inner-box .first-inner {
  display: flex;
  gap: 15px;
  border-bottom: 2px solid #e6e6e6;
  padding-bottom: 15px;
  padding-top: 5px;
}
.first-row-box-footer {
  color: #4b218c;
  font-weight: bold;
  display: flex;
  align-items: center;
  margin: 20px 0 5px;
  justify-content: flex-end;
  gap: 8px;
}
.first-row-box-footer p,
.second-row-box-footer p,
.third-row-box-footer p {
  margin-bottom: 0 !important;
}
.first-inner-box .first-inner .box-title p,
.reports-description p {
  margin-bottom: 8px !important;
  color: #757575;
  white-space: nowrap;
}
.first-inner-box .first-inner .box-image {
  background-color: #f1e7ff;
  width: 60px;
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 5px;
}
.first-row-box-footer:hover {
  text-decoration: none;
  color: #6100ff9e;
}
.second-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  padding: 15px;
  text-align: right;
}
.second-row-box {
  padding: 10px 20px;
  margin: 0;
  background-color: white;
  border-radius: 8px;
}
.reports-title {
  border-bottom: 2px solid #e7e7e7;
  padding-block: 15px;
}
.reports-percent,
.reports-description {
  position: relative;
  left: 25%;
}
.reports-percent svg {
  position: relative;
  width: 100%;
  transform: rotate(-90deg);
  overflow: visible;
}
.reports-percent svg circle {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: #e9e9e9;
  stroke-width: 13px;
  stroke-linecap: round;
  cx: 50%;
  cy: 50%;
  position: absolute;
}
.product-progress .reports-percent svg circle:last-of-type {
  stroke-dasharray: 625px;
  stroke-dashoffset: calc(625px - (625px * var(--percent)) / 200);
  stroke: #ff9b3e;
}
.creditTime-progress .reports-percent svg circle:last-of-type {
  stroke-dasharray: 625px;
  stroke-dashoffset: calc(625px - (625px * var(--percent)) / 200);
  stroke: #00b895;
}
.second-inner,
.third-inner {
  display: flex;
  align-items: center;
  margin-top: 10px;
  border-bottom: 2px solid #e6e6e6;
  padding-bottom: 10px;
  justify-content: center;
}
.second-inner:not(.second-analys) {
  justify-content: space-between;
}
.analysis-report-box .second-inner img {
  margin-block: 5px;
}
.second-row-box-footer,
.third-row-box-footer {
  display: flex;
  align-items: flex-start;
  gap: 5px;
  margin: 20px 0 10px;
}
.second-row-box-footer .totall-number {
  color: #757575;
}
.second-row-box-footer .totall-number ~ p {
  font-weight: bold;
}
.second-inner .reports-progress {
  display: flex;
  justify-content: center;
  align-items: center;
}
.third-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  padding: 15px;
  text-align: right;
  padding-bottom: 65px;
}
.third-row-box {
  padding: 10px 20px;
  margin: 0;
  background-color: white;
  border-radius: 8px;
}
.disable-box-text {
  color: #8d8d8d;
}

.EN_language .reports-percent,
.EN_language .reports-description {
  left: 0;
}
.EN_language .homePage .row {
  text-align: left;
}
.EN_language .first-inner-box .first-inner {
  flex-direction: row;
}
.EN_language .homePage .row .row-box-footer,
.EN_language .homePage .row .row-box-footer p,
.EN_language .box-title h5 {
  direction: ltr !important;
}
/* .EN_language .reports-description h6 {
  text-align: right;
} */
.EN_language .homePage .row .row-box-footer .fa-chevron-left {
  transform: rotate(180deg);
}

#businessList {
  width: 150px;
}
#businessList img {
  max-height: 30px;
  /* max-width: max(50px , 25%); */
  max-width: 50px;
}
#businessList p {
  margin: 0;
  padding-block: 5px;
  max-width: 75%;
  /* max-width: 100px; */
}
#businessList i {
  width: 5%;
}
.navDropDowns {
  display: flex;
  align-items: stretch;
  gap: 15px;
  font-size: 15px;
  min-height: 30px;
}
.navDropDowns .dropdown {
  border: 1px solid gainsboro;
  border-radius: 8px;
  display: flex;
  align-items: center;
}
.dropdown-menu.show li:not(:last-child) {
  border-bottom: 1px solid gainsboro;
}
.dropdown-menu.show li {
  padding-block: 5px;
}
.dropdown-menu.show li a:hover {
  background-color: #f0f0f0;
}
#businessList .dropdown-item:active {
  background-color: #f9fafb;
  color: #6100ff;
}

a:not([href]):not([tabindex]):focus,
a:not([href]):not([tabindex]):hover {
  color: #b1b1b1fc;
}

.btn.customer-btn,
#edit_btn,
#edit_pass {
  background-color: #6100ff;
  color: white;
  margin-inline: 5px;
}
.btn.customer-btn:hover,
#edit_btn:hover,
#edit_pass:hover {
  background-color: #9553ff;
}

.EN_language .table .custom-control .custom-control-label::before,
.EN_language .custom-control .table .custom-control-label::after {
  right: 0;
  left: 0;
}
.EN_language
  .table
  .custom-switch.custom-switch-off-danger
  .custom-control-input
  ~ .custom-control-label::after {
  transform: translateX(0);
  left: 0;
  right: 0;
}
.EN_language
  .table
  .custom-switch
  .custom-control-input:checked
  ~ .custom-control-label::after {
  transform: translateX(0.75rem);
  left: 0;
  right: 0;
}
#contactUsModal .modal-content {
  padding: 20px 30px 5px;
  border-color: #cdc8d2;
  text-align: center;
  background-color: #fbf9ff;
  position: relative;
  overflow: hidden;
  color: #212529;
}
#contactUsModal .modal-content::before,
#contactUsModal .modal-content::after {
  content: "";
  position: absolute;
  width: 700px;
  height: 700px;
  background: url("/images/Shadow.svg") no-repeat center;
  background-size: 100%;
  z-index: 1;
}
#contactUsModal .modal-content::before {
  top: -100%;
  right: -50%;
}
#contactUsModal .modal-content::after {
  bottom: -100%;
  left: -50%;
}
#contactUsModal .modal-header {
  border: none;
  position: relative;
  padding: 10px;
  z-index: 2;
}
#contactUsModal .modal-header .close span {
  font-weight: 300;
  color: black;
  opacity: 1;
  font-size: 45px;
  position: absolute;
  top: -10px;
  left: 0;
  margin: 0;
}
#contactUsModal .modal-header .close span:hover {
  opacity: 0.5;
}
#contactUsModal .modal-dialog.modal-dialog-centered {
  max-width: 580px;
}
#contactUsModal #contactUs_title p {
  margin-block: 2rem;
}
.EN_language #contactUsModal #contactUs_title p {
  direction: ltr !important;
}
#contactUsModal #contactUs_ways {
  margin-bottom: 5px;
  position: relative;
  display: flex;
  justify-content: space-between;
  padding: 0 15px;
  align-items: center;
}
#contactUsModal .contactUs-items h6 {
  margin: 15px 0 4px;
  color: #472381;
  font-size: 16px;
  font-weight: bold;
}
#contactUsModal .contactUs-items p {
  font-size: 15px;
  font-weight: bold;
}
#contactUsModal #contactUs_links {
  display: flex;
  justify-content: center;
  gap: 10px;
}
#contactUsModal #contactUs_links img {
  width: 100%;
}
#contactUsModal #contactUs_links img:hover,
#qrcodeLink #share_links img:hover {
  transform: scale(1.3);
  filter: opacity(0.5);
}
#qrcode {
  display: flex;
  justify-content: center;
}
#contactUsModal .contactUs-items:first-child::after {
  content: "";
  display: block;
  width: 2px;
  height: 80%;
  background-color: #efeeff;
  position: absolute;
  top: -5px;
  right: 50%;
}
.EN_language .responsiveTable .row:first-child {
  text-align: left;
}
.login-box .dropdown,
.register-box .dropdown {
  width: 100px;
  border: solid 1px #bbbbbd;
  border-radius: 5px;
  background: #f5f6f7;
  display: inline-block;
}
.login-box .dropdown-toggle,
.register-box .dropdown-toggle {
  justify-content: center;
}
.back_btn {
  display: flex;
  align-items: center;
  float: left;
  padding: 5px;
  font-size: 0.84rem;
  border: solid 1px #bbbbbd;
  border-radius: 5px;
  background: #f5f6f7;
  color: #212529;
}
.back_btn .fa.fa-angle-left {
  margin-right: 5px;
  font-size: 12px;
}
.back_btn:hover,
.login-box .dropdown:hover,
.register-box .dropdown:hover {
  text-decoration: none;
  border-color: #0a7383;
}
.EN_language .back_btn .fa.fa-angle-left {
  margin-right: 0;
  margin-left: 5px;
  rotate: 180deg;
}
.add_items_table {
  float: left;
  position: relative;
  background: #00b895;
  font-size: 0.9rem;
  padding: 5px 10px;
  border-radius: 0.2rem;
  margin-top: -2px;
  color: white;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
}
.add_items_table i {
  position: relative;
  /* top: 2px;
  left: 4px; */
  font-size: 0.8rem;
}
.EN_language .add_items_table {
  direction: ltr !important;
}
.add_items_table a:hover {
  text-decoration: none;
}
.add_items_table:hover,
.add_items_table.disabled {
  background: #adb5bdc7;
}
.add_items_table.disabled,
.add_items_table.disabled a {
  cursor: default;
}
.FA_language .first-row #dashboardBusinessList i,
.FA_language .first-row #dashboardEditProfile i {
  position: relative;
  top: -2px;
}
#reset_password .modal-dialog {
  width: 400px;
  margin: auto;
  right: 100px;
}
.login-box,
.register-box {
  width: 450px;
}
.register-box {
  top: 0;
}
.navDropDowns .dropdown-toggle::after {
  display: none;
}
.navDropDowns .fa.fa-angle-down {
  font-size: 12px;
}
.FA_language #languages-menue .fa-globe {
  margin-top: -2px;
}
.required-star {
  float: right;
  margin-inline: 5px;
}
.EN_language .required-star {
  float: left;
}
.custom-control-input:checked ~ .custom-control-label::before {
  color: #fff;
  border-color: #6100ff;
  background-color: #6100ff;
}
.row-box-footer i,
td.shopPackage {
  font-size: 14px;
}
.responsiveTable,
.add_items_table {
  font-size: 15px;
}
.dataTables_info {
  word-spacing: 2px;
  font-size: 14px;
}
.pagination {
  font-size: 13px;
}
.HproductImgType {
  font-family: "Roboto";
}
.callout.callout-info {
  border-left: none;
  color: rgb(42 3 105);
  border-radius: 0.25rem;
  box-shadow: 0px 0px 1px 0px rgb(149, 58, 237) !important;
  background-color: rgb(246, 242, 255);
  border-right: 6px solid rgb(97 0 255) !important;
  margin: 0 5px !important;
  padding: 1rem;
  position: relative;
  top: 15px;
  font-size: 15px;
}
.EN_language .callout.callout-info {
  border-right: none !important;
  border-left: 6px solid rgb(97 0 255) !important;
}
.EN_language #alert_text {
  direction: ltr !important;
  text-align: left;
}
#FA_footer a {
  color: #bc92ff;
  text-decoration: none;
}
.package-description {
  display: flex;
  flex-flow: column;
  gap: 10px;
  margin: auto;
  margin-bottom: 50px;
  max-width: fit-content;
  align-items: flex-start;
  font-size: 14px;
}
.EN_language .package-description,
.EN_language .package_type p {
  direction: ltr !important;
}
.package-description p::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  background-color: #6100ff;
  margin-top: 10px;
  border-radius: 50%;
  margin-inline: 10px;
}
.qrcode-link {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  justify-content: space-around;
  gap: 0 20px;
}
.project-actions .btn {
  display: flex;
  width: 30px;
  height: 30px;
  align-items: center;
  justify-content: center;
}
#qrcodeLink .modal-body {
  display: flex;
  flex-flow: column;
  align-items: center;
  gap: 30px;
}
#copyLink {
  border: 1px solid #6100ff;
  padding: 5px 25px;
}
#copyLink:hover {
  background-color: #b080ff;
  color: white;
}
#productLink {
  resize: none;
  text-align: left;
  font-family: Roboto;
  font-size: 14px;
  padding: 15px 10px 0px;
}
.tooltip-inner {
  font-size: 11px !important;
}
.code-container pre {
  background: #282c34;
  color: #ffffff;
  border-radius: 0 0 8px 8px;
  padding: 5px 10px;
  overflow-x: auto;
  font-size: 14px;
}

@keyframes loaderAnimation {
  from {
    width: 0%;
  }
  to {
    width: 100%;
  }
}

@keyframes collapse-logo {
  from {
    left: 0;
  }
  to {
    left: 150px;
  }
}

@media only screen and (max-width: 1850px) {
  html {
    overflow-x: hidden;
  }
  .custom-product-form .userErrorHandler .form-group {
    margin: 15px 20px;
  }
  .card {
    overflow-y: auto;
  }
}
@media only screen and (max-width: 1500px) {
  .reports-percent,
  .reports-description {
    left: 0;
  }
  .analysis-vector {
    max-width: 100%;
  }
  .box-title h5,
  .reports-title h5,
  .reports-description h6 {
    font-size: 0.95rem;
  }
  .row-box-footer {
    font-size: 0.96rem;
  }
  .first-row i {
    top: -1px;
    font-size: 12px;
  }
}
@media only screen and (max-width: 1400px) {
  .percent svg {
    transform: rotate(-90deg) scale(0.8);
  }
  .percent p {
    margin-top: -15px;
  }
  /* .percent svg circle {
        cx: 60;
    } */
  .dataTables_wrapper .shopListTable {
    overflow-x: auto;
    width: 100%;
    display: block;
  }
}
@media only screen and (max-width: 1365px) {
  #shop-table .shopActionTable .btn {
    font-size: 13px;
    margin: 0;
  }
  .custom-product-form .userErrorHandler .form-group {
    margin: 15px auto !important;
    width: 100%;
  }
  #package-select .form-control {
    width: 100% !important;
  }
  .first-row-box-footer p,
  .second-row-box-footer p,
  .third-row-box-footer p {
    font-size: 14px;
  }
}
@media only screen and (max-width: 1300px) {
  .package_items.items {
    width: 45%;
  }
  /* .percent svg circle {
        cx: 90;
    } */
  .second-inner .reports-progress {
    transform: scale(0.8);
  }
}
@media only screen and (max-width: 1270px) {
  .package_items.items {
    width: 45%;
  }
  .percent svg circle {
    cx: 90;
  }
  .reports-percent svg circle {
    transform: translate(10px, 10px);
  }
}
@media only screen and (max-width: 1200px) {
  .card {
    overflow-y: auto;
  }

  #user-table .userActionTable .btn {
    padding: 16px 10px;
    margin: 0 3px;
  }
  .dataTables_length label,
  .dataTables_filter label {
    width: 80%;
  }
  #scroll_arrow {
    display: block !important;
    width: 45px;
    position: absolute;
    z-index: 1;
    left: 50px;
    top: 110px;
  }
  .second-row-box-footer {
    flex-wrap: wrap;
  }
  .second-inner {
    flex-flow: column;
  }
  .reports-description {
    display: grid;
    grid-template-columns: auto auto;
  }
  .second-row {
    grid-template-columns: repeat(2, 1fr);
  }
  .second-row .second-row-box:last-child {
    grid-column: 1 / 3;
  }
  .second-inner .analysis-vector {
    width: unset;
  }
  .second-inner .reports-progress {
    transform: scale(1);
  }
}
@media only screen and (max-width: 1100px) {
  #user-table .userActionTable .btn {
    font-size: 12px !important;
  }
  .package_items.items {
    width: 100%;
    max-width: 400px;
  }
  .percent svg {
    transform: rotate(-90deg) scale(0.9);
  }
  .dataTables_wrapper .userListTable {
    overflow-x: auto;
    width: 100%;
    display: block;
  }
}
@media only screen and (max-width: 1025px) {
  .card {
    font-size: 14px;
  }
  #user-table .userActionTable .btn {
    padding: 5px;
    min-width: 84px !important;
  }
  #shop-table .shopActionTable .btn {
    min-width: 60px !important;
    font-size: 12px;
  }
  #business_type {
    margin-right: unset;
  }
  #productForm .card-body-top-fix {
    grid-template-columns: 1fr 1fr;
  }
  #productForm .form-group:first-child {
    grid-column: 1 / 3;
  }
  .first-row {
    grid-template-columns: repeat(2, 1fr);
  }
  .first-row .first-row-box:last-child {
    grid-column: 1 / 3;
  }
  #profile-edit-pass {
    width: 100%;
  }

  #contactUsModal .modal-dialog.modal-dialog-centered {
    max-width: 500px;
  }
  #contactUsModal #contactUs_ways {
    padding: 0;
  }
  #contactUsModal .modal-content::before {
    top: -115%;
    right: -65%;
  }
  #contactUsModal .modal-content::after {
    bottom: -115%;
    left: -65%;
  }
}
@media only screen and (max-width: 900px) {
  .dataTables_length label,
  .dataTables_filter label {
    width: 100%;
  }
  .third-row {
    grid-template-columns: 1fr;
  }
  .analysis-vector {
    max-width: 100%;
  }
  .second-row {
    grid-template-columns: 1fr;
  }
  .second-row .second-row-box {
    grid-column: 1 / 3;
  }
  .second-inner {
    flex-flow: row;
  }
  .reports-description {
    display: block;
  }
  #header_nav .navbar-nav .nav-link {
    padding-inline: 0.4rem;
    white-space: nowrap;
  }
  .navDropDowns {
    gap: 5px;
  }
  #shopForm .card-body-top-fix {
    grid-template-columns: 1fr;
  }
  #HproductActions a {
    width: 80px;
  }
  #shopLogo {
    text-align: center;
    grid-row: 1;
  }
}
@media only screen and (max-width: 850px) {
  #user-table .userActionTable .btn {
    font-size: 12px !important;
  }
  .package_items.items {
    width: 100%;
    max-width: 400px;
  }
  .percent svg {
    transform: rotate(-90deg) scale(0.9);
  }
  .dataTables_wrapper .userListTable {
    overflow-x: auto;
    width: 100%;
    display: block;
  }
  .AR_language .dropdown-toggle,
  #businessList .dropdown-item {
    padding: 2px;
    gap: 2px;
  }
  .AR_language .main-header.navbar.navbar-expand.navbar-white.navbar-light {
    gap: 0;
    font-size: 14px;
  }

  #contactUsModal .modal-dialog.modal-dialog-centered {
    max-width: 425px;
  }
  #contactUsModal .modal-header {
    padding: 0;
  }
  #contactUsModal #contactUs_title img,
  #contactUsModal #contactUs_links img {
    transform: scale(0.99);
  }
  #contactUsModal #contactUs_title p {
    margin-block: 1.5rem;
    font-size: 15px;
  }
  #contactUsModal .contactUs-items h6 {
    font-size: 15px;
  }
  #contactUsModal .contactUs-items p {
    font-size: 14px;
  }
  #contactUsModal #contactUs_ways {
    margin-bottom: 0;
  }
  #contactUsModal .modal-content::before,
  #contactUsModal .modal-content::after {
    width: 600px;
    height: 600px;
  }
}
@media only screen and (max-width: 770px) {
  .dataTables_paginate .pagination {
    justify-content: center;
  }
  #scroll_arrow {
    top: 175px;
  }
  .container {
    max-width: 500px;
  }
  .first-row {
    grid-template-columns: 1fr;
  }
  .first-row .first-row-box {
    grid-column: 1 / 3;
  }
  .navDropDowns {
    gap: 10px;
  }
  .AR_language .main-header.navbar.navbar-expand.navbar-white.navbar-light {
    margin-right: 10px;
  }
  #reset_password .modal-dialog {
    right: unset;
  }
  .dataTables_filter label {
    margin-bottom: 20px;
  }
  #shopIndexTable img,
  .HproductImage img {
    width: 45px;
  }
}
@media only screen and (max-width: 600px) {
  .dataTables_wrapper .productListTable {
    overflow-x: auto;
    width: 100%;
    display: block;
  }
  .update-shop #shopImageFile {
    width: 100% !important;
  }
  .update-shop #shopLogo {
    width: 100% !important;
  }

  #contactUsModal .modal-dialog.modal-dialog-centered {
    max-width: 385px;
    margin: auto;
  }
  #contactUsModal #contactUs_title img {
    transform: scale(0.9);
  }
  #contactUsModal .modal-content {
    padding: 10px 15px 0;
  }
  #contactUsModal #contactUs_title p {
    margin-block: 1rem;
  }
  #contactUsModal .contactUs-items h6 {
    margin: 10px 0 2px;
  }
  #contactUsModal .modal-body {
    padding-inline: 5px;
  }
  #contactUsModal .contactUs-items p {
    margin-bottom: 5px;
  }
  #contactUsModal .modal-content::before {
    top: -100%;
    right: -50%;
  }
  #contactUsModal .modal-content::after {
    bottom: -100%;
    left: -50%;
  }
  #contactUsModal .modal-content::before,
  #contactUsModal .modal-content::after {
    width: 530px;
    height: 530px;
  }
  .login-box {
    margin-top: 40%;
    width: 90%;
  }
  .register-box {
    margin-top: 20%;
    width: 90%;
  }
  #userForm .card-body,
  #adminForm .card-body {
    grid-template-columns: 1fr;
  }
}
@media only screen and (max-width: 500px) {
  #productImg {
    max-width: 100%;
  }
  .add-shop #shopLogo {
    width: 100% !important;
    text-align: center;
  }
  .add-shop #business_type {
    width: unset;
    margin: unset;
  }
  .add-shop #businessStatus {
    width: unset;
    margin: unset;
  }
  .navDropDowns {
    gap: 5px;
    font-size: 0.9rem;
  }
  .dropdown-toggle {
    padding-inline: 5px;
  }
  #productForm .card-body-top-fix {
    grid-template-columns: 1fr;
  }
  #productForm .form-group:first-child {
    grid-column: unset;
  }
  #HproductActions a {
    width: 70px;
    font-size: 12px;
  }
  .table.table-bordered.dataTable th,
  table.table-bordered.dataTable td {
    padding: 10px;
  }
  #shop-table .shopActionTable .btn {
    width: 50px !important;
    font-size: 11px;
    padding: 4px 0px;
  }
  #shopIndexTable img,
  .HproductImage img {
    width: 40px;
  }
  .responsiveTable,
  .add_items_table {
    font-size: 0.85rem;
  }
  .card-title {
    font-size: 1rem;
  }
  td.shopPackage,
  .dataTables_info,
  .pagination {
    font-size: 0.75rem;
  }
  .main-sidebar {
    font-size: 0.9rem;
  }
  #businessList {
    width: 140px;
  }
  #businessList img {
    width: max(30px, 20%);
  }
}
@media only screen and (max-width: 450px) {
  .package_items.items {
    width: 100%;
    max-width: 300px;
  }
  .package_items.items img {
    width: 50%;
  }
  .percent svg {
    transform: rotate(-90deg) scale(0.8);
  }
  .percent svg circle {
    cx: 70;
  }
  .register-box {
    width: 90% !important;
  }
  #reset_password .modal-dialog {
    width: 90%;
  }
}
@media only screen and (max-width: 400px) {
  .navDropDowns .dropdown {
    font-size: 14px;
    max-width: 120px;
  }
  #businessList p {
    margin: 0;
  }
  .second-inner .reports-progress {
    transform: scale(0.8);
  }
  .navDropDowns .dropdown i.nav-icon {
    font-size: 13px;
  }
  .dropdown-toggle {
    gap: 2px;
  }
}
@media only screen and (max-width: 350px) {
  .dropdown-toggle {
    padding-inline: 2px;
  }
  .dropdown-toggle::after {
    margin-right: 1px;
  }
  .navDropDowns .dropdown {
    max-width: 100px;
  }
}