/*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[6].rules[1].use[0]!./node_modules/@angular-devkit/build-angular/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].rules[1].use[1]!./src/styles.scss?ngGlobalStyle ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
@import url(https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap);
/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[6].rules[1].use[0]!./node_modules/@angular-devkit/build-angular/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].rules[1].use[1]!./src/styles.scss?ngGlobalStyle (1) ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
@import url(https://fonts.googleapis.com/css?family=Open+Sans);
/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[6].rules[1].use[0]!./node_modules/@angular-devkit/build-angular/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].rules[1].use[1]!./src/styles.scss?ngGlobalStyle (2) ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
@import url(https://fonts.googleapis.com/css?family=Sofia);
/*!****************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/@ng-select/ng-select/themes/default.theme.css ***!
  \****************************************************************************************************************************************************************************************************************************************************/
.ng-select.ng-select-opened>.ng-select-container{background:#fff;border-color:hsl(0,0%,70%) #ccc hsl(0,0%,85%)}.ng-select.ng-select-opened>.ng-select-container:hover{box-shadow:none}.ng-select.ng-select-opened>.ng-select-container .ng-arrow{top:-2px;border-color:rgba(0,0,0,0) rgba(0,0,0,0) #999;border-width:0 5px 5px}.ng-select.ng-select-opened>.ng-select-container .ng-arrow:hover{border-color:rgba(0,0,0,0) rgba(0,0,0,0) #333}.ng-select.ng-select-opened.ng-select-top>.ng-select-container{border-top-right-radius:0;border-top-left-radius:0}.ng-select.ng-select-opened.ng-select-right>.ng-select-container{border-top-right-radius:0;border-bottom-right-radius:0}.ng-select.ng-select-opened.ng-select-bottom>.ng-select-container{border-bottom-right-radius:0;border-bottom-left-radius:0}.ng-select.ng-select-opened.ng-select-left>.ng-select-container{border-top-left-radius:0;border-bottom-left-radius:0}.ng-select.ng-select-focused:not(.ng-select-opened)>.ng-select-container{border-color:#007eff;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 0 3px rgba(0,126,255,.1)}.ng-select.ng-select-disabled>.ng-select-container{background-color:#f9f9f9}.ng-select .ng-has-value .ng-placeholder{display:none}.ng-select .ng-select-container{color:#333;background-color:#fff;border-radius:4px;border:1px solid #ccc;min-height:36px;align-items:center}.ng-select .ng-select-container:hover{box-shadow:0 1px 0 rgba(0,0,0,.06)}.ng-select .ng-select-container .ng-value-container{align-items:center;padding-left:10px}[dir=rtl] .ng-select .ng-select-container .ng-value-container{padding-right:10px;padding-left:0}.ng-select .ng-select-container .ng-value-container .ng-placeholder{color:#999}.ng-select.ng-select-single .ng-select-container{height:36px}.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{top:5px;left:0;padding-left:10px;padding-right:50px}[dir=rtl] .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input{padding-right:10px;padding-left:50px}.ng-select.ng-select-multiple.ng-select-disabled>.ng-select-container .ng-value-container .ng-value{background-color:#f9f9f9;border:1px solid hsl(0,0%,90%)}.ng-select.ng-select-multiple.ng-select-disabled>.ng-select-container .ng-value-container .ng-value .ng-value-label{padding:0 5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container{padding-top:5px;padding-left:7px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container{padding-right:7px;padding-left:0}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{font-size:.9em;margin-bottom:5px;color:#333;background-color:rgb(234.6,244.68,255);border-radius:2px;margin-right:5px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{margin-right:0;margin-left:5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled{background-color:#f9f9f9}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-label{padding-left:5px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-label{padding-left:0;padding-right:5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label{display:inline-block;padding:1px 5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{display:inline-block;padding:1px 5px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon:hover{background-color:rgb(209.1,231.78,255)}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{border-right:1px solid rgb(183.6,218.88,255)}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{border-left:1px solid rgb(183.6,218.88,255);border-right:none}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{border-left:1px solid rgb(183.6,218.88,255)}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{border-left:0;border-right:1px solid rgb(183.6,218.88,255)}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input{padding:0 0 3px 3px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input{padding:0 3px 3px 0}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input>input{color:#000}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{top:5px;padding-bottom:5px;padding-left:3px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{padding-right:3px;padding-left:0}.ng-select .ng-clear-wrapper{color:#999}.ng-select .ng-clear-wrapper:hover .ng-clear{color:#d0021b}.ng-select .ng-clear-wrapper:focus .ng-clear{color:#d0021b}.ng-select .ng-clear-wrapper:focus{outline:none}.ng-select .ng-spinner-zone{padding:5px 5px 0 0}[dir=rtl] .ng-select .ng-spinner-zone{padding:5px 0 0 5px}.ng-select .ng-arrow-wrapper{width:25px;padding-right:5px}[dir=rtl] .ng-select .ng-arrow-wrapper{padding-left:5px;padding-right:0}.ng-select .ng-arrow-wrapper:hover .ng-arrow{border-top-color:#666}.ng-select .ng-arrow-wrapper .ng-arrow{border-color:#999 rgba(0,0,0,0) rgba(0,0,0,0);border-style:solid;border-width:5px 5px 2.5px}.ng-dropdown-panel{background-color:#fff;border:1px solid #ccc;box-shadow:0 1px 0 rgba(0,0,0,.06);left:0}.ng-dropdown-panel.ng-select-top{bottom:100%;border-top-right-radius:4px;border-top-left-radius:4px;border-bottom-color:hsl(0,0%,90%);margin-bottom:-1px}.ng-dropdown-panel.ng-select-top .ng-dropdown-panel-items .ng-option:first-child{border-top-right-radius:4px;border-top-left-radius:4px}.ng-dropdown-panel.ng-select-right{left:100%;top:0;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:4px;border-bottom-color:hsl(0,0%,90%);margin-bottom:-1px}.ng-dropdown-panel.ng-select-right .ng-dropdown-panel-items .ng-option:first-child{border-top-right-radius:4px}.ng-dropdown-panel.ng-select-bottom{top:100%;border-bottom-right-radius:4px;border-bottom-left-radius:4px;border-top-color:hsl(0,0%,90%);margin-top:-1px}.ng-dropdown-panel.ng-select-bottom .ng-dropdown-panel-items .ng-option:last-child{border-bottom-right-radius:4px;border-bottom-left-radius:4px}.ng-dropdown-panel.ng-select-left{left:-100%;top:0;border-top-left-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:4px;border-bottom-color:hsl(0,0%,90%);margin-bottom:-1px}.ng-dropdown-panel.ng-select-left .ng-dropdown-panel-items .ng-option:first-child{border-top-left-radius:4px}.ng-dropdown-panel .ng-dropdown-header{border-bottom:1px solid #ccc;padding:5px 7px}.ng-dropdown-panel .ng-dropdown-footer{border-top:1px solid #ccc;padding:5px 7px}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{-webkit-user-select:none;user-select:none;padding:8px 10px;font-weight:500;color:rgba(0,0,0,.54);cursor:pointer}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-disabled{cursor:default}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-marked{background-color:rgb(244.8,249.84,255)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected,.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected.ng-option-marked{color:rgba(0,0,0,.54);background-color:rgb(234.6,244.68,255);font-weight:600}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{background-color:#fff;color:rgba(0,0,0,.87);padding:8px 10px}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected,.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked{color:#333;background-color:rgb(234.6,244.68,255)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected .ng-option-label,.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked .ng-option-label{font-weight:600}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background-color:rgb(244.8,249.84,255);color:#333}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-disabled{color:#ccc}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-left:22px}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-right:22px;padding-left:0}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{font-size:80%;font-weight:400;padding-right:5px}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{padding-left:5px;padding-right:0}[dir=rtl] .ng-dropdown-panel{direction:rtl;text-align:right}/*# sourceMappingURL=default.theme.css.map */

/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[6].rules[1].use[0]!./node_modules/@angular-devkit/build-angular/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].rules[1].use[1]!./src/styles.scss?ngGlobalStyle (3) ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/* You can add global styles to this file, and also import other style files */
:root {
  --baseColor: #ffa500;
  --baseColorLight: #fae9d0;
  --textColor: #000080;
  --borderColor: #3f3f3f53;
  --textColorSecondary: #464646;
  --textBoxShadow: #dddddd10;
}

.invalid-field {
  font-size: 12px;
  color: #dc3545;
  font-weight: 400;
}

.toolbar-container {
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1215686275);
  position: sticky;
  top: 0;
  z-index: 99;
}

.empty-container {
  display: grid;
  place-items: center;
  height: 50vh;
  color: grey;
  font-weight: 400;
  font-size: 18px;
}

.default-label {
  font-size: 12px;
  font-weight: 400;
  color: #666;
}

.default-value {
  font-size: 15px;
  font-weight: 500;
  overflow-wrap: break-word;
  line-height: 16px;
}

.input-right-icon {
  cursor: pointer;
  pointer-events: all;
  margin-top: -40px;
  height: 40px;
  width: fit-content;
  display: flex;
  align-items: center;
}

.status-chip {
  color: #fff;
  padding: 1px 8px;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
}

#global-loader {
  position: fixed;
  inset: 0;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 99999;
}

.initialSpinner {
  width: 24px;
  height: 24px;
  border: 3px solid #e0e0e0;
  border-top-color: #1976d2;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
body {
  background-color: #EAF1F5;
  margin: 0;
  font-family: "Roboto", sans-serif;
}
body .toolbar {
  background-color: #FFFFFF;
  min-height: 65px;
  max-height: 65px;
  color: var(--textColor);
}
body .toolbar .menu {
  max-width: 60px;
}
body .toolbar .menu .material-icons-outlined {
  font-size: 33px;
}
body .toolbar .toolbarLabel {
  font-weight: 500;
  text-align: left;
}
body .toolbar .toolbarLabel .primayLabel {
  font-size: clamp(14px, 5.5vw, 20px);
  max-height: 25px;
  line-height: 1;
}
body .toolbar .toolbarLabel .secondaryLabel {
  font-size: clamp(9px, 3vw, 13px);
}
body .toolbar .roundedIcon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  text-align: center;
  box-shadow: 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 1px 8px 0 rgba(0, 0, 0, 0.12);
}
body .toolbar .rightSideIcon {
  font-size: 35px;
}
body .listItem {
  overflow: hidden;
  background-color: #FFFFFF;
  border-radius: 10px;
  box-shadow: 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 1px 8px 0 rgba(0, 0, 0, 0.12);
  min-height: 50px;
}
body .listItem .imageWrapper {
  max-width: 58px;
  min-width: 58px;
  max-height: 58px;
  min-height: 58px;
}
body .listItem .imageWrapper .image {
  width: 58px;
  height: 58px;
  border-radius: 10px;
  overflow: hidden;
  background: #E3E3E3;
}
body .listItem .primaryLabel {
  font-size: 15px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;
  letter-spacing: 0em;
  text-align: left;
}
body .listItem .secondaryLabel {
  font-size: 11px;
  font-style: normal;
  font-weight: 400;
  line-height: 13px;
  letter-spacing: 0em;
  text-align: left;
}
body .listItem .infoChipWrapper {
  height: 30px;
  background: var(--baseColorLight);
  border-radius: 15px;
  padding: 5px;
  text-align: center;
  line-height: 0;
}
body .listItem .infoChipWrapper .primaryLabel {
  font-size: 14px;
  font-weight: 700;
  color: var(--baseColor);
}
body .listItem .infoChipWrapper .secondaryLabel {
  font-size: 10px;
  font-weight: 500;
  color: #464646;
}
body .listItem .warningChipWrapper {
  padding: 3px 14px;
  font-weight: 700;
  font-size: 12px;
  color: #FF8A00;
  background: #FFEBCC;
  border-radius: 5px;
}
body .listItem .detailsWrapper .labelOne {
  font-size: 15px;
  font-weight: 700;
  color: #000000;
  text-align: right;
}
body .listItem .detailsWrapper .labelTwo {
  font-size: 14px;
  font-weight: 400;
  color: #767676;
  text-align: right;
}
body .listItem .detailsWrapper .labelThree {
  font-size: 11px;
  font-weight: 400px;
  color: #767676;
  text-align: right;
}
body .listItem .successChipWrapper {
  padding: 3px 8px;
  font-weight: 700;
  font-size: 12px;
  color: #1F9B14;
  background: #CCFFDE;
  border-radius: 5px;
}
body .listItem .dangerChipWrapper {
  padding: 3px 8px;
  font-weight: 700;
  font-size: 12px;
  color: #721c24;
  background: #f8d7da;
  border-radius: 5px;
}
body .listItem .checkandbuyChipWrapper {
  padding: 3px 8px;
  font-weight: 700;
  font-size: 12px;
  color: #ffffff;
  background: #ff835d;
  border-radius: 5px;
}
body .listItem .NotAvialableChipWrapper {
  padding: 3px 8px;
  font-weight: 700;
  font-size: 12px;
  color: #5e5e5e;
  background: #bfbfbf;
  border-radius: 5px;
}
body .primaryButton {
  background: var(--baseColor);
  border-radius: 20px;
  color: #FFFFFF;
  font-weight: 700;
  font-size: 12px;
  height: 35px;
  line-height: 3;
  text-align: center;
  width: 100%;
}
body button {
  border: none;
}
body button:disabled {
  opacity: 40%;
}
body .primaryOutLinedButton {
  color: var(--baseColor);
  border-radius: 20px;
  border: 1px solid var(--baseColor);
  background-color: #FFFFFF;
  font-weight: 700;
  font-size: 12px;
  height: 35px;
  line-height: 3;
  text-align: center;
}
body .secondaryButton {
  background: #ABACAD;
  border-radius: 20px;
  color: #FFFFFF;
  font-weight: 700;
  font-size: 12px;
  height: 35px;
  line-height: 3;
  text-align: center;
}
body nav .nav-tabs {
  justify-content: center;
}
body nav a {
  color: #000000;
  font-weight: 700;
  font-size: 14px;
}
body nav .nav-tabs .nav-item.show .nav-link, body nav .nav-tabs .nav-link.active {
  border: none;
  border-bottom: 3px solid #4A4AFF;
  color: #4A4AFF;
  background: none;
}
body .input-wrap {
  position: relative;
  width: 100%;
  z-index: 1;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.12));
}
body .input-wrap .wraped-input {
  font-size: 18px;
  line-height: 1.5;
  color: #BABABA;
  display: block;
  width: 100%;
  height: 45px;
  padding: 0 30px 0 54px;
  border-radius: 10px;
  border: 1px solid #e2e1ea;
}
body .input-wrap .wraped-input-icon {
  font-size: 17px;
  display: flex;
  align-items: center;
  position: absolute;
  border-radius: 10px;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding-left: 22px;
  pointer-events: none;
  transition: all 0.4s;
  color: #BABABA;
}
body .input-wrap input:focus {
  color: #2e2e2e;
  background-color: #fff;
  border-color: #80bdff;
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
body .cancelButton {
  background: #ABACAD;
  border-radius: 20px;
  color: #FFFFFF;
  font-weight: 700;
  font-size: 12px;
  height: 35px;
  line-height: 3;
  text-align: center;
}
body #main {
  transition: all 0.5s ease;
}
body .spinner {
  position: fixed;
  top: 50%;
  left: 46%;
  right: 50%;
  z-index: 99;
}

.row {
  margin: 0 !important;
}

.infoChipWrapper {
  height: 30px;
  background: var(--baseColorLight);
  border-radius: 15px;
  padding: 5px;
  text-align: center;
  line-height: 0;
}
.infoChipWrapper .primaryLabel {
  font-size: 14px;
  font-weight: 700;
  color: var(--baseColor);
}
.infoChipWrapper .secondaryLabel {
  font-size: 10px;
  font-weight: 500;
  color: #5184E9;
}

.warningChipWrapper {
  padding: 3px 14px;
  font-weight: 700;
  font-size: 12px;
  color: #FF8A00;
  background: #FFEBCC;
  border-radius: 5px;
}

.detailsWrapper .labelOne {
  font-size: 15px;
  font-weight: 700;
  color: #000000;
  text-align: right;
}
.detailsWrapper .labelTwo {
  font-size: 14px;
  font-weight: 400;
  color: #767676;
  text-align: right;
}
.detailsWrapper .labelThree {
  font-size: 11px;
  font-weight: 400px;
  color: #767676;
  text-align: right;
}

.successChipWrapper {
  padding: 3px 8px;
  font-weight: 700;
  font-size: 12px;
  color: #1F9B14;
  background: #CCFFDE;
  border-radius: 5px;
}

.dangerChipWrapper {
  padding: 3px 8px;
  font-weight: 700;
  font-size: 12px;
  color: #721c24;
  background: #f8d7da;
  border-radius: 5px;
}

.checkandbuyChipWrapper {
  padding: 3px 8px;
  font-weight: 700;
  font-size: 12px;
  color: #ffffff;
  background: #ff835d;
  border-radius: 5px;
}

.NotAvialableChipWrapper {
  padding: 3px 8px;
  font-weight: 700;
  font-size: 12px;
  color: #5e5e5e;
  background: #bfbfbf;
  border-radius: 5px;
}

.brandchip {
  margin-right: 10px;
  width: 71px;
  height: 20px;
  background-color: rgb(54, 182, 151);
  border-radius: 5px;
  align-content: center;
}

.brandchip-font {
  margin: 0px auto 0px auto !important;
  font-size: 12px;
  color: white;
  width: fit-content;
  height: fit-content;
}

.popup-container {
  background-color: rgba(0, 0, 0, 0.1019607843);
  display: flex;
  z-index: 10001;
  width: 100vw;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  justify-content: center;
  align-items: center;
}
.popup-container .popup-card {
  overflow: hidden;
  background-color: #FFFFFF;
  border-radius: 10px;
  box-shadow: 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 1px 8px 0 rgba(0, 0, 0, 0.12);
  width: 90vw;
}
.popup-container .popup-card .popup-title {
  height: 45px;
  display: flex;
  justify-content: space-between;
  padding: 15px 10px 15px 15px;
}
.popup-container .popup-card .popup-title .head {
  font-size: 18px;
  font-weight: 500;
}
.popup-container .popup-card .popup-body {
  padding: 10px 15px 15px;
  font-size: 16px;
}
.popup-container .popup-card .popup-bottom {
  padding: 15px;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
}

.main-content {
  display: flex;
  flex-direction: column;
  min-height: 95vh;
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  width: 100%;
}

.partson-head {
  font-size: 38px;
  color: white;
  font-weight: 600;
  text-align: center;
  padding-top: 60px;
  padding-bottom: 30px;
}

.loading {
  z-index: 1233;
  position: fixed;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.143);
  display: flex;
}

.continue-button {
  color: var(--textColor);
  border-color: var(--textColor);
  width: 100%;
  border-radius: 20px;
  font-size: 13px;
}

.place-order-button {
  color: #fff;
  background-color: var(--baseColor);
  border-radius: 20px;
  width: 100%;
}

.base-bg {
  background-color: var(--textColor);
  width: 200vw;
  height: 80vh;
  position: fixed;
  border-radius: 50%;
  top: -25%;
  left: -50%;
}

.contact-us-btn {
  color: var(--textColor);
  display: flex;
  justify-content: center;
  width: 75%;
  margin: 40px auto 0px;
  padding: 2px;
  background-color: transparent;
}

.toast-msg-conatiner {
  height: 60px;
  width: 100%;
  padding: 8px 8px;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 888888;
}
.toast-msg-conatiner .toast-msg {
  height: 100%;
  width: 100%;
  border-radius: 5px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding: 0 15px;
  color: #fff;
}

.foot-label {
  font-size: 14px;
  font-weight: 600;
  color: #9C9C9C;
  font-style: italic;
  text-align: center;
  margin: 20px auto;
  padding: 5px;
  width: fit-content;
  border-radius: 5px;
}

.card-container {
  background-color: #FFFFFF;
  border-radius: 10px;
  box-shadow: 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 1px 8px 0 rgba(0, 0, 0, 0.12);
}

.btn-q5 {
  border-radius: 20px;
  font-size: 1rem;
  font-weight: 500;
  background-color: var(--textColor);
}

.btn-q5:disabled {
  opacity: 40%;
}

.btn-primary-q5 {
  padding: 0.5rem 1rem;
  background-color: var(--textColor);
  color: var(--baseColorLight);
}

.btn-outline-primary-q5 {
  padding: 0.3rem 1rem;
  background-color: transparent;
  border: 1px solid var(--baseColor);
  color: var(--baseColor);
}

.btn-secondary-q5 {
  padding: 0.5rem 1rem;
  background-color: var(--baseColorLight);
  color: #464646;
}

.btn-outline-secondary-q5 {
  padding: 0rem 1rem;
  background-color: transparent;
  border: 1px solid #464646;
  color: #464646;
}

.btn-blue-q5 {
  padding: 0.5rem 1rem;
  background-color: #2436f8;
  color: #fff;
}

.btn-outline-blue-q5 {
  padding: 0.5rem 1rem;
  background-color: transparent;
  border: 1px solid #0014FF;
  color: #0014FF;
}

.btn-yellow-q5 {
  padding: 0.5rem 1rem;
  background-color: #F49D1A;
  color: #fff;
}

.btn-outline-yellow-q5 {
  padding: 0.5rem 1rem;
  background-color: transparent;
  border: 1px solid #F49D1A;
  color: #FF7000;
}

.input-fields-q5 {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 13px;
  transition: all 0.3s ease;
  box-sizing: border-box;
}

.input-fields-q5:hover {
  outline: none;
}

.readonly-input {
  background-color: #f1f1f1 !important;
  border: 1px solid #c6c6c6 !important;
}

.text-area-q5 {
  border-radius: 10px;
  border: 1px solid var(--borderColor);
  box-shadow: inset 4px 0px 8px 5px var(--textBoxShadow), inset 0px 4px 8px 5px var(--textBoxShadow), inset -4px 0px 8px 5px var(--textBoxShadow), inset 0px -4px 8px 5px var(--textBoxShadow);
  background-color: #fff;
  width: 100%;
  height: 120px;
  padding: 15px;
}

.toolbar-container {
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1215686275);
  position: sticky;
  top: 0;
  z-index: 99;
}

.input-fields-label {
  font-size: 14px;
  font-weight: 400;
  color: #666;
  padding-left: 2px;
}

.invalid-field {
  font-size: 12px;
  color: #dc3545;
  font-weight: 400;
}

.input-field {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 13px;
  transition: all 0.3s ease;
  box-sizing: border-box;
}

.input-field:focus {
  border-color: #666;
  box-shadow: 0 0 0 3px rgba(74, 144, 226, 0.2);
  outline: none;
}

.input-right-icon {
  cursor: pointer;
  pointer-events: all;
  margin-top: -40px;
  height: 40px;
  width: fit-content;
  display: flex;
  align-items: center;
}

.empty-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 50vh;
  color: grey;
  font-weight: 400;
  font-size: 18px;
}

.custom-dropdown {
  background-color: #fff;
  z-index: 10;
  border-radius: 10px;
  box-shadow: rgba(0, 0, 0, 0.15) 0px 1px 4px 1px, rgba(0, 0, 0, 0.12) 0px 2px 2px 0px, rgba(0, 0, 0, 0.1) 0px 1px 5px 0px;
  position: absolute;
  width: 100%;
  overflow: hidden;
}
.custom-dropdown .drop-body {
  max-height: 25vh;
  overflow-y: scroll;
}
.custom-dropdown .drop-body .drop-item {
  border: 1px solid #eee;
}
.custom-dropdown .input-search {
  border-radius: 10px;
  border: 1px solid #ccc;
  background-color: white;
}
.custom-dropdown .input-search input {
  box-shadow: none !important;
  background-color: transparent;
  padding-left: 15px;
  height: 40px;
  border: none;
  width: 100%;
  outline: none;
}
.custom-dropdown .selected {
  background-color: var(--baseColorLight);
}

.chip-base {
  padding: 3px 8px;
  font-weight: 700;
  font-size: 12px;
  border-radius: 5px;
  color: #8a5340;
  background-color: #feedaf;
}

.Delivered, .Approved, .Success, .success {
  color: #316a35;
  background-color: #c8e6c9;
}

.Proccessed, .process {
  color: #694382;
  background-color: #eccfff;
}

.Canceled, .cancelled .Cancelled {
  color: #444;
  background-color: #d8d2d2;
}

.Pending {
  color: #8a5340;
  background-color: #feedaf;
}

.Rejected, .Failed, .failed {
  color: #ca4343;
  background-color: #ffcdd2;
}

.Placed, .waiting, .Waiting, .Transist, .Requested, .Initiated, .initiated {
  color: #23547b;
  background-color: #b3e5fc;
}

.customToggle {
  position: relative;
  height: 45px;
  background-color: #E5E5E5;
  border-radius: 10px;
  overflow: hidden;
}
.customToggle .customToggle-slider {
  position: absolute;
  z-index: 1;
  width: 50%;
  border-radius: 10px;
  transition: 0.2s;
  background-color: var(--baseColor);
  box-shadow: rgba(0, 0, 0, 0.25) 0px 0px 10px;
  height: 45px;
}
.customToggle .customToggle-text {
  width: 50%;
  text-align: center;
  height: 100%;
  font-weight: 500;
  font-size: 14px;
  padding: 12px;
  transition: 0.2s;
}

.tooltip-like {
  font-size: 12px;
  font-weight: 300;
  color: white;
  background-color: #000;
  padding: 2px 5px;
  border-radius: 2px;
  position: absolute;
  z-index: 10;
}

.tooltip-right {
  left: 100%;
  right: -700%;
  margin-left: 2px;
}

.tooltip-bottom {
  top: 100%;
  right: -700%;
  margin-left: 2px;
}

.sub-head {
  color: var(--textColor);
  font-size: 16px;
  font-weight: 500;
  padding: 17px 0px 6px 2px;
}

.ng-select .ng-select-container {
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 13px;
}

.categorybar {
  width: 100%;
  overflow-x: auto;
}
.categorybar .categoryscroller {
  padding: 10px 5px;
  width: fit-content;
  display: inline-flex;
  flex-direction: row;
}
.categorybar .categoryscroller .category-button {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 36px;
  min-width: 130px;
  max-width: fit-content;
  padding: 10px;
  margin: 0px 5px;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.categorybar .categoryscroller .category-active {
  background-color: white;
  color: var(--textColor);
  border: 1px solid #fff;
}
.categorybar .categoryscroller .category-inactive {
  background-color: #d9dfe4;
  color: #56718c;
  border: 1px solid #d9dfe4;
}

.help-button {
  color: black !important;
  background: transparent !important;
  border: none;
  font-size: 1rem;
}

.help-button:active {
  color: #0000FF !important;
}

.flash-msg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 11px;
  background-color: #fff;
  color: #555;
  font-size: 12px;
  border-radius: 10px;
  white-space: nowrap;
}

.error-message {
  font-size: 12px;
  font-weight: 400;
  color: red;
  font-family: "Merriweather", serif;
}

.bg-r {
  background-color: red;
}

.bg-g {
  background-color: green;
}

.bg-b {
  background-color: blue;
}

.bg-y {
  background-color: yellow;
}

.bg-m {
  background-color: magenta;
}

.bg-c {
  background-color: cyan;
}

.bg-0 {
  background-color: #000000;
}

.bg-1 {
  background-color: #FFFFFF;
}

body {
  margin: 0;
  padding: 0;
  scroll-behavior: smooth;
}

.top-banner {
  width: 100% !important;
  background: url("/assets/images/bazaar-near-bg3-min.jpg") no-repeat center;
  background-size: cover;
  background-position: center;
  padding: 0 0 19rem;
}

.orange-button {
  text-transform: uppercase !important;
  background-color: white !important;
  color: #ff6600 !important;
  font-weight: bold !important;
  margin-top: 0 !important;
  border: 1px solid #ff6600 !important;
  padding: 8px 30px 6px 30px !important;
}

.family1 {
  font-family: "Sofia", sans-serif;
}

.family2 {
  font-family: "Open Sans", serif;
}

.navbar {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  margin-top: 0 !important;
  width: 100% !important;
}

.navbar-nav {
  text-align: end !important;
}

.nav-item {
  margin: 15px 8px 15px !important;
  padding: 0 !important;
}

.nav-head {
  color: #fff !important;
  font-weight: bold !important;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

.navbar-toggler-icon {
  font-size: 1.6rem !important;
  font-weight: 600 !important;
}

.section-padding {
  padding-top: 60px !important;
}

.numbered-circle {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-color: #FF6600;
  color: #fff;
  border-radius: 50%;
  text-align: center;
  line-height: 25px;
  font-weight: bold;
  font-size: 1.1rem;
  margin-right: 5px;
}

.inline-title {
  display: inline;
  font-size: 1.2rem;
  margin-left: 0;
}

@media (max-width: 768px) {
  .navbar-collapse {
    display: block;
  }
  .nav-item {
    margin: 5px 8px 0px;
    padding: 0;
  }
}
.faq-item {
  background-color: white;
  color: black;
  padding: 5px;
  margin-bottom: 13px;
  transition: background-color 0.3s, color 0.3s;
}

.faq-item.active {
  border: 1px solid #0F2C59 !important;
}

.d-flex .display-6 {
  margin-right: 50px;
  margin-left: 50px;
  text-align: center;
  align-items: center;
  justify-content: center;
}

.d-flex .fas.fa-plus {
  margin-right: 7rem;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.trial:hover {
  color: #FF6600 !important;
  font-size: 2em;
  transition: font-size 0.3s;
  cursor: pointer;
}

/* style for pricing table */
/* a {
    text-decoration: none;
} */
.gradient-text {
  background: linear-gradient(to right, #ff6600, #0f2c59);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.pricingTable {
  width: 300px;
  height: 300px;
  text-align: center;
  /* background: #4B77BE; */
  padding: 0 0px 5px 0px;
  border-radius: 0;
  border-top-right-radius: 42px;
  transform: scale(1);
  transition: all 0.5s ease 0s;
  border: 2px solid #d1cece;
}

.pricingTable:hover {
  transform: scale(1.05);
  z-index: 1;
}

.pricingTable .pricingTable-header {
  padding: 5px 10px 5px 10px;
  background: #BFBFBF;
  border-radius: 0 40px 0 50px;
  transition: all 0.5s ease 0s;
}

.pricingTable:hover .pricingTable-header {
  background: #FF6600;
}

.pricingTable .pricingTable-header i {
  font-size: 30px;
  color: #0F2C59;
  margin-bottom: 8px;
  transition: all 0.5s ease 0s;
}

.pricingTable .price-value {
  font-size: 30px;
  color: #0F2C59;
  transition: all 0.5s ease 0s;
}

.pricingTable .month {
  display: block;
  font-size: 14px;
  color: #0F2C59;
}

.pricingTable:hover .month,
.pricingTable:hover .price-value,
.pricingTable:hover .pricingTable-header i {
  color: #fff;
}

.pricingTable .pricing-content ul {
  padding: 0;
}

.pricingTable .pricing-content ul li {
  line-height: 25px;
  color: black;
}

.pricingTable .pricingTable-signup a {
  font-size: 15px;
  color: #fff;
  padding: 10px 35px;
  border-radius: 20px;
  background: #FF6600;
  text-transform: uppercase;
  transition: all 0.3s ease 0s;
  text-decoration: none;
}

.pricingTable .pricingTable-signup a:hover {
  background-color: #0F2C59;
  box-shadow: 0 0 10px;
}

.footerlist {
  text-decoration: none;
  color: white;
}

.pointer {
  cursor: pointer;
}

.demovideo {
  width: 400px;
  height: 315px;
  text-align: center;
  /* background: #4B77BE; */
  padding: 0 0px 5px 0px;
  border-radius: 0;
  transform: scale(1);
  transition: all 0.5s ease 0s;
  border: 2px solid #d1cece;
}

.demovideo:hover {
  transform: scale(1.05);
  z-index: 1;
}

/* .scrolling-container {
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
  }

  .scrolling-content {
    display: inline-block;
    animation: scroll 15s linear infinite;
  }

  @keyframes scroll {
    0% { transform: translateX(0%); }
    100% { transform: translateX(-50%); }
  } */
.small-screen-text {
  font-size: 1.7rem;
}

.price-text-small {
  font-size: 2.5rem;
}

@media (max-width: 767.98px) {
  #features .row {
    display: flex;
    flex-wrap: nowrap;
    scroll-snap-type: x mandatory;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  #features .col-md-6 {
    flex-basis: auto;
    max-width: none;
  }
  #features .mb-4 {
    margin-bottom: 0 !important;
  }
  #features .row::-webkit-scrollbar {
    display: none;
  }
  #features .small-screen-text {
    font-size: 1.2rem;
  }
  .price-text-small {
    font-size: 1.9rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .scrolling-content {
    animation: none;
  }
  .navbar {
    position: sticky;
    top: 0;
    z-index: 1000;
    margin-top: 20px;
  }
  h1 {
    font-size: 1.8rem;
    /* Decrease font size for smaller screens */
  }
  /* .nav-item-login, .nav-item-create-account {
        display: none;
    } */
  .nav-item {
    margin: 0;
    padding: 0;
    margin-right: 10px;
    margin-bottom: 0.5rem;
  }
  .section-padding {
    padding-top: 60px;
    /* Adjust this value as needed */
  }
}
.video-container {
  width: 100%;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
}

.video-thumbnail {
  position: relative;
  cursor: pointer;
}

.video-popup {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 9999;
  background-color: #fff;
  padding: 8px;
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.7);
  width: 70%; /* Set the width of the popup */
  max-width: 800px; /* Set maximum width to avoid excessive size */
}

.close-button {
  position: absolute;
  top: 2px;
  right: 10px;
  cursor: pointer;
  font-size: 30px;
  color: white;
}

.video-description {
  /* border-top: 1px dotted #0F2C59; */
  width: 100%;
  text-align: left;
  font-family: Helvetica;
  font-size: 1rem;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  /* background-color: red; */
}

.image-size {
  position: relative;
  width: 100%;
  height: 215px;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.image-size img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.bi-play-fill {
  position: absolute;
  font-size: 50px;
  color: white;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  z-index: 1;
}

.circle-background {
  position: absolute;
  width: 60px;
  height: 60px;
  background-color: rgba(235, 234, 234, 0.8);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 0;
}

.faq-item {
  margin: 10px 0;
  padding: 5px;
  outline: none;
  border: 0;
  color: #041e42;
  font-size: 1.25rem;
  font-weight: 600;
}

.faq-question {
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 20px;
  background-color: rgba(0, 0, 0, 0.031372549);
  transition: background-color 0.2s ease;
}

.faq-question .question-text {
  flex: 1;
}

.faq-question .dropdown-arrow {
  transition: transform 0.2s ease;
}

.faq-answer {
  padding: 20px 20px;
  display: none;
  background-color: rgba(0, 0, 0, 0.031372549);
}

.faq-answer.active {
  display: block;
  animation: fadeIn 0.5s;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.faq-item.open .faq-question {
  background-color: rgba(0, 0, 0, 0.031372549);
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
  color: #FF6600;
}

.faq-item.open .faq-question .dropdown-arrow {
  transform: rotate(180deg);
}

.beta-tag {
  background-color: #7d7de2;
  color: #fff;
  font-size: 14px;
  padding: 2px 8px;
  margin-left: 5px;
  border-radius: 4px;
}

.custom-disc-line {
  font-size: 0.75rem;
  color: #610000;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 6px;
}

.custom-disc-line-value {
  font-size: 0.75rem;
  font-weight: 500;
}

.custom-disc-subtext {
  font-size: 0.75rem;
  color: #610000;
  margin-left: 2px;
  margin-top: -2px;
}

.ripple {
  position: relative;
  overflow: hidden;
}

.ripple-effect {
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.4);
  transform: scale(0);
  animation: ripple-animation 600ms linear;
  pointer-events: none;
}

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

/*# sourceMappingURL=styles.css.map*/